quasar 2.4.12 → 2.4.13

package/src/components/inner-loading/QInnerLoading.json

@@ -41,7 +41,8 @@
     },
 
     "label-style": {
-      "type": [ "Array", "String", "Object" ],
+      "type": [ "String", "Array", "Object" ],
+      "tsType": "VueStyleProp",
       "desc": "Apply custom style to the label; Works along the 'label' prop only",
       "examples": [
         "font-size: 28px",

package/src/components/input/QInput.json

@@ -53,7 +53,8 @@
     },
 
     "input-class": {
-      "type": [ "Array", "String", "Object" ],
+      "type": [ "String", "Array", "Object" ],
+      "tsType": "VueClassProp",
       "desc": "Class definitions to be attributed to the underlying input tag",
       "examples": [
         "my-special-class",
@@ -63,7 +64,8 @@
     },
 
     "input-style": {
-      "type": [ "Array", "String", "Object" ],
+      "type": [ "String", "Array", "Object" ],
+      "tsType": "VueStyleProp",
       "desc": "Style definitions to be attributed to the underlying input tag",
       "examples": [
         "background-color: #ff0000",

package/src/components/pagination/QPagination.json

@@ -51,7 +51,8 @@
     },
 
     "input-style": {
-      "type": [ "Array", "String", "Object" ],
+      "type": [ "String", "Array", "Object" ],
+      "tsType": "VueStyleProp",
       "desc": "Style definitions to be attributed to the input (if using one)",
       "examples": [
         "background-color: #ff0000",
@@ -61,7 +62,8 @@
     },
 
     "input-class": {
-      "type": [ "Array", "String", "Object" ],
+      "type": [ "String", "Array", "Object" ],
+      "tsType": "VueClassProp",
       "desc": "Class definitions to be attributed to the input (if using one)",
       "examples": [
         "my-special-class",

package/src/components/scroll-area/QScrollArea.json

@@ -9,21 +9,24 @@
     },
 
     "bar-style": {
-      "type": [ "Array", "String", "Object"],
+      "type": [ "String", "Array", "Object" ],
+      "tsType": "VueStyleProp",
       "desc": "Object with CSS properties and values for custom styling the scrollbars (both vertical and horizontal)",
       "examples": [ ":bar-style=\"{ borderRadius: '5px', background: 'red', opacity: 1 }\"" ],
       "category": "style"
     },
 
     "vertical-bar-style": {
-      "type": [ "Array", "String", "Object"],
+      "type": [ "String", "Array", "Object" ],
+      "tsType": "VueStyleProp",
       "desc": "Object with CSS properties and values for custom styling the vertical scrollbar; Is applied on top of 'bar-style' prop",
       "examples": [ ":bar-style=\"{ right: '4px', borderRadius: '5px', background: 'red', width: '10px', opacity: 1 }\"" ],
       "category": "style"
     },
 
     "horizontal-bar-style": {
-      "type": [ "Array", "String", "Object"],
+      "type": [ "String", "Array", "Object" ],
+      "tsType": "VueStyleProp",
       "desc": "Object with CSS properties and values for custom styling the horizontal scrollbar; Is applied on top of 'bar-style' prop",
       "examples": [ ":bar-style=\"{ bottom: '4px', borderRadius: '5px', background: 'red', height: '10px', opacity: 1 }\"" ],
       "category": "style"
@@ -31,6 +34,7 @@
 
     "thumb-style": {
       "type": "Object",
+      "tsType": "VueStyleObjectProp",
       "desc": "Object with CSS properties and values for custom styling the thumb of scrollbars (both vertical and horizontal)",
       "examples": [ ":thumb-style=\"{ right: '4px', borderRadius: '5px', background: 'red', width: '10px', opacity: 1 }\"" ],
       "category": "style"
@@ -38,6 +42,7 @@
 
     "vertical-thumb-style": {
       "type": "Object",
+      "tsType": "VueStyleObjectProp",
       "desc": "Object with CSS properties and values for custom styling the thumb of the vertical scrollbar; Is applied on top of 'thumb-style' prop",
       "examples": [ ":thumb-style=\"{ right: '4px', borderRadius: '5px', background: 'red', width: '10px', opacity: 1 }\"" ],
       "category": "style"
@@ -45,20 +50,23 @@
 
     "horizontal-thumb-style": {
       "type": "Object",
+      "tsType": "VueStyleObjectProp",
       "desc": "Object with CSS properties and values for custom styling the thumb of the horizontal scrollbar; Is applied on top of 'thumb-style' prop",
       "examples": [ ":thumb-style=\"{ bottom: '4px', borderRadius: '5px', background: 'red', height: '10px', opacity: 1 }\"" ],
       "category": "style"
     },
 
     "content-style": {
-      "type": [ "Array", "String", "Object"],
+      "type": [ "String", "Array", "Object" ],
+      "tsType": "VueStyleProp",
       "desc": "Object with CSS properties and values for styling the container of QScrollArea",
       "examples": [ ":content-style=\"{ backgroundColor: '#C0C0C0' }\"" ],
       "category": "style"
     },
 
     "content-active-style": {
-      "type": [ "Array", "String", "Object"],
+      "type": [ "String", "Array", "Object" ],
+      "tsType": "VueStyleProp",
       "desc": "Object with CSS properties and values for styling the container of QScrollArea when scroll area becomes active (is mouse hovered)",
       "examples": [ ":content-active-style=\"{ backgroundColor: 'white' }\"" ],
       "category": "style"

package/src/components/select/QSelect.json

@@ -224,7 +224,8 @@
     },
 
     "popup-content-style": {
-      "type": [ "Array", "String", "Object" ],
+      "type": [ "String", "Array", "Object" ],
+      "tsType": "VueStyleProp",
       "desc": "Style definitions to be attributed to the popup content",
       "examples": [
         "background-color: #ff0000",
@@ -279,7 +280,8 @@
     },
 
     "input-class": {
-      "type": [ "Array", "String", "Object" ],
+      "type": [ "String", "Array", "Object" ],
+      "tsType": "VueClassProp",
       "desc": "Class definitions to be attributed to the underlying input tag",
       "examples": [
         "my-special-class",
@@ -289,7 +291,8 @@
     },
 
     "input-style": {
-      "type": [ "Array", "String", "Object" ],
+      "type": [ "String", "Array", "Object" ],
+      "tsType": "VueStyleProp",
       "desc": "Style definitions to be attributed to the underlying input tag",
       "examples": [
         "background-color: #ff0000",

package/src/components/slider/use-slider.json

@@ -164,11 +164,13 @@
         },
         "classes": {
           "type": [ "String", "Array", "Object" ],
+          "tsType": "VueClassProp",
           "desc": "CSS classes to be attributed to the marker label",
           "examples": [ "my-class-name" ]
         },
         "style": {
           "type": "Object",
+          "tsType": "VueStyleObjectProp",
           "desc": "Style definitions to be attributed to the marker label",
           "examples": [ "{ height: '24px' }" ]
         }
@@ -197,11 +199,13 @@
           },
           "classes": {
             "type": [ "String", "Array", "Object" ],
+            "tsType": "VueClassProp",
             "desc": "CSS classes to be attributed to the marker label",
             "examples": [ "my-class-name" ]
           },
           "style": {
             "type": "Object",
+            "tsType": "VueStyleObjectProp",
             "desc": "Style definitions to be attributed to the marker label",
             "examples": [ "{ height: '24px' }" ]
           }
@@ -317,6 +321,7 @@
             },
             "style": {
               "type": "Object",
+              "tsType": "VueStyleObjectProp",
               "desc": "Style definitions to be attributed to the marker label",
               "examples": [ "{ height: '24px' }" ]
             }
@@ -350,6 +355,7 @@
             },
             "style": {
               "type": "Object",
+              "tsType": "VueStyleObjectProp",
               "desc": "Style definitions to be attributed to the marker label",
               "examples": [ "{ height: '24px' }" ]
             }
@@ -387,6 +393,7 @@
                 },
                 "style": {
                   "type": "Object",
+                  "tsType": "VueStyleObjectProp",
                   "desc": "Style definitions to be attributed to the marker label",
                   "examples": [ "{ height: '24px' }" ]
                 }
@@ -453,6 +460,7 @@
             },
             "style": {
               "type": "Object",
+              "tsType": "VueStyleObjectProp",
               "desc": "Style definitions to be attributed to the marker label",
               "examples": [ "{ height: '24px' }" ]
             }
@@ -490,6 +498,7 @@
                 },
                 "style": {
                   "type": "Object",
+                  "tsType": "VueStyleObjectProp",
                   "desc": "Style definitions to be attributed to the marker label",
                   "examples": [ "{ height: '24px' }" ]
                 }

package/src/components/splitter/QSplitter.json

@@ -50,7 +50,8 @@
     },
 
     "before-class": {
-      "type": [ "Array", "String", "Object" ],
+      "type": [ "String", "Array", "Object" ],
+      "tsType": "VueClassProp",
       "desc": "Class definitions to be attributed to the 'before' panel",
       "examples": [
         "bg-deep-orange",
@@ -60,7 +61,8 @@
     },
 
     "after-class": {
-      "type": [ "Array", "String", "Object" ],
+      "type": [ "String", "Array", "Object" ],
+      "tsType": "VueClassProp",
       "desc": "Class definitions to be attributed to the 'after' panel",
       "examples": [
         "bg-deep-orange",
@@ -70,7 +72,8 @@
     },
 
     "separator-class": {
-      "type": [ "Array", "String", "Object" ],
+      "type": [ "String", "Array", "Object" ],
+      "tsType": "VueClassProp",
       "desc": "Class definitions to be attributed to the splitter separator",
       "examples": [
         "bg-deep-orange",
@@ -80,7 +83,8 @@
     },
 
     "separator-style": {
-      "type": [ "Array", "String", "Object" ],
+      "type": [ "String", "Array", "Object" ],
+      "tsType": "VueStyleProp",
       "desc": "Style definitions to be attributed to the splitter separator",
       "examples": [
         "background-color: #ff0000",

package/src/components/stepper/QStep.js

@@ -70,7 +70,7 @@ export default createComponent({
     const isActive = computed(() => $stepper.value.modelValue === props.name)
 
     const scrollEvent = computed(() => (
-      ($q.platform.is.ios !== true && $q.platform.is.safari !== true)
+      ($q.platform.is.ios !== true && $q.platform.is.chrome === true)
         || isActive.value !== true
         || $stepper.value.vertical !== true
         ? {}

package/src/components/table/QTable.json

@@ -482,6 +482,7 @@
 
     "table-style": {
       "type": [ "String", "Array", "Object" ],
+      "tsType": "VueStyleProp",
       "desc": "CSS style to apply to native HTML <table> element's wrapper (which is a DIV)",
       "examples": [
         "background-color: #ff0000",
@@ -492,6 +493,7 @@
 
     "table-class": {
       "type": [ "String", "Array", "Object" ],
+      "tsType": "VueClassProp",
       "desc": "CSS classes to apply to native HTML <table> element's wrapper (which is a DIV)",
       "examples": [
         "my-special-class",
@@ -502,6 +504,7 @@
 
     "table-header-style": {
       "type": [ "String", "Array", "Object" ],
+      "tsType": "VueStyleProp",
       "desc": "CSS style to apply to header of native HTML <table> (which is a TR)",
       "examples": [
         "background-color: #ff0000",
@@ -512,6 +515,7 @@
 
     "table-header-class": {
       "type": [ "String", "Array", "Object" ],
+      "tsType": "VueClassProp",
       "desc": "CSS classes to apply to header of native HTML <table> (which is a TR)",
       "examples": [
         "my-special-class",
@@ -522,6 +526,7 @@
 
     "card-container-style": {
       "type": [ "String", "Array", "Object" ],
+      "tsType": "VueStyleProp",
       "desc": "CSS style to apply to the cards container (when in grid mode)",
       "examples": [
         "background-color: #ff0000",
@@ -532,6 +537,7 @@
 
     "card-container-class": {
       "type": [ "String", "Array", "Object" ],
+      "tsType": "VueClassProp",
       "desc": "CSS classes to apply to the cards container (when in grid mode)",
       "examples": [
         "my-special-class",
@@ -543,6 +549,7 @@
 
     "card-style": {
       "type": [ "String", "Array", "Object" ],
+      "tsType": "VueStyleProp",
       "desc": "CSS style to apply to the card (when in grid mode) or container card (when not in grid mode)",
       "examples": [
         "background-color: #ff0000",
@@ -553,6 +560,7 @@
 
     "card-class": {
       "type": [ "String", "Array", "Object" ],
+      "tsType": "VueClassProp",
       "desc": "CSS classes to apply to the card (when in grid mode) or container card (when not in grid mode)",
       "examples": [
         "my-special-class",
@@ -563,6 +571,7 @@
 
     "title-class": {
       "type": [ "String", "Array", "Object" ],
+      "tsType": "VueClassProp",
       "desc": "CSS classes to apply to the title (if using 'title' prop)",
       "examples": [
         "my-special-class",

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

@@ -591,7 +591,9 @@ export function useVirtualScroll ({
 
     localScrollViewSize = scrollViewSize
 
-    const multiplier = 1 + props.virtualScrollSliceRatioBefore + props.virtualScrollSliceRatioAfter
+    const virtualScrollSliceRatioBefore = parseFloat(props.virtualScrollSliceRatioBefore) || 0
+    const virtualScrollSliceRatioAfter = parseFloat(props.virtualScrollSliceRatioAfter) || 0
+    const multiplier = 1 + virtualScrollSliceRatioBefore + virtualScrollSliceRatioAfter
     const view = scrollViewSize === void 0 || scrollViewSize <= 0
       ? 1
       : Math.ceil(scrollViewSize / virtualScrollItemSizeComputed.value)
@@ -604,9 +606,9 @@ export function useVirtualScroll ({
 
     virtualScrollSliceSizeComputed.value = {
       total: Math.ceil(baseSize * multiplier),
-      start: Math.ceil(baseSize * props.virtualScrollSliceRatioBefore),
-      center: Math.ceil(baseSize * (0.5 + props.virtualScrollSliceRatioBefore)),
-      end: Math.ceil(baseSize * (1 + props.virtualScrollSliceRatioBefore)),
+      start: Math.ceil(baseSize * virtualScrollSliceRatioBefore),
+      center: Math.ceil(baseSize * (0.5 + virtualScrollSliceRatioBefore)),
+      end: Math.ceil(baseSize * (1 + virtualScrollSliceRatioBefore)),
       view
     }
   }

package/src/plugins/BottomSheet.json

@@ -33,6 +33,7 @@
               "definition": {
                 "classes": {
                   "type": [ "String", "Array", "Object" ],
+                  "tsType": "VueClassProp",
                   "desc": "CSS classes for this action",
                   "examples": [ "my-class" ]
                 },

package/src/plugins/Dialog.json

@@ -14,6 +14,7 @@
         "opts": {
           "desc": "Dialog options",
           "tsType": "QDialogOptions",
+          "autoDefineTsType": true,
           "definition": {
             "title": {
               "type": "String",

package/src/plugins/Notify.json

@@ -254,7 +254,8 @@
               ]
             },
             "badgeStyle": {
-              "type": [ "Array", "String", "Object" ],
+              "type": [ "String", "Array", "Object" ],
+              "tsType": "VueStyleProp",
               "desc": "Style definitions to be attributed to the badge",
               "examples": [
                 "background-color: #ff0000",
@@ -262,7 +263,8 @@
               ]
             },
             "badgeClass": {
-              "type": [ "Array", "String", "Object" ],
+              "type": [ "String", "Array", "Object" ],
+              "tsType": "VueClassProp",
               "desc": "Class definitions to be attributed to the badge",
               "examples": [
                 "my-special-class",
@@ -275,7 +277,8 @@
               "desc": "Show progress bar to detail when notification will disappear automatically (unless timeout is 0)"
             },
             "progressClass": {
-              "type": [ "Array", "String", "Object" ],
+              "type": [ "String", "Array", "Object" ],
+              "tsType": "VueClassProp",
               "desc": "Class definitions to be attributed to the progress bar",
               "examples": [
                 "my-special-class",
@@ -406,7 +409,8 @@
                 "desc": "Show progress bar to detail when notification will disappear automatically (unless timeout is 0)"
               },
               "progressClass": {
-                "type": [ "Array", "String", "Object" ],
+                "type": [ "String", "Array", "Object" ],
+                "tsType": "VueClassProp",
                 "desc": "Class definitions to be attributed to the progress bar",
                 "examples": [
                   "my-special-class",
@@ -566,7 +570,8 @@
               "examples": [ "bottom-right" ]
             },
             "badgeStyle": {
-              "type": [ "Array", "String", "Object" ],
+              "type": [ "String", "Array", "Object" ],
+              "tsType": "VueStyleProp",
               "desc": "Style definitions to be attributed to the badge",
               "examples": [
                 "background-color: #ff0000",
@@ -574,7 +579,8 @@
               ]
             },
             "badgeClass": {
-              "type": [ "Array", "String", "Object" ],
+              "type": [ "String", "Array", "Object" ],
+              "tsType": "VueClassProp",
               "desc": "Class definitions to be attributed to the badge",
               "examples": [
                 "my-special-class",
@@ -587,7 +593,8 @@
               "desc": "Show progress bar to detail when notification will disappear automatically (unless timeout is 0)"
             },
             "progressClass": {
-              "type": [ "Array", "String", "Object" ],
+              "type": [ "String", "Array", "Object" ],
+              "tsType": "VueClassProp",
               "desc": "Class definitions to be attributed to the progress bar",
               "examples": [
                 "my-special-class",
@@ -746,7 +753,8 @@
               "examples": [ "bottom-right" ]
             },
             "badgeStyle": {
-              "type": [ "Array", "String", "Object" ],
+              "type": [ "String", "Array", "Object" ],
+              "tsType": "VueStyleProp",
               "desc": "Style definitions to be attributed to the badge",
               "examples": [
                 "background-color: #ff0000",
@@ -754,7 +762,8 @@
               ]
             },
             "badgeClass": {
-              "type": [ "Array", "String", "Object" ],
+              "type": [ "String", "Array", "Object" ],
+              "tsType": "VueClassProp",
               "desc": "Class definitions to be attributed to the badge",
               "examples": [
                 "my-special-class",
@@ -767,7 +776,8 @@
               "desc": "Show progress bar to detail when notification will disappear automatically (unless timeout is 0)"
             },
             "progressClass": {
-              "type": [ "Array", "String", "Object" ],
+              "type": [ "String", "Array", "Object" ],
+              "tsType": "VueClassProp",
               "desc": "Class definitions to be attributed to the progress bar",
               "examples": [
                 "my-special-class",

package/src/utils/private/global-dialog.json

@@ -9,12 +9,14 @@
           "definition": {
             "class": {
               "type": [ "String", "Array", "Object" ],
+              "tsType": "VueClassProp",
               "desc": "CSS Class name to apply to the Dialog's QCard",
               "examples": [ "my-class" ]
             },
 
             "style": {
               "type": [ "String", "Array", "Object" ],
+              "tsType": "VueStyleProp",
               "desc": "CSS style to apply to the Dialog's QCard",
               "examples": [ "border: 2px solid black" ]
             }
@@ -26,6 +28,7 @@
         "type": "Object",
         "desc": "Chainable Object",
         "tsType": "DialogChainObject",
+        "autoDefineTsType": true,
         "definition": {
           "onOk": {
             "type": "Function",