quasar 2.18.7 → 2.19.0

package/src/plugins/app-fullscreen/test/mock-fullscreen.js

@@ -5,21 +5,21 @@ import { vi, onTestFinished } from 'vitest'
  * so we mock the functionality
  */
 
-export function mockedRequestFullscreen (el = document.documentElement) {
+export function mockedRequestFullscreen(el = document.documentElement) {
   document.fullscreenElement = el
   mockedToggleFullscreen()
 }
 
-export function mockedExitFullscreen () {
+export function mockedExitFullscreen() {
   document.fullscreenElement = null
   mockedToggleFullscreen()
 }
 
-export function mockedToggleFullscreen () {
+export function mockedToggleFullscreen() {
   document.onfullscreenchange()
 }
 
-export function createMockedEl () {
+export function createMockedEl() {
   const el = document.createElement('div')
   el.setAttribute('tabindex', '0')
   document.body.appendChild(el)
@@ -31,7 +31,9 @@ export function createMockedEl () {
 
   el.exitFullscreen = mockedExitFullscreen
 
-  onTestFinished(() => { el.remove() })
+  onTestFinished(() => {
+    el.remove()
+  })
 
   return el
 }

package/src/plugins/app-visibility/AppVisibility.js

@@ -1,37 +1,41 @@
 import { createReactivePlugin } from '../../utils/private.create/create.js'
 import { injectProp } from '../../utils/private.inject-obj-prop/inject-obj-prop.js'
 
-const Plugin = createReactivePlugin({
-  appVisible: true
-}, {
-  install ({ $q }) {
-    if (__QUASAR_SSR_SERVER__) {
-      this.appVisible = $q.appVisible = true
-      return
-    }
+const Plugin = createReactivePlugin(
+  {
+    appVisible: true
+  },
+  {
+    install({ $q }) {
+      if (__QUASAR_SSR_SERVER__) {
+        this.appVisible = $q.appVisible = true
+        return
+      }
 
-    injectProp($q, 'appVisible', () => this.appVisible)
+      injectProp($q, 'appVisible', () => this.appVisible)
+    }
   }
-})
+)
 
 if (__QUASAR_SSR_SERVER__ !== true) {
   let prop, evt
 
-  if (typeof document.hidden !== 'undefined') { // Opera 12.10 and Firefox 18 and later support
+  if (typeof document.hidden !== 'undefined') {
+    // Opera 12.10 and Firefox 18 and later support
     prop = 'hidden'
     evt = 'visibilitychange'
-  }
-  else if (typeof document.msHidden !== 'undefined') {
+  } else if (typeof document.msHidden !== 'undefined') {
     prop = 'msHidden'
     evt = 'msvisibilitychange'
-  }
-  else if (typeof document.webkitHidden !== 'undefined') {
+  } else if (typeof document.webkitHidden !== 'undefined') {
     prop = 'webkitHidden'
     evt = 'webkitvisibilitychange'
   }
 
-  if (evt && typeof document[ prop ] !== 'undefined') {
-    const update = () => { Plugin.appVisible = !document[ prop ] }
+  if (evt && typeof document[prop] !== 'undefined') {
+    const update = () => {
+      Plugin.appVisible = !document[prop]
+    }
     document.addEventListener(evt, update, false)
   }
 }

package/src/plugins/app-visibility/AppVisibility.test.js

@@ -6,7 +6,9 @@ import AppVisibility from './AppVisibility.js'
 const mountPlugin = () => mount({ template: '<div />' })
 
 // We override Quasar install so it installs this plugin
-const quasarVuePlugin = config.global.plugins.find(entry => entry.name === 'Quasar')
+const quasarVuePlugin = config.global.plugins.find(
+  entry => entry.name === 'Quasar'
+)
 const { install } = quasarVuePlugin
 quasarVuePlugin.install = app => install(app, { plugins: { AppVisibility } })
 

package/src/plugins/bottom-sheet/BottomSheet.js

@@ -2,7 +2,7 @@ import BottomSheet from './component/BottomSheetComponent.js'
 import globalDialog from '../../utils/private.dialog/create-dialog.js'
 
 export default {
-  install ({ $q, parentApp }) {
+  install({ $q, parentApp }) {
     $q.bottomSheet = this.create = globalDialog(BottomSheet, false, parentApp)
   }
 }

package/src/plugins/bottom-sheet/BottomSheet.json

@@ -1,5 +1,5 @@
 {
-  "mixins": [ "utils/private.dialog/create-dialog" ],
+  "mixins": ["utils/private.dialog/create-dialog"],
 
   "meta": {
     "docsUrl": "https://v2.quasar.dev/quasar-plugins/bottom-sheet"
@@ -18,13 +18,13 @@
             "title": {
               "type": "String",
               "desc": "Title",
-              "examples": [ "'Share'" ]
+              "examples": ["'Share'"]
             },
 
             "message": {
               "type": "String",
               "desc": "Message",
-              "examples": [ "'Please select how to share'" ]
+              "examples": ["'Please select how to share'"]
             },
 
             "actions": {
@@ -32,17 +32,17 @@
               "desc": "Array of Objects, each Object defining an action",
               "definition": {
                 "classes": {
-                  "type": [ "String", "Array", "Object" ],
+                  "type": ["String", "Array", "Object"],
                   "tsType": "VueClassProp",
                   "desc": "CSS classes for this action",
-                  "examples": [ "'my-class'" ]
+                  "examples": ["'my-class'"]
                 },
 
                 "style": {
-                  "type": [ "String", "Array", "Object" ],
+                  "type": ["String", "Array", "Object"],
                   "tsType": "VueStyleProp",
                   "desc": "Style definitions to be attributed to this action element",
-                  "examples": [ "{ padding: '2px' }" ],
+                  "examples": ["{ padding: '2px' }"],
                   "addedIn": "v2.11.7"
                 },
 
@@ -71,9 +71,9 @@
                 },
 
                 "label": {
-                  "type": [ "String", "Number" ],
+                  "type": ["String", "Number"],
                   "desc": "Action label",
-                  "examples": [ "'Facebook'" ]
+                  "examples": ["'Facebook'"]
                 },
 
                 "...": {

package/src/plugins/bottom-sheet/component/BottomSheetComponent.js

@@ -12,7 +12,9 @@ import QItem from '../../../components/item/QItem.js'
 import QItemSection from '../../../components/item/QItemSection.js'
 
 import { createComponent } from '../../../utils/private.create/create.js'
-import useDark, { useDarkProps } from '../../../composables/private.use-dark/use-dark.js'
+import useDark, {
+  useDarkProps
+} from '../../../composables/private.use-dark/use-dark.js'
 
 export default createComponent({
   name: 'BottomSheetComponent',
@@ -26,158 +28,193 @@ export default createComponent({
 
     grid: Boolean,
 
-    cardClass: [ String, Array, Object ],
-    cardStyle: [ String, Array, Object ]
+    cardClass: [String, Array, Object],
+    cardStyle: [String, Array, Object]
   },
 
-  emits: [ 'ok', 'hide' ],
+  emits: ['ok', 'hide'],
 
-  setup (props, { emit }) {
+  setup(props, { emit }) {
     const { proxy } = getCurrentInstance()
     const isDark = useDark(props, proxy.$q)
 
     const dialogRef = ref(null)
 
-    function show () {
+    function show() {
       dialogRef.value.show()
     }
 
-    function hide () {
+    function hide() {
       dialogRef.value.hide()
     }
 
-    function onOk (action) {
+    function onOk(action) {
       emit('ok', action)
       hide()
     }
 
-    function onHide () {
+    function onHide() {
       emit('hide')
     }
 
-    function getGrid () {
+    function getGrid() {
       return props.actions.map(action => {
         const img = action.avatar || action.img
 
         return action.label === void 0
           ? h(QSeparator, {
-            class: 'col-all',
-            dark: isDark.value
-          })
-          : h('div', {
-            class: [
-              'q-bottom-sheet__item q-hoverable q-focusable cursor-pointer relative-position',
-              action.class
-            ],
-            style: action.style,
-            tabindex: 0,
-            role: 'listitem',
-            onClick () { onOk(action) },
-            onKeyup (e) { e.keyCode === 13 && onOk(action) }
-          }, [
-            h('div', { class: 'q-focus-helper' }),
-
-            action.icon
-              ? h(QIcon, { name: action.icon, color: action.color })
-              : (
-                  img
-                    ? h('img', {
-                      class: action.avatar ? 'q-bottom-sheet__avatar' : '',
-                      src: img
-                    })
-                    : h('div', { class: 'q-bottom-sheet__empty-icon' })
-                ),
+              class: 'col-all',
+              dark: isDark.value
+            })
+          : h(
+              'div',
+              {
+                class: [
+                  'q-bottom-sheet__item q-hoverable q-focusable cursor-pointer relative-position',
+                  action.class
+                ],
+                style: action.style,
+                tabindex: 0,
+                role: 'listitem',
+                onClick() {
+                  onOk(action)
+                },
+                onKeyup(e) {
+                  if (e.keyCode === 13) onOk(action)
+                }
+              },
+              [
+                h('div', { class: 'q-focus-helper' }),
 
-            h('div', action.label)
-          ])
+                action.icon
+                  ? h(QIcon, { name: action.icon, color: action.color })
+                  : img
+                    ? h('img', {
+                        class: action.avatar ? 'q-bottom-sheet__avatar' : '',
+                        src: img
+                      })
+                    : h('div', { class: 'q-bottom-sheet__empty-icon' }),
+
+                h('div', action.label)
+              ]
+            )
       })
     }
 
-    function getList () {
+    function getList() {
       return props.actions.map(action => {
         const img = action.avatar || action.img
 
         return action.label === void 0
           ? h(QSeparator, { spaced: true, dark: isDark.value })
-          : h(QItem, {
-            class: [ 'q-bottom-sheet__item', action.classes ],
-            style: action.style,
-            tabindex: 0,
-            clickable: true,
-            dark: isDark.value,
-            onClick () { onOk(action) }
-          }, () => [
-            h(
-              QItemSection,
-              { avatar: true },
-              () => (
-                action.icon
-                  ? h(QIcon, { name: action.icon, color: action.color })
-                  : (
-                      img
-                        ? h('img', {
+          : h(
+              QItem,
+              {
+                class: ['q-bottom-sheet__item', action.classes],
+                style: action.style,
+                tabindex: 0,
+                clickable: true,
+                dark: isDark.value,
+                onClick() {
+                  onOk(action)
+                }
+              },
+              () => [
+                h(QItemSection, { avatar: true }, () =>
+                  action.icon
+                    ? h(QIcon, { name: action.icon, color: action.color })
+                    : img
+                      ? h('img', {
                           class: action.avatar ? 'q-bottom-sheet__avatar' : '',
                           src: img
                         })
-                        : null
-                    )
-              )
-            ),
+                      : null
+                ),
 
-            h(QItemSection, () => action.label)
-          ])
+                h(QItemSection, () => action.label)
+              ]
+            )
       })
     }
 
-    function getCardContent () {
+    function getCardContent() {
       const child = []
 
-      props.title && child.push(
-        h(QCardSection, {
-          class: 'q-dialog__title'
-        }, () => props.title)
-      )
-
-      props.message && child.push(
-        h(QCardSection, {
-          class: 'q-dialog__message'
-        }, () => props.message)
-      )
+      if (props.title) {
+        child.push(
+          h(
+            QCardSection,
+            {
+              class: 'q-dialog__title'
+            },
+            () => props.title
+          )
+        )
+      }
+
+      if (props.message) {
+        child.push(
+          h(
+            QCardSection,
+            {
+              class: 'q-dialog__message'
+            },
+            () => props.message
+          )
+        )
+      }
 
       child.push(
         props.grid === true
-          ? h('div', {
-            class: 'row items-stretch justify-start',
-            role: 'list'
-          }, getGrid())
-          : h('div', {
-            role: 'list'
-          }, getList())
+          ? h(
+              'div',
+              {
+                class: 'row items-stretch justify-start',
+                role: 'list'
+              },
+              getGrid()
+            )
+          : h(
+              'div',
+              {
+                role: 'list'
+              },
+              getList()
+            )
       )
 
       return child
     }
 
-    function getContent () {
+    function getContent() {
       return [
-        h(QCard, {
-          class: [
-            `q-bottom-sheet q-bottom-sheet--${ props.grid === true ? 'grid' : 'list' }`
-            + (isDark.value === true ? ' q-bottom-sheet--dark q-dark' : ''),
-            props.cardClass
-          ],
-          style: props.cardStyle
-        }, getCardContent)
+        h(
+          QCard,
+          {
+            class: [
+              `q-bottom-sheet q-bottom-sheet--${props.grid === true ? 'grid' : 'list'}` +
+                (isDark.value === true ? ' q-bottom-sheet--dark q-dark' : ''),
+              props.cardClass
+            ],
+            style: props.cardStyle
+          },
+          getCardContent
+        )
       ]
     }
 
     // expose public methods
     Object.assign(proxy, { show, hide })
 
-    return () => h(QDialog, {
-      ref: dialogRef,
-      position: 'bottom',
-      onHide
-    }, getContent)
+    return () =>
+      h(
+        QDialog,
+        {
+          ref: dialogRef,
+          position: 'bottom',
+          onHide
+        },
+        getContent
+      )
   }
 })

package/src/plugins/cookies/Cookies.js

@@ -1,16 +1,16 @@
-function encode (string) {
+function encode(string) {
   return encodeURIComponent(string)
 }
 
-function decode (string) {
+function decode(string) {
   return decodeURIComponent(string)
 }
 
-function stringifyCookieValue (value) {
-  return encode(value === Object(value) ? JSON.stringify(value) : '' + value)
+function stringifyCookieValue(value) {
+  return encode(value === Object(value) ? JSON.stringify(value) : String(value))
 }
 
-function read (string) {
+function read(string) {
   if (string === '') {
     return string
   }
@@ -31,19 +31,18 @@ function read (string) {
     if (parsed === Object(parsed) || Array.isArray(parsed) === true) {
       string = parsed
     }
-  }
-  catch (_) {}
+  } catch {}
 
   return string
 }
 
-function getString (msOffset) {
+function getString(msOffset) {
   const time = new Date()
   time.setMilliseconds(time.getMilliseconds() + msOffset)
   return time.toUTCString()
 }
 
-function parseExpireString (str) {
+function parseExpireString(str) {
   let timestamp = 0
 
   const days = str.match(/(\d+)d/)
@@ -51,17 +50,24 @@ function parseExpireString (str) {
   const minutes = str.match(/(\d+)m/)
   const seconds = str.match(/(\d+)s/)
 
-  if (days) { timestamp += days[ 1 ] * 864e+5 }
-  if (hours) { timestamp += hours[ 1 ] * 36e+5 }
-  if (minutes) { timestamp += minutes[ 1 ] * 6e+4 }
-  if (seconds) { timestamp += seconds[ 1 ] * 1000 }
+  if (days) {
+    timestamp += days[1] * 864e5
+  }
+  if (hours) {
+    timestamp += hours[1] * 36e5
+  }
+  if (minutes) {
+    timestamp += minutes[1] * 6e4
+  }
+  if (seconds) {
+    timestamp += seconds[1] * 1000
+  }
 
-  return timestamp === 0
-    ? str
-    : getString(timestamp)
+  return timestamp === 0 ? str : getString(timestamp)
 }
 
-function set (key, val, opts = {}, ssr) {
+// oxlint-disable-next-line default-param-last
+function set(key, val, opts = {}, ssr) {
   let expire, expireValue
 
   if (opts.expires !== void 0) {
@@ -77,13 +83,14 @@ function set (key, val, opts = {}, ssr) {
     // otherwise it must be a Number (defined in days)
     else {
       expireValue = parseFloat(opts.expires)
-      expire = isNaN(expireValue) === false
-        ? getString(expireValue * 864e+5)
-        : opts.expires
+      expire =
+        isNaN(expireValue) === false
+          ? getString(expireValue * 864e5)
+          : opts.expires
     }
   }
 
-  const keyValue = `${ encode(key) }=${ stringifyCookieValue(val) }`
+  const keyValue = `${encode(key)}=${stringifyCookieValue(val)}`
 
   const cookie = [
     keyValue,
@@ -99,9 +106,8 @@ function set (key, val, opts = {}, ssr) {
   if (ssr) {
     if (ssr.req.qCookies) {
       ssr.req.qCookies.push(cookie)
-    }
-    else {
-      ssr.req.qCookies = [ cookie ]
+    } else {
+      ssr.req.qCookies = [cookie]
     }
 
     ssr.res.setHeader('Set-Cookie', ssr.req.qCookies)
@@ -112,48 +118,41 @@ function set (key, val, opts = {}, ssr) {
     let all = ssr.req.headers.cookie || ''
 
     if (expire !== void 0 && expireValue < 0) {
-      const val = get(key, ssr)
-      if (val !== undefined) {
+      const localVal = get(key, ssr)
+      if (localVal !== void 0) {
         all = all
-          .replace(`${ key }=${ val }; `, '')
-          .replace(`; ${ key }=${ val }`, '')
-          .replace(`${ key }=${ val }`, '')
+          .replace(`${key}=${localVal}; `, '')
+          .replace(`; ${key}=${localVal}`, '')
+          .replace(`${key}=${localVal}`, '')
       }
-    }
-    else {
-      all = all
-        ? `${ keyValue }; ${ all }`
-        : cookie
+    } else {
+      all = all ? `${keyValue}; ${all}` : cookie
     }
 
     ssr.req.headers.cookie = all
-  }
-  else {
+  } else {
     document.cookie = cookie
   }
 }
 
-function get (key, ssr) {
-  const
-    cookieSource = ssr ? ssr.req.headers : document,
+function get(key, ssr) {
+  const cookieSource = ssr ? ssr.req.headers : document,
     cookies = cookieSource.cookie ? cookieSource.cookie.split('; ') : [],
     l = cookies.length
-  let
-    result = key ? null : {},
+  let result = key ? null : {},
     i = 0,
     parts,
     name,
     cookie
 
   for (; i < l; i++) {
-    parts = cookies[ i ].split('=')
+    parts = cookies[i].split('=')
     name = decode(parts.shift())
     cookie = parts.join('=')
 
     if (!key) {
-      result[ name ] = cookie
-    }
-    else if (key === name) {
+      result[name] = cookie
+    } else if (key === name) {
       result = read(cookie)
       break
     }
@@ -162,20 +161,15 @@ function get (key, ssr) {
   return result
 }
 
-function remove (key, options, ssr) {
-  set(
-    key,
-    '',
-    { expires: -1, ...options },
-    ssr
-  )
+function remove(key, options, ssr) {
+  set(key, '', { expires: -1, ...options }, ssr)
 }
 
-function has (key, ssr) {
+function has(key, ssr) {
   return get(key, ssr) !== null
 }
 
-export function getObject (ssr) {
+export function getObject(ssr) {
   return {
     get: key => get(key, ssr),
     set: (key, val, opts) => set(key, val, opts, ssr),
@@ -186,10 +180,8 @@ export function getObject (ssr) {
 }
 
 const Plugin = {
-  install ({ $q, ssrContext }) {
-    $q.cookies = __QUASAR_SSR_SERVER__
-      ? getObject(ssrContext)
-      : this
+  install({ $q, ssrContext }) {
+    $q.cookies = __QUASAR_SSR_SERVER__ ? getObject(ssrContext) : this
   }
 }