‚̧Nocturnal Parakeet Monitor
    Wondering what‚Äôs next for npm?Check out our public roadmap! ¬Ľ

    transition-timing
    TypeScript icon, indicating that this package has built-in type declarations

    1.1.0¬†‚Äʬ†Public¬†‚Äʬ†Published

    Transition Timing Functions

    This library provides convenient methods that generating a transition timing function such as easing or steps.

    Installation

    npm install transition-timing
    import { easing } from 'transition-timing';
     
    const ease = easing('ease');

    Usage

    TimingFunction

    /**
     * Timing function type.
     *
     * @param {number} t time ratio. from 0 to 1.
     * @returns {number} output ratio. from 0 to 1.
     */
    type TimingFunction = (t: number) => number;

    cubicBezier

    This is method that renamed from the bezier-easing.

    function cubicBezier(mX1: number, mY1: number, mX2: number, mY2: number): TimingFunction;

    easing

    This is helper method for cubicBezier.

    function easing(arg: string|number|[number, number, number, number], ...args: number[]): TimingFunction;

    Examples

    Please see information for keywords for common timing functions

    // using same as cubicBezier.
    let ease = easing(0.25, 0.1, 0.25, 1);
    let easeIn = easing([0.42, 0, 1, 1]);
     
    // also can using by common keywords.
    // common keywords: 'linear', 'ease', 'easeIn', 'easeOut' and 'easeInOut'.
    let easeOut = easing('easeOut');

    steps

    Please see information for the steps timing functions

    function steps(num: number, direction: 'start'|'end'): TimingFunction;

    References

    License

    The MIT License

    Install

    npm i transition-timing

    DownloadsWeekly Downloads

    4

    Version

    1.1.0

    License

    MIT

    Unpacked Size

    40.8 kB

    Total Files

    21

    Last publish

    Collaborators

    • avatar