usePointer

Category

Sensors

Export Size

475 B

Last Changed

5 days ago

Reactive pointer state

Demo

Basic Usage

import { usePointer } from '@reause/core'

const { x, y, pressure, pointerType, isInside } = usePointer()

// only let `pen` pointers update the state
const pen = usePointer({ pointerTypes: ['pen'] })

Type Declarations

export type PointerType = 'mouse' | 'touch' | 'pen'

export interface UsePointerState {
    x: number;
    y: number;
    pointerId: number;
    pressure: number;
    tiltX: number;
    tiltY: number;
    width: number;
    height: number;
    twist: number;
    pointerType: PointerType | null;
}

export interface UsePointerOptions extends ConfigurableWindow {
    pointerTypes?: PointerType[];
    initialValue?: Partial<UsePointerState>;
    target?: RefObject<EventTarget | null | undefined>;
}

export interface UsePointerReturn extends UsePointerState {
    isInside: boolean;
}

export function usePointer(options?: UsePointerOptions): UsePointerReturn

Source

Source · Demo · VueUse

Contributors

Changelog

v0.1.0 on

e608a - feat(ci): align CI, packaging and release with VueUse

7a57e - fix(core): resolve usePointer audit findings (#618)