quasar 2.5.0 → 2.5.1

package/dist/ssr-directives/Morph.js

@@ -1,5 +1,5 @@
 /*!
- * Quasar Framework v2.5.0
+ * Quasar Framework v2.5.1
  * (c) 2015-present Razvan Stoenescu
  * Released under the MIT License.
  */

package/dist/types/utils/date.d.ts

@@ -1,18 +1,18 @@
 interface DateOptions {
   milliseconds?: number;
+  millisecond?: number;
   seconds?: number;
+  second?: number;
   minutes?: number;
+  minute?: number;
   hours?: number;
-}
-
-export interface BuildDateOptions extends DateOptions {
+  hour?: number;
+  days?: number;
+  day?: number;
   date?: number;
+  months?: number;
   month?: number;
   year?: number;
-}
-export interface ModifyDateOptions extends DateOptions {
-  days?: number;
-  months?: number;
   years?: number;
 }
 
@@ -23,23 +23,35 @@ export interface DateLocale {
   monthsShort?: string[];
 }
 
-export type DateUnitOptions = "second" | "minute" | "hour" | "day" | "month" | "year";
+export type DateUnitOptions =
+  | "second"
+  | "seconds"
+  | "minute"
+  | "minutes"
+  | "hour"
+  | "hours"
+  | "day"
+  | "days"
+  | "date"
+  | "month"
+  | "months"
+  | "year"
+  | "years";
 
 export namespace date {
   function isValid(date: number | string): boolean;
   function extractDate(str: string, mask: string, locale?: DateLocale): Date;
-  function buildDate(options: BuildDateOptions, utc?: boolean): Date;
+  function buildDate(options: DateOptions, utc?: boolean): Date;
   function getDayOfWeek(date: Date): number;
   function getWeekOfYear(date: Date | number | string): number;
   function isBetweenDates(date: Date | number | string, from: Date | number | string, to: Date | number | string, opts?: { inclusiveFrom: boolean; inclusiveTo: boolean; onlyDate: boolean }): boolean;
-  function addToDate(date: Date | number | string, options: ModifyDateOptions): Date;
-  function subtractFromDate(date: Date | number | string, options: ModifyDateOptions): Date;
-  function adjustDate(date: Date | number | string, options: BuildDateOptions, utc?: boolean): Date;
+  function addToDate(date: Date | number | string, options: DateOptions): Date;
+  function subtractFromDate(date: Date | number | string, options: DateOptions): Date;
+  function adjustDate(date: Date | number | string, options: DateOptions, utc?: boolean): Date;
   function startOfDate(date: Date | number | string, option: DateUnitOptions, utc?: boolean): Date;
   function endOfDate(date: Date | number | string, option: DateUnitOptions, utc?: boolean): Date;
   function getMaxDate(date: Date | number | string, ...args: (Date | number | string)[]): Date;
   function getMinDate(date: Date | number | string, ...args: (Date | number | string)[]): Date;
-  // TODO: (Qv3) uniform "unit" to `DateUnitOptions` interface
   function getDateDiff(date: Date | number | string, subtract: Date | number | string, unit?: `${DateUnitOptions}s`): number;
   function getDayOfYear(date: Date | number | string): number;
   function inferDateFormat(date: Date | number | string): "date" | "number" | "string";

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

@@ -2,7 +2,7 @@
   "$schema": "",
   "framework": "vue",
   "name": "quasar",
-  "version": "2.5.0",
+  "version": "2.5.1",
   "contributions": {
     "html": {
       "types-syntax": "typescript",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "quasar",
-  "version": "2.5.0",
+  "version": "2.5.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/field/QField.sass

@@ -45,6 +45,7 @@ $field-transition-label-right-up: .324s cubic-bezier(.4,0,.2,1)
     line-height: 1
     color: rgba(0,0,0,.54)
     padding: 8px 12px 0
+    backface-visibility: hidden
 
     &--animated
       transform: translateY(100%)
@@ -190,6 +191,7 @@ $field-transition-label-right-up: .324s cubic-bezier(.4,0,.2,1)
     text-transform: inherit
     transform-origin: left top
     transition: transform $field-transition, max-width $field-transition-label-right-up
+    backface-visibility: hidden
 
   &--float .q-field__label
     max-width: 133%

package/src/components/form/QForm.js

@@ -33,7 +33,7 @@ export default createComponent({
         ? shouldFocus
         : props.noErrorFocus !== true
 
-      validateIndex++
+      const index = ++validateIndex
 
       const emitEvent = (res, ref) => {
         emit('validation-' + (res === true ? 'success' : 'error'), ref)
@@ -47,7 +47,7 @@ export default createComponent({
           promises.push(
             valid.then(
               valid => ({ valid, comp }),
-              error => ({ valid: false, comp, error })
+              err => ({ valid: false, comp, err })
             )
           )
         }
@@ -71,34 +71,33 @@ export default createComponent({
         return Promise.resolve(true)
       }
 
-      const index = validateIndex
-
-      return Promise.all(promises).then(
-        res => {
-          if (index === validateIndex) {
-            const errors = res.filter(r => r.valid !== true)
+      return Promise.all(promises).then(res => {
+        const errors = res.filter(r => r.valid !== true)
 
-            if (errors.length === 0) {
-              emitEvent(true)
-              return true
-            }
+        if (errors.length === 0) {
+          index === validateIndex && emitEvent(true)
+          return true
+        }
 
-            const { valid, comp } = errors[ 0 ]
+        const { valid, comp, err } = errors[ 0 ]
 
-            emitEvent(false, comp)
+        // if not outdated already
+        if (index === validateIndex) {
+          err !== void 0 && console.error(err)
 
-            if (
-              focus === true
-              && valid !== true
-              && typeof comp.focus === 'function'
-            ) {
-              comp.focus()
-            }
+          emitEvent(false, comp)
 
-            return false
+          if (
+            focus === true
+            && valid !== true
+            && typeof comp.focus === 'function'
+          ) {
+            comp.focus()
           }
         }
-      )
+
+        return false
+      })
     }
 
     function resetValidation () {
@@ -112,8 +111,11 @@ export default createComponent({
     function submit (evt) {
       evt !== void 0 && stopAndPrevent(evt)
 
+      const index = validateIndex + 1
+
       validate().then(val => {
-        if (val === true) {
+        // if not outdated && validation succeeded
+        if (index === validateIndex && val === true) {
           if (props.onSubmit !== void 0) {
             emit('submit', evt)
           }

package/src/composables/private/use-validate.js

@@ -84,7 +84,14 @@ export default function (focused, innerLoading) {
     else if (isDirtyModel.value === false) {
       isDirtyModel.value = true
 
-      if (hasActiveRules.value === true && props.lazyRules !== 'ondemand') {
+      if (
+        hasActiveRules.value === true
+        && props.lazyRules !== 'ondemand'
+        // Don't re-trigger if it's already in progress;
+        // It might mean that focus switched to submit btn and
+        // QForm's submit() has been called already (ENTER key)
+        && innerLoading.value === false
+      ) {
         debouncedValidate()
       }
     }
@@ -110,7 +117,7 @@ export default function (focused, innerLoading) {
       return true
     }
 
-    validateIndex++
+    const index = ++validateIndex
 
     if (innerLoading.value !== true && props.lazyRules !== true) {
       isDirtyModel.value = true
@@ -127,9 +134,7 @@ export default function (focused, innerLoading) {
         innerErrorMessage.value = m
       }
 
-      if (innerLoading.value !== false) {
-        innerLoading.value = false
-      }
+      innerLoading.value = false
     }
 
     const promises = []
@@ -159,35 +164,26 @@ export default function (focused, innerLoading) {
       return true
     }
 
-    if (innerLoading.value !== true) {
-      innerLoading.value = true
-    }
-
-    const index = validateIndex
+    innerLoading.value = true
 
     return Promise.all(promises).then(
       res => {
-        if (index !== validateIndex) {
-          return true
-        }
-
         if (res === void 0 || Array.isArray(res) === false || res.length === 0) {
-          update(false)
+          index === validateIndex && update(false)
           return true
         }
 
         const msg = res.find(r => r === false || typeof r === 'string')
-        update(msg !== void 0, msg)
+        index === validateIndex && update(msg !== void 0, msg)
         return msg === void 0
       },
       e => {
         if (index === validateIndex) {
           console.error(e)
           update(true)
-          return false
         }
 
-        return true
+        return false
       }
     )
   }

package/src/utils/date.js

@@ -174,15 +174,18 @@ function formatTimezone (offset, delimeter = '') {
 function applyYearMonthDayChange (date, mod, sign) {
   let
     year = date.getFullYear(),
-    month = date.getMonth(),
-    day = date.getDate()
+    month = date.getMonth()
 
-  if (mod.years !== void 0) {
-    year += sign * mod.years
+  const day = date.getDate()
+
+  if (mod.year !== void 0) {
+    year += sign * mod.year
+    delete mod.year
   }
 
-  if (mod.months !== void 0) {
-    month += sign * mod.months
+  if (mod.month !== void 0) {
+    month += sign * mod.month
+    delete mod.month
   }
 
   date.setDate(1)
@@ -192,30 +195,14 @@ function applyYearMonthDayChange (date, mod, sign) {
   date.setMonth(month)
   date.setDate(Math.min(day, daysInMonth(date)))
 
-  if (mod.days !== void 0) {
-    date.setDate(date.getDate() + sign * mod.days)
+  if (mod.date !== void 0) {
+    date.setDate(date.getDate() + sign * mod.date)
+    delete mod.date
   }
 
   return date
 }
 
-function getChange (date, mod, sign) {
-  const
-    d = new Date(date),
-    t = mod.years !== void 0 || mod.months !== void 0 || mod.days !== void 0
-      ? applyYearMonthDayChange(d, mod, sign)
-      : d
-
-  for (const key in mod) {
-    if (key !== 'years' && key !== 'months' && key !== 'days') {
-      const op = capitalize(key)
-      t[ `set${ op }` ](t[ `get${ op }` ]() + sign * mod[ key ])
-    }
-  }
-
-  return t
-}
-
 function applyYearMonthDay (date, mod, middle) {
   const
     year = mod.year !== void 0 ? mod.year : date[ `get${ middle }FullYear` ](),
@@ -230,22 +217,86 @@ function applyYearMonthDay (date, mod, middle) {
   date[ `set${ middle }Month` ](month)
   date[ `set${ middle }Date` ](day)
 
+  delete mod.year
+  delete mod.month
+  delete mod.date
+
   return date
 }
 
-export function adjustDate (date, mod, utc) {
+function getChange (date, rawMod, sign) {
   const
+    mod = normalizeMod(rawMod),
+    d = new Date(date),
+    t = mod.year !== void 0 || mod.month !== void 0 || mod.date !== void 0
+      ? applyYearMonthDayChange(d, mod, sign) // removes year/month/day
+      : d
+
+  for (const key in mod) {
+    const op = capitalize(key)
+    t[ `set${ op }` ](t[ `get${ op }` ]() + sign * mod[ key ])
+  }
+
+  return t
+}
+
+function normalizeMod (mod) {
+  const acc = { ...mod }
+
+  if (mod.years !== void 0) {
+    acc.year = mod.years
+    delete acc.years
+  }
+
+  if (mod.months !== void 0) {
+    acc.month = mod.months
+    delete acc.months
+  }
+
+  if (mod.days !== void 0) {
+    acc.date = mod.days
+    delete acc.days
+  }
+  if (mod.day !== void 0) {
+    acc.date = mod.day
+    delete acc.day
+  }
+
+  if (mod.hour !== void 0) {
+    acc.hours = mod.hour
+    delete acc.hour
+  }
+
+  if (mod.minute !== void 0) {
+    acc.minutes = mod.minute
+    delete acc.minute
+  }
+
+  if (mod.second !== void 0) {
+    acc.seconds = mod.second
+    delete acc.second
+  }
+
+  if (mod.millisecond !== void 0) {
+    acc.milliseconds = mod.millisecond
+    delete acc.millisecond
+  }
+
+  return acc
+}
+
+export function adjustDate (date, rawMod, utc) {
+  const
+    mod = normalizeMod(rawMod),
     middle = utc === true ? 'UTC' : '',
     d = new Date(date),
     t = mod.year !== void 0 || mod.month !== void 0 || mod.date !== void 0
-      ? applyYearMonthDay(d, mod, middle)
+      ? applyYearMonthDay(d, mod, middle) // removes year/month/day
       : d
 
   for (const key in mod) {
-    if (key !== 'year' && key !== 'month' && key !== 'date') {
-      const op = key.charAt(0).toUpperCase() + key.slice(1)
-      t[ `set${ middle }${ op }` ](mod[ key ])
-    }
+    const op = key.charAt(0).toUpperCase() + key.slice(1)
+    t[ `set${ middle }${ op }` ](mod[ key ])
   }
 
   return t
@@ -479,16 +530,23 @@ export function startOfDate (date, unit, utc) {
 
   switch (unit) {
     case 'year':
+    case 'years':
       t[ `${ prefix }Month` ](0)
     case 'month':
+    case 'months':
       t[ `${ prefix }Date` ](1)
     case 'day':
+    case 'days':
+    case 'date':
       t[ `${ prefix }Hours` ](0)
     case 'hour':
+    case 'hours':
       t[ `${ prefix }Minutes` ](0)
     case 'minute':
+    case 'minutes':
       t[ `${ prefix }Seconds` ](0)
     case 'second':
+    case 'seconds':
       t[ `${ prefix }Milliseconds` ](0)
   }
   return t
@@ -501,16 +559,23 @@ export function endOfDate (date, unit, utc) {
 
   switch (unit) {
     case 'year':
+    case 'years':
       t[ `${ prefix }Month` ](11)
     case 'month':
+    case 'months':
       t[ `${ prefix }Date` ](daysInMonth(t))
     case 'day':
+    case 'days':
+    case 'date':
       t[ `${ prefix }Hours` ](23)
     case 'hour':
+    case 'hours':
       t[ `${ prefix }Minutes` ](59)
     case 'minute':
+    case 'minutes':
       t[ `${ prefix }Seconds` ](59)
     case 'second':
+    case 'seconds':
       t[ `${ prefix }Milliseconds` ](999)
   }
   return t
@@ -546,21 +611,28 @@ export function getDateDiff (date, subtract, unit = 'days') {
 
   switch (unit) {
     case 'years':
+    case 'year':
       return (t.getFullYear() - sub.getFullYear())
 
     case 'months':
+    case 'month':
       return (t.getFullYear() - sub.getFullYear()) * 12 + t.getMonth() - sub.getMonth()
 
     case 'days':
+    case 'day':
+    case 'date':
       return getDiff(startOfDate(t, 'day'), startOfDate(sub, 'day'), MILLISECONDS_IN_DAY)
 
     case 'hours':
+    case 'hour':
       return getDiff(startOfDate(t, 'hour'), startOfDate(sub, 'hour'), MILLISECONDS_IN_HOUR)
 
     case 'minutes':
+    case 'minute':
       return getDiff(startOfDate(t, 'minute'), startOfDate(sub, 'minute'), MILLISECONDS_IN_MINUTE)
 
     case 'seconds':
+    case 'second':
       return getDiff(startOfDate(t, 'second'), startOfDate(sub, 'second'), 1000)
   }
 }
@@ -606,26 +678,33 @@ export function isSameDate (date, date2, unit) {
 
   switch (unit) {
     case 'second':
+    case 'seconds':
       if (t.getSeconds() !== d.getSeconds()) {
         return false
       }
     case 'minute': // intentional fall-through
+    case 'minutes':
       if (t.getMinutes() !== d.getMinutes()) {
         return false
       }
     case 'hour': // intentional fall-through
+    case 'hours':
       if (t.getHours() !== d.getHours()) {
         return false
       }
     case 'day': // intentional fall-through
+    case 'days':
+    case 'date':
       if (t.getDate() !== d.getDate()) {
         return false
       }
     case 'month': // intentional fall-through
+    case 'months':
       if (t.getMonth() !== d.getMonth()) {
         return false
       }
     case 'year': // intentional fall-through
+    case 'years':
       if (t.getFullYear() !== d.getFullYear()) {
         return false
       }