📄 `filters.ts`¶

📊 Analysis Summary¶

Metric	Count
🔧 Functions	14
📦 Imports	11
📊 Variables & Constants	14
⚡ Async/Await Patterns	5
📐 Interfaces	5
📑 Type Aliases	2

📚 Table of Contents¶

Imports
Variables & Constants
Async/Await Patterns
Functions
Interfaces
Type Aliases

🛠️ File Location:¶

📂 packages/shared/utils/filters.ts

📦 Imports¶

Name	Source
`MaybeRefOrGetter`	`vue`
`AnyFn`	`./types`
`ArgumentsType`	`./types`
`Awaited`	`./types`
`Pausable`	`./types`
`Promisify`	`./types`
`isRef`	`vue`
`readonly`	`vue`
`toValue`	`vue`
`toRef`	`../toRef`
`noop`	`./is`

Variables & Constants¶

Name	Type	Kind	Value	Exported
`timer`	`ReturnType<typeof setTimeout> \| undefined`	let/var	`not shown`	✗
`maxTimer`	`ReturnType<typeof setTimeout> \| undefined \| null`	let/var	`not shown`	✗
`lastRejector`	`AnyFn`	let/var	`noop`	✗
`lastInvoker`	`() => void`	let/var	`not shown`	✗
`lastExec`	`number`	let/var	`0`	✗
`timer`	`ReturnType<typeof setTimeout> \| undefined`	let/var	`not shown`	✗
`isLeading`	`boolean`	let/var	`true`	✗
`lastRejector`	`AnyFn`	let/var	`noop`	✗
`lastValue`	`any`	let/var	`not shown`	✗
`ms`	`MaybeRefOrGetter<number>`	let/var	`not shown`	✗
`trailing`	`boolean`	let/var	`not shown`	✗
`leading`	`boolean`	let/var	`not shown`	✗
`rejectOnCancel`	`boolean`	let/var	`not shown`	✗
`elapsed`	`number`	const	`Date.now() - lastExec`	✗

Async/Await Patterns¶

Type	Function	Await Expressions	Promise Chains
promise-chain	`createFilterWrapper`	none	new Promise(...), Promise.resolve(filter(() => fn.apply(this, args), { fn, thisArg: this, args }))
.then(resolve).catch, Promise.resolve(filter(() => fn.apply(this, args), { fn, thisArg: this, args })).then, Promise.resolve
promise-chain	`wrapper`	none	new Promise(...), Promise.resolve(filter(() => fn.apply(this, args), { fn, thisArg: this, args }))
.then(resolve).catch, Promise.resolve(filter(() => fn.apply(this, args), { fn, thisArg: this, args })).then, Promise.resolve
promise-chain	`debounceFilter`	none	Promise.resolve, new Promise(...)
promise-chain	`filter`	none	Promise.resolve, new Promise(...)
promise-chain	`filter`	none	new Promise(...)

Functions¶

`createFilterWrapper(filter: EventFilter, fn: T): (this: any, ...args: ArgumentsType<T>) => Promise<Awaited<ReturnType<T>>>`¶

Code

export function createFilterWrapper<T extends AnyFn>(filter: EventFilter, fn: T) {
  function wrapper(this: any, ...args: ArgumentsType<T>) {
    return new Promise<Awaited<ReturnType<T>>>((resolve, reject) => {
      // make sure it's a promise
      Promise.resolve(filter(() => fn.apply(this, args), { fn, thisArg: this, args }))
        .then(resolve)
        .catch(reject)
    })
  }

  return wrapper
}

JSDoc:
```
/**
 * @internal
 */
```
Parameters:
filter: EventFilter
fn: T
Return Type: (this: any, ...args: ArgumentsType<T>) => Promise<Awaited<ReturnType<T>>>
Calls:
Promise.resolve(filter(() => fn.apply(this, args), { fn, thisArg: this, args })) .then(resolve) .catch
Internal Comments:
```
// make sure it's a promise (x8)
```

`wrapper(this: any, args: ArgumentsType<T>): Promise<Awaited<ReturnType<T>>>`¶

Code

function wrapper(this: any, ...args: ArgumentsType<T>) {
    return new Promise<Awaited<ReturnType<T>>>((resolve, reject) => {
      // make sure it's a promise
      Promise.resolve(filter(() => fn.apply(this, args), { fn, thisArg: this, args }))
        .then(resolve)
        .catch(reject)
    })
  }

Parameters:
this: any
args: ArgumentsType<T>
Return Type: Promise<Awaited<ReturnType<T>>>
Calls:
Promise.resolve(filter(() => fn.apply(this, args), { fn, thisArg: this, args })) .then(resolve) .catch
Internal Comments:
```
// make sure it's a promise (x8)
```

`bypassFilter(invoke: AnyFn): any`¶

Code

(invoke) => {
  return invoke()
}

Parameters:
invoke: AnyFn
Return Type: any
Calls:
invoke

`debounceFilter(ms: MaybeRefOrGetter<number>, options: DebounceFilterOptions): EventFilter<any[], any, AnyFn>`¶

Code

export function debounceFilter(ms: MaybeRefOrGetter<number>, options: DebounceFilterOptions = {}) {
  let timer: ReturnType<typeof setTimeout> | undefined
  let maxTimer: ReturnType<typeof setTimeout> | undefined | null
  let lastRejector: AnyFn = noop

  const _clearTimeout = (timer: ReturnType<typeof setTimeout>) => {
    clearTimeout(timer)
    lastRejector()
    lastRejector = noop
  }

  let lastInvoker: () => void

  const filter: EventFilter = (invoke) => {
    const duration = toValue(ms)
    const maxDuration = toValue(options.maxWait)

    if (timer)
      _clearTimeout(timer)

    if (duration <= 0 || (maxDuration !== undefined && maxDuration <= 0)) {
      if (maxTimer) {
        _clearTimeout(maxTimer)
        maxTimer = null
      }
      return Promise.resolve(invoke())
    }

    return new Promise((resolve, reject) => {
      lastRejector = options.rejectOnCancel ? reject : resolve
      lastInvoker = invoke
      // Create the maxTimer. Clears the regular timer on invoke
      if (maxDuration && !maxTimer) {
        maxTimer = setTimeout(() => {
          if (timer)
            _clearTimeout(timer)
          maxTimer = null
          resolve(lastInvoker())
        }, maxDuration)
      }

      // Create the regular timer. Clears the max timer on invoke
      timer = setTimeout(() => {
        if (maxTimer)
          _clearTimeout(maxTimer)
        maxTimer = null
        resolve(invoke())
      }, duration)
    })
  }

  return filter
}

JSDoc:

/**
 * Create an EventFilter that debounce the events
 */

Parameters:
ms: MaybeRefOrGetter<number>
options: DebounceFilterOptions
Return Type: EventFilter<any[], any, AnyFn>
Calls:
clearTimeout
lastRejector
toValue (from vue)
_clearTimeout
Promise.resolve
invoke
setTimeout
resolve
lastInvoker

Internal Comments:

// Create the maxTimer. Clears the regular timer on invoke
// Create the regular timer. Clears the max timer on invoke (x3)

`_clearTimeout(timer: ReturnType<typeof setTimeout>): void`¶

Code

(timer: ReturnType<typeof setTimeout>) => {
    clearTimeout(timer)
    lastRejector()
    lastRejector = noop
  }

Parameters:
timer: ReturnType<typeof setTimeout>
Return Type: void
Calls:
clearTimeout
lastRejector

`filter(invoke: AnyFn): Promise<any>`¶

Code

(invoke) => {
    const duration = toValue(ms)
    const maxDuration = toValue(options.maxWait)

    if (timer)
      _clearTimeout(timer)

    if (duration <= 0 || (maxDuration !== undefined && maxDuration <= 0)) {
      if (maxTimer) {
        _clearTimeout(maxTimer)
        maxTimer = null
      }
      return Promise.resolve(invoke())
    }

    return new Promise((resolve, reject) => {
      lastRejector = options.rejectOnCancel ? reject : resolve
      lastInvoker = invoke
      // Create the maxTimer. Clears the regular timer on invoke
      if (maxDuration && !maxTimer) {
        maxTimer = setTimeout(() => {
          if (timer)
            _clearTimeout(timer)
          maxTimer = null
          resolve(lastInvoker())
        }, maxDuration)
      }

      // Create the regular timer. Clears the max timer on invoke
      timer = setTimeout(() => {
        if (maxTimer)
          _clearTimeout(maxTimer)
        maxTimer = null
        resolve(invoke())
      }, duration)
    })
  }

Parameters:
invoke: AnyFn
Return Type: Promise<any>
Calls:
toValue (from vue)
_clearTimeout
Promise.resolve
invoke
setTimeout
resolve
lastInvoker

Internal Comments:

// Create the maxTimer. Clears the regular timer on invoke
// Create the regular timer. Clears the max timer on invoke (x3)

`throttleFilter(ms: MaybeRefOrGetter<number>, trailing: boolean, leading: boolean, rejectOnCancel: boolean): EventFilter`¶

Code

export function throttleFilter(ms: MaybeRefOrGetter<number>, trailing?: boolean, leading?: boolean, rejectOnCancel?: boolean): EventFilter

JSDoc:

/**
 * Create an EventFilter that throttle the events
 *
 * @param ms
 * @param [trailing]
 * @param [leading]
 * @param [rejectOnCancel]
 */

Parameters:
ms: MaybeRefOrGetter<number>
trailing: boolean
leading: boolean
rejectOnCancel: boolean
Return Type: EventFilter

`clear(): void`¶

Code

() => {
    if (timer) {
      clearTimeout(timer)
      timer = undefined
      lastRejector()
      lastRejector = noop
    }
  }

Return Type: void
Calls:
clearTimeout
lastRejector

`filter(_invoke: AnyFn): any`¶

Code

(_invoke) => {
    const duration = toValue(ms)
    const elapsed = Date.now() - lastExec
    const invoke = () => {
      return lastValue = _invoke()
    }

    clear()

    if (duration <= 0) {
      lastExec = Date.now()
      return invoke()
    }

    if (elapsed > duration && (leading || !isLeading)) {
      lastExec = Date.now()
      invoke()
    }
    else if (trailing) {
      lastValue = new Promise((resolve, reject) => {
        lastRejector = rejectOnCancel ? reject : resolve
        timer = setTimeout(() => {
          lastExec = Date.now()
          isLeading = true
          resolve(invoke())
          clear()
        }, Math.max(0, duration - elapsed))
      })
    }

    if (!leading && !timer)
      timer = setTimeout(() => isLeading = true, duration)

    isLeading = false
    return lastValue
  }

Parameters:
_invoke: AnyFn
Return Type: any
Calls:
toValue (from vue)
Date.now
_invoke
clear
invoke
setTimeout
resolve
Math.max

`invoke(): any`¶

Code

() => {
      return lastValue = _invoke()
    }

Return Type: any
Calls:
_invoke

`pausableFilter(extendFilter: EventFilter, options: PausableFilterOptions): Pausable & { eventFilter: EventFilter }`¶

Code

export function pausableFilter(extendFilter: EventFilter = bypassFilter, options: PausableFilterOptions = {}): Pausable & { eventFilter: EventFilter } {
  const {
    initialState = 'active',
  } = options

  const isActive = toRef(initialState === 'active')

  function pause() {
    isActive.value = false
  }
  function resume() {
    isActive.value = true
  }

  const eventFilter: EventFilter = (...args) => {
    if (isActive.value)
      extendFilter(...args)
  }

  return { isActive: readonly(isActive), pause, resume, eventFilter }
}

JSDoc:

/**
 * EventFilter that gives extra controls to pause and resume the filter
 *
 * @param extendFilter  Extra filter to apply when the PausableFilter is active, default to none
 * @param options Options to configure the filter
 */

Parameters:
extendFilter: EventFilter
options: PausableFilterOptions
Return Type: Pausable & { eventFilter: EventFilter }
Calls:
toRef (from ../toRef)
extendFilter
readonly (from vue)

`pause(): void`¶

Code

function pause() {
    isActive.value = false
  }

Return Type: void

`resume(): void`¶

Code

function resume() {
    isActive.value = true
  }

Return Type: void

`eventFilter(args: [invoke: AnyFn, options: FunctionWrapperOptions<any[], any>]): void`¶

Code

(...args) => {
    if (isActive.value)
      extendFilter(...args)
  }

Parameters:
args: [invoke: AnyFn, options: FunctionWrapperOptions<any[], any>]
Return Type: void
Calls:
extendFilter

Interfaces¶

`FunctionWrapperOptions<Args extends any[] = any[], This = any>`¶

Interface Code

export interface FunctionWrapperOptions<Args extends any[] = any[], This = any> {
  fn: FunctionArgs<Args, This>
  args: Args
  thisArg: This
}

Properties¶

Name	Type	Optional
`fn`	`FunctionArgs<Args, This>`	✗
`args`	`Args`	✗
`thisArg`	`This`	✗

`ConfigurableEventFilter`¶

Interface Code

export interface ConfigurableEventFilter {
  /**
   * Filter for if events should to be received.
   *
   * @see https://vueuse.org/guide/config.html#event-filters
   */
  eventFilter?: EventFilter
}

Properties¶

Name	Type	Optional	Description
`eventFilter`	`EventFilter`	✓

`DebounceFilterOptions`¶

Interface Code

export interface DebounceFilterOptions {
  /**
   * The maximum time allowed to be delayed before it's invoked.
   * In milliseconds.
   */
  maxWait?: MaybeRefOrGetter<number>

  /**
   * Whether to reject the last call if it's been cancel.
   *
   * @default false
   */
  rejectOnCancel?: boolean
}

Properties¶

Name	Type	Optional	Description
`maxWait`	`MaybeRefOrGetter<number>`	✓
`rejectOnCancel`	`boolean`	✓

`ThrottleFilterOptions`¶

Interface Code

export interface ThrottleFilterOptions {
  /**
   * The maximum time allowed to be delayed before it's invoked.
   */
  delay: MaybeRefOrGetter<number>
  /**
   * Whether to invoke on the trailing edge of the timeout.
   */
  trailing?: boolean
  /**
   * Whether to invoke on the leading edge of the timeout.
   */
  leading?: boolean
  /**
   * Whether to reject the last call if it's been cancel.
   */
  rejectOnCancel?: boolean
}

Properties¶

Name	Type	Optional
`delay`	`MaybeRefOrGetter<number>`	✗
`trailing`	`boolean`	✓
`leading`	`boolean`	✓
`rejectOnCancel`	`boolean`	✓

`PausableFilterOptions`¶

Interface Code

export interface PausableFilterOptions {
  /**
   * The initial state
   *
   * @default 'active'
   */
  initialState?: 'active' | 'paused'
}

Properties¶

Name	Type	Optional	Description
`initialState`	`'active' \| 'paused'`	✓

Type Aliases¶

`FunctionArgs<Args extends any[] = any[] extends any[] = any[], Return = void = void>`¶

type FunctionArgs<Args extends any[] = any[] extends any[] = any[], Return = void = void> = (...args: Args) => Return;

`EventFilter<Args extends any[] = any[] extends any[] = any[], This = any = any, Invoke extends AnyFn = AnyFn extends AnyFn = AnyFn>`¶

type EventFilter<Args extends any[] = any[] extends any[] = any[], This = any = any, Invoke extends AnyFn = AnyFn extends AnyFn = AnyFn> = (
  invoke: Invoke,
  options: FunctionWrapperOptions<Args, This>
) => ReturnType<Invoke> | Promisify<ReturnType<Invoke>>;

📄 filters.ts¶

📊 Analysis Summary¶

📚 Table of Contents¶

🛠️ File Location:¶

📦 Imports¶

Variables & Constants¶

Async/Await Patterns¶

Functions¶

createFilterWrapper(filter: EventFilter, fn: T): (this: any, ...args: ArgumentsType<T>) => Promise<Awaited<ReturnType<T>>>¶

wrapper(this: any, args: ArgumentsType<T>): Promise<Awaited<ReturnType<T>>>¶

bypassFilter(invoke: AnyFn): any¶

debounceFilter(ms: MaybeRefOrGetter<number>, options: DebounceFilterOptions): EventFilter<any[], any, AnyFn>¶

_clearTimeout(timer: ReturnType<typeof setTimeout>): void¶

filter(invoke: AnyFn): Promise<any>¶

throttleFilter(ms: MaybeRefOrGetter<number>, trailing: boolean, leading: boolean, rejectOnCancel: boolean): EventFilter¶

clear(): void¶

filter(_invoke: AnyFn): any¶

invoke(): any¶

pausableFilter(extendFilter: EventFilter, options: PausableFilterOptions): Pausable & { eventFilter: EventFilter }¶

pause(): void¶

resume(): void¶

eventFilter(args: [invoke: AnyFn, options: FunctionWrapperOptions<any[], any>]): void¶

Interfaces¶

FunctionWrapperOptions<Args extends any[] = any[], This = any>¶

Properties¶

ConfigurableEventFilter¶

Properties¶

DebounceFilterOptions¶

Properties¶

ThrottleFilterOptions¶

Properties¶

PausableFilterOptions¶

Properties¶

Type Aliases¶

FunctionArgs<Args extends any[] = any[] extends any[] = any[], Return = void = void>¶

EventFilter<Args extends any[] = any[] extends any[] = any[], This = any = any, Invoke extends AnyFn = AnyFn extends AnyFn = AnyFn>¶

📄 `filters.ts`¶

`createFilterWrapper(filter: EventFilter, fn: T): (this: any, ...args: ArgumentsType<T>) => Promise<Awaited<ReturnType<T>>>`¶

`wrapper(this: any, args: ArgumentsType<T>): Promise<Awaited<ReturnType<T>>>`¶

`bypassFilter(invoke: AnyFn): any`¶

`debounceFilter(ms: MaybeRefOrGetter<number>, options: DebounceFilterOptions): EventFilter<any[], any, AnyFn>`¶

`_clearTimeout(timer: ReturnType<typeof setTimeout>): void`¶

`filter(invoke: AnyFn): Promise<any>`¶

`throttleFilter(ms: MaybeRefOrGetter<number>, trailing: boolean, leading: boolean, rejectOnCancel: boolean): EventFilter`¶

`clear(): void`¶

`filter(_invoke: AnyFn): any`¶

`invoke(): any`¶

`pausableFilter(extendFilter: EventFilter, options: PausableFilterOptions): Pausable & { eventFilter: EventFilter }`¶

`pause(): void`¶

`resume(): void`¶

`eventFilter(args: [invoke: AnyFn, options: FunctionWrapperOptions<any[], any>]): void`¶

`FunctionWrapperOptions<Args extends any[] = any[], This = any>`¶

`ConfigurableEventFilter`¶

`DebounceFilterOptions`¶

`ThrottleFilterOptions`¶

`PausableFilterOptions`¶

`FunctionArgs<Args extends any[] = any[] extends any[] = any[], Return = void = void>`¶

`EventFilter<Args extends any[] = any[] extends any[] = any[], This = any = any, Invoke extends AnyFn = AnyFn extends AnyFn = AnyFn>`¶