quasar 2.11.1 → 2.11.2

package/dist/quasar.css

@@ -4898,10 +4898,14 @@ body.desktop .q-table > tbody > tr:not(.q-tr--no-hover):hover > td:not(.q-td--no
 .q-tabs--scrollable.q-tabs__arrows--inside .q-tabs__arrow--faded {
   display: none;
 }
-.q-tabs--not-scrollable .q-tabs__arrow {
+.q-tabs--not-scrollable.q-tabs__arrows--outside, body.mobile .q-tabs--scrollable.q-tabs--mobile-without-arrows.q-tabs__arrows--outside {
+  padding-left: 0;
+  padding-right: 0;
+}
+.q-tabs--not-scrollable .q-tabs__arrow, body.mobile .q-tabs--scrollable.q-tabs--mobile-without-arrows .q-tabs__arrow {
   display: none;
 }
-.q-tabs--not-scrollable .q-tabs__content {
+.q-tabs--not-scrollable .q-tabs__content, body.mobile .q-tabs--scrollable.q-tabs--mobile-without-arrows .q-tabs__content {
   border-radius: inherit;
 }
 .q-tabs__arrow {
@@ -10500,7 +10504,8 @@ img.responsive {
           user-select: none !important;
 }
 
-.scroll {
+.scroll,
+body.mobile .scroll--mobile {
   overflow: auto;
 }
 

package/dist/quasar.esm.js

@@ -1,5 +1,5 @@
 /*!
- * Quasar Framework v2.11.1
+ * Quasar Framework v2.11.2
  * (c) 2015-present Razvan Stoenescu
  * Released under the MIT License.
  */
@@ -316,8 +316,8 @@ const Platform = {
       // the rest of the props; we also avoid
       // hydration errors
       opts.onSSRHydrated.push(() => {
-        isRuntimeSsrPreHydration.value = false;
         Object.assign($q.platform, client);
+        isRuntimeSsrPreHydration.value = false;
         iosCorrection = void 0;
       });
 
@@ -1172,21 +1172,51 @@ function getBodyClasses ({ is, has, within }, cfg) {
 }
 
 function applyClientSsrCorrections () {
+  const { is } = client;
   const classes = document.body.className;
-  let newCls = classes;
+
+  const classList = new Set(classes.replace(/ {2}/g, ' ').split(' '));
 
   if (iosCorrection !== void 0) {
-    newCls = newCls.replace('desktop', 'platform-ios mobile');
+    classList.delete('desktop');
+    classList.add('platform-ios');
+    classList.add('mobile');
+  }
+  // else: is it SSG?
+  else if (is.nativeMobile !== true && is.electron !== true && is.bex !== true) {
+    if (is.desktop === true) {
+      classList.delete('mobile');
+      classList.delete('platform-ios');
+      classList.delete('platform-android');
+      classList.add('desktop');
+    }
+    else if (is.mobile === true) {
+      classList.delete('desktop');
+      classList.add('mobile');
+
+      const mobile = getMobilePlatform(is);
+      if (mobile !== void 0) {
+        classList.add(`platform-${ mobile }`);
+        classList.delete(`platform-${ mobile === 'ios' ? 'android' : 'ios' }`);
+      }
+      else {
+        classList.delete('platform-ios');
+        classList.delete('platform-android');
+      }
+    }
   }
 
   if (client.has.touch === true) {
-    newCls = newCls.replace('no-touch', 'touch');
+    classList.delete('no-touch');
+    classList.add('touch');
   }
 
   if (client.within.iframe === true) {
-    newCls += ' within-iframe';
+    classList.add('within-iframe');
   }
 
+  const newCls = Array.from(classList).join(' ');
+
   if (classes !== newCls) {
     document.body.className = newCls;
   }
@@ -1610,7 +1640,7 @@ function prepareApp (app, uiOpts, pluginOpts) {
 }
 
 var installQuasar = function (parentApp, opts = {}) {
-    const $q = { version: '2.11.1' };
+    const $q = { version: '2.11.2' };
 
     if (globalConfigIsFrozen === false) {
       if (opts.config !== void 0) {
@@ -9568,18 +9598,11 @@ var QTabs = createComponent({
     const rightArrow = ref(false);
     const justify = ref(false);
 
-    const arrowsEnabled = computed(() =>
-      $q.platform.is.desktop === true || props.mobileArrows === true
-    );
-
     const tabDataList = [];
     const tabDataListLen = ref(0);
     const hasFocus = ref(false);
 
     let animateTimer, scrollTimer, unwatchRoute;
-    let localUpdateArrows = arrowsEnabled.value === true
-      ? updateArrowsFn
-      : noop;
 
     const tabProps = computed(() => ({
       activeClass: props.activeClass,
@@ -9620,17 +9643,17 @@ var QTabs = createComponent({
       'q-tabs row no-wrap items-center'
       + ` q-tabs--${ scrollable.value === true ? '' : 'not-' }scrollable`
       + ` q-tabs--${ props.vertical === true ? 'vertical' : 'horizontal' }`
-      + ` q-tabs__arrows--${ arrowsEnabled.value === true && props.outsideArrows === true ? 'outside' : 'inside' }`
+      + ` q-tabs__arrows--${ props.outsideArrows === true ? 'outside' : 'inside' }`
+      + ` q-tabs--mobile-with${ props.mobileArrows === true ? '' : 'out' }-arrows`
       + (props.dense === true ? ' q-tabs--dense' : '')
       + (props.shrink === true ? ' col-shrink' : '')
       + (props.stretch === true ? ' self-stretch' : '')
     );
 
     const innerClass = computed(() =>
-      'q-tabs__content row no-wrap items-center self-stretch hide-scrollbar relative-position '
+      'q-tabs__content scroll--mobile row no-wrap items-center self-stretch hide-scrollbar relative-position '
       + alignClass.value
       + (props.contentClass !== void 0 ? ` ${ props.contentClass }` : '')
-      + ($q.platform.is.mobile === true ? ' scroll' : '')
     );
 
     const domProps = computed(() => (
@@ -9642,25 +9665,15 @@ var QTabs = createComponent({
     const isRTL = computed(() => props.vertical !== true && $q.lang.rtl === true);
     const rtlPosCorrection = computed(() => rtlHasScrollBug === false && isRTL.value === true);
 
-    watch(isRTL, localUpdateArrows);
+    watch(isRTL, updateArrows);
 
     watch(() => props.modelValue, name => {
       updateModel({ name, setCurrent: true, skipEmit: true });
     });
 
-    watch(() => props.outsideArrows, () => {
-      recalculateScroll();
-    });
+    watch(() => props.outsideArrows, recalculateScroll);
 
-    watch(arrowsEnabled, v => {
-      localUpdateArrows = v === true
-        ? updateArrowsFn
-        : noop;
-
-      recalculateScroll();
-    });
-
-    function updateModel ({ name, setCurrent, skipEmit, fromRoute }) {
+    function updateModel ({ name, setCurrent, skipEmit }) {
       if (currentModel.value !== name) {
         if (skipEmit !== true && props[ 'onUpdate:modelValue' ] !== void 0) {
           emit('update:modelValue', name);
@@ -9706,7 +9719,7 @@ var QTabs = createComponent({
       scrollable.value = scroll;
 
       // Arrows need to be updated even if the scroll status was already true
-      scroll === true && registerUpdateArrowsTick(localUpdateArrows);
+      scroll === true && registerUpdateArrowsTick(updateArrows);
 
       justify.value = size < parseInt(props.breakpoint, 10);
     }
@@ -9763,34 +9776,34 @@ var QTabs = createComponent({
 
       if (offset < 0) {
         contentRef.value[ props.vertical === true ? 'scrollTop' : 'scrollLeft' ] += Math.floor(offset);
-        localUpdateArrows();
+        updateArrows();
         return
       }
 
       offset += props.vertical === true ? newPos.height - height : newPos.width - width;
       if (offset > 0) {
         contentRef.value[ props.vertical === true ? 'scrollTop' : 'scrollLeft' ] += Math.ceil(offset);
-        localUpdateArrows();
+        updateArrows();
       }
     }
 
-    function updateArrowsFn () {
+    function updateArrows () {
       const content = contentRef.value;
-      if (content !== null) {
-        const
-          rect = content.getBoundingClientRect(),
-          pos = props.vertical === true ? content.scrollTop : Math.abs(content.scrollLeft);
+      if (content === null) { return }
 
-        if (isRTL.value === true) {
-          leftArrow.value = Math.ceil(pos + rect.width) < content.scrollWidth - 1;
-          rightArrow.value = pos > 0;
-        }
-        else {
-          leftArrow.value = pos > 0;
-          rightArrow.value = props.vertical === true
-            ? Math.ceil(pos + rect.height) < content.scrollHeight
-            : Math.ceil(pos + rect.width) < content.scrollWidth;
-        }
+      const
+        rect = content.getBoundingClientRect(),
+        pos = props.vertical === true ? content.scrollTop : Math.abs(content.scrollLeft);
+
+      if (isRTL.value === true) {
+        leftArrow.value = Math.ceil(pos + rect.width) < content.scrollWidth - 1;
+        rightArrow.value = pos > 0;
+      }
+      else {
+        leftArrow.value = pos > 0;
+        rightArrow.value = props.vertical === true
+          ? Math.ceil(pos + rect.height) < content.scrollHeight
+          : Math.ceil(pos + rect.width) < content.scrollWidth;
       }
     }
 
@@ -9892,7 +9905,7 @@ var QTabs = createComponent({
       }
 
       set(content, pos);
-      localUpdateArrows();
+      updateArrows();
 
       return done
     }
@@ -10136,17 +10149,21 @@ var QTabs = createComponent({
     });
 
     return () => {
-      const child = [
+      return h('div', {
+        ref: rootRef,
+        class: classes.value,
+        role: 'tablist',
+        onFocusin,
+        onFocusout
+      }, [
         h(QResizeObserver, { onResize: updateContainer }),
 
         h('div', {
           ref: contentRef,
           class: innerClass.value,
-          onScroll: localUpdateArrows
-        }, hSlot(slots.default))
-      ];
+          onScroll: updateArrows
+        }, hSlot(slots.default)),
 
-      arrowsEnabled.value === true && child.push(
         h(QIcon, {
           class: 'q-tabs__arrow q-tabs__arrow--left absolute q-tab__icon'
             + (leftArrow.value === true ? '' : ' q-tabs__arrow--faded'),
@@ -10168,15 +10185,7 @@ var QTabs = createComponent({
           onMouseleavePassive: stopAnimScroll,
           onTouchendPassive: stopAnimScroll
         })
-      );
-
-      return h('div', {
-        ref: rootRef,
-        class: classes.value,
-        role: 'tablist',
-        onFocusin,
-        onFocusout
-      }, child)
+      ])
     }
   }
 });
@@ -40324,7 +40333,7 @@ function runSequentialPromises (
  */
 
 const Quasar = {
-  version: '2.11.1',
+  version: '2.11.2',
   install: installQuasar,
   lang: Plugin$8,
   iconSet: Plugin$7