Socket
Socket
Sign inDemoInstall

typeit-react

Package Overview
Dependencies
Maintainers
1
Versions
65
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

typeit-react - npm Package Compare versions

Comparing version 2.3.1 to 2.3.2

134

dist/index.es.js

@@ -34,11 +34,11 @@ var __defProp = Object.defineProperty;

};
const Queue = function(initialItems) {
const add = function(steps) {
let Queue = function(initialItems) {
let add = function(steps) {
_queue = _queue.concat(asArray(steps));
return this;
};
const set = function(index, item) {
let set = function(index, item) {
_queue[index] = item;
};
const reset = function() {
let reset = function() {
_queue = _queue.map((item) => {

@@ -49,4 +49,8 @@ delete item.done;

};
const getItems = () => _queue.filter((i) => !i.done);
const markDone = (index) => {
let wipe = function() {
_queue = [];
add(initialItems);
};
let getItems = (all = false) => _queue.filter((i) => all || !i.done);
let markDone = (index) => {
_queue[index].done = true;

@@ -60,2 +64,3 @@ };

reset,
wipe,
getItems,

@@ -71,3 +76,3 @@ markDone

};
const expandTextNodes = (element) => {
let expandTextNodes = (element) => {
[...element.childNodes].forEach((child) => {

@@ -128,3 +133,3 @@ if (child.nodeValue) {

function walkElementNodes(element, shouldReverse = false) {
const walker = document.createTreeWalker(element, NodeFilter.SHOW_ALL, {
let walker = document.createTreeWalker(element, NodeFilter.SHOW_ALL, {
acceptNode: (node) => {

@@ -158,6 +163,6 @@ var _a;

};
const isNumber = (value) => {
let isNumber = (value) => {
return Number.isInteger(value);
};
const select = (selector, element = document, all = false) => {
let select = (selector, element = document, all = false) => {
return element[`querySelector${all ? "All" : ""}`](selector);

@@ -168,3 +173,3 @@ };

};
const getAllChars = (element) => {
let getAllChars = (element) => {
if (isInput(element)) {

@@ -175,3 +180,3 @@ return toArray(element.value);

};
const calculateStepsToSelector = (selector, element, to = START) => {
let calculateStepsToSelector = (selector, element, to = START) => {
let isMovingToLast = new RegExp(END, "i").test(to);

@@ -238,7 +243,7 @@ let selectedElement = selector ? select(selector, element) : element;

};
const handleFunctionalArg = (arg) => {
let handleFunctionalArg = (arg) => {
return typeof arg === "function" ? arg() : arg;
};
const isBodyElement = (node) => (node == null ? void 0 : node.tagName) === "BODY";
const insertIntoElement = (originalTarget, character) => {
let isBodyElement = (node) => (node == null ? void 0 : node.tagName) === "BODY";
let insertIntoElement = (originalTarget, character) => {
if (isInput(originalTarget)) {

@@ -252,3 +257,3 @@ originalTarget.value = `${originalTarget.value}${character.textContent}`;

};
const updateCursorPosition = (steps, cursorPosition, printedCharacters) => {
let updateCursorPosition = (steps, cursorPosition, printedCharacters) => {
return Math.min(Math.max(cursorPosition + steps, 0), printedCharacters.length);

@@ -262,4 +267,4 @@ };

return;
const nodeParent = node.parentNode;
const nodeToRemove = nodeParent.childNodes.length > 1 ? node : nodeParent;
let nodeParent = node.parentNode;
let nodeToRemove = nodeParent.childNodes.length > 1 ? node : nodeParent;
nodeToRemove.remove();

@@ -276,6 +281,6 @@ };

}
const isNonVoidElement = (el) => /<(.+)>(.*?)<\/(.+)>/.test(el.outerHTML);
const wait = async (callback, delay, timeouts) => {
let isNonVoidElement = (el) => /<(.+)>(.*?)<\/(.+)>/.test(el.outerHTML);
let wait = async (callback, delay, timeouts) => {
return new Promise((resolve) => {
const cb = async () => {
let cb = async () => {
await callback();

@@ -287,3 +292,3 @@ resolve();

};
const cursorFontStyles = {
let cursorFontStyles = {
"font-family": "",

@@ -298,3 +303,3 @@ "font-weight": "",

};
const setCursorStyles = (id, options, element) => {
let setCursorStyles = (id, options, element) => {
let rootSelector = `[${DATA_ATTRIBUTE}='${id}']`;

@@ -309,3 +314,3 @@ let cursorSelector = `${rootSelector} .${CURSOR_CLASS}`;

function TypeIt$1(element, options = {}) {
const _wait = async (callback, delay, silent = false) => {
let _wait = async (callback, delay, silent = false) => {
if (_statuses.frozen) {

@@ -323,13 +328,13 @@ await new Promise((resolve) => {

};
const _elementIsInput = () => isInput(_element);
const _getPace = (index) => calculatePace(_opts)[index];
const _getAllChars = () => getAllChars(_element);
const _getActionPace = (instant, paceIndex = 0) => {
let _elementIsInput = () => isInput(_element);
let _getPace = (index) => calculatePace(_opts)[index];
let _getAllChars = () => getAllChars(_element);
let _getActionPace = (instant, paceIndex = 0) => {
return instant ? _getPace(paceIndex) : 0;
};
const _maybeAppendPause = (opts = {}) => {
let _maybeAppendPause = (opts = {}) => {
let delay = opts["delay"];
delay && _queue.add(() => _pause(delay));
};
const _queueAndReturn = (steps, opts) => {
let _queueAndReturn = (steps, opts) => {
_queue.add(steps);

@@ -339,3 +344,3 @@ _maybeAppendPause(opts);

};
const _generateTemporaryOptionQueueItems = (newOptions = {}) => {
let _generateTemporaryOptionQueueItems = (newOptions = {}) => {
return [

@@ -346,3 +351,3 @@ () => _options(newOptions),

};
const _addSplitPause = (items) => {
let _addSplitPause = (items) => {
let delay = _opts.nextStringDelay;

@@ -355,3 +360,3 @@ _queue.add([

};
const _setUpCursor = () => {
let _setUpCursor = () => {
if (_elementIsInput()) {

@@ -369,7 +374,7 @@ return;

};
const _attachCursor = async () => {
let _attachCursor = async () => {
!_elementIsInput() && _element.appendChild(_cursor);
_shouldRenderCursor && setCursorStyles(_id, _opts, _element);
};
const _disableCursorBlink = (shouldDisable) => {
let _disableCursorBlink = (shouldDisable) => {
if (_shouldRenderCursor) {

@@ -380,3 +385,3 @@ _cursor.classList.toggle("disabled", shouldDisable);

};
const _generateQueue = () => {
let _generateQueue = () => {
let strings = _opts.strings.filter((string) => !!string);

@@ -389,3 +394,3 @@ strings.forEach((string, index) => {

}
const splitPauseArgs = [
let splitPauseArgs = [
_opts.breakLines ? () => _type({

@@ -399,3 +404,3 @@ chars: [createElement("BR")],

};
const _prepLoop = async (delay) => {
let _prepLoop = async (delay) => {
_cursorPosition && await _move({ value: _cursorPosition });

@@ -406,3 +411,3 @@ _queue.reset();

};
const _maybePrependHardcodedStrings = (strings) => {
let _maybePrependHardcodedStrings = (strings) => {
let existingMarkup = _element.innerHTML;

@@ -424,3 +429,3 @@ if (!existingMarkup) {

};
const _fire = async () => {
let _fire = async () => {
_statuses.started = true;

@@ -448,7 +453,5 @@ let queueItems = _queue.getItems();

};
const _pause = (time = 0) => {
return _wait(() => {
}, time);
};
const _move = async ({
let _pause = (time = 0) => _wait(() => {
}, time);
let _move = async ({
value,

@@ -475,3 +478,3 @@ to = START,

};
const _type = ({
let _type = ({
chars,

@@ -483,3 +486,3 @@ silent = false,

return _wait(async () => {
const insert = (character) => insertIntoElement(_element, character);
let insert = (character) => insertIntoElement(_element, character);
silent || await _opts.beforeString(chars, this);

@@ -492,7 +495,7 @@ for (let char of chars) {

};
const _options = async (opts) => {
let _options = async (opts) => {
_opts = merge(_opts, opts);
return;
};
const _empty = async () => {
let _empty = async () => {
if (_elementIsInput()) {

@@ -507,3 +510,3 @@ _element.value = "";

};
const _delete = async ({
let _delete = async ({
num = null,

@@ -515,9 +518,17 @@ instant = false,

await _wait(async () => {
let rounds = isNumber(num) || _elementIsInput() ? num : calculateCursorSteps({
el: _element,
move: num,
cursorPos: _cursorPosition,
to
});
const deleteIt = () => {
let rounds = (() => {
if (num === null) {
return _getAllChars().length;
}
if (isNumber(num)) {
return num;
}
return calculateCursorSteps({
el: _element,
move: num,
cursorPos: _cursorPosition,
to
});
})();
let deleteIt = () => {
let allChars = _getAllChars();

@@ -608,5 +619,10 @@ if (!allChars.length)

};
this.reset = function() {
this.reset = function(rebuild) {
!this.is("destroyed") && this.destroy();
_queue.reset();
if (rebuild) {
_queue.wipe();
rebuild(this);
} else {
_queue.reset();
}
_cursorPosition = 0;

@@ -613,0 +629,0 @@ for (let property in _statuses) {

2

dist/index.umd.js

@@ -1,1 +0,1 @@

var je=Object.defineProperty;var F=Object.getOwnPropertySymbols;var ge=Object.prototype.hasOwnProperty,Se=Object.prototype.propertyIsEnumerable;var ye=(a,f,g)=>f in a?je(a,f,{enumerable:!0,configurable:!0,writable:!0,value:g}):a[f]=g,be=(a,f)=>{for(var g in f||(f={}))ge.call(f,g)&&ye(a,g,f[g]);if(F)for(var g of F(f))Se.call(f,g)&&ye(a,g,f[g]);return a};var ve=(a,f)=>{var g={};for(var v in a)ge.call(a,v)&&f.indexOf(v)<0&&(g[v]=a[v]);if(a!=null&&F)for(var v of F(a))f.indexOf(v)<0&&Se.call(a,v)&&(g[v]=a[v]);return g};(function(a,f){typeof exports=="object"&&typeof module!="undefined"?module.exports=f(require("react")):typeof define=="function"&&define.amd?define(["react"],f):(a=typeof globalThis!="undefined"?globalThis:a||self,a.TypeIt=f(a.React))})(this,function(a){"use strict";function f(e){if(e&&e.__esModule)return e;var n={__proto__:null,[Symbol.toStringTag]:"Module"};return e&&Object.keys(e).forEach(function(r){if(r!=="default"){var o=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(n,r,o.get?o:{enumerable:!0,get:function(){return e[r]}})}}),n.default=e,Object.freeze(n)}var g=f(a),v=e=>Array.isArray(e),Z=e=>v(e)?e:[e];const _e=function(e){const n=function(m){return d=d.concat(Z(m)),this},r=function(m,S){d[m]=S},o=function(){d=d.map(m=>(delete m.done,m))},u=()=>d.filter(m=>!m.done),c=m=>{d[m].done=!0};let d=[];return n(e),{add:n,set:r,reset:o,getItems:u,markDone:c}};var ee=e=>Array.from(e),z=e=>document.createTextNode(e);const Q=e=>([...e.childNodes].forEach(n=>{if(n.nodeValue){[...n.nodeValue].forEach(r=>{n.parentNode.insertBefore(z(r),n)}),n.remove();return}Q(n)}),e);var te=e=>{let n=document.implementation.createHTMLDocument();return n.body.innerHTML=e,Q(n.body)};const ne="data-typeit-id",D="ti-cursor",j="START",Te="END",Ee={started:!1,completed:!1,frozen:!1,destroyed:!1},we={breakLines:!0,cursor:!0,cursorChar:"|",cursorSpeed:1e3,deleteSpeed:null,html:!0,lifeLike:!0,loop:!1,loopDelay:750,nextStringDelay:750,speed:100,startDelay:250,startDelete:!1,strings:[],waitUntilVisible:!1,beforeString:()=>{},afterString:()=>{},beforeStep:()=>{},afterStep:()=>{},afterComplete:()=>{}};function U(e,n=!1){const r=document.createTreeWalker(e,NodeFilter.SHOW_ALL,{acceptNode:c=>{var d;return((d=c==null?void 0:c.classList)==null?void 0:d.contains(D))?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}});let o,u=[];for(;o=r.nextNode();)o.originalParent=o.parentNode,u.push(o);return n?u.reverse():u}function Ie(e){return U(te(e))}function re(e,n=!0){return n?Ie(e):ee(e).map(z)}var R=e=>document.createElement(e),se=(e,n="")=>{let r=R("style");r.id=n,r.appendChild(z(e)),document.head.appendChild(r)};const oe=e=>Number.isInteger(e),k=(e,n=document,r=!1)=>n[`querySelector${r?"All":""}`](e);var q=e=>"value"in e;const ie=e=>q(e)?ee(e.value):U(e,!0).filter(n=>!(n.childNodes.length>0)),Ce=(e,n,r=j)=>{let o=new RegExp(Te,"i").test(r),u=e?k(e,n):n,c=U(u,!0),d=c[0],m=c[c.length-1],_=o&&!e?0:ie(n).findIndex(N=>N.isSameNode(o?d:m));return o&&_--,_+1};var le=({el:e,move:n,cursorPos:r,to:o})=>oe(n)?n*-1:Ce(n,e,o)-r,ue=e=>(v(e)||(e=[e/2,e/2]),e),ae=(e,n)=>Math.abs(Math.random()*(e+n-(e-n))+(e-n));let ce=e=>e/2;function Ne(e){let{speed:n,deleteSpeed:r,lifeLike:o}=e;return r=r!==null?r:n/3,o?[ae(n,ce(n)),ae(r,ce(r))]:[n,r]}var Le=e=>(e.forEach(n=>clearTimeout(n)),[]),Pe=()=>Math.random().toString().substring(2,9),Ae=(e,n)=>{new IntersectionObserver((o,u)=>{o.forEach(c=>{c.isIntersecting&&(n(),u.unobserve(e))})},{threshold:1}).observe(e)};const C=e=>typeof e=="function"?e():e,De=e=>(e==null?void 0:e.tagName)==="BODY",Me=(e,n)=>{if(q(e)){e.value=`${e.value}${n.textContent}`;return}n.innerHTML="";let r=De(n.originalParent)?e:n.originalParent||e;r.insertBefore(n,k("."+D,r)||null)},Re=(e,n,r)=>Math.min(Math.max(n+e,0),r.length);var x=(e,n)=>Object.assign({},e,n),V=e=>{if(!e)return;const n=e.parentNode;(n.childNodes.length>1?e:n).remove()},ke=(e,n,r)=>{let o=n[r-1],u=k(`.${D}`,e);e=(o==null?void 0:o.parentNode)||e,e.insertBefore(u,o||null)};function xe(e){return typeof e=="string"?k(e):e}const $e=e=>/<(.+)>(.*?)<\/(.+)>/.test(e.outerHTML),Oe=async(e,n,r)=>new Promise(o=>{const u=async()=>{await e(),o()};r.push(setTimeout(u,n))}),He={"font-family":"","font-weight":"","font-size":"","font-style":"","line-height":"",color:"","margin-left":"-.125em","margin-right":".125em"},Be=(e,n,r)=>{let u=`${`[${ne}='${e}']`} .${D}`,c=getComputedStyle(r),d=Object.entries(He).reduce((m,[S,_])=>`${m} ${S}: var(--ti-cursor-${S}, ${_||c[S]});`,"");se(`@keyframes blink-${e} { 0% {opacity: 0} 49% {opacity: 0} 50% {opacity: 1} } ${u} { display: inline; letter-spacing: -1em; ${d} animation: blink-${e} ${n.cursorSpeed/1e3}s infinite; } ${u}.with-delay { animation-delay: 500ms; } ${u}.disabled { animation: none; }`,e)};function Fe(e,n={}){const r=async(t,s,l=!1)=>{E.frozen&&await new Promise(y=>{this.unfreeze=()=>{E.frozen=!1,y()}}),l||await i.beforeStep(this),await Oe(t,s,K),l||await i.afterStep(this)},o=()=>q(p),u=t=>Ne(i)[t],c=()=>ie(p),d=(t,s=0)=>t?u(s):0,m=(t={})=>{let s=t.delay;s&&w.add(()=>A(s))},S=(t,s)=>(w.add(t),m(s),this),_=(t={})=>[()=>H(t),()=>H(i)],N=t=>{let s=i.nextStringDelay;w.add([()=>A(s[0]),...t,()=>A(s[1])])},L=()=>{if(o())return;let t=R("span");return t.className=D,X?(t.innerHTML=te(i.cursorChar).innerHTML,t):(t.style.visibility="hidden",t)},J=async()=>{!o()&&p.appendChild(B),X&&Be(me,i,p)},P=t=>{X&&(B.classList.toggle("disabled",t),B.classList.toggle("with-delay",!t))},Y=()=>{let t=i.strings.filter(s=>!!s);t.forEach((s,l)=>{let y=re(s,i.html);if(w.add(()=>O({chars:y})),l+1===t.length)return;const h=[i.breakLines?()=>O({chars:[R("BR")],silent:!0}):()=>M({num:y.length})];N(h)})},G=async t=>{I&&await he({value:I}),w.reset(),w.set(0,()=>A(t)),await M({num:null})},$=t=>{let s=p.innerHTML;return s?(p.innerHTML="",i.startDelete?(p.innerHTML=s,Q(p),N([()=>M({num:null})]),t):s.trim().split(/<br(?:\s*?)(?:\/)?>/).concat(t)):t},T=async()=>{E.started=!0;let t=w.getItems();try{for(let l=0;l<t.length;l++)await t[l](),w.markDone(l),P(!1);if(E.completed=!0,await i.afterComplete(this),!i.loop)throw"";let s=i.loopDelay;r(async()=>{await G(s[0]),T()},s[1])}catch{}return this},A=(t=0)=>r(()=>{},t),he=async({value:t,to:s=j,instant:l=!1})=>{P(!0);let y=le({el:p,move:t,cursorPos:I,to:s}),h=()=>{I=Re(y<0?-1:1,I,c()),ke(p,c(),I)};await r(async()=>{for(let b=0;b<Math.abs(y);b++)l?h():await r(h,u(0))},d(l))},O=({chars:t,silent:s=!1,instant:l=!1})=>(P(!0),r(async()=>{const y=h=>Me(p,h);s||await i.beforeString(t,this);for(let h of t)l||$e(h)?y(h):await r(()=>y(h),u(0));s||await i.afterString(t,this)},d(l),!0)),H=async t=>{i=x(i,t)},Qe=async()=>{if(o()){p.value="";return}c().forEach(t=>{V(t)})},M=async({num:t=null,instant:s=!1,to:l=j})=>{P(!0),await r(async()=>{let y=oe(t)||o()?t:le({el:p,move:t,cursorPos:I,to:l});const h=()=>{let b=c();!b.length||(o()?p.value=p.value.slice(0,-1):V(b[I]))};for(let b=0;b<y;b++)s?h():await r(h,u(1))},d(s,1)),t===null&&c().length-1>0&&await M({num:null})};this.break=function(t){return S(()=>O({chars:[R("BR")],silent:!0}),t)},this.delete=function(t=null,s={}){t=C(t);let l=_(s),y=t,{instant:h,to:b}=s;return S([l[0],()=>M({num:y,instant:h,to:b}),l[1]],s)},this.empty=function(t={}){return S(Qe,t)},this.exec=function(t,s){let l=_(s);return S([l[0],t,l[1]],s)},this.move=function(t,s={}){t=C(t);let l=_(s),{instant:y,to:h}=s,b={value:t===null?"":t,to:h,instant:y};return S([l[0],()=>he(b),l[1]],s)},this.options=function(t){return t=C(t),S(()=>H(t),t)},this.pause=function(t,s={}){return S(()=>A(C(t)),s)},this.type=function(t,s={}){t=C(t);let l=_(s),y=re(t,i.html),{instant:h}=s,b=[l[0],()=>O({chars:y,instant:h}),l[1]];return S(b,s)},this.is=function(t){return E[t]},this.destroy=function(t=!0){K=Le(K),C(t)&&V(B),E.destroyed=!0},this.freeze=function(){E.frozen=!0},this.unfreeze=function(){},this.reset=function(){!this.is("destroyed")&&this.destroy(),w.reset(),I=0;for(let t in E)E[t]=!1;return p[o()?"value":"innerHTML"]="",this},this.go=function(){return E.started?this:(J(),i.waitUntilVisible?(Ae(p,T.bind(this)),this):(T(),this))},this.getQueue=()=>w,this.getOptions=()=>i,this.updateOptions=t=>H(t),this.getElement=()=>p;let p=xe(e),K=[],I=0,E=x({},Ee),i=x(we,n);i=x(i,{html:!o()&&i.html,nextStringDelay:ue(i.nextStringDelay),loopDelay:ue(i.loopDelay)});let me=Pe(),w=_e([()=>A(i.startDelay)]);p.dataset.typeitId=me,se(`[${ne}]:before {content: '.'; display: inline-block; width: 0; visibility: hidden;}`);let X=i.cursor&&!o(),B=L();i.strings=$(Z(i.strings)),i.strings.length&&Y()}const{useRef:de,useEffect:W,useState:fe}=g,ze={as:"span",options:{},getBeforeInit:e=>e,getAfterInit:e=>e},pe=e=>{const n=de(null),r=de(null),$=e,{options:o,as:u,children:c,getBeforeInit:d,getAfterInit:m}=$,S=ve($,["options","as","children","getBeforeInit","getAfterInit"]),[_,N]=fe(!0),[L,J]=fe(null),P=u;function Y(){const T=Object.assign({},o);c&&n.current&&(T.strings=n.current.innerHTML),J(T)}function G(){r.current=new Fe(n.current,L),r.current=d(r.current),r.current.go(),r.current=m(r.current)}return W(()=>{Y(),N(!1)},[o]),W(()=>{var T;!L||((T=r.current)==null?void 0:T.updateOptions(L))||G()},[L]),W(()=>()=>{var T;return(T=r.current)==null?void 0:T.destroy()},[]),g.createElement(P,be({ref:n,children:_?c:null,style:{opacity:_?0:1}},S))};return pe.defaultProps=ze,pe});
var je=Object.defineProperty;var F=Object.getOwnPropertySymbols;var ge=Object.prototype.hasOwnProperty,Se=Object.prototype.propertyIsEnumerable;var ye=(c,f,y)=>f in c?je(c,f,{enumerable:!0,configurable:!0,writable:!0,value:y}):c[f]=y,be=(c,f)=>{for(var y in f||(f={}))ge.call(f,y)&&ye(c,y,f[y]);if(F)for(var y of F(f))Se.call(f,y)&&ye(c,y,f[y]);return c};var ve=(c,f)=>{var y={};for(var _ in c)ge.call(c,_)&&f.indexOf(_)<0&&(y[_]=c[_]);if(c!=null&&F)for(var _ of F(c))f.indexOf(_)<0&&Se.call(c,_)&&(y[_]=c[_]);return y};(function(c,f){typeof exports=="object"&&typeof module!="undefined"?module.exports=f(require("react")):typeof define=="function"&&define.amd?define(["react"],f):(c=typeof globalThis!="undefined"?globalThis:c||self,c.TypeIt=f(c.React))})(this,function(c){"use strict";function f(e){if(e&&e.__esModule)return e;var r={__proto__:null,[Symbol.toStringTag]:"Module"};return e&&Object.keys(e).forEach(function(n){if(n!=="default"){var i=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(r,n,i.get?i:{enumerable:!0,get:function(){return e[n]}})}}),r.default=e,Object.freeze(r)}var y=f(c),_=e=>Array.isArray(e),Z=e=>_(e)?e:[e];let _e=function(e){let r=function(u){return g=g.concat(Z(u)),this},n=function(u,S){g[u]=S},i=function(){g=g.map(u=>(delete u.done,u))},a=function(){g=[],r(e)},d=(u=!1)=>g.filter(S=>u||!S.done),b=u=>{g[u].done=!0},g=[];return r(e),{add:r,set:n,reset:i,wipe:a,getItems:d,markDone:b}};var ee=e=>Array.from(e),z=e=>document.createTextNode(e);let Q=e=>([...e.childNodes].forEach(r=>{if(r.nodeValue){[...r.nodeValue].forEach(n=>{r.parentNode.insertBefore(z(n),r)}),r.remove();return}Q(r)}),e);var te=e=>{let r=document.implementation.createHTMLDocument();return r.body.innerHTML=e,Q(r.body)};const re="data-typeit-id",D="ti-cursor",j="START",Te="END",Ee={started:!1,completed:!1,frozen:!1,destroyed:!1},we={breakLines:!0,cursor:!0,cursorChar:"|",cursorSpeed:1e3,deleteSpeed:null,html:!0,lifeLike:!0,loop:!1,loopDelay:750,nextStringDelay:750,speed:100,startDelay:250,startDelete:!1,strings:[],waitUntilVisible:!1,beforeString:()=>{},afterString:()=>{},beforeStep:()=>{},afterStep:()=>{},afterComplete:()=>{}};function U(e,r=!1){let n=document.createTreeWalker(e,NodeFilter.SHOW_ALL,{acceptNode:d=>{var b;return((b=d==null?void 0:d.classList)==null?void 0:b.contains(D))?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}}),i,a=[];for(;i=n.nextNode();)i.originalParent=i.parentNode,a.push(i);return r?a.reverse():a}function Ie(e){return U(te(e))}function ne(e,r=!0){return r?Ie(e):ee(e).map(z)}var R=e=>document.createElement(e),le=(e,r="")=>{let n=R("style");n.id=r,n.appendChild(z(e)),document.head.appendChild(n)};let ie=e=>Number.isInteger(e),k=(e,r=document,n=!1)=>r[`querySelector${n?"All":""}`](e);var q=e=>"value"in e;let se=e=>q(e)?ee(e.value):U(e,!0).filter(r=>!(r.childNodes.length>0)),Ce=(e,r,n=j)=>{let i=new RegExp(Te,"i").test(n),a=e?k(e,r):r,d=U(a,!0),b=d[0],g=d[d.length-1],S=i&&!e?0:se(r).findIndex(N=>N.isSameNode(i?b:g));return i&&S--,S+1};var oe=({el:e,move:r,cursorPos:n,to:i})=>ie(r)?r*-1:Ce(r,e,i)-n,ue=e=>(_(e)||(e=[e/2,e/2]),e),ae=(e,r)=>Math.abs(Math.random()*(e+r-(e-r))+(e-r));let ce=e=>e/2;function Ne(e){let{speed:r,deleteSpeed:n,lifeLike:i}=e;return n=n!==null?n:r/3,i?[ae(r,ce(r)),ae(n,ce(n))]:[r,n]}var Le=e=>(e.forEach(r=>clearTimeout(r)),[]),Pe=()=>Math.random().toString().substring(2,9),Ae=(e,r)=>{new IntersectionObserver((i,a)=>{i.forEach(d=>{d.isIntersecting&&(r(),a.unobserve(e))})},{threshold:1}).observe(e)};let C=e=>typeof e=="function"?e():e,De=e=>(e==null?void 0:e.tagName)==="BODY",Me=(e,r)=>{if(q(e)){e.value=`${e.value}${r.textContent}`;return}r.innerHTML="";let n=De(r.originalParent)?e:r.originalParent||e;n.insertBefore(r,k("."+D,n)||null)},Re=(e,r,n)=>Math.min(Math.max(r+e,0),n.length);var x=(e,r)=>Object.assign({},e,r),V=e=>{if(!e)return;let r=e.parentNode;(r.childNodes.length>1?e:r).remove()},ke=(e,r,n)=>{let i=r[n-1],a=k(`.${D}`,e);e=(i==null?void 0:i.parentNode)||e,e.insertBefore(a,i||null)};function xe(e){return typeof e=="string"?k(e):e}let $e=e=>/<(.+)>(.*?)<\/(.+)>/.test(e.outerHTML),Oe=async(e,r,n)=>new Promise(i=>{let a=async()=>{await e(),i()};n.push(setTimeout(a,r))}),He={"font-family":"","font-weight":"","font-size":"","font-style":"","line-height":"",color:"","margin-left":"-.125em","margin-right":".125em"},Be=(e,r,n)=>{let a=`${`[${re}='${e}']`} .${D}`,d=getComputedStyle(n),b=Object.entries(He).reduce((g,[u,S])=>`${g} ${u}: var(--ti-cursor-${u}, ${S||d[u]});`,"");le(`@keyframes blink-${e} { 0% {opacity: 0} 49% {opacity: 0} 50% {opacity: 1} } ${a} { display: inline; letter-spacing: -1em; ${b} animation: blink-${e} ${r.cursorSpeed/1e3}s infinite; } ${a}.with-delay { animation-delay: 500ms; } ${a}.disabled { animation: none; }`,e)};function Fe(e,r={}){let n=async(t,l,o=!1)=>{w.frozen&&await new Promise(m=>{this.unfreeze=()=>{w.frozen=!1,m()}}),o||await s.beforeStep(this),await Oe(t,l,K),o||await s.afterStep(this)},i=()=>q(p),a=t=>Ne(s)[t],d=()=>se(p),b=(t,l=0)=>t?a(l):0,g=(t={})=>{let l=t.delay;l&&E.add(()=>A(l))},u=(t,l)=>(E.add(t),g(l),this),S=(t={})=>[()=>H(t),()=>H(s)],N=t=>{let l=s.nextStringDelay;E.add([()=>A(l[0]),...t,()=>A(l[1])])},L=()=>{if(i())return;let t=R("span");return t.className=D,X?(t.innerHTML=te(s.cursorChar).innerHTML,t):(t.style.visibility="hidden",t)},J=async()=>{!i()&&p.appendChild(B),X&&Be(me,s,p)},P=t=>{X&&(B.classList.toggle("disabled",t),B.classList.toggle("with-delay",!t))},Y=()=>{let t=s.strings.filter(l=>!!l);t.forEach((l,o)=>{let m=ne(l,s.html);if(E.add(()=>O({chars:m})),o+1===t.length)return;let h=[s.breakLines?()=>O({chars:[R("BR")],silent:!0}):()=>M({num:m.length})];N(h)})},G=async t=>{I&&await he({value:I}),E.reset(),E.set(0,()=>A(t)),await M({num:null})},$=t=>{let l=p.innerHTML;return l?(p.innerHTML="",s.startDelete?(p.innerHTML=l,Q(p),N([()=>M({num:null})]),t):l.trim().split(/<br(?:\s*?)(?:\/)?>/).concat(t)):t},T=async()=>{w.started=!0;let t=E.getItems();try{for(let o=0;o<t.length;o++)await t[o](),E.markDone(o),P(!1);if(w.completed=!0,await s.afterComplete(this),!s.loop)throw"";let l=s.loopDelay;n(async()=>{await G(l[0]),T()},l[1])}catch{}return this},A=(t=0)=>n(()=>{},t),he=async({value:t,to:l=j,instant:o=!1})=>{P(!0);let m=oe({el:p,move:t,cursorPos:I,to:l}),h=()=>{I=Re(m<0?-1:1,I,d()),ke(p,d(),I)};await n(async()=>{for(let v=0;v<Math.abs(m);v++)o?h():await n(h,a(0))},b(o))},O=({chars:t,silent:l=!1,instant:o=!1})=>(P(!0),n(async()=>{let m=h=>Me(p,h);l||await s.beforeString(t,this);for(let h of t)o||$e(h)?m(h):await n(()=>m(h),a(0));l||await s.afterString(t,this)},b(o),!0)),H=async t=>{s=x(s,t)},Qe=async()=>{if(i()){p.value="";return}d().forEach(t=>{V(t)})},M=async({num:t=null,instant:l=!1,to:o=j})=>{P(!0),await n(async()=>{let m=(()=>t===null?d().length:ie(t)?t:oe({el:p,move:t,cursorPos:I,to:o}))(),h=()=>{let v=d();!v.length||(i()?p.value=p.value.slice(0,-1):V(v[I]))};for(let v=0;v<m;v++)l?h():await n(h,a(1))},b(l,1)),t===null&&d().length-1>0&&await M({num:null})};this.break=function(t){return u(()=>O({chars:[R("BR")],silent:!0}),t)},this.delete=function(t=null,l={}){t=C(t);let o=S(l),m=t,{instant:h,to:v}=l;return u([o[0],()=>M({num:m,instant:h,to:v}),o[1]],l)},this.empty=function(t={}){return u(Qe,t)},this.exec=function(t,l){let o=S(l);return u([o[0],t,o[1]],l)},this.move=function(t,l={}){t=C(t);let o=S(l),{instant:m,to:h}=l,v={value:t===null?"":t,to:h,instant:m};return u([o[0],()=>he(v),o[1]],l)},this.options=function(t){return t=C(t),u(()=>H(t),t)},this.pause=function(t,l={}){return u(()=>A(C(t)),l)},this.type=function(t,l={}){t=C(t);let o=S(l),m=ne(t,s.html),{instant:h}=l,v=[o[0],()=>O({chars:m,instant:h}),o[1]];return u(v,l)},this.is=function(t){return w[t]},this.destroy=function(t=!0){K=Le(K),C(t)&&V(B),w.destroyed=!0},this.freeze=function(){w.frozen=!0},this.unfreeze=function(){},this.reset=function(t){!this.is("destroyed")&&this.destroy(),t?(E.wipe(),t(this)):E.reset(),I=0;for(let l in w)w[l]=!1;return p[i()?"value":"innerHTML"]="",this},this.go=function(){return w.started?this:(J(),s.waitUntilVisible?(Ae(p,T.bind(this)),this):(T(),this))},this.getQueue=()=>E,this.getOptions=()=>s,this.updateOptions=t=>H(t),this.getElement=()=>p;let p=xe(e),K=[],I=0,w=x({},Ee),s=x(we,r);s=x(s,{html:!i()&&s.html,nextStringDelay:ue(s.nextStringDelay),loopDelay:ue(s.loopDelay)});let me=Pe(),E=_e([()=>A(s.startDelay)]);p.dataset.typeitId=me,le(`[${re}]:before {content: '.'; display: inline-block; width: 0; visibility: hidden;}`);let X=s.cursor&&!i(),B=L();s.strings=$(Z(s.strings)),s.strings.length&&Y()}const{useRef:de,useEffect:W,useState:fe}=y,ze={as:"span",options:{},getBeforeInit:e=>e,getAfterInit:e=>e},pe=e=>{const r=de(null),n=de(null),$=e,{options:i,as:a,children:d,getBeforeInit:b,getAfterInit:g}=$,u=ve($,["options","as","children","getBeforeInit","getAfterInit"]),[S,N]=fe(!0),[L,J]=fe(null),P=a;function Y(){const T=Object.assign({},i);d&&r.current&&(T.strings=r.current.innerHTML),J(T)}function G(){n.current=new Fe(r.current,L),n.current=b(n.current),n.current.go(),n.current=g(n.current)}return W(()=>{Y(),N(!1)},[i]),W(()=>{var T;!L||((T=n.current)==null?void 0:T.updateOptions(L))||G()},[L]),W(()=>()=>{var T;return(T=n.current)==null?void 0:T.destroy()},[]),y.createElement(P,be({ref:r,children:S?d:null,style:{opacity:S?0:1}},u))};return pe.defaultProps=ze,pe});

5

package.json
{
"name": "typeit-react",
"version": "2.3.1",
"version": "2.3.2",
"description": "React component for the most versatile JavaScript animated typing utility on the planet.",

@@ -50,4 +50,3 @@ "homepage": "https://typeitjs.com",

"typescript": "^4.5.5"
},
"gitHead": "e1549a16fc8a064ee96c372f03cd482e834cba22"
}
}
LICENSE
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc