retro-react/dist/cjs/components/typewritertext/TypewriterText.js

A React component library for building retro-style websites

"use strict";var e=require("../../_virtual/_tslib.js"),r=require("react"),t=require("../../node_modules/@theme-ui/core/jsx-runtime/dist/theme-ui-core-jsx-runtime.esm.js"),s=require("../../utils/classNames.js"),u=require("../text/Text.js");const c=r.forwardRef(((c,n)=>{var{id:i,className:a,text:o,typingSpeed:l=100,erasingSpeed:m=50,repeat:p=!1,pauseDuration:d=2e3,restartPause:x=1e3,showCursor:T=!0,cursor:f="|",color:j="#000000",sx:g}=c,h=e.__rest(c,["id","className","text","typingSpeed","erasingSpeed","repeat","pauseDuration","restartPause","showCursor","cursor","color","sx"]);const[w,y]=r.useState(""),[S,b]=r.useState(!0),[N,C]=r.useState(!0),q=r.useRef(null),v=r.useRef(null),R=r.useRef(0),_=r.useRef(!0),k=r.useCallback((()=>{q.current&&(clearTimeout(q.current),q.current=null),v.current&&(clearTimeout(v.current),v.current=null)}),[]),O=r.useCallback((()=>{if(!T||!_.current)return;const e=()=>{_.current&&(C((e=>!e)),v.current=setTimeout(e,530))};v.current=setTimeout(e,530)}),[T]),D=r.useCallback((()=>{if(!_.current)return;const e=R.current;S?e<=o.length&&(y(o.slice(0,e)),R.current=e+1,e<o.length?q.current=setTimeout(D,l):p&&(q.current=setTimeout((()=>{b(!1),D()}),d))):e>=0&&(y(o.slice(0,e)),R.current=e-1,q.current=e>0?setTimeout(D,m):setTimeout((()=>{b(!0),R.current=0,D()}),x))}),[o,l,m,d,x,p,S]);return r.useEffect((()=>(_.current=!0,R.current=0,y(""),b(!0),O(),q.current=setTimeout(D,l),()=>{_.current=!1,k()})),[o,D,O,l,k]),r.useEffect((()=>{T&&_.current?O():(v.current&&(clearTimeout(v.current),v.current=null),C(!1))}),[T,O]),t.jsxs(u.Text,Object.assign({ref:n,id:i,color:j,className:s.classNames("typewriter-text-root",a)},h,{sx:Object.assign({fontFamily:"'Courier New', monospace",minHeight:"1.2em",whiteSpace:"pre-wrap"},g)},{children:[w,T&&t.jsx("span",Object.assign({style:{opacity:N?1:0,transition:"none"}},{children:f}),void 0)]}),void 0)}));c.displayName="TypewriterText",exports.TypewriterText=c;