typewriter-text-effect/dist/index.mjs

Simple typewriter text animation in JS/TS

var u=Object.defineProperty;var a=Object.getOwnPropertySymbols;var d=Object.prototype.hasOwnProperty,m=Object.prototype.propertyIsEnumerable;var h=(i,t,e)=>t in i?u(i,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):i[t]=e,l=(i,t)=>{for(var e in t||(t={}))d.call(t,e)&&h(i,e,t[e]);if(a)for(var e of a(t))m.call(t,e)&&h(i,e,t[e]);return i};var o=class{constructor(t,e){this.index=0;this.charIndex=0;this.isDeleting=!1;this.isPaused=!1;this.isStopped=!1;this.status="idle";this.pause=()=>{this.isPaused=!0,this.status="paused",clearTimeout(this.loopTimeout)};this.resume=()=>{!this.isPaused||this.isStopped||(this.isPaused=!1,this.status="typing",this.type())};if(this.el=t,this.options=l({speed:100,deleteSpeed:50,delayBetween:1e3,pauseBetweenLoops:2e3,loop:!0,cursor:!0,cursorChar:"|",startDelay:0,pauseOnHover:!1,randomSpeed:!1,autoStart:!0,textStyleClass:"",onComplete:()=>{}},e),this.options.textStyleClass){let s=document.createElement("span");s.className=this.options.textStyleClass,this.el.appendChild(s)}else this.el.appendChild(document.createTextNode(""));if(this.options.cursor){let s=document.createElement("span");s.className="typewriter-cursor",s.textContent=this.options.cursorChar,this.el.appendChild(s)}this.options.pauseOnHover&&(this.el.addEventListener("mouseenter",this.pause),this.el.addEventListener("mouseleave",this.resume)),this.options.autoStart&&this.start()}start(){this.isStopped=!1,this.status="typing",this.options.startDelay>0?setTimeout(()=>this.type(),this.options.startDelay):this.type()}type(){var n,r;if(this.isStopped||this.isPaused)return;let t=this.options.text[this.index],e=t.substring(0,this.charIndex),s=this.el.firstChild;s&&(s.textContent=e);let p=this.options.randomSpeed?this.getRandomSpeed():this.isDeleting?this.options.deleteSpeed:this.options.speed;this.isDeleting?this.charIndex>0?(this.charIndex--,this.loopTimeout=setTimeout(()=>this.type(),p)):(this.isDeleting=!1,this.index=(this.index+1)%this.options.text.length,this.loopTimeout=setTimeout(()=>this.type(),this.options.pauseBetweenLoops)):this.charIndex<t.length?(this.charIndex++,this.loopTimeout=setTimeout(()=>this.type(),p)):this.options.loop?(this.isDeleting=!0,this.loopTimeout=setTimeout(()=>this.type(),this.options.delayBetween)):(this.status="stopped",(r=(n=this.options).onComplete)==null||r.call(n))}getRandomSpeed(){let t=this.isDeleting?this.options.deleteSpeed:this.options.speed,e=t*.3;return t+Math.floor((Math.random()-.5)*e)}stop(){clearTimeout(this.loopTimeout),this.isStopped=!0,this.status="stopped"}reset(){this.stop(),this.index=0,this.charIndex=0,this.isDeleting=!1,this.isPaused=!1,this.status="idle",this.el.childNodes[0].textContent=""}updateText(t){this.options.text=t,this.reset(),this.start()}isRunning(){return this.status==="typing"}destroy(){this.stop(),this.el.innerHTML="",this.el.removeEventListener("mouseenter",this.pause),this.el.removeEventListener("mouseleave",this.resume)}};var T=o;export{o as Typewriter,T as default};
//# sourceMappingURL=index.mjs.map