quasar 2.7.3 → 2.7.6

package/dist/quasar.sass

@@ -1,5 +1,5 @@
 /*!
- * Quasar Framework v2.7.3
+ * Quasar Framework v2.7.6
  * (c) 2015-present Razvan Stoenescu
  * Released under the MIT License.
  */
@@ -903,6 +903,8 @@ input[type='search']::-webkit-search-decoration
     padding: 0
     min-width: 3em
     min-height: 3em
+  &--square
+    border-radius: 0
   &--flat, &--outline, &--unelevated
     &:before
       box-shadow: none
@@ -1011,6 +1013,8 @@ input[type='search']::-webkit-search-decoration
             margin-bottom: -2px
   &--rounded
     border-radius: $button-rounded-border-radius
+  &--square
+    border-radius: 0
   &--flat, &--outline, &--unelevated
     box-shadow: none
   &--outline
@@ -2301,6 +2305,7 @@ $field-transition-label-right-up: .324s cubic-bezier(.4,0,.2,1)
     width: 100%
     min-width: 0 
     outline: 0 !important 
+    user-select: auto
     &:-webkit-autofill
       -webkit-animation-name: q-autofill
       -webkit-animation-fill-mode: both
@@ -4581,6 +4586,10 @@ body.desktop .q-table > tbody > tr:not(.q-tr--no-hover):hover > td:not(.q-td--no
       line-height: 38px
       width: 100%
       color: #fff
+      > svg,
+      > img
+        width: 1em
+        height: 1em
   &__dot-img
     position: absolute
     top: 4px
@@ -5036,7 +5045,7 @@ body.desktop
     
     &::-webkit-file-upload-button
       cursor: pointer
-  &__header, &__file
+  &__file
     &:before
       content: ''
       border-top-left-radius: inherit

package/dist/quasar.umd.js

@@ -1,5 +1,5 @@
 /*!
- * Quasar Framework v2.7.3
+ * Quasar Framework v2.7.6
  * (c) 2015-present Razvan Stoenescu
  * Released under the MIT License.
  */
@@ -1603,7 +1603,7 @@
   }
 
   var installQuasar = function (parentApp, opts = {}) {
-      const $q = { version: '2.7.3' };
+      const $q = { version: '2.7.6' };
 
       if (globalConfigIsFrozen === false) {
         if (opts.config !== void 0) {
@@ -2536,7 +2536,7 @@
     return vm.appContext.config.globalProperties.$router !== void 0
   }
 
-  const disabledValues = [ void 0, true ];
+  const disabledValues = [ '', true ];
 
   var QBreadcrumbs = createComponent({
     name: 'QBreadcrumbs',
@@ -3185,8 +3185,14 @@
         name: 'ripple',
 
         beforeMount (el, binding) {
+          const cfg = binding.instance.$.appContext.config.globalProperties.$q.config || {};
+
+          if (cfg.ripple === false) {
+            return
+          }
+
           const ctx = {
-            cfg: binding.instance.$.appContext.config.globalProperties.$q.config,
+            cfg,
             enabled: binding.value !== false,
             modifiers: {},
             abort: [],
@@ -3228,19 +3234,23 @@
         updated (el, binding) {
           if (binding.oldValue !== binding.value) {
             const ctx = el.__qripple;
-            ctx.enabled = binding.value !== false;
+            if (ctx !== void 0) {
+              ctx.enabled = binding.value !== false;
 
-            if (ctx.enabled === true && Object(binding.value) === binding.value) {
-              updateModifiers$1(ctx, binding);
+              if (ctx.enabled === true && Object(binding.value) === binding.value) {
+                updateModifiers$1(ctx, binding);
+              }
             }
           }
         },
 
         beforeUnmount (el) {
           const ctx = el.__qripple;
-          ctx.abort.forEach(fn => { fn(); });
-          cleanEvt(ctx, 'main');
-          delete el._qripple;
+          if (ctx !== void 0) {
+            ctx.abort.forEach(fn => { fn(); });
+            cleanEvt(ctx, 'main');
+            delete el._qripple;
+          }
         }
       }
   );
@@ -3279,6 +3289,7 @@
     iconRight: String,
 
     round: Boolean,
+    square: Boolean,
     outline: Boolean,
     flat: Boolean,
     unelevated: Boolean,
@@ -3412,8 +3423,11 @@
         colors = `text-${ props.textColor }`;
       }
 
-      return `q-btn--${ design.value } `
-        + `q-btn--${ props.round === true ? 'round' : `rectangle${ isRounded.value === true ? ' q-btn--rounded' : '' }` }`
+      const shape = props.round === true
+        ? 'round'
+        : `rectangle${ isRounded.value === true ? ' q-btn--rounded' : (props.square === true ? ' q-btn--square' : '') }`;
+
+      return `q-btn--${ design.value } q-btn--${ shape }`
         + (colors !== void 0 ? ' ' + colors : '')
         + (isActionable.value === true ? ' q-btn--actionable q-focusable q-hoverable' : (props.disable === true ? ' disabled' : ''))
         + (props.fab === true ? ' q-btn--fab' : (props.fabMini === true ? ' q-btn--fab-mini' : ''))
@@ -3421,6 +3435,7 @@
         + (props.dense === true ? ' q-btn--dense' : '')
         + (props.stretch === true ? ' no-border-radius self-stretch' : '')
         + (props.glossy === true ? ' glossy' : '')
+        + (props.square ? ' q-btn--square' : '')
     });
 
     const innerClasses = vue.computed(() =>
@@ -3815,6 +3830,7 @@
       outline: Boolean,
       flat: Boolean,
       rounded: Boolean,
+      square: Boolean,
       push: Boolean,
       stretch: Boolean,
       glossy: Boolean,
@@ -3823,7 +3839,7 @@
 
     setup (props, { slots }) {
       const classes = vue.computed(() => {
-        const cls = [ 'unelevated', 'outline', 'flat', 'rounded', 'push', 'stretch', 'glossy' ]
+        const cls = [ 'unelevated', 'outline', 'flat', 'rounded', 'square', 'push', 'stretch', 'glossy' ]
           .filter(t => props[ t ] === true)
           .map(t => `q-btn-group--${ t }`).join(' ');
 
@@ -5686,6 +5702,7 @@
           outline: props.outline,
           flat: props.flat,
           rounded: props.rounded,
+          square: props.square,
           push: props.push,
           unelevated: props.unelevated,
           glossy: props.glossy,
@@ -7171,7 +7188,7 @@
     const refocusRef = vue.ref(null);
 
     const refocusTargetEl = vue.computed(() => {
-      if (props.disable !== true) {
+      if (props.disable === true) {
         return null
       }
 
@@ -9989,9 +10006,16 @@
       if (isKeyCode(e, [ 13, 32 ])) {
         onClick(e, true);
       }
-      else if (shouldIgnoreKey(e) !== true && e.keyCode >= 35 && e.keyCode <= 40) {
+      else if (
+        shouldIgnoreKey(e) !== true
+        && e.keyCode >= 35
+        && e.keyCode <= 40
+        && e.altKey !== true
+        && e.metaKey !== true
+      ) {
         $tabs.onKbdNavigate(e.keyCode, proxy.$el) === true && stopAndPrevent(e);
       }
+
       emit('keydown', e);
     }
 
@@ -12407,7 +12431,7 @@
     YY (date, dateLocale, forcedYear) {
       // workaround for < 1900 with new Date()
       const y = this.YYYY(date, dateLocale, forcedYear) % 100;
-      return y > 0
+      return y >= 0
         ? pad(y)
         : '-' + pad(Math.abs(y))
     },
@@ -17707,7 +17731,7 @@
         let child;
 
         if (slots.header !== void 0) {
-          child = [].concat(slots.header());
+          child = [].concat(slots.header({ expanded: showing.value === true }));
         }
         else {
           child = [
@@ -18945,14 +18969,14 @@
 
     function addFilesToQueue (e, fileList) {
       const localFiles = processFiles(e, fileList, state.files.value, true);
-
-      if (localFiles === void 0) { return }
-
       const fileInput = getFileInput();
+
       if (fileInput !== void 0 && fileInput !== null) {
         fileInput.value = '';
       }
 
+      if (localFiles === void 0) { return }
+
       localFiles.forEach(file => {
         state.updateFileStatus(file, 'idle');
         uploadSize.value += file.size;
@@ -21369,6 +21393,11 @@
 
       function addFilesToQueue (e, fileList) {
         const files = processFiles(e, fileList, innerValue.value, isAppending.value);
+        const fileInput = getFileInput();
+
+        if (fileInput !== void 0 && fileInput !== null) {
+          fileInput.value = '';
+        }
 
         // if nothing to do...
         if (files === void 0) { return }
@@ -23464,7 +23493,7 @@
       }
 
       function onInput (e) {
-        if (!e || !e.target || e.target.qComposing === true) {
+        if (!e || !e.target) {
           return
         }
 
@@ -23475,6 +23504,12 @@
 
         const val = e.target.value;
 
+        if (e.target.qComposing === true) {
+          temp.value = val;
+
+          return
+        }
+
         if (hasMask.value === true) {
           updateMaskValue(val, false, e.inputType);
         }
@@ -27055,6 +27090,8 @@
     mouseAllDir: true
   };
 
+  const getMinThumbSize = size => (size >= 250 ? 50 : Math.ceil(size / 5));
+
   var QScrollArea = createComponent({
     name: 'QScrollArea',
 
@@ -27146,7 +27183,7 @@
         Math.round(
           between(
             container.vertical.value * container.vertical.value / scroll.vertical.size.value,
-            50,
+            getMinThumbSize(container.vertical.value),
             container.vertical.value
           )
         )
@@ -27188,7 +27225,7 @@
         Math.round(
           between(
             container.horizontal.value * container.horizontal.value / scroll.horizontal.size.value,
-            50,
+            getMinThumbSize(container.horizontal.value),
             container.horizontal.value
           )
         )
@@ -29659,10 +29696,9 @@
         showPopup,
 
         floatingLabel: vue.computed(() =>
-          (props.hideSelected === true
-            ? inputValue.value.length > 0
-            : hasValue.value === true
-          )
+          (props.hideSelected !== true && hasValue.value === true)
+          || typeof inputValue.value === 'number'
+          || inputValue.value.length > 0
           || fieldValueIsFilled(props.displayValue)
         ),
 
@@ -29722,6 +29758,7 @@
                 class: 'q-select__focus-target',
                 id: isTarget === true ? state.targetUid.value : void 0,
                 readonly: true,
+                'data-autofocus': (fromDialog !== true && props.autofocus === true) || void 0,
                 ...attrs,
                 onKeydown: onTargetKeydown,
                 onKeyup: onTargetKeyup,
@@ -38119,10 +38156,10 @@
 
           // account for "script setup" + async component way of declaring component
           if (
-            target.component.subTree &&
-            target.component.subTree.component &&
-            target.component.subTree.component.proxy &&
-            target.component.subTree.component.proxy[ cmd ]
+            target.component.subTree
+            && target.component.subTree.component
+            && target.component.subTree.component.proxy
+            && target.component.subTree.component.proxy[ cmd ]
           ) {
             target.component.subTree.component.proxy[ cmd ]();
             return
@@ -38195,25 +38232,19 @@
           ...props,
           ref: dialogRef,
           onOk,
-          onHide
+          onHide,
+          onVnodeMounted (...args) {
+            if (typeof props.onVnodeMounted === 'function') {
+              props.onVnodeMounted(...args);
+            }
+
+            applyState('show');
+          }
         })
       }, parentApp);
 
       vm = app.mount(el);
 
-      function show () {
-        applyState('show');
-      }
-
-      if (typeof DialogComponent.__asyncLoader === 'function') {
-        DialogComponent.__asyncLoader().then(() => {
-          vue.nextTick(show);
-        });
-      }
-      else {
-        vue.nextTick(show);
-      }
-
       return API
     }
   }
@@ -39732,7 +39763,7 @@
   });
 
   var index_umd = {
-    version: '2.7.3',
+    version: '2.7.6',
     install (app, opts) {
       installQuasar(app, {
         components,