quasar 2.13.1 → 2.14.1

package/dist/types/index.d.ts

@@ -5914,9 +5914,9 @@ export interface QImgProps {
   onLoad?: (src: string) => void;
   /**
    * Emitted when browser could not load the image
-   * @param err JS Error object
+   * @param evt JS Event object (same as the browser's native 'error' event)
    */
-  onError?: (err: Error) => void;
+  onError?: (evt: Event) => void;
 }
 
 export interface QImgSlots {
@@ -12810,10 +12810,13 @@ export interface QTimeProps {
    * @param hr Hour
    * @param min Minutes
    * @param sec Seconds
+   * @returns Is the user allowed to set the specified time?
    */
-  options?:
-    | ((hr: number, min: number | null, sec: number | null) => void)
-    | undefined;
+  options?: (
+    hr: number,
+    min: number | null,
+    sec: number | null
+  ) => boolean | null | undefined;
   /**
    * Optionally configure what hours is the user allowed to set; Overrides 'options' prop if that is also set
    */

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

@@ -2,7 +2,7 @@
   "$schema": "",
   "framework": "vue",
   "name": "quasar",
-  "version": "2.13.1",
+  "version": "2.14.1",
   "contributions": {
     "html": {
       "types-syntax": "typescript",
@@ -7610,9 +7610,9 @@
               "name": "error",
               "arguments": [
                 {
-                  "name": "err",
-                  "type": "Error",
-                  "description": "JS Error object",
+                  "name": "evt",
+                  "type": "Event",
+                  "description": "JS Event object (same as the browser's native 'error' event)",
                   "doc-url": "https://v2.quasar.dev/vue-components/img"
                 }
               ],

package/lang/ms.js

@@ -25,7 +25,7 @@ module.exports = {
   },
   date: {
     days: 'Ahad_Isnin_Selasa_Rabu_Khamis_Jummat_Sabtu'.split('_'),
-    daysShort: 'Ahad_Isnin_Selasa_Rabu_Khamis_Jummat_Sabtu'.split('_'),
+    daysShort: 'Aha_Isn_Sel_Rab_Kha_Jum_Sab'.split('_'),
     months: 'Januari_Februari_Mac_April_Mei_Jun_Julai_Ogos_Oktober_November_Disember'.split('_'),
     monthsShort: 'Jan_Feb_Mac_Apr_Mei_Jun_Jul_Ogos_Sep_Okt_Nov_Dis'.split('_'),
     firstDayOfWeek: 1, // 0-6, 0 - Sunday, 1 Monday, ...

package/lang/ms.mjs

@@ -20,7 +20,7 @@ export default {
   },
   date: {
     days: 'Ahad_Isnin_Selasa_Rabu_Khamis_Jummat_Sabtu'.split('_'),
-    daysShort: 'Ahad_Isnin_Selasa_Rabu_Khamis_Jummat_Sabtu'.split('_'),
+    daysShort: 'Aha_Isn_Sel_Rab_Kha_Jum_Sab'.split('_'),
     months: 'Januari_Februari_Mac_April_Mei_Jun_Julai_Ogos_Oktober_November_Disember'.split('_'),
     monthsShort: 'Jan_Feb_Mac_Apr_Mei_Jun_Jul_Ogos_Sep_Okt_Nov_Dis'.split('_'),
     firstDayOfWeek: 1, // 0-6, 0 - Sunday, 1 Monday, ...

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "quasar",
-  "version": "2.13.1",
+  "version": "2.14.1",
   "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/btn/QBtn.js

@@ -297,7 +297,7 @@ export default createComponent({
       props.icon !== void 0 && inner.push(
         h(QIcon, {
           name: props.icon,
-          left: props.stack === false && hasLabel.value === true,
+          left: props.stack !== true && hasLabel.value === true,
           role: 'img',
           'aria-hidden': 'true'
         })
@@ -313,7 +313,7 @@ export default createComponent({
         inner.push(
           h(QIcon, {
             name: props.iconRight,
-            right: props.stack === false && hasLabel.value === true,
+            right: props.stack !== true && hasLabel.value === true,
             role: 'img',
             'aria-hidden': 'true'
           })

package/src/components/circular-progress/QCircularProgress.js

@@ -60,11 +60,16 @@ export default createComponent({
 
     const normalized = computed(() => between(props.value, props.min, props.max))
 
-    const strokeDashOffset = computed(() => circumference * (
-      1 - (normalized.value - props.min) / (props.max - props.min)
-    ))
-
+    const range = computed(() => props.max - props.min)
     const strokeWidth = computed(() => props.thickness / 2 * viewBox.value)
+    const strokeDashOffset = computed(() => {
+      const dashRatio = (props.max - normalized.value) / range.value
+      const dashGap = props.rounded === true && normalized.value < props.max && dashRatio < 0.25
+        ? strokeWidth.value / 2 * (1 - dashRatio / 0.25)
+        : 0
+
+      return circumference * dashRatio + dashGap
+    })
 
     function getCircle ({ thickness, offset, color, cls, rounded }) {
       return h('circle', {

package/src/components/date/QDate.js

@@ -728,10 +728,22 @@ export default createComponent({
     })
 
     function setToday () {
-      const date = today.value
-      const month = daysMap.value[ getMonthHash(date) ]
+      const { year, month, day } = today.value
 
-      if (month === void 0 || month.includes(date.day) === false) {
+      const date = {
+        // contains more props than needed (hour, minute, second, millisecond)
+        // but those aren't used in the processing of this "date" variable
+        ...viewModel.value,
+
+        // overwriting with today's date
+        year,
+        month,
+        day
+      }
+
+      const monthMap = daysMap.value[ getMonthHash(date) ]
+
+      if (monthMap === void 0 || monthMap.includes(date.day) === false) {
         addToModel(date)
       }
 

package/src/components/img/QImg.json

@@ -246,9 +246,9 @@
     "error": {
       "desc": "Emitted when browser could not load the image",
       "params": {
-        "err": {
-          "type": "Error",
-          "desc": "JS Error object"
+        "evt": {
+          "type": "Event",
+          "desc": "JS Event object (same as the browser's native 'error' event)"
         }
       }
     }

package/src/components/select/QSelect.js

@@ -319,11 +319,12 @@ export default createComponent({
 
       return props.options.slice(from, to).map((opt, i) => {
         const disable = isOptionDisabled.value(opt) === true
+        const active = isOptionSelected(opt) === true
         const index = from + i
 
         const itemProps = {
           clickable: true,
-          active: false,
+          active,
           activeClass: computedOptionsSelectedClass.value,
           manualFocus: true,
           focused: false,
@@ -332,16 +333,14 @@ export default createComponent({
           dense: props.optionsDense,
           dark: isOptionsDark.value,
           role: 'option',
+          'aria-selected': active === true ? 'true' : 'false',
           id: `${ state.targetUid.value }_${ index }`,
           onClick: () => { toggleOption(opt) }
         }
 
         if (disable !== true) {
-          isOptionSelected(opt) === true && (itemProps.active = true)
           optionIndex.value === index && (itemProps.focused = true)
 
-          itemProps[ 'aria-selected' ] = itemProps.active === true ? 'true' : 'false'
-
           if ($q.platform.is.desktop === true) {
             itemProps.onMousemove = () => { menu.value === true && setOptionIndex(index) }
           }

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

@@ -238,7 +238,7 @@ export default function ({ updateValue, updatePosition, getDragging, formAttrs }
     let model = min + ratio * (max - min)
 
     if (step > 0) {
-      const modulo = (model - min) % step
+      const modulo = (model - innerMin.value) % step
       model += (Math.abs(modulo) >= step / 2 ? (modulo < 0 ? -1 : 1) * step : 0) - modulo
     }
 

package/src/components/time/QTime.json

@@ -55,7 +55,10 @@
           "desc": "Seconds"
         }
       },
-      "returns": null,
+      "returns": {
+        "type": [ "Boolean", "null", "undefined" ],
+        "desc": "Is the user allowed to set the specified time?"
+      },
       "examples": [
         ":options=\"(hr, min, sec) => hr <= 6\""
       ],

package/src/css/core/flex.sass

@@ -1,3 +1,5 @@
+@use 'sass:math'
+
 @import '../helpers/string.sass'
 
 @mixin fg($name, $size)
@@ -30,13 +32,13 @@
       .row
         #{str-fe('> .col<name>-<i>', $name, $noProcNotZero, $ic)}
           height: auto
-          width: toFixed(percentage($i / $flex-cols), 10000)
+          width: toFixed(percentage(math.div($i, $flex-cols)), 10000)
         @if $i != 0 or $name != ''
           #{str-fe('> .offset<name>-<i>', $name, $noProcNotZero, $ic)}
-            margin-left: toFixed(percentage($i / $flex-cols), 10000)
+            margin-left: toFixed(percentage(math.div($i, $flex-cols)), 10000)
       .column
         #{str-fe('> .col<name>-<i>', $name, $noProcNotZero, $ic)}
-          height: toFixed(percentage($i / $flex-cols), 10000)
+          height: toFixed(percentage(math.div($i, $flex-cols)), 10000)
           width: auto
       @if $size == 0 and $i == $flex-cols
         .row > .col-all

package/src/css/flex-addon.sass

@@ -1,3 +1,5 @@
+@use 'sass:math'
+
 @import './helpers/string.sass'
 @import './helpers/math.sass'
 
@@ -194,7 +196,7 @@
 
         @for $i from 0 through $flex-cols
           $ic: quote('' + $i)
-          $internal-size: toFixed(percentage($i / $flex-cols), 10000)
+          $internal-size: toFixed(percentage(math.div($i, $flex-cols)), 10000)
 
           #{str-fr('.row<name>', $name)}
             #{str-fe('> .col<name>-<i>', $name2c, $noProcNotZero2, $ic)}

package/src/css/helpers/math.sass

@@ -1,3 +1,5 @@
+@use 'sass:math'
+
 $PI: 3.14159265359
 
 @function pow($number, $exp)
@@ -21,22 +23,22 @@ $PI: 3.14159265359
 // toFixed(0.12345, 100) -> 0.12
 // toFixed(0.12345, 1000) -> 0.123
 @function toFixed($number, $power)
-  @return round($number * $power) / $power
+  @return math.div(round($number * $power), $power)
 
 @function sin($angle)
   $sin: 0
   // angle -> radians
-  $rad: $angle / 180 * $PI
+  $rad: math.div($angle, 180) * $PI
   // interval determines precision
   @for $i from 0 through 25
-    $sin: $sin + pow(-1, $i) * pow($rad, (2 * $i + 1)) / fact(2 * $i + 1)
+    $sin: $sin + math.div(pow(-1, $i) * pow($rad, (2 * $i + 1)), fact(2 * $i + 1))
   @return $sin
 
 @function cos($angle)
   $cos: 0
   // angle -> radians
-  $rad: $angle / 180 * $PI
+  $rad: math.div($angle, 180) * $PI
   // interval determines precision
   @for $i from 0 through 25
-    $cos: $cos + pow(-1, $i) * pow($rad, 2 * $i) / fact(2 * $i)
+    $cos: $cos + math.div(pow(-1, $i) * pow($rad, 2 * $i), fact(2 * $i))
   @return $cos