magnifuer/dist/composables/useMagnifuerScale.d.ts

Feature-rich Vue component and tooling for creating customizable magnifying-glass-style interfaces with ease.

import { MaybeRefOrGetter, Ref } from 'vue';
export interface UseMagnifuerScaleOptions {
    /**
     * Minimal scale value
     *
     * @default 1
     */
    min?: MaybeRefOrGetter<number | undefined>;
    /**
     * Maximal scale value
     *
     * @default 10
     */
    max?: MaybeRefOrGetter<number | undefined>;
    /**
     * Speed value for the default scale step function
     *
     * @default 1.3
     */
    speed?: MaybeRefOrGetter<number | undefined>;
    /**
     * Scale computation function on step
     *
     * @param current Current scale
     * @param direction Step direction (±1)
     * @returns The new scale value
     * @default (current, direction) => current * Math.pow(speed, direction)
     */
    step?: (current: number, direction: number) => number;
}
export interface UseMagnifuerScaleReturn {
    /**
     * Safe-guarded scale guaranteed to be within limits
     */
    scale: Ref<number>;
    /**
     * Alter the scale
     *
     * @param value Altering direction (±1)
     */
    alter: (value: number) => void;
    /**
     * Callback for the `wheel` event which automatically triggers the altering
     * and blocks native scrolling
     *
     * @param event
     */
    onWheel: (event: WheelEvent) => void;
}
/**
 * Utility composable for controlling the scale value of a magnifier.
 * Keeps the scale within limits and provides callbacks to alter it.
 *
 * @param scale Raw scale value
 * @param options Additional options
 */
declare function useMagnifuerScale(scale: Ref<number>, options?: UseMagnifuerScaleOptions): UseMagnifuerScaleReturn;
export default useMagnifuerScale;