quasar 2.6.2 → 2.6.3

package/dist/vetur/quasar-attributes.json

@@ -4799,6 +4799,10 @@
     "type": "boolean",
     "description": "Display data using QVirtualScroll (for non-grid mode only)"
   },
+  "q-table/virtual-scroll-target": {
+    "type": "element|string",
+    "description": "CSS selector or DOM element to be used as a custom scroll container instead of the auto detected one"
+  },
   "q-table/virtual-scroll-slice-size": {
     "type": "number|string",
     "description": "Minimum number of rows to render in the virtual list"

package/dist/vetur/quasar-tags.json

@@ -1717,6 +1717,7 @@
       "rows",
       "row-key",
       "virtual-scroll",
+      "virtual-scroll-target",
       "virtual-scroll-slice-size",
       "virtual-scroll-slice-ratio-before",
       "virtual-scroll-slice-ratio-after",

package/dist/web-types/web-types.json

@@ -2,7 +2,7 @@
   "$schema": "",
   "framework": "vue",
   "name": "quasar",
-  "version": "2.6.2",
+  "version": "2.6.3",
   "contributions": {
     "html": {
       "types-syntax": "typescript",
@@ -15506,6 +15506,15 @@
               "doc-url": "https://v2.quasar.dev/vue-components/table",
               "type": "boolean"
             },
+            {
+              "name": "virtual-scroll-target",
+              "value": {
+                "kind": "expression",
+                "type": "Element|string"
+              },
+              "description": "CSS selector or DOM element to be used as a custom scroll container instead of the auto detected one\n\nExamples:\n:scroll-target=\"$refs.scrollTarget\"\nscroll-target=\".scroll-target-class\"\nscroll-target=\"#scroll-target-id\"\nscroll-target=\"body\"",
+              "doc-url": "https://v2.quasar.dev/vue-components/table"
+            },
             {
               "name": "virtual-scroll-slice-size",
               "value": {

package/lang/ar-TN.js

@@ -0,0 +1,101 @@
+/**
+ * DO NOT EDIT THIS FILE. It is automatically generated
+ * from its .mjs counterpart (same filename but with .mjs extension).
+ * Edit that file instead (ar-TN.mjs).
+ */
+module.exports = {
+  isoName: 'ar-TN',
+  nativeName: 'العربية (تونس)',
+  rtl: true,
+  label: {
+    clear: 'مسح',
+    ok: 'حسناً',
+    cancel: 'إلغاء',
+    close: 'إغلاق',
+    set: 'ضبط',
+    select: 'تحديد',
+    reset: 'إعادة ضبط',
+    remove: 'حذف',
+    update: 'تحديث',
+    create: 'إنشاء',
+    search: 'بحث',
+    filter: 'ترشيح',
+    refresh: 'تحديث'
+  },
+  date: {
+    days: 'الأحد_الإثنين_الثلاثاء_الأربعاء_الخميس_الجمعة_السبت'.split('_'),
+    daysShort: 'أحد_إثن_ثلا_أرب_خمي_جمع_سبت'.split('_'),
+    months: 'جانفي_فيفري_مارس_أفريل_ماي_جوان_جويلية_أوت_سبتمبر_أكتوبر_نوفمبر_ديسمبر'.split('_'),
+    monthsShort: 'جان_فيف_مار_أفر_ماي_جوا_جوي_أوت_سبت_أكت_نوف_ديس'.split('_'),
+    firstDayOfWeek: 1, // 0-6, 0 - Sunday, 1 Monday, ...
+    format24h: false,
+    pluralDay: 'أيام'
+  },
+  table: {
+    noData: 'لا توجد بيانات',
+    noResults: 'لا توجد نتائج',
+    loading: 'جارٍ التحميل...',
+    selectedRecords: rows => (
+      rows === 0
+        ? 'لا توجد مُدخَلات محدّدة.'
+        : rows === 1
+          ? 'مُدخَلة واحدة محدّدة.'
+          : rows === 2
+            ? 'مُدخَلتان محدّدتان.'
+            : 'عدد المُدخَلات المحدّدة ' + rows + '.'
+    ),
+    recordsPerPage: 'عدد المُدخَلات في كل صفحة:',
+    allRows: 'الكل',
+    pagination: (start, end, total) => start + '-' + end + ' من ' + total,
+    columns: 'أعمدة'
+  },
+  editor: {
+    url: 'رابط',
+    bold: 'عريض',
+    italic: 'مائل',
+    strikethrough: 'مشطوب',
+    underline: 'مسطّر',
+    unorderedList: 'قائمة غير مرتبة',
+    orderedList: 'قائمة مرتبة',
+    subscript: 'منخفض',
+    superscript: 'مرتفع',
+    hyperlink: 'رابط',
+    toggleFullscreen: 'تفعيل أو إيقاف العرض في كامل الشاشة',
+    quote: 'اقتباس',
+    left: 'انتظام لجهة اليسار',
+    center: 'توسيط',
+    right: 'انتظام لجهة اليمين',
+    justify: 'انتظام بالتساوي',
+    print: 'طباعة',
+    outdent: 'تقليل مسافة البداية',
+    indent: 'زيادة مسافة البداية',
+    removeFormat: 'إزالة التنسيق',
+    formatting: 'تنسيق',
+    fontSize: 'حجم الخط',
+    align: 'انتظام',
+    hr: 'إضافة خط أفقي',
+    undo: 'تراجع',
+    redo: 'إعادة',
+    heading1: 'عنوان 1',
+    heading2: 'عنوان 2',
+    heading3: 'عنوان 3',
+    heading4: 'عنوان 4',
+    heading5: 'عنوان 5',
+    heading6: 'عنوان 6',
+    paragraph: 'فقرة',
+    code: 'تعليمات برمجية',
+    size1: 'صغير جداً',
+    size2: 'صغير',
+    size3: 'عادي',
+    size4: 'فوق المتوسط',
+    size5: 'كبير',
+    size6: 'كبير جداً',
+    size7: 'الأقصى',
+    defaultFont: 'الخط الإفتراضي',
+    viewSource: 'عرض المصدر'
+  },
+  tree: {
+    noNodes: 'لا توجد عُقَد',
+    noResults: 'لا توجد نتائج'
+  }
+}

package/lang/ar-TN.mjs

@@ -0,0 +1,96 @@
+export default {
+  isoName: 'ar-TN',
+  nativeName: 'العربية (تونس)',
+  rtl: true,
+  label: {
+    clear: 'مسح',
+    ok: 'حسناً',
+    cancel: 'إلغاء',
+    close: 'إغلاق',
+    set: 'ضبط',
+    select: 'تحديد',
+    reset: 'إعادة ضبط',
+    remove: 'حذف',
+    update: 'تحديث',
+    create: 'إنشاء',
+    search: 'بحث',
+    filter: 'ترشيح',
+    refresh: 'تحديث'
+  },
+  date: {
+    days: 'الأحد_الإثنين_الثلاثاء_الأربعاء_الخميس_الجمعة_السبت'.split('_'),
+    daysShort: 'أحد_إثن_ثلا_أرب_خمي_جمع_سبت'.split('_'),
+    months: 'جانفي_فيفري_مارس_أفريل_ماي_جوان_جويلية_أوت_سبتمبر_أكتوبر_نوفمبر_ديسمبر'.split('_'),
+    monthsShort: 'جان_فيف_مار_أفر_ماي_جوا_جوي_أوت_سبت_أكت_نوف_ديس'.split('_'),
+    firstDayOfWeek: 1, // 0-6, 0 - Sunday, 1 Monday, ...
+    format24h: false,
+    pluralDay: 'أيام'
+  },
+  table: {
+    noData: 'لا توجد بيانات',
+    noResults: 'لا توجد نتائج',
+    loading: 'جارٍ التحميل...',
+    selectedRecords: rows => (
+      rows === 0
+        ? 'لا توجد مُدخَلات محدّدة.'
+        : rows === 1
+          ? 'مُدخَلة واحدة محدّدة.'
+          : rows === 2
+            ? 'مُدخَلتان محدّدتان.'
+            : 'عدد المُدخَلات المحدّدة ' + rows + '.'
+    ),
+    recordsPerPage: 'عدد المُدخَلات في كل صفحة:',
+    allRows: 'الكل',
+    pagination: (start, end, total) => start + '-' + end + ' من ' + total,
+    columns: 'أعمدة'
+  },
+  editor: {
+    url: 'رابط',
+    bold: 'عريض',
+    italic: 'مائل',
+    strikethrough: 'مشطوب',
+    underline: 'مسطّر',
+    unorderedList: 'قائمة غير مرتبة',
+    orderedList: 'قائمة مرتبة',
+    subscript: 'منخفض',
+    superscript: 'مرتفع',
+    hyperlink: 'رابط',
+    toggleFullscreen: 'تفعيل أو إيقاف العرض في كامل الشاشة',
+    quote: 'اقتباس',
+    left: 'انتظام لجهة اليسار',
+    center: 'توسيط',
+    right: 'انتظام لجهة اليمين',
+    justify: 'انتظام بالتساوي',
+    print: 'طباعة',
+    outdent: 'تقليل مسافة البداية',
+    indent: 'زيادة مسافة البداية',
+    removeFormat: 'إزالة التنسيق',
+    formatting: 'تنسيق',
+    fontSize: 'حجم الخط',
+    align: 'انتظام',
+    hr: 'إضافة خط أفقي',
+    undo: 'تراجع',
+    redo: 'إعادة',
+    heading1: 'عنوان 1',
+    heading2: 'عنوان 2',
+    heading3: 'عنوان 3',
+    heading4: 'عنوان 4',
+    heading5: 'عنوان 5',
+    heading6: 'عنوان 6',
+    paragraph: 'فقرة',
+    code: 'تعليمات برمجية',
+    size1: 'صغير جداً',
+    size2: 'صغير',
+    size3: 'عادي',
+    size4: 'فوق المتوسط',
+    size5: 'كبير',
+    size6: 'كبير جداً',
+    size7: 'الأقصى',
+    defaultFont: 'الخط الإفتراضي',
+    viewSource: 'عرض المصدر'
+  },
+  tree: {
+    noNodes: 'لا توجد عُقَد',
+    noResults: 'لا توجد نتائج'
+  }
+}

package/lang/index.json

@@ -1,4 +1,8 @@
 [
+  {
+    "isoName": "ar-TN",
+    "nativeName": "العربية (تونس)"
+  },
   {
     "isoName": "ar",
     "nativeName": "العربية"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "quasar",
-  "version": "2.6.2",
+  "version": "2.6.3",
   "description": "Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time",
   "main": "dist/quasar.cjs.prod.js",
   "module": "dist/quasar.esm.prod.js",

package/src/components/checkbox/QCheckbox.js

@@ -50,7 +50,7 @@ export default createComponent({
           ? [
               h('div', {
                 key: 'icon',
-                class: 'q-checkbox__icon-container absolute flex flex-center no-wrap'
+                class: 'q-checkbox__icon-container absolute-full flex flex-center no-wrap'
               }, [
                 h(QIcon, {
                   class: 'q-checkbox__icon',

package/src/components/checkbox/QCheckbox.sass

@@ -9,13 +9,13 @@ $checkbox-transition: .22s cubic-bezier(0,0,.2,1) 0ms
 
   &__bg,
   &__icon-container
+    user-select: none
+
+  &__bg
     top: 25%
     left: 25%
     width: 50%
     height: 50%
-    user-select: none
-
-  &__bg
     border: 2px solid currentColor
     border-radius: 2px
     transition: background $checkbox-transition
@@ -23,7 +23,7 @@ $checkbox-transition: .22s cubic-bezier(0,0,.2,1) 0ms
 
   &__icon
     color: currentColor
-    font-size: .6em
+    font-size: .5em
 
   &__svg
     color: #fff
@@ -76,16 +76,12 @@ $checkbox-transition: .22s cubic-bezier(0,0,.2,1) 0ms
 
   &--dense
 
-    .q-checkbox__icon
-      font-size: .6em
-
     .q-checkbox__inner
       width: .5em
       min-width: .5em
       height: .5em
 
-    .q-checkbox__bg,
-    .q-checkbox__icon-container
+    .q-checkbox__bg
       left: 5%
       top: 5%
       width: 90%

package/src/components/dialog-plugin/DialogPlugin.js

@@ -239,14 +239,14 @@ export default createComponent({
     function getButtons () {
       const child = []
 
-      props.cancel && child.push(
-        h(QBtn, cancelProps.value)
-      )
-
       props.ok && child.push(
         h(QBtn, okProps.value)
       )
 
+      props.cancel && child.push(
+        h(QBtn, cancelProps.value)
+      )
+
       return h(QCardActions, {
         class: props.stackButtons === true ? 'items-end' : '',
         vertical: props.stackButtons,

package/src/components/icon/QIcon.js

@@ -11,13 +11,13 @@ const sameFn = i => i
 const ionFn = i => `ionicons ${ i }`
 
 const libMap = {
+  'mdi-': i => `mdi ${ i }`,
   'icon-': sameFn, // fontawesome equiv
   'bt-': i => `bt ${ i }`,
   'eva-': i => `eva ${ i }`,
   'ion-md': ionFn,
   'ion-ios': ionFn,
   'ion-logo': ionFn,
-  'mdi-': i => `mdi ${ i }`,
   'iconfont ': sameFn,
   'ti-': i => `themify-icon ${ i }`,
   'bi-': i => `bootstrap-icons ${ i }`
@@ -35,8 +35,7 @@ const mRE = /^[Mm]\s?[-+]?\.?\d/
 const imgRE = /^img:/
 const svgUseRE = /^svguse:/
 const ionRE = /^ion-/
-const faLaRE = /^[lf]a[srlbdk]? /
-const fa6RE = /^fa-(solid|regular|light|brands|duotone|thin)/
+const faRE = /^(fa-(solid|regular|light|brands|duotone|thin)|[lf]a[srlbdk]?) /
 
 export default createComponent({
   name: 'QIcon',
@@ -130,7 +129,7 @@ export default createComponent({
       if (matches !== null) {
         cls = libMap[ matches[ 1 ] ](icon)
       }
-      else if (faLaRE.test(icon) === true || fa6RE.test(icon) === true) {
+      else if (faRE.test(icon) === true) {
         cls = icon
       }
       else if (ionRE.test(icon) === true) {

package/src/components/radio/QRadio.js

@@ -142,7 +142,7 @@ export default createComponent({
         ? [
             h('div', {
               key: 'icon',
-              class: 'q-radio__icon-container absolute flex flex-center no-wrap'
+              class: 'q-radio__icon-container absolute-full flex flex-center no-wrap'
             }, [
               h(QIcon, {
                 class: 'q-radio__icon',

package/src/components/radio/QRadio.sass

@@ -9,20 +9,20 @@ $radio-transition: .22s cubic-bezier(0,0,.2,1) 0ms
 
   &__bg,
   &__icon-container
+    user-select: none
+
+  &__bg
     top: 25%
     left: 25%
     width: 50%
     height: 50%
-    user-select: none
-
-  &__bg
     -webkit-print-color-adjust: exact
     path
       fill: currentColor
 
   &__icon
     color: currentColor
-    font-size: .6em
+    font-size: .5em
 
   &__check
     transform-origin: 50% 50%
@@ -56,16 +56,12 @@ $radio-transition: .22s cubic-bezier(0,0,.2,1) 0ms
 
   &--dense
 
-    .q-checkbox__icon
-      font-size: .6em
-
     .q-radio__inner
       width: .5em
       min-width: .5em
       height: .5em
 
-    .q-radio__bg,
-    .q-radio__icon-container
+    .q-radio__bg
       left: 0
       top: 0
       width: 100%

package/src/components/table/QTable.js

@@ -71,6 +71,9 @@ export default createComponent({
     wrapCells: Boolean,
 
     virtualScroll: Boolean,
+    virtualScrollTarget: {
+      default: void 0
+    },
     ...commonVirtPropsObj,
 
     noDataLabel: String,
@@ -313,6 +316,7 @@ export default createComponent({
           class: props.tableClass,
           style: props.tableStyle,
           ...virtProps.value,
+          scrollTarget: props.virtualScrollTarget,
           items: computedRows.value,
           type: '__qtable',
           tableColspan: computedColspan.value,

package/src/components/table/QTable.json

@@ -39,6 +39,10 @@
       "category": "virtual-scroll"
     },
 
+    "virtual-scroll-target": {
+      "extends": "scroll-target"
+    },
+
     "virtual-scroll-slice-size": {
       "type": [ "Number", "String" ],
       "desc": "Minimum number of rows to render in the virtual list",

package/src/components/table/QTh.js

@@ -19,10 +19,13 @@ export default createComponent({
     const vm = getCurrentInstance()
     const { proxy: { $q } } = vm
 
+    const onClick = evt => { emit('click', evt) }
+
     return () => {
       if (props.props === void 0) {
         return h('th', {
-          class: props.autoWidth === true ? 'q-table--col-auto-width' : ''
+          class: props.autoWidth === true ? 'q-table--col-auto-width' : '',
+          onClick
         }, hSlot(slots.default))
       }
 
@@ -60,7 +63,7 @@ export default createComponent({
         style: col.headerStyle,
         onClick: evt => {
           col.sortable === true && props.props.sort(col) // eslint-disable-line
-          emit('click', evt)
+          onClick(evt)
         }
       }
 

package/src/components/virtual-scroll/QVirtualScroll.js

@@ -1,4 +1,4 @@
-import { h, ref, computed, watch, onBeforeMount, onMounted, onBeforeUnmount } from 'vue'
+import { h, ref, computed, watch, onBeforeMount, onMounted, onBeforeUnmount, onActivated, onDeactivated } from 'vue'
 
 import QList from '../item/QList.js'
 import QMarkupTable from '../markup-table/QMarkupTable.js'
@@ -136,6 +136,14 @@ export default createComponent({
       configureScrollTarget()
     })
 
+    onActivated(() => {
+      configureScrollTarget()
+    })
+
+    onDeactivated(() => {
+      unconfigureScrollTarget()
+    })
+
     onBeforeUnmount(() => {
       unconfigureScrollTarget()
     })