quasar 2.18.7 → 2.19.0

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

@@ -11,7 +11,7 @@
     "vertical-offset": {
       "type": "Array",
       "desc": "Adds [top, bottom] offset to vertical thumb",
-      "default": "# [ 0, 0 ]",
+      "default": "# [0, 0]",
       "category": "style",
       "addedIn": "v2.17"
     },
@@ -19,32 +19,36 @@
     "horizontal-offset": {
       "type": "Array",
       "desc": "Adds [left, right] offset to horizontal thumb",
-      "default": "# [ 0, 0 ]",
+      "default": "# [0, 0]",
       "category": "style",
       "addedIn": "v2.17"
     },
 
     "bar-style": {
-      "type": [ "String", "Array", "Object" ],
+      "type": ["String", "Array", "Object"],
       "tsType": "VueStyleProp",
       "desc": "Object with CSS properties and values for custom styling the scrollbars (both vertical and horizontal)",
-      "examples": [ "{ borderRadius: '5px', background: 'red', opacity: 1 }" ],
+      "examples": ["{ borderRadius: '5px', background: 'red', opacity: 1 }"],
       "category": "style"
     },
 
     "vertical-bar-style": {
-      "type": [ "String", "Array", "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": [ "{ right: '4px', borderRadius: '5px', background: 'red', width: '10px', opacity: 1 }" ],
+      "examples": [
+        "{ right: '4px', borderRadius: '5px', background: 'red', width: '10px', opacity: 1 }"
+      ],
       "category": "style"
     },
 
     "horizontal-bar-style": {
-      "type": [ "String", "Array", "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": [ "{ bottom: '4px', borderRadius: '5px', background: 'red', height: '10px', opacity: 1 }" ],
+      "examples": [
+        "{ bottom: '4px', borderRadius: '5px', background: 'red', height: '10px', opacity: 1 }"
+      ],
       "category": "style"
     },
 
@@ -52,7 +56,9 @@
       "type": "Object",
       "tsType": "VueStyleObjectProp",
       "desc": "Object with CSS properties and values for custom styling the thumb of scrollbars (both vertical and horizontal)",
-      "examples": [ "{ right: '4px', borderRadius: '5px', background: 'red', width: '10px', opacity: 1 }" ],
+      "examples": [
+        "{ right: '4px', borderRadius: '5px', background: 'red', width: '10px', opacity: 1 }"
+      ],
       "category": "style"
     },
 
@@ -60,7 +66,9 @@
       "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": [ "{ right: '4px', borderRadius: '5px', background: 'red', width: '10px', opacity: 1 }" ],
+      "examples": [
+        "{ right: '4px', borderRadius: '5px', background: 'red', width: '10px', opacity: 1 }"
+      ],
       "category": "style"
     },
 
@@ -68,35 +76,37 @@
       "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": [ "{ bottom: '4px', borderRadius: '5px', background: 'red', height: '10px', opacity: 1 }" ],
+      "examples": [
+        "{ bottom: '4px', borderRadius: '5px', background: 'red', height: '10px', opacity: 1 }"
+      ],
       "category": "style"
     },
 
     "content-style": {
-      "type": [ "String", "Array", "Object" ],
+      "type": ["String", "Array", "Object"],
       "tsType": "VueStyleProp",
       "desc": "Object with CSS properties and values for styling the container of QScrollArea",
-      "examples": [ "{ backgroundColor: '#C0C0C0' }" ],
+      "examples": ["{ backgroundColor: '#C0C0C0' }"],
       "category": "style"
     },
 
     "content-active-style": {
-      "type": [ "String", "Array", "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": [ "{ backgroundColor: 'white' }" ],
+      "examples": ["{ backgroundColor: 'white' }"],
       "category": "style"
     },
 
     "visible": {
-      "type": [ "Boolean", "null" ],
+      "type": ["Boolean", "null"],
       "default": "null",
       "desc": "Manually control the visibility of the scrollbar; Overrides default mouse over/leave behavior",
       "category": "behavior"
     },
 
     "delay": {
-      "type": [ "Number", "String" ],
+      "type": ["Number", "String"],
       "desc": "When content changes, the scrollbar appears; this delay defines the amount of time (in milliseconds) before scrollbars disappear again (if component is not hovered)",
       "default": "1000",
       "category": "behavior"
@@ -279,7 +289,7 @@
             "desc": "Scroll offset from left (horizontal)"
           }
         },
-        "examples": [ "{ top: 10, left: 0 }" ]
+        "examples": ["{ top: 10, left: 0 }"]
       }
     },
 
@@ -301,7 +311,7 @@
             "desc": "Scroll percentage (0.0 <= x <= 1.0) offset from left (horizontal)"
           }
         },
-        "examples": [ "{ top: 0.212, left: 0 }" ]
+        "examples": ["{ top: 0.212, left: 0 }"]
       }
     },
 
@@ -312,7 +322,7 @@
           "type": "String",
           "required": true,
           "desc": "Scroll axis",
-          "values": [ "'vertical'", "'horizontal'" ]
+          "values": ["'vertical'", "'horizontal'"]
         },
         "offset": {
           "type": "Number",
@@ -333,7 +343,7 @@
         "axis": {
           "type": "String",
           "desc": "Scroll axis",
-          "values": [ "'vertical'", "'horizontal'" ],
+          "values": ["'vertical'", "'horizontal'"],
           "required": true
         },
         "offset": {

package/src/components/scroll-area/ScrollAreaControls.js

@@ -7,25 +7,20 @@ import { createComponent } from '../../utils/private.create/create.js'
  * of the QScrollArea content when the scrollbars are interacted with.
  */
 export default createComponent({
-  props: [
-    'store',
-    'barStyle',
-    'verticalBarStyle',
-    'horizontalBarStyle'
-  ],
+  props: ['store', 'barStyle', 'verticalBarStyle', 'horizontalBarStyle'],
 
-  setup (props) {
-    return () => ([
+  setup(props) {
+    return () => [
       h('div', {
         class: props.store.scroll.vertical.barClass.value,
-        style: [ props.barStyle, props.verticalBarStyle ],
+        style: [props.barStyle, props.verticalBarStyle],
         'aria-hidden': 'true',
         onMousedown: props.store.onVerticalMousedown
       }),
 
       h('div', {
         class: props.store.scroll.horizontal.barClass.value,
-        style: [ props.barStyle, props.horizontalBarStyle ],
+        style: [props.barStyle, props.horizontalBarStyle],
         'aria-hidden': 'true',
         onMousedown: props.store.onHorizontalMousedown
       }),
@@ -49,6 +44,6 @@ export default createComponent({
         }),
         props.store.thumbHorizDir
       )
-    ])
+    ]
   }
 })

package/src/components/scroll-area/index.js

@@ -1,5 +1,3 @@
 import QScrollArea from './QScrollArea.js'
 
-export {
-  QScrollArea
-}
+export { QScrollArea }

package/src/components/scroll-observer/QScrollObserver.js

@@ -1,11 +1,16 @@
 import { watch, onMounted, onBeforeUnmount, getCurrentInstance } from 'vue'
 
 import { createComponent } from '../../utils/private.create/create.js'
-import { getScrollTarget, getVerticalScrollPosition, getHorizontalScrollPosition, scrollTargetProp } from '../../utils/scroll/scroll.js'
+import {
+  getScrollTarget,
+  getVerticalScrollPosition,
+  getHorizontalScrollPosition,
+  scrollTargetProp
+} from '../../utils/scroll/scroll.js'
 import { listenOpts, noop } from '../../utils/event/event.js'
 
 const { passive } = listenOpts
-const axisValues = [ 'both', 'horizontal', 'vertical' ]
+const axisValues = ['both', 'horizontal', 'vertical']
 
 export default createComponent({
   name: 'QScrollObserver',
@@ -17,14 +22,14 @@ export default createComponent({
       default: 'vertical'
     },
 
-    debounce: [ String, Number ],
+    debounce: [String, Number],
 
     scrollTarget: scrollTargetProp
   },
 
-  emits: [ 'scroll' ],
+  emits: ['scroll'],
 
-  setup (props, { emit }) {
+  setup(props, { emit }) {
     const scroll = {
       position: {
         top: 0,
@@ -45,14 +50,19 @@ export default createComponent({
       }
     }
 
-    let clearTimer = null, localScrollTarget, parentEl
+    let clearTimer = null,
+      localScrollTarget,
+      parentEl
 
-    watch(() => props.scrollTarget, () => {
-      unconfigureScrollTarget()
-      configureScrollTarget()
-    })
+    watch(
+      () => props.scrollTarget,
+      () => {
+        unconfigureScrollTarget()
+        configureScrollTarget()
+      }
+    )
 
-    function emitEvent () {
+    function emitEvent() {
       clearTimer?.()
 
       const top = Math.max(0, getVerticalScrollPosition(localScrollTarget))
@@ -64,13 +74,20 @@ export default createComponent({
       }
 
       if (
-        (props.axis === 'vertical' && delta.top === 0)
-        || (props.axis === 'horizontal' && delta.left === 0)
-      ) return
+        (props.axis === 'vertical' && delta.top === 0) ||
+        (props.axis === 'horizontal' && delta.left === 0)
+      ) {
+        return
+      }
 
-      const curDir = Math.abs(delta.top) >= Math.abs(delta.left)
-        ? (delta.top < 0 ? 'up' : 'down')
-        : (delta.left < 0 ? 'left' : 'right')
+      const curDir =
+        Math.abs(delta.top) >= Math.abs(delta.left)
+          ? delta.top < 0
+            ? 'up'
+            : 'down'
+          : delta.left < 0
+            ? 'left'
+            : 'right'
 
       scroll.position = { top, left }
       scroll.directionChanged = scroll.direction !== curDir
@@ -84,27 +101,30 @@ export default createComponent({
       emit('scroll', { ...scroll })
     }
 
-    function configureScrollTarget () {
+    function configureScrollTarget() {
       localScrollTarget = getScrollTarget(parentEl, props.scrollTarget)
       localScrollTarget.addEventListener('scroll', trigger, passive)
       trigger(true)
     }
 
-    function unconfigureScrollTarget () {
+    function unconfigureScrollTarget() {
       if (localScrollTarget !== void 0) {
         localScrollTarget.removeEventListener('scroll', trigger, passive)
         localScrollTarget = void 0
       }
     }
 
-    function trigger (immediately) {
-      if (immediately === true || props.debounce === 0 || props.debounce === '0') {
+    function trigger(immediately) {
+      if (
+        immediately === true ||
+        props.debounce === 0 ||
+        props.debounce === '0'
+      ) {
         emitEvent()
-      }
-      else if (clearTimer === null) {
-        const [ timer, fn ] = props.debounce
-          ? [ setTimeout(emitEvent, props.debounce), clearTimeout ]
-          : [ requestAnimationFrame(emitEvent), cancelAnimationFrame ]
+      } else if (clearTimer === null) {
+        const [timer, fn] = props.debounce
+          ? [setTimeout(emitEvent, props.debounce), clearTimeout]
+          : [requestAnimationFrame(emitEvent), cancelAnimationFrame]
 
         clearTimer = () => {
           fn(timer)

package/src/components/scroll-observer/QScrollObserver.json

@@ -5,16 +5,16 @@
 
   "props": {
     "debounce": {
-      "type": [ "String", "Number" ],
+      "type": ["String", "Number"],
       "desc": "Debounce amount (in milliseconds)",
-      "examples": [ "0", "'530'" ],
+      "examples": ["0", "'530'"],
       "category": "behavior"
     },
 
     "axis": {
       "type": "String",
       "desc": "Axis on which to detect changes",
-      "values": [ "'both'", "'vertical'", "'horizontal'" ],
+      "values": ["'both'", "'vertical'", "'horizontal'"],
       "default": "'vertical'",
       "category": "behavior"
     },
@@ -54,7 +54,7 @@
               "type": "String",
               "required": true,
               "desc": "Direction of scroll",
-              "values": [ "'up'", "'down'", "'left'", "'right'" ]
+              "values": ["'up'", "'down'", "'left'", "'right'"]
             },
             "directionChanged": {
               "type": "Boolean",

package/src/components/scroll-observer/index.js

@@ -1,5 +1,3 @@
 import QScrollObserver from './QScrollObserver.js'
 
-export {
-  QScrollObserver
-}
+export { QScrollObserver }