@types/react-scramble v0.4.5

Installation

npm install --save @types/react-scramble

Summary

This package contains type definitions for react-scramble (https://github.com/cettoana/react-scramble#readme).

Details

Files were exported from https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/react-scramble.

index.d.ts

// Type definitions for react-scramble 0.4
// Project: https://github.com/cettoana/react-scramble#readme
// Definitions by: fes300 <https://github.com/fes300>
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped

import * as React from 'react';

export interface Step {
    /**
     * Action of the step, + as scramble, - as descramble and leave blank to do nothing.
     */
    action: '+' | '-';
    /**
     * Times of action in the step.
     */
    roll?: number | undefined;
    /**
     * Change the original text.
     */
    text?: string | undefined;
    /**
     * Scramble/descrmble type of the step.
     */
    type?: 'all' | 'random' | 'forward' | undefined;
}

export interface AnimationControls {
    start: () => void;
    pause: () => void;
}

export interface Props {
    /**
     * Set true to auto start animation after render.
     */
    autoStart?: boolean | undefined;
    /**
     * Scramble the text after render.
     */
    preScramble?: boolean | undefined;
    /**
     * Speed of scramble per second.
     */
    speed?: 'slow' | 'medium' | 'fast' | undefined;
    /**
     * Original text.
     */
    text: string;
    /**
     * Scramble steps, a list of Object in Step format.
     */
    steps: Step[];
    /**
     * Using no-break space or not.
     */
    noBreakSpace?: boolean | undefined;
    /**
     * Event trigger type when mouse enter.
     */
    mouseEnterTrigger?: 'start' | 'pause' | 'reset' | 'restart' | undefined;
    /**
     * Event trigger type when mouse leave.
     */
    mouseLeaveTrigger?: 'start' | 'pause' | 'reset' | 'restart' | undefined;
    /**
     * Method binding callback function.
     */
    bindMethod?: ((c: AnimationControls) => void) | undefined;
}

/**
 * @example
 * ```
 * import React from 'react'
 * import Scramble from 'react-scramble'
 *
 * class App extends React.Component {
 *   render() {
 *    return (
 *      <Scramble
 *        autoStart
 *        text="Scramble me!"
 *        steps={[
 *          {
 *            roll: 10,
 *            action: '+',
 *            type: 'all',
 *          },
 *          {
 *            action: '-',
 *            type: 'forward',
 *          },
 *        ]}
 *      />
 *    )
 *  }
 * }
 * ```
 */
declare const Scramble: React.FC<Props>;

export default Scramble;

Additional Details

• Last updated: Thu, 08 Jul 2021 22:41:30 GMT
• Dependencies: @types/react
• Global values: none

Credits

These definitions were written by fes300.