@asasugar-use/vue3-typewriter/dist/vue3-typewriter.umd.js

Vue3 Component for typewriter effects.

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue")):"function"==typeof define&&define.amd?define(["exports","vue"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).Vue3Typewriter={},e.Vue)}(this,(function(e,t){"use strict";const o={key:0},n=((e,t)=>{const o=e.__vccOpts||e;for(const[n,r]of t)o[n]=r;return o})(t.defineComponent({__name:"vue3-typewriter",props:{text:{},typingSpeed:{default:100},cursorColor:{default:"red"},cursorShow:{type:Boolean,default:!0}},emits:["completed"],setup(e,{emit:n}){t.useCssVars((e=>({"3338934b":r.cursorColor})));const r=e,u=n,l=t.useAttrs(),s=t.ref(""),i=t.ref(!1),a=t.computed((()=>!r.cursorShow||i.value));let c,d=0,p=0;const f=e=>{if(d<r.text.length){p||(p=e);e-p>r.typingSpeed&&(s.value+=r.text.charAt(d),d++,p=e),c=requestAnimationFrame(f)}else i.value=!0,u("completed")};return t.watch((()=>r.text),((e,t)=>{e.length<t.length&&(s.value=e.slice(0,d)),i.value=!1,c=requestAnimationFrame(f)})),t.onUnmounted((()=>{cancelAnimationFrame(c)})),(e,n)=>s.value?(t.openBlock(),t.createElementBlock("div",o,[t.createElementVNode("span",t.mergeProps({...t.unref(l)},{class:["text",{"cursor-hidden":a.value}]}),t.toDisplayString(s.value),17)])):t.createCommentVNode("",!0)}}),[["__scopeId","data-v-4c7ca741"]]);let r=!1;function u(e){r||(r=!0,e.component("Vue3Typewriter",n))}const l={install:u};"undefined"!=typeof window&&window.Vue&&window.Vue.use(l),e.default=n,e.install=u,Object.defineProperties(e,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));