UNPKG

cm-typing-effect

Version:

Typing animation effect for web elements with customizable caret and timing.

64 lines (61 loc) 2.08 kB
interface StartTypingOptions { /** Time in milliseconds before typing animation starts. * (Caret will be blinking alone during this.) * Default: `0` */ startDelay?: number; /** Time in milliseconds before typing animation ends. * (Caret will be blinking during this.) * Default: `0` */ endDelay?: number; /** Caret blinks only when typing stops. * Default: `false` */ realisticTyping?: boolean; /** Keep the caret blinking after typing ends. * Default: `false` */ keepCaretBlinkingAfterEnd?: boolean; /** Total duration (in ms) for typing animation. * Default: `1000` */ animationTime?: number; /** Custom character for the caret. * Default: `"|"` */ caret?: string; /** Speed of the caret blinking in blinks per second. * Default: `1.6` */ caretBlinkingSpeed?: number; /** Make caret take space of the target element. * Default `false` */ caretTakeSpace?: boolean; /** Horizontal caret offset in px. * Can't be used with "caretTakeSpace: true". * Default `0` */ caretOffset?: number; /** Make a erase animation. * Default `false` */ eraseMode?: boolean; } /** * Starts a typing animation on a given HTML element or element ID. * Requires text content with a monospaced font, no full-width characters and * no tags inside target element. * * `Tip`: To keep the target element hidden before the animation starts, * use `visibility: hidden` on it. * * @param target - HTML element or ID of the element where * the typing animation will occur. * @param options - Configuration object for the typing animation. * @returns A Promise<void> that resolves when the animation is complete. * */ declare const startTyping: (target: HTMLElement | string, { startDelay, endDelay, realisticTyping, keepCaretBlinkingAfterEnd, animationTime, caret, caretBlinkingSpeed, caretTakeSpace, caretOffset, eraseMode }?: StartTypingOptions) => Promise<void>; export { startTyping };