quasar 1.18.10 → 1.19.2

package/dist/quasar.sass

@@ -1,5 +1,5 @@
 /*!
- * Quasar Framework v1.18.10
+ * Quasar Framework v1.19.2
  * (c) 2015-present Razvan Stoenescu
  * Released under the MIT License.
  */
@@ -648,6 +648,7 @@ input[type='search']::-webkit-search-decoration
   line-height: 1
   width: 1em
   height: 1em
+  flex-shrink: 0
   letter-spacing: normal
   text-transform: none
   white-space: nowrap
@@ -665,13 +666,16 @@ input[type='search']::-webkit-search-decoration
     justify-content: center
   > svg,
   > img
-    width: 1em
-    height: 1em
+    width: 100%
+    height: 100%
 .q-icon,
 .material-icons,
 .material-icons-outlined,
 .material-icons-round,
-.material-icons-sharp
+.material-icons-sharp,
+.material-symbols-outlined,
+.material-symbols-rounded,
+.material-symbols-sharp
   user-select: none
   cursor: inherit
   font-size: inherit
@@ -4187,7 +4191,7 @@ body.platform-ios
     &--selected
       transform: scale(.95)
 .q-table--horizontal-separator, .q-table--cell-separator
-  thead th, tbody tr:not(:last-child) td
+  thead th, tbody tr:not(:last-child) > td
     border-bottom-width: 1px
 .q-table--vertical-separator, .q-table--cell-separator
   td, th
@@ -5514,6 +5518,7 @@ body.q-ios-padding .q-notifications__list
   --q-color-info:         #{$info}
   --q-color-warning:      #{$warning}
   --q-color-dark:         #{$dark}
+  --q-color-dark-page:    #{$dark-page}
 .text-dark
   color: $dark !important
   color: var(--q-color-dark) !important
@@ -7497,6 +7502,7 @@ body.desktop
 body.body--dark
   color: #fff
   background: $dark-page
+  background: var(--q-color-dark-page)
 .q-dark
   color: #fff
   background: $grey-9

package/dist/quasar.styl

@@ -1,5 +1,5 @@
 /*!
- * Quasar Framework v1.18.10
+ * Quasar Framework v1.19.2
  * (c) 2015-present Razvan Stoenescu
  * Released under the MIT License.
  */
@@ -694,6 +694,7 @@ input[type='search']::-webkit-search-decoration
   line-height: 1
   width: 1em
   height: 1em
+  flex-shrink: 0
   letter-spacing: normal
   text-transform: none
   white-space: nowrap
@@ -711,13 +712,16 @@ input[type='search']::-webkit-search-decoration
     justify-content: center
   > svg,
   > img
-    width: 1em
-    height: 1em
+    width: 100%
+    height: 100%
 .q-icon,
 .material-icons,
 .material-icons-outlined,
 .material-icons-round,
-.material-icons-sharp
+.material-icons-sharp,
+.material-symbols-outlined,
+.material-symbols-rounded,
+.material-symbols-sharp
   user-select: none
   cursor: inherit
   font-size: inherit
@@ -4234,7 +4238,7 @@ body.platform-ios
     &--selected
       transform: scale(.95)
 .q-table--horizontal-separator, .q-table--cell-separator
-  thead th, tbody tr:not(:last-child) td
+  thead th, tbody tr:not(:last-child) > td
     border-bottom-width: 1px
 .q-table--vertical-separator, .q-table--cell-separator
   td, th
@@ -5558,6 +5562,7 @@ body.q-ios-padding .q-notifications__list
   --q-color-info:         $info
   --q-color-warning:      $warning
   --q-color-dark:         $dark
+  --q-color-dark-page:    $dark-page
 .text-dark
   color: $dark !important
   color: var(--q-color-dark) !important
@@ -7543,6 +7548,7 @@ body.desktop
 body.body--dark
   color: #fff
   background: $dark-page
+  background: var(--q-color-dark-page)
 .q-dark
   color: #fff
   background: $grey-9

package/dist/quasar.umd.js

@@ -1,5 +1,5 @@
 /*!
- * Quasar Framework v1.18.10
+ * Quasar Framework v1.19.2
  * (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.18.10";
+  var version = "1.19.2";
 
   /* eslint-disable no-useless-escape */
 
@@ -2403,8 +2403,15 @@
     s_: '-sharp'
   };
 
+  var symMap = {
+    sym_o_: '-outlined',
+    sym_r_: '-rounded',
+    sym_s_: '-sharp'
+  };
+
   var libRE = new RegExp('^(' + Object.keys(libMap).join('|') + ')');
   var matRE = new RegExp('^(' + Object.keys(matMap).join('|') + ')');
+  var symRE = new RegExp('^(' + Object.keys(symMap).join('|') + ')');
   var mRE = /^[Mm]\s?[-+]?\.?\d/;
   var imgRE = /^img:/;
   var svgUseRE = /^svguse:/;
@@ -2518,6 +2525,22 @@
         else if (ionRE.test(icon) === true) {
           cls = "ionicons ion-" + (this.$q.platform.is.ios === true ? 'ios' : 'md') + (icon.substr(3));
         }
+        else if (symRE.test(icon) === true) {
+          // "notranslate" class is for Google Translate
+          // to avoid tampering with Material Symbols ligature font
+          //
+          // Caution: To be able to add suffix to the class name,
+          // keep the 'material-symbols' at the end of the string.
+          cls = 'notranslate material-symbols';
+
+          var matches$1 = icon.match(symRE);
+          if (matches$1 !== null) {
+            icon = icon.substring(6);
+            cls += symMap[ matches$1[ 1 ] ];
+          }
+
+          content = icon;
+        }
         else {
           // "notranslate" class is for Google Translate
           // to avoid tampering with Material Icons ligature font
@@ -2526,10 +2549,10 @@
           // keep the 'material-icons' at the end of the string.
           cls = 'notranslate material-icons';
 
-          var matches$1 = icon.match(matRE);
-          if (matches$1 !== null) {
+          var matches$2 = icon.match(matRE);
+          if (matches$2 !== null) {
             icon = icon.substring(2);
-            cls += matMap[ matches$1[ 1 ] ];
+            cls += matMap[ matches$2[ 1 ] ];
           }
 
           content = icon;
@@ -2569,7 +2592,7 @@
         return h('span', data, mergeSlot([
           h('svg', {
             attrs: {
-              viewBox: this.type.viewBox,
+              viewBox: this.type.viewBox || '0 0 24 24',
               focusable: 'false' /* needed for IE11 */
             }
           }, this.type.nodes)
@@ -3374,11 +3397,7 @@
             evt.qSkipRipple !== true &&
             // on ENTER in form IE emits a PointerEvent with negative client cordinates
             (client.is.ie !== true || evt.clientX >= 0) &&
-            (
-              ctx.modifiers.early === true
-                ? ['mousedown', 'touchstart'].includes(evt.type) === true
-                : evt.type === 'click'
-            )
+            evt.type === (ctx.modifiers.early === true ? 'pointerdown' : 'click')
           ) {
             showRipple(evt, el, ctx, evt.qKeyEvent === true);
           }
@@ -3401,8 +3420,7 @@
       el.__qripple = ctx;
 
       addEvt(ctx, 'main', [
-        [ el, 'mousedown', 'start', 'passive' ],
-        [ el, 'touchstart', 'start', 'passive' ],
+        [ el, 'pointerdown', 'start', 'passive' ],
         [ el, 'click', 'start', 'passive' ],
         [ el, 'keydown', 'keystart', 'passive' ],
         [ el, 'keyup', 'keystart', 'passive' ]
@@ -3937,11 +3955,11 @@
       if (this.loading === true && this.percentage !== void 0) {
         child.push(
           h('span', {
-            staticClass: 'q-btn__progress absolute-full overflow-hidden'
+            staticClass: 'q-btn__progress absolute-full overflow-hidden',
+            class: this.darkPercentage === true ? 'q-btn__progress--dark' : ''
           }, [
             h('span', {
               staticClass: 'q-btn__progress-indicator fit block',
-              class: this.darkPercentage === true ? 'q-btn__progress--dark' : '',
               style: this.percentageStyle
             })
           ])
@@ -4176,7 +4194,7 @@
       },
 
       __pickAnchorEl: function __pickAnchorEl () {
-        if (this.target === false || this.target === '') {
+        if (this.target === false || this.target === '' || this.parentEl === null) {
           this.anchorEl = void 0;
         }
         else if (this.target === true) {
@@ -12154,7 +12172,7 @@
     var date = new Date(
       d.year,
       d.month === null ? null : d.month - 1,
-      d.day,
+      d.day === null ? 1 : d.day,
       d.hour,
       d.minute,
       d.second,
@@ -16644,7 +16662,7 @@
       return false
     }
 
-    if (el !== null && list.includes(el.nodeName.toLowerCase()) === true) {
+    if (list.includes(el.nodeName.toLowerCase()) === true) {
       return true
     }
 
@@ -17262,33 +17280,14 @@
         }
       },
 
-      __onMousedown: function __onMousedown () {
+      // mousedown, touchstart
+      __onPointerStart: function __onPointerStart (e) {
         this.__offsetBottom = void 0;
+        this.qListeners[e.type] !== void 0 && this.$emit(e.type, e);
       },
 
-      __onMouseup: function __onMouseup (e) {
+      __onSelectionchange: function __onSelectionchange () {
         this.caret.save();
-        if (this.qListeners.mouseup !== void 0) {
-          this.$emit('mouseup', e);
-        }
-      },
-
-      __onKeyup: function __onKeyup (e) {
-        this.caret.save();
-        if (this.qListeners.keyup !== void 0) {
-          this.$emit('keyup', e);
-        }
-      },
-
-      __onTouchstart: function __onTouchstart () {
-        this.__offsetBottom = void 0;
-      },
-
-      __onTouchend: function __onTouchend (e) {
-        this.caret.save();
-        if (this.qListeners.touchend !== void 0) {
-          this.$emit('touchend', e);
-        }
       },
 
       runCmd: function runCmd (cmd, param, update) {
@@ -17358,6 +17357,12 @@
       this.caret = new Caret(this.$refs.content, this);
       this.__setContent(this.value);
       this.refreshToolbar();
+
+      document.addEventListener('selectionchange', this.__onSelectionchange);
+    },
+
+    beforeDestroy: function beforeDestroy () {
+      document.removeEventListener('selectionchange', this.__onSelectionchange);
     },
 
     render: function render (h) {
@@ -17394,13 +17399,8 @@
         focus: this.__onFocus,
 
         // clean saved scroll position
-        mousedown: this.__onMousedown,
-        touchstart: this.__onTouchstart,
-
-        // save caret
-        mouseup: this.__onMouseup,
-        keyup: this.__onKeyup,
-        touchend: this.__onTouchend});
+        mousedown: this.__onPointerStart,
+        touchstart: this.__onPointerStart});
 
       return h('div', {
         style: {
@@ -18925,8 +18925,9 @@
             h('div', {
               ref: 'target',
               staticClass: 'q-field__native row',
-              attrs: Object.assign({}, this.qAttrs,
-                {'data-autofocus': this.autofocus})
+              attrs: Object.assign({}, {tabindex: -1},
+                this.qAttrs,
+                {'data-autofocus': this.autofocus || void 0})
             }, this.$scopedSlots.control(this.controlSlotScope))
           );
         }
@@ -19104,7 +19105,7 @@
 
       var attrs = this.__getControl === void 0 && this.$scopedSlots.control === void 0
         ? Object.assign({}, this.qAttrs,
-          {'data-autofocus': this.autofocus},
+          {'data-autofocus': this.autofocus || void 0},
           this.attrs)
         : this.attrs;
 
@@ -19511,6 +19512,10 @@
 
       isAppending: function isAppending () {
         return this.multiple === true && this.append === true
+      },
+
+      fieldClass: function fieldClass () {
+        return 'q-file q-field--auto-height' + (this.dnd === true ? ' q-file--dnd' : '')
       }
     },
 
@@ -19681,8 +19686,6 @@
     },
 
     created: function created () {
-      this.fieldClass = 'q-file q-field--auto-height';
-
       // necessary for QField's clearable
       // and FileValueMixin
       this.type = 'file';
@@ -20770,6 +20773,16 @@
 
         if (this.isWorking === true) {
           this.__scrollTarget.addEventListener('scroll', this.poll, passive$1);
+
+          if (this.reverse === true) {
+            var
+              scrollHeight = getScrollHeight(this.__scrollTarget),
+              containerHeight = height(this.__scrollTarget);
+
+            setScrollPosition(this.__scrollTarget, scrollHeight - containerHeight);
+          }
+
+          this.immediatePoll();
         }
       },
 
@@ -20801,16 +20814,6 @@
       this.__setDebounce(this.debounce);
 
       this.updateScrollTarget();
-
-      if (this.reverse === true) {
-        var
-          scrollHeight = getScrollHeight(this.__scrollTarget),
-          containerHeight = height(this.__scrollTarget);
-
-        setScrollPosition(this.__scrollTarget, scrollHeight - containerHeight);
-      }
-
-      this.immediatePoll();
     },
 
     activated: function activated () {
@@ -21475,28 +21478,29 @@
   var isJapanese = /[\u3000-\u303f\u3040-\u309f\u30a0-\u30ff\uff00-\uff9f\u4e00-\u9faf\u3400-\u4dbf]/;
   var isChinese = /(?:[\u3300-\u4DBF\u4E00-\u9FFF\uF900-\uFAFF\uFE30-\uFE4F]|[\uD840-\uD868\uD86A-\uD872][\uDC00-\uDFFF]|\uD869[\uDC00-\uDEDF\uDF00-\uDFFF]|\uD873[\uDC00-\uDEAF]|\uD87E[\uDC00-\uDE1F])/;
   var isKorean = /[\u3131-\u314e\u314f-\u3163\uac00-\ud7a3]/;
+  var isPlainText = /[a-z0-9_ -]$/i;
 
   var CompositionMixin = {
     methods: {
       __onComposition: function __onComposition (e) {
         if (e.type === 'compositionend' || e.type === 'change') {
-          if (e.target.composing !== true) { return }
-          e.target.composing = false;
+          if (e.target.qComposing !== true) { return }
+          e.target.qComposing = false;
           this.__onInput(e);
         }
-        else if (e.type === 'compositionupdate') {
-          if (
-            typeof e.data === 'string' &&
-            isJapanese.test(e.data) === false &&
-            isChinese.test(e.data) === false &&
-            isKorean.test(e.data) === false
-          ) {
-            e.target.composing = false;
+        else if (
+          e.type === 'compositionupdate' &&
+          e.target.qComposing !== true &&
+          typeof e.data === 'string'
+        ) {
+          var isComposing = client.is.firefox === true
+            ? isPlainText.test(e.data) === false
+            : isJapanese.test(e.data) === true || isChinese.test(e.data) === true || isKorean.test(e.data) === true;
+
+          if (isComposing === true) {
+            e.target.qComposing = true;
           }
         }
-        else {
-          e.target.composing = true;
-        }
       }
     }
   };
@@ -21641,7 +21645,7 @@
 
       inputAttrs: function inputAttrs () {
         var attrs = Object.assign({}, {tabindex: 0,
-          'data-autofocus': this.autofocus,
+          'data-autofocus': this.autofocus || void 0,
           rows: this.type === 'textarea' ? 6 : void 0,
           'aria-label': this.label,
           name: this.nameProp},
@@ -21695,7 +21699,7 @@
       },
 
       __onInput: function __onInput (e) {
-        if (!e || !e.target || e.target.composing === true) {
+        if (!e || !e.target || e.target.qComposing === true) {
           return
         }
 
@@ -21777,13 +21781,17 @@
         var inp = this.$refs.input;
         if (inp !== void 0) {
           var parentStyle = inp.parentNode.style;
+          var ref = inp.style;
+          var overflow = ref.overflow;
 
           // 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 = '';
         }
       },
@@ -22586,6 +22594,7 @@
       var layout = h('div', {
         class: this.classes,
         style: this.style,
+        attrs: { tabindex: -1 },
         on: Object.assign({}, this.qListeners)
       }, mergeSlot([
         h(QScrollObserver, {
@@ -26372,11 +26381,12 @@
       setOverflowAnchor.isSupported = window.getComputedStyle(document.body).overflowAnchor !== void 0;
     }
 
-    if (setOverflowAnchor.isSupported === false) {
+    if (setOverflowAnchor.isSupported === false || contentEl === void 0) {
       return
     }
 
-    requestAnimationFrame(function () {
+    cancelAnimationFrame(contentEl._qOverflowAnimationFrame);
+    contentEl._qOverflowAnimationFrame = requestAnimationFrame(function () {
       if (contentEl === void 0) {
         return
       }
@@ -27053,15 +27063,20 @@
         this.__updateMenu(show);
       },
 
-      virtualScrollLength: function virtualScrollLength () {
+      virtualScrollLength: function virtualScrollLength (newLength, oldLength) {
         var this$1 = this;
 
         if (this.menu === true && this.innerLoading === false) {
-          this.reset();
+          this.__resetVirtualScroll(-1, true);
 
           this.$nextTick(function () {
             if (this$1.menu === true && this$1.innerLoading === false) {
-              this$1.__updateMenu(true);
+              if (newLength > oldLength) {
+                this$1.__resetVirtualScroll();
+              }
+              else {
+                this$1.__updateMenu(true);
+              }
             }
           });
         }
@@ -27318,7 +27333,7 @@
 
       virtualScrollItemSizeComputed: function virtualScrollItemSizeComputed () {
         return this.virtualScrollItemSize === void 0
-          ? (this.dense === true ? 24 : 48)
+          ? (this.optionsDense === true ? 24 : 48)
           : this.virtualScrollItemSize
       },
 
@@ -28011,7 +28026,7 @@
             maxlength: this.maxlength, // this is converted to prop by QField
             tabindex: this.tabindex,
             autocomplete: this.autocomplete,
-            'data-autofocus': fromDialog === true ? false : this.autofocus,
+            'data-autofocus': (fromDialog !== true && this.autofocus) || void 0,
             disabled: this.disable === true,
             readonly: this.readonly === true}),
           on: this.inputControlEvents
@@ -28033,7 +28048,7 @@
 
         clearTimeout(this.inputTimer);
 
-        if (e && e.target && e.target.composing === true) {
+        if (e && e.target && e.target.qComposing === true) {
           return
         }
 
@@ -35965,28 +35980,32 @@
 
         return [
           h('div', {
-            staticClass: 'q-uploader__header-content flex flex-center no-wrap q-gutter-xs'
+            staticClass: 'q-uploader__header-content column'
           }, [
-            this.__getBtn(h, this.queuedFiles.length > 0, 'removeQueue', this.removeQueuedFiles),
-            this.__getBtn(h, this.uploadedFiles.length > 0, 'removeUploaded', this.removeUploadedFiles),
-
-            this.isUploading === true
-              ? h(QSpinner, { staticClass: 'q-uploader__spinner' })
-              : null,
+            h('div', {
+              staticClass: 'flex flex-center no-wrap q-gutter-xs'
+            }, [
+              this.__getBtn(h, this.queuedFiles.length > 0, 'removeQueue', this.removeQueuedFiles),
+              this.__getBtn(h, this.uploadedFiles.length > 0, 'removeUploaded', this.removeUploadedFiles),
 
-            h('div', { staticClass: 'col column justify-center' }, [
-              this.label !== void 0
-                ? h('div', { staticClass: 'q-uploader__title' }, [ this.label ])
+              this.isUploading === true
+                ? h(QSpinner, { staticClass: 'q-uploader__spinner' })
                 : null,
 
-              h('div', { staticClass: 'q-uploader__subtitle' }, [
-                this.uploadSizeLabel + ' / ' + this.uploadProgressLabel
-              ])
-            ]),
+              h('div', { staticClass: 'col column justify-center' }, [
+                this.label !== void 0
+                  ? h('div', { staticClass: 'q-uploader__title' }, [ this.label ])
+                  : null,
 
-            this.__getBtn(h, this.canAddFiles, 'add', this.pickFiles),
-            this.__getBtn(h, this.hideUploadBtn === false && this.canUpload === true, 'upload', this.upload),
-            this.__getBtn(h, this.isUploading, 'clear', this.abort)
+                h('div', { staticClass: 'q-uploader__subtitle' }, [
+                  this.uploadSizeLabel + ' / ' + this.uploadProgressLabel
+                ])
+              ]),
+
+              this.__getBtn(h, this.canAddFiles, 'add', this.pickFiles),
+              this.__getBtn(h, this.hideUploadBtn === false && this.canUpload === true, 'upload', this.upload),
+              this.__getBtn(h, this.isUploading, 'clear', this.abort)
+            ])
           ])
         ]
       },
@@ -36089,7 +36108,8 @@
           'q-uploader--bordered': this.bordered,
           'q-uploader--square no-border-radius': this.square,
           'q-uploader--flat no-shadow': this.flat,
-          'disabled q-uploader--disable': this.disable
+          'disabled q-uploader--disable': this.disable,
+          'q-uploader--dnd': this.dnd
         },
         on: this.canAddFiles === true
           ? cache(this, 'drag', {