in-typing/dist/cjs/index.js

Typing Animation Component for React

"use strict";var e=require("react/jsx-runtime"),t=require("react");module.exports=function({type:r,backspace:s,delay:n,duration:i,cursor:u}){const l="string"==typeof r?[r]:r,a="number"==typeof s?[s]:s,c=i||100,o=n||c,[f,g]=t.useState(new Array(l.length).fill("")),[h,d]=t.useState(0),[m,p]=t.useState(!1),[y,b]=t.useState(!0);return t.useEffect(()=>{const e=setInterval(()=>{if(h<l.length&&!m){if(f[h]!==l[h]){const e=[...f];e[h]=l[h].substring(0,f[h].length+1),g(e),b(!0)}else if(f[h]===l[h]){if(a?.includes(h)){clearInterval(e);const t=setTimeout(()=>{p(!0)},o);return()=>{clearTimeout(t)}}d(h+1)}}else if(h<l.length&&m)if(f[h].length){const e=[...f];e[h]=l[h].substring(0,f[h].length-1),g(e),b(!0)}else p(!1),d(h+1)},c);return()=>{clearInterval(e)}},[f,h,m]),t.useEffect(()=>(setTimeout(()=>{b(!y)},500),()=>{}),[y]),e.jsx("h1",{style:y&&u?{borderRight:`1px solid ${u}`,marginRight:"-1px"}:{},children:f})};