react-decode-animation/dist/esm/components/DecodeAnimationCharacter.js

Decode effect typing animation for React

import React, { useEffect, useState } from "react";
import { CharacterList } from "../CharacterList";
export function DecodeAnimationCharacter({ isPlaying, loopString, options = { intervalDeviation: 10, interval: 100 }, }) {
    const code = CharacterList.generateCode(loopString);
    const minInterval = options.interval - (options.intervalDeviation || 50);
    const maxInterval = options.interval + (options.intervalDeviation || 50);
    const interval = Math.random() * (maxInterval - minInterval) + minInterval;
    let intervalId;
    const [character, setCharacter] = useState(`${code.next().value}`);
    const clear = () => {
        clearInterval(intervalId);
    };
    useEffect(() => {
        if (isPlaying) {
            intervalId = setInterval(() => {
                setCharacter(`${code.next().value}`);
            }, interval);
        }
        else {
            clear();
        }
        return clear;
    }, [isPlaying]);
    return React.createElement(React.Fragment, null, character);
}
//# sourceMappingURL=DecodeAnimationCharacter.js.map