Skip to content

⬅️ Back to Table of Contents

📄 index.ts

📊 Analysis Summary

Metric Count
🔧 Functions 1
📦 Imports 3
🟢 Vue Composition API 1
📑 Type Aliases 1

📚 Table of Contents

🛠️ File Location:

📂 packages/core/usePreferredContrast/index.ts

📦 Imports

Name Source
ConfigurableWindow ../_configurable
computed vue
useMediaQuery ../useMediaQuery

Vue Composition API

Name Type Reactive Variables Composables
computed computed none none

Functions

usePreferredContrast(options: ConfigurableWindow): any

Code
export function usePreferredContrast(options?: ConfigurableWindow) {
  const isMore = useMediaQuery('(prefers-contrast: more)', options)
  const isLess = useMediaQuery('(prefers-contrast: less)', options)
  const isCustom = useMediaQuery('(prefers-contrast: custom)', options)

  return computed<ContrastType>(() => {
    if (isMore.value)
      return 'more'
    if (isLess.value)
      return 'less'
    if (isCustom.value)
      return 'custom'
    return 'no-preference'
  })
}
  • JSDoc:

    /**
     * Reactive prefers-contrast media query.
     *
     * @see https://vueuse.org/usePreferredContrast
     * @param [options]
     */
    

  • Parameters:

  • options: ConfigurableWindow
  • Return Type: any
  • Calls:
  • useMediaQuery (from ../useMediaQuery)
  • computed (from vue)

Type Aliases

ContrastType

type ContrastType = 'more' | 'less' | 'custom' | 'no-preference';