quasar 1.17.2 → 1.17.6

package/dist/quasar.sass

@@ -1,5 +1,5 @@
 /*!
- * Quasar Framework v1.17.2
+ * Quasar Framework v1.17.6
  * (c) 2015-present Razvan Stoenescu
  * Released under the MIT License.
  */
@@ -663,9 +663,10 @@ input[type='search']::-webkit-search-decoration
     display: flex !important
     align-items: center
     justify-content: center
-  > svg
-    width: 100%
-    height: 100%
+  > svg,
+  > img
+    width: 1em
+    height: 1em
 .q-icon,
 .material-icons,
 .material-icons-outlined,
@@ -3285,7 +3286,10 @@ body.desktop
     min-width: 50px !important
     &--padding
       padding-left: 4px
+  &__focus-target,
   &__autocomplete-input
+    position: absolute
+    outline: 0 !important
     width: 0
     height: 0
     padding: 0

package/dist/quasar.styl

@@ -1,5 +1,5 @@
 /*!
- * Quasar Framework v1.17.2
+ * Quasar Framework v1.17.6
  * (c) 2015-present Razvan Stoenescu
  * Released under the MIT License.
  */
@@ -709,9 +709,10 @@ input[type='search']::-webkit-search-decoration
     display: flex !important
     align-items: center
     justify-content: center
-  > svg
-    width: 100%
-    height: 100%
+  > svg,
+  > img
+    width: 1em
+    height: 1em
 .q-icon,
 .material-icons,
 .material-icons-outlined,
@@ -3332,7 +3333,10 @@ body.desktop
     min-width: 50px !important
     &--padding
       padding-left: 4px
+  &__focus-target,
   &__autocomplete-input
+    position: absolute
+    outline: 0 !important
     width: 0
     height: 0
     padding: 0

package/dist/quasar.umd.js

@@ -1,5 +1,5 @@
 /*!
- * Quasar Framework v1.17.2
+ * Quasar Framework v1.17.6
  * (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.17.2";
+  var version = "1.17.6";
 
   /* eslint-disable no-useless-escape */
 
@@ -2005,6 +2005,8 @@
 
   var ariaHidden = { 'aria-hidden': 'true' };
 
+  var iconAsButton = { tabindex: 0, type: 'button', 'aria-hidden': false, role: null };
+
   var AttrsMixin = getPropCacheMixin('$attrs', 'qAttrs');
 
   var
@@ -2184,18 +2186,19 @@
         if ( speed === void 0 ) speed = 300;
 
         var oldSpeed = this.speed;
-        this.speed = Math.max(0, speed) || 0;
+        var newSpeed = this.speed = Math.max(0, speed) || 0;
 
         this.calls++;
 
         if (this.calls > 1) {
-          if (oldSpeed === 0 && speed > 0) {
+          if (oldSpeed === 0 && newSpeed > 0) {
             this.__work();
           }
-          else if (oldSpeed > 0 && speed <= 0) {
+          else if (oldSpeed > 0 && newSpeed <= 0) {
             clearTimeout(this.timer);
           }
-          return
+
+          return this.calls
         }
 
         clearTimeout(this.timer);
@@ -2203,27 +2206,35 @@
 
         this.progress = 0;
 
-        if (this.onScreen === true) { return }
-
-        this.onScreen = true;
-        this.animate = false;
         this.timer = setTimeout(function () {
           this$1.animate = true;
-          speed > 0 && this$1.__work();
-        }, 100);
+          newSpeed > 0 && this$1.__work();
+        }, this.onScreen === true ? 500 : 1);
+
+        if (this.onScreen !== true) {
+          this.onScreen = true;
+          this.animate = false;
+        }
+
+        return this.calls
       },
 
       increment: function increment (amount) {
         if (this.calls > 0) {
           this.progress = inc(this.progress, amount);
         }
+
+        return this.calls
       },
 
       stop: function stop () {
         var this$1 = this;
 
         this.calls = Math.max(0, this.calls - 1);
-        if (this.calls > 0) { return }
+
+        if (this.calls > 0) {
+          return this.calls
+        }
 
         clearTimeout(this.timer);
         this.$emit('stop');
@@ -2242,6 +2253,8 @@
         else {
           end();
         }
+
+        return this.calls
       },
 
       __work: function __work () {
@@ -2533,18 +2546,16 @@
       }
 
       if (this.type.img === true) {
-        return h('div', data, mergeSlot([
+        return h('span', data, mergeSlot([
           h('img', {
-            class: this.type.cls,
             attrs: { src: this.type.src }
           })
         ], this, 'default'))
       }
 
       if (this.type.svg === true) {
-        return h('div', data, mergeSlot([
+        return h('span', data, mergeSlot([
           h('svg', {
-            class: this.type.cls,
             attrs: {
               viewBox: this.type.viewBox,
               focusable: 'false' /* needed for IE11 */
@@ -2554,9 +2565,8 @@
       }
 
       if (this.type.svguse === true) {
-        return h('div', data, mergeSlot([
+        return h('span', data, mergeSlot([
           h('svg', {
-            class: this.type.cls,
             attrs: {
               viewBox: this.type.viewBox,
               focusable: 'false' /* needed for IE11 */
@@ -10154,10 +10164,6 @@
       }
     },
 
-    activated: function activated () {
-      this.__recalculateScroll();
-    },
-
     created: function created () {
       this.buffer = [];
 
@@ -10170,6 +10176,15 @@
       this.rtlHasScrollBug = rtlHasScrollBug();
     },
 
+    activated: function activated () {
+      if (this.shouldActivate !== true) { return }
+      this.__recalculateScroll();
+    },
+
+    deactivated: function deactivated () {
+      this.shouldActivate = true;
+    },
+
     beforeDestroy: function beforeDestroy () {
       clearTimeout(this.bufferTimer);
       clearTimeout(this.animateTimer);
@@ -12856,7 +12871,11 @@
         return this.normalizedModel
           .filter(function (date) { return typeof date === 'string'; })
           .map(function (date) { return this$1.__decodeString(date, this$1.innerMask, this$1.innerLocale); })
-          .filter(function (date) { return date.dateHash !== null; })
+          .filter(function (date) { return date.dateHash !== null &&
+            date.day !== null &&
+            date.month !== null &&
+            date.year !== null; }
+          )
       },
 
       rangeModel: function rangeModel () {
@@ -18724,7 +18743,7 @@
               h(QIcon, {
                 staticClass: 'q-field__focusable-action',
                 props: { tag: 'button', name: this.clearIcon || this.$q.iconSet.field.clear },
-                attrs: { tabindex: 0, type: 'button' },
+                attrs: iconAsButton,
                 on: this.clearableEvents
               })
             ])
@@ -19003,6 +19022,15 @@
       this.autofocus === true && this.focus();
     },
 
+    activated: function activated () {
+      if (this.shouldActivate !== true) { return }
+      this.autofocus === true && this.focus();
+    },
+
+    deactivated: function deactivated () {
+      this.shouldActivate = true;
+    },
+
     beforeDestroy: function beforeDestroy () {
       clearTimeout(this.focusoutTimer);
     }
@@ -19758,6 +19786,15 @@
       this.autofocus === true && this.focus();
     },
 
+    activated: function activated () {
+      if (this.shouldActivate !== true) { return }
+      this.autofocus === true && this.focus();
+    },
+
+    deactivated: function deactivated () {
+      this.shouldActivate = true;
+    },
+
     methods: {
       validate: function validate (shouldFocus) {
         var this$1 = this;
@@ -20627,7 +20664,7 @@
     },
 
     activated: function activated () {
-      if (this.__scrollTarget && this.__scrollPosition !== void 0) {
+      if (this.__scrollPosition !== void 0 && this.__scrollTarget) {
         setScrollPosition(this.__scrollTarget, this.__scrollPosition);
       }
     },
@@ -22170,22 +22207,27 @@
       },
 
       trigger: function trigger (immediately) {
+        var this$1 = this;
+
         if (immediately === true || this.debounce === 0 || this.debounce === '0') {
           this.__emit();
         }
-        else if (this.timer === null) {
-          this.timer = this.debounce
-            ? setTimeout(this.__emit, this.debounce)
-            : requestAnimationFrame(this.__emit);
+        else if (this.clearTimer === void 0) {
+          var ref = this.debounce
+            ? [ setTimeout(this.__emit, this.debounce), clearTimeout ]
+            : [ requestAnimationFrame(this.__emit), cancelAnimationFrame ];
+          var timer = ref[0];
+          var fn = ref[1];
+
+          this.clearTimer = function () {
+            fn(timer);
+            this$1.clearTimer = void 0;
+          };
         }
       },
 
       __emit: function __emit () {
-        if (this.timer !== null) {
-          clearTimeout(this.timer);
-          cancelAnimationFrame(this.timer);
-          this.timer = null;
-        }
+        this.clearTimer !== void 0 && this.clearTimer();
 
         var fn = this.horizontal === true
           ? getHorizontalScrollPosition
@@ -22224,14 +22266,11 @@
     },
 
     mounted: function mounted () {
-      this.timer = null;
-
       this.__configureScrollTarget();
     },
 
     beforeDestroy: function beforeDestroy () {
-      clearTimeout(this.timer);
-      cancelAnimationFrame(this.timer);
+      this.clearTimer !== void 0 && this.clearTimer();
       this.__unconfigureScrollTarget();
     }
   });
@@ -25475,6 +25514,14 @@
         ) || this.scroll.horizontal.size <= this.container.horizontal + 1
       },
 
+      verticalThumbStart: function verticalThumbStart () {
+        return this.verticalScrollPercentage * (this.container.vertical - this.verticalThumbSize)
+      },
+
+      horizontalThumbStart: function horizontalThumbStart () {
+        return this.horizontalScrollPercentage * (this.container.horizontal - this.horizontalThumbSize)
+      },
+
       verticalThumbSize: function verticalThumbSize () {
         return Math.round(
           between(
@@ -25496,18 +25543,16 @@
       },
 
       verticalStyle: function verticalStyle () {
-        var pos = this.verticalScrollPercentage * (this.container.vertical - this.verticalThumbSize);
         return Object.assign({}, this.thumbStyle,
           this.verticalThumbStyle,
-          {top: (pos + "px"),
+          {top: ((this.verticalThumbStart) + "px"),
           height: ((this.verticalThumbSize) + "px")})
       },
 
       horizontalStyle: function horizontalStyle () {
-        var pos = this.horizontalScrollPercentage * (this.container.horizontal - this.horizontalThumbSize);
         return Object.assign({}, this.thumbStyle,
           this.horizontalThumbStyle,
-          {left: (pos + "px"),
+          {left: ((this.horizontalThumbStart) + "px"),
           width: ((this.horizontalThumbSize) + "px")})
       },
 
@@ -25536,6 +25581,7 @@
           vertical: Object.assign({}, this.scroll.vertical,
             {percentage: this.verticalScrollPercentage,
             thumbHidden: this.verticalThumbHidden,
+            thumbStart: this.verticalThumbStart,
             thumbSize: this.verticalThumbSize,
             style: this.verticalStyle,
             thumbClass: this.verticalThumbClass,
@@ -25543,6 +25589,7 @@
           horizontal: Object.assign({}, this.scroll.horizontal,
             {percentage: this.horizontalScrollPercentage,
             thumbHidden: this.horizontalThumbHidden,
+            thumbStart: this.horizontalThumbStart,
             thumbSize: this.horizontalThumbSize,
             style: this.horizontalStyle,
             thumbClass: this.horizontalThumbClass,
@@ -25775,8 +25822,11 @@
         var data = this.scrollComputed[ axis ];
 
         if (data.thumbHidden !== true) {
-          var pos = evt[ dirProps[ axis ].offset ] - data.thumbSize / 2;
-          this.__setScroll(pos / this.container[ axis ] * data.size, axis);
+          var offset = evt[ dirProps[ axis ].offset ];
+          if (offset < data.thumbStart || offset > data.thumbStart + data.thumbSize) {
+            var pos = offset - data.thumbSize / 2;
+            this.__setScroll(pos / this.container[ axis ] * data.size, axis);
+          }
 
           var ref = axis === 'vertical' ? this.$refs.verticalThumb : this.$refs.horizontalThumb;
           // activate thumb pan
@@ -25909,9 +25959,11 @@
     },
 
     activated: function activated () {
+      if (this.__scrollPosition === void 0) { return }
+
       var scrollTarget = this.getScrollTarget();
 
-      if (scrollTarget !== void 0 && this.__scrollPosition !== void 0) {
+      if (scrollTarget !== void 0) {
         setHorizontalScrollPosition(scrollTarget, this.__scrollPosition.left);
         setVerticalScrollPosition(scrollTarget, this.__scrollPosition.top);
       }
@@ -26528,9 +26580,9 @@
           ? 1
           : Math.ceil(scrollViewSize / this.virtualScrollItemSizeComputed);
         var baseSize = Math.max(
-          10,
+          1,
           view,
-          Math.ceil(this.virtualScrollSliceSize / multiplier)
+          Math.ceil((this.virtualScrollSliceSize > 0 ? this.virtualScrollSliceSize : 10) / multiplier)
         );
 
         this.virtualScrollSliceSizeComputed = {
@@ -26623,6 +26675,8 @@
     },
 
     activated: function activated () {
+      if (this.shouldActivate !== true) { return }
+
       var scrollEl = this.__getVirtualScrollTarget();
 
       if (this.prevScrollStart !== void 0 && scrollEl !== void 0 && scrollEl !== null && scrollEl.nodeType !== 8) {
@@ -26638,6 +26692,10 @@
       }
     },
 
+    deactivated: function deactivated () {
+      this.shouldActivate = true;
+    },
+
     beforeMount: function beforeMount () {
       this.__onVirtualScrollEvt = debounce(this.__onVirtualScrollEvt, this.$q.platform.is.ios === true ? 120 : 35);
       this.__setVirtualScrollSize();
@@ -27279,34 +27337,34 @@
 
         if (typeof value === 'string' && value.length > 0) {
           var needle = value.toLocaleLowerCase();
+          var findFn = function (extractFn) {
+            var option = this$1.options.find(function (opt) { return extractFn(opt).toLocaleLowerCase() === needle; });
 
-          var fn = function (opt) { return this$1.getOptionValue(opt).toLocaleLowerCase() === needle; };
-          var option = this.options.find(fn);
+            if (option === void 0) {
+              return false
+            }
 
-          if (option !== void 0) {
-            if (this.innerValue.indexOf(option) === -1) {
-              this.toggleOption(option);
+            if (this$1.innerValue.indexOf(option) === -1) {
+              this$1.toggleOption(option);
             }
             else {
-              this.hidePopup();
+              this$1.hidePopup();
             }
-          }
-          else {
-            fn = function (opt) { return this$1.getOptionLabel(opt).toLocaleLowerCase() === needle; };
-            option = this.options.find(fn);
 
-            if (option !== void 0) {
-              if (this.innerValue.indexOf(option) === -1) {
-                this.toggleOption(option);
-              }
-              else {
-                this.hidePopup();
-              }
+            return true
+          };
+          var fillFn = function (afterFilter) {
+            if (findFn(this$1.getOptionValue) === true) {
+              return
             }
-            else {
-              this.filter(value, true);
+            if (findFn(this$1.getOptionLabel) === true || afterFilter === true) {
+              return
             }
-          }
+
+            this$1.filter(value, true, function () { return fillFn(true); });
+          };
+
+          fillFn();
         }
         else {
           this.__clearValue(e);
@@ -27599,7 +27657,7 @@
             h('div', {
               ref: 'target',
               key: 'd_t',
-              staticClass: 'no-outline',
+              staticClass: 'q-select__focus-target',
               attrs: Object.assign({}, {id: this.targetUid,
                 tabindex: this.tabindex},
                 this.comboboxAttrs),
@@ -27614,7 +27672,7 @@
           if (typeof this.autocomplete === 'string' && this.autocomplete.length > 0) {
             child.push(
               h('input', {
-                staticClass: 'q-select__autocomplete-input no-outline',
+                staticClass: 'q-select__autocomplete-input',
                 attrs: { autocomplete: this.autocomplete },
                 on: cache(this, 'autoinp', {
                   keyup: this.__onTargetAutocomplete
@@ -27788,7 +27846,7 @@
         }
       },
 
-      filter: function filter (val, keepClosed) {
+      filter: function filter (val, keepClosed, afterUpdateFn) {
         var this$1 = this;
 
         if (this.qListeners.filter === void 0 || (keepClosed !== true && this.focused !== true)) {
@@ -27847,6 +27905,7 @@
                 }
 
                 typeof afterFn === 'function' && this$1.$nextTick(function () { afterFn(this$1); });
+                typeof afterUpdateFn === 'function' && this$1.$nextTick(function () { afterUpdateFn(this$1); });
               });
             }
           },
@@ -34688,6 +34747,8 @@
       expanded: Array, // sync
       selected: {}, // sync
 
+      noSelectionUnset: Boolean,
+
       defaultExpandAll: Boolean,
       accordion: Boolean,
 
@@ -35261,7 +35322,12 @@
 
         if (this.hasSelection) {
           if (meta.selectable) {
-            this.$emit('update:selected', meta.key !== this.selected ? meta.key : null);
+            if (this.noSelectionUnset === false) {
+              this.$emit('update:selected', meta.key !== this.selected ? meta.key : null);
+            }
+            else if (meta.key !== this.selected) {
+              this.$emit('update:selected', meta.key || null);
+            }
           }
         }
         else {
@@ -39015,9 +39081,9 @@
       okProps: function okProps () {
         return Object.assign({}, {color: this.vmColor,
           label: this.okLabel,
-          ripple: false},
-          (Object(this.ok) === this.ok ? this.ok : { flat: true }),
-          {disable: this.okDisabled})
+          ripple: false,
+          disable: this.okDisabled},
+          (Object(this.ok) === this.ok ? this.ok : { flat: true }))
       },
 
       cancelProps: function cancelProps () {
@@ -39242,8 +39308,9 @@
       var $q = ref.$q;
       var cfg = ref.cfg;
 
+      $q.loadingBar = this;
+
       if (isSSR === true) {
-        $q.loadingBar = this;
         return
       }
 
@@ -39251,7 +39318,7 @@
         ? Object.assign({}, cfg.loadingBar)
         : {};
 
-      var bar = $q.loadingBar = new Vue({
+      var bar = new Vue({
         name: 'LoadingBar',
 
         // hide App from Vue devtools
@@ -39271,11 +39338,11 @@
       Object.assign(this, {
         start: function (speed) {
           bar.start(speed);
-          this$1.isActive = bar.isActive = bar.calls > 0;
+          this$1.isActive = bar.isActive = true;
         },
         stop: function () {
-          bar.stop();
-          this$1.isActive = bar.isActive = bar.calls > 0;
+          var sessions = bar.stop();
+          this$1.isActive = bar.isActive = sessions > 0;
         },
         increment: bar.increment,
         setDefaults: function (opts) {
@@ -39888,7 +39955,7 @@
     closeBtn && actions.push({
       label: typeof closeBtn === 'string'
         ? closeBtn
-        : this.$q.lang.label.close
+        : vm.$q.lang.label.close
     });
 
     notif.actions = actions.map(function (ref) {