quasar 2.19.3 → 2.20.1

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

@@ -24,11 +24,11 @@ export default function useAlign(props) {
   return computed(() => {
     const align =
       props.align === void 0
-        ? props.vertical === true
+        ? props.vertical
           ? 'stretch'
           : 'left'
         : props.align
 
-    return `${props.vertical === true ? 'items' : 'justify'}-${alignMap[align]}`
+    return `${props.vertical ? 'items' : 'justify'}-${alignMap[align]}`
   })
 }

package/src/composables/private.use-align/use-align.test.js

@@ -1,4 +1,4 @@
-import { describe, test, expect } from 'vitest'
+import { describe, expect, test } from 'vitest'
 
 import useAlign, { alignMap, alignValues, useAlignProps } from './use-align.js'
 

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

@@ -1,10 +1,10 @@
 import {
-  ref,
-  watch,
-  onMounted,
-  onBeforeUnmount,
+  getCurrentInstance,
   nextTick,
-  getCurrentInstance
+  onBeforeUnmount,
+  onMounted,
+  ref,
+  watch
 } from 'vue'
 
 import { clearSelection } from '../../utils/private.selection/selection.js'
@@ -63,7 +63,7 @@ export default function useAnchor({
       },
 
       toggleKey(evt) {
-        if (isKeyCode(evt, 13) === true) anchorEvents.toggle(evt)
+        if (isKeyCode(evt, 13)) anchorEvents.toggle(evt)
       },
 
       contextClick(evt) {
@@ -80,7 +80,7 @@ export default function useAnchor({
       mobileTouch(evt) {
         anchorEvents.mobileCleanup(evt)
 
-        if (canShow(evt) !== true) return
+        if (!canShow(evt)) return
 
         proxy.hide(evt)
         anchorEl.value.classList.add('non-selectable')
@@ -108,34 +108,29 @@ export default function useAnchor({
           touchTimer = null
         }
 
-        if (showing.value === true && evt !== void 0) {
+        if (showing.value && evt !== void 0) {
           clearSelection()
         }
       }
     })
 
+    // oxlint-disable-next-line func-name-matching
     configureAnchorEl = function configureAnchorElFn(
       context = props.contextMenu
     ) {
-      if (props.noParentEvent === true || anchorEl.value === null) return
-
-      let evts
-
-      if (context === true) {
-        if (proxy.$q.platform.is.mobile === true) {
-          evts = [[anchorEl.value, 'touchstart', 'mobileTouch', 'passive']]
-        } else {
-          evts = [
-            [anchorEl.value, 'mousedown', 'hide', 'passive'],
-            [anchorEl.value, 'contextmenu', 'contextClick', 'notPassive']
+      if (props.noParentEvent || anchorEl.value === null) return
+
+      const evts = context
+        ? proxy.$q.platform.is.mobile
+          ? [[anchorEl.value, 'touchstart', 'mobileTouch', 'passive']]
+          : [
+              [anchorEl.value, 'mousedown', 'hide', 'passive'],
+              [anchorEl.value, 'contextmenu', 'contextClick', 'notPassive']
+            ]
+        : [
+            [anchorEl.value, 'click', 'toggle', 'passive'],
+            [anchorEl.value, 'keyup', 'toggleKey', 'passive']
           ]
-        }
-      } else {
-        evts = [
-          [anchorEl.value, 'click', 'toggle', 'passive'],
-          [anchorEl.value, 'keyup', 'toggleKey', 'passive']
-        ]
-      }
 
       addEvt(anchorEvents, 'anchor', evts)
     }
@@ -208,7 +203,7 @@ export default function useAnchor({
     () => props.noParentEvent,
     val => {
       if (anchorEl.value !== null) {
-        if (val === true) {
+        if (val) {
           unconfigureAnchorEl()
         } else {
           configureAnchorEl()
@@ -220,11 +215,7 @@ export default function useAnchor({
   onMounted(() => {
     pickAnchorEl()
 
-    if (
-      avoidEmit !== true &&
-      props.modelValue === true &&
-      anchorEl.value === null
-    ) {
+    if (!avoidEmit && props.modelValue && anchorEl.value === null) {
       emit('update:modelValue', false)
     }
   })

package/src/composables/private.use-dark/use-dark.test.js

@@ -1,4 +1,4 @@
-import { describe, test, expect } from 'vitest'
+import { describe, expect, test } from 'vitest'
 
 import useDark, { useDarkProps } from './use-dark.js'
 

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

@@ -1,14 +1,14 @@
 import {
-  h,
-  ref,
-  computed,
   Transition,
+  computed,
+  getCurrentInstance,
+  h,
   nextTick,
   onActivated,
-  onDeactivated,
   onBeforeUnmount,
+  onDeactivated,
   onMounted,
-  getCurrentInstance
+  ref
 } from 'vue'
 
 import QIcon from '../../components/icon/QIcon.js'
@@ -103,11 +103,11 @@ export function useFieldState({
   return {
     requiredForAttr,
     changeEvent,
-    tag: tagProp === true ? computed(() => props.tag) : { value: 'label' },
+    tag: tagProp ? computed(() => props.tag) : { value: 'label' },
 
     isDark,
 
-    editable: computed(() => props.disable !== true && props.readonly !== true),
+    editable: computed(() => !props.disable && !props.readonly),
 
     innerLoading: ref(false),
     focused: ref(false),
@@ -141,6 +141,20 @@ export function useFieldState({
   }
 }
 
+function getInnerAppendNode(key, content) {
+  return content === null
+    ? null
+    : h(
+        'div',
+        {
+          key,
+          class:
+            'q-field__append q-field__marginal row no-wrap items-center q-anchor--skip'
+        },
+        content
+      )
+}
+
 export default function useField(state) {
   const { props, emit, slots, attrs, proxy } = getCurrentInstance()
   const { $q } = proxy
@@ -173,12 +187,12 @@ export default function useField(state) {
 
   if (state.computedCounter === void 0) {
     state.computedCounter = computed(() => {
-      if (props.counter !== false) {
+      if (props.counter) {
         const len =
           typeof props.modelValue === 'string' ||
           typeof props.modelValue === 'number'
             ? String(props.modelValue).length
-            : Array.isArray(props.modelValue) === true
+            : Array.isArray(props.modelValue)
               ? props.modelValue.length
               : 0
 
@@ -197,39 +211,26 @@ export default function useField(state) {
     state.floatingLabel !== void 0
       ? computed(
           () =>
-            props.stackLabel === true ||
-            state.focused.value === true ||
-            state.floatingLabel.value === true
+            props.stackLabel || state.focused.value || state.floatingLabel.value
         )
       : computed(
-          () =>
-            props.stackLabel === true ||
-            state.focused.value === true ||
-            state.hasValue.value === true
+          () => props.stackLabel || state.focused.value || state.hasValue.value
         )
 
   const shouldRenderBottom = computed(
     () =>
-      props.bottomSlots === true ||
+      props.bottomSlots ||
       props.hint !== void 0 ||
-      hasRules.value === true ||
-      props.counter === true ||
+      hasRules.value ||
+      props.counter ||
       props.error !== null
   )
 
   const styleType = computed(() => {
-    if (props.filled === true) {
-      return 'filled'
-    }
-    if (props.outlined === true) {
-      return 'outlined'
-    }
-    if (props.borderless === true) {
-      return 'borderless'
-    }
-    if (props.standout) {
-      return 'standout'
-    }
+    if (props.filled) return 'filled'
+    if (props.outlined) return 'outlined'
+    if (props.borderless) return 'borderless'
+    if (props.standout) return 'standout'
     return 'standard'
   })
 
@@ -237,25 +238,23 @@ export default function useField(state) {
     () =>
       `q-field row no-wrap items-start q-field--${styleType.value}` +
       (state.fieldClass !== void 0 ? ` ${state.fieldClass.value}` : '') +
-      (props.rounded === true ? ' q-field--rounded' : '') +
-      (props.square === true ? ' q-field--square' : '') +
-      (floatingLabel.value === true ? ' q-field--float' : '') +
-      (hasLabel.value === true ? ' q-field--labeled' : '') +
-      (props.dense === true ? ' q-field--dense' : '') +
-      (props.itemAligned === true ? ' q-field--item-aligned q-item-type' : '') +
-      (state.isDark.value === true ? ' q-field--dark' : '') +
+      (props.rounded ? ' q-field--rounded' : '') +
+      (props.square ? ' q-field--square' : '') +
+      (floatingLabel.value ? ' q-field--float' : '') +
+      (hasLabel.value ? ' q-field--labeled' : '') +
+      (props.dense ? ' q-field--dense' : '') +
+      (props.itemAligned ? ' q-field--item-aligned q-item-type' : '') +
+      (state.isDark.value ? ' q-field--dark' : '') +
       (state.getControl === void 0 ? ' q-field--auto-height' : '') +
-      (state.focused.value === true ? ' q-field--focused' : '') +
-      (hasError.value === true ? ' q-field--error' : '') +
-      (hasError.value === true || state.focused.value === true
-        ? ' q-field--highlighted'
-        : '') +
-      (props.hideBottomSpace !== true && shouldRenderBottom.value === true
+      (state.focused.value ? ' q-field--focused' : '') +
+      (hasError.value ? ' q-field--error' : '') +
+      (hasError.value || state.focused.value ? ' q-field--highlighted' : '') +
+      (!props.hideBottomSpace && shouldRenderBottom.value
         ? ' q-field--with-bottom'
         : '') +
-      (props.disable === true
+      (props.disable
         ? ' q-field--disabled'
-        : props.readonly === true
+        : props.readonly
           ? ' q-field--readonly'
           : '')
   )
@@ -264,25 +263,23 @@ export default function useField(state) {
     () =>
       'q-field__control relative-position row no-wrap' +
       (props.bgColor !== void 0 ? ` bg-${props.bgColor}` : '') +
-      (hasError.value === true
+      (hasError.value
         ? ' text-negative'
         : typeof props.standout === 'string' &&
             props.standout.length !== 0 &&
-            state.focused.value === true
+            state.focused.value
           ? ` ${props.standout}`
           : props.color !== void 0
             ? ` text-${props.color}`
             : '')
   )
 
-  const hasLabel = computed(
-    () => props.labelSlot === true || props.label !== void 0
-  )
+  const hasLabel = computed(() => props.labelSlot || props.label !== void 0)
 
   const labelClass = computed(
     () =>
       'q-field__label no-pointer-events absolute ellipsis' +
-      (props.labelColor !== void 0 && hasError.value !== true
+      (props.labelColor !== void 0 && !hasError.value
         ? ` text-${props.labelColor}`
         : '')
   )
@@ -303,7 +300,7 @@ export default function useField(state) {
       acc.for = state.targetUid.value
     }
 
-    if (props.disable === true) {
+    if (props.disable) {
       acc['aria-disabled'] = 'true'
     }
 
@@ -315,7 +312,7 @@ export default function useField(state) {
     let target = state.targetRef?.value
 
     if (target && (el === null || el.id !== state.targetUid.value)) {
-      if (target.hasAttribute('tabindex') !== true) {
+      if (!target.hasAttribute('tabindex')) {
         target = target.querySelector('[tabindex]')
       }
 
@@ -343,7 +340,7 @@ export default function useField(state) {
       focusoutTimer = null
     }
 
-    if (state.editable.value === true && state.focused.value === false) {
+    if (state.editable.value && !state.focused.value) {
       state.focused.value = true
       emit('focus', e)
     }
@@ -355,16 +352,16 @@ export default function useField(state) {
       focusoutTimer = null
 
       if (
-        document.hasFocus() === true &&
-        (state.hasPopupOpen === true ||
+        document.hasFocus() &&
+        (state.hasPopupOpen ||
           state.controlRef === void 0 ||
           state.controlRef.value === null ||
-          state.controlRef.value.contains(document.activeElement) !== false)
+          state.controlRef.value.contains(document.activeElement))
       ) {
         return
       }
 
-      if (state.focused.value === true) {
+      if (state.focused.value) {
         state.focused.value = false
         emit('blur', e)
       }
@@ -377,10 +374,10 @@ export default function useField(state) {
     // prevent activating the field but keep focus on desktop
     stopAndPrevent(e)
 
-    if ($q.platform.is.mobile !== true) {
+    if (!$q.platform.is.mobile) {
       const el = state.targetRef?.value || state.rootRef.value
       el.focus()
-    } else if (state.rootRef.value.contains(document.activeElement) === true) {
+    } else if (state.rootRef.value.contains(document.activeElement)) {
       document.activeElement.blur()
     }
 
@@ -392,7 +389,7 @@ export default function useField(state) {
     }
 
     emit('update:modelValue', null)
-    if (state.changeEvent === true) emit('change', null)
+    if (state.changeEvent) emit('change', null)
     emit('clear', props.modelValue)
 
     nextTick(() => {
@@ -435,7 +432,7 @@ export default function useField(state) {
       )
     )
 
-    if (hasError.value === true && props.noErrorIcon === false) {
+    if (hasError.value && !props.noErrorIcon) {
       node.push(
         getInnerAppendNode('error', [
           h(QIcon, { name: $q.iconSet.field.error, color: 'negative' })
@@ -443,7 +440,7 @@ export default function useField(state) {
       )
     }
 
-    if (props.loading === true || state.innerLoading.value === true) {
+    if (props.loading || state.innerLoading.value) {
       node.push(
         getInnerAppendNode(
           'inner-loading-append',
@@ -453,9 +450,9 @@ export default function useField(state) {
         )
       )
     } else if (
-      props.clearable === true &&
-      state.hasValue.value === true &&
-      state.editable.value === true
+      props.clearable &&
+      state.hasValue.value &&
+      state.editable.value
     ) {
       node.push(
         getInnerAppendNode('inner-clearable-append', [
@@ -513,11 +510,11 @@ export default function useField(state) {
       )
     }
 
-    if (state.getShadowControl !== void 0 && state.hasShadow.value === true) {
+    if (state.getShadowControl !== void 0 && state.hasShadow.value) {
       node.push(state.getShadowControl())
     }
 
-    if (hasLabel.value === true) {
+    if (hasLabel.value) {
       node.push(
         h(
           'div',
@@ -544,7 +541,7 @@ export default function useField(state) {
             class: 'q-field__native row',
             tabindex: -1,
             ...state.splitAttrs.attributes.value,
-            'data-autofocus': props.autofocus === true || void 0
+            'data-autofocus': props.autofocus || void 0
           },
           slots.control(controlSlotScope.value)
         )
@@ -563,13 +560,14 @@ export default function useField(state) {
       )
     }
 
+    // oxlint-disable-next-line unicorn/prefer-spread
     return node.concat(hSlot(slots.default))
   }
 
   function getBottom() {
     let msg, key
 
-    if (hasError.value === true) {
+    if (hasError.value) {
       if (errorMessage.value !== null) {
         msg = [h('div', { role: 'alert' }, errorMessage.value)]
         key = `q--slot-error-${errorMessage.value}`
@@ -577,7 +575,7 @@ export default function useField(state) {
         msg = hSlot(slots.error)
         key = 'q--slot-error'
       }
-    } else if (props.hideHint !== true || state.focused.value === true) {
+    } else if (!props.hideHint || state.focused.value) {
       if (props.hint !== void 0) {
         msg = [h('div', props.hint)]
         key = `q--slot-hint-${props.hint}`
@@ -587,13 +585,9 @@ export default function useField(state) {
       }
     }
 
-    const hasCounter = props.counter === true || slots.counter !== void 0
+    const hasCounter = props.counter || slots.counter !== void 0
 
-    if (
-      props.hideBottomSpace === true &&
-      hasCounter === false &&
-      msg === void 0
-    ) {
+    if (props.hideBottomSpace && !hasCounter && msg === void 0) {
       return
     }
 
@@ -611,15 +605,15 @@ export default function useField(state) {
       {
         class:
           'q-field__bottom row items-start q-field__bottom--' +
-          (props.hideBottomSpace !== true ? 'animated' : 'stale'),
+          (props.hideBottomSpace ? 'stale' : 'animated'),
         onClick: prevent
       },
       [
-        props.hideBottomSpace === true
+        props.hideBottomSpace
           ? main
           : h(Transition, { name: 'q-transition--field-message' }, () => main),
 
-        hasCounter === true
+        hasCounter
           ? h(
               'div',
               {
@@ -634,20 +628,6 @@ export default function useField(state) {
     )
   }
 
-  function getInnerAppendNode(key, content) {
-    return content === null
-      ? null
-      : h(
-          'div',
-          {
-            key,
-            class:
-              'q-field__append q-field__marginal row no-wrap items-center q-anchor--skip'
-          },
-          content
-        )
-  }
-
   let shouldActivate = false
 
   onDeactivated(() => {
@@ -655,12 +635,12 @@ export default function useField(state) {
   })
 
   onActivated(() => {
-    if (shouldActivate === true && props.autofocus === true) {
+    if (shouldActivate && props.autofocus) {
       proxy.focus()
     }
   })
 
-  if (props.autofocus === true) {
+  if (props.autofocus) {
     onMounted(() => {
       proxy.focus()
     })
@@ -678,7 +658,7 @@ export default function useField(state) {
       state.getControl === void 0 && slots.control === void 0
         ? {
             ...state.splitAttrs.attributes.value,
-            'data-autofocus': props.autofocus === true || void 0,
+            'data-autofocus': props.autofocus || void 0,
             ...attributes.value
           }
         : attributes.value
@@ -721,7 +701,7 @@ export default function useField(state) {
               getContent()
             ),
 
-            shouldRenderBottom.value === true ? getBottom() : null
+            shouldRenderBottom.value ? getBottom() : null
           ]
         ),
 

package/src/composables/private.use-file/use-file-dom-props.js

@@ -13,7 +13,7 @@ export default function useFileDomProps(props, typeGuard) {
             : void 0
 
       if (Object(model) === model) {
-        ;('length' in model ? Array.from(model) : [model]).forEach(file => {
+        ;('length' in model ? [...model] : [model]).forEach(file => {
           dt.items.add(file)
         })
       }
@@ -28,7 +28,7 @@ export default function useFileDomProps(props, typeGuard) {
     }
   }
 
-  return typeGuard === true
+  return typeGuard
     ? computed(() => {
         if (props.type !== 'file') return
         return getFormDomProps()