typeit - npm Package Compare versions
Comparing version 8.8.3 to 8.8.4
@@ -1,2 +0,2 @@ | ||
| declare let handleFunctionalArg: <T>(arg: any) => T; | ||
| declare let handleFunctionalArg: <T>(arg: any | (() => T)) => T; | ||
| export default handleFunctionalArg; |
@@ -1,2 +0,1 @@ | ||
| /// <reference types="web-animations-js" /> | ||
| import { El } from "../types"; | ||
@@ -3,0 +2,0 @@ /** |
@@ -190,2 +190,13 @@ // TypeIt by Alex MacArthur - https://typeitjs.com | ||
| const cleanUpSkipped = ({ | ||
| index, | ||
| newIndex, | ||
| queueItems, | ||
| cleanUp | ||
| }) => { | ||
| for (let i = index + 1; i < newIndex + 1; i++) { | ||
| cleanUp(queueItems[i][0]); | ||
| } | ||
| }; | ||
| const isNumber = (value) => Number.isInteger(value); | ||
@@ -260,4 +271,3 @@ | ||
| }) => { | ||
| if (!cursor || !cursorOptions) | ||
| return; | ||
| if (!cursor || !cursorOptions) return; | ||
| let animation = getAnimationFromElement(cursor); | ||
@@ -414,4 +424,3 @@ let oldCurrentTime; | ||
| const removeNode = (node, rootElement) => { | ||
| if (!node) | ||
| return; | ||
| if (!node) return; | ||
| let nodeParent = node.parentNode; | ||
@@ -729,9 +738,10 @@ let nodeToRemove = nodeParent.childNodes.length > 1 || nodeParent.isSameNode(rootElement) ? ( | ||
| let [queueKey, queueItem] = queueItems[index]; | ||
| if (queueItem.done) | ||
| continue; | ||
| if (queueItem.done) continue; | ||
| if (!queueItem.deletable || queueItem.deletable && this.#allChars.length) { | ||
| let newIndex = await this.#fireItemWithContext(index, queueItems); | ||
| Array(newIndex - index).fill(index + 1).map((x, y) => x + y).forEach((i) => { | ||
| let [key] = queueItems[i]; | ||
| cleanUp(key); | ||
| cleanUpSkipped({ | ||
| index, | ||
| newIndex, | ||
| queueItems, | ||
| cleanUp | ||
| }); | ||
@@ -936,4 +946,3 @@ index = newIndex; | ||
| #delete() { | ||
| if (!this.#allChars.length) | ||
| return; | ||
| if (!this.#allChars.length) return; | ||
| if (this.#isInput) { | ||
@@ -940,0 +949,0 @@ this.element.value = this.element.value.slice(0, -1); |
| // TypeIt by Alex MacArthur - https://typeitjs.com | ||
| !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self).TypeIt=t()}(this,(function(){"use strict";const e=e=>Array.isArray(e),t=t=>e(t)?t:[t];const s="data-typeit-id",i="ti-cursor",r={started:!1,completed:!1,frozen:!1,destroyed:!1},n={breakLines:!0,cursor:{autoPause:!0,autoPauseDelay:500,animation:{frames:[0,0,1].map((e=>({opacity:e}))),options:{iterations:1/0,easing:"steps(2, start)",fill:"forwards"}}},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:()=>{}},o=`[${s}]:before {content: '.'; display: inline-block; width: 0; visibility: hidden;}`,a=e=>document.createElement(e),u=e=>document.createTextNode(e),l=(e,t="")=>{let s=a("style");s.id=t,s.appendChild(u(e)),document.head.appendChild(s)},h=t=>(e(t)||(t=[t/2,t/2]),t),d=(e,t)=>Math.abs(Math.random()*(e+t-(e-t))+(e-t));let p=e=>e/2;const c=e=>Array.from(e);let m=e=>([...e.childNodes].forEach((e=>{if(e.nodeValue)return[...e.nodeValue].forEach((t=>{e.parentNode.insertBefore(u(t),e)})),void e.remove();m(e)})),e);const f=e=>{let t=document.implementation.createHTMLDocument();return t.body.innerHTML=e,m(t.body)};function y(e,t=!1,s=!1){let r,n=e.querySelector(`.${i}`),o=document.createTreeWalker(e,NodeFilter.SHOW_ALL,{acceptNode:e=>{if(n&&s){if(e.classList?.contains(i))return NodeFilter.FILTER_ACCEPT;if(n.contains(e))return NodeFilter.FILTER_REJECT}return e.classList?.contains(i)?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}}),a=[];for(;r=o.nextNode();)r.originalParent||(r.originalParent=r.parentNode),a.push(r);return t?a.reverse():a}function g(e,t=!0){return t?y(f(e)):c(e).map(u)}const b=e=>Number.isInteger(e),P=({queueItems:e,selector:t,cursorPosition:s,to:i})=>{if(b(t))return-1*t;let r=new RegExp("END","i").test(i),n=t?[...e].reverse().findIndex((({char:e})=>{let s=e.parentElement,i=s.matches(t);return!(!r||!i)||i&&s.firstChild.isSameNode(e)})):-1;return n<0&&(n=r?0:e.length-1),n-s+(r?0:1)},C=(e,t)=>new Array(t).fill(e);let v=e=>new Promise((t=>{requestAnimationFrame((async()=>{t(await e())}))})),T=e=>e?.getAnimations().find((t=>t.id===e.dataset.tiAnimationId)),w=({cursor:e,frames:t,options:s})=>{let i=e.animate(t,s);return i.pause(),i.id=e.dataset.tiAnimationId,v((()=>{v((()=>{i.play()}))})),i},I=e=>e.func?.call(null),q=async({index:e,queueItems:t,wait:s,cursor:i,cursorOptions:r})=>{let n=t[e][1],o=[],a=e,u=n,l=()=>u&&!u.delay,h=n.shouldPauseCursor()&&r.autoPause;for(;l();)o.push(u),l()&&a++,u=t[a]?t[a][1]:null;if(o.length)return await v((async()=>{for(let e of o)await I(e)})),a-1;let d,p=T(i);return p&&(d={...p.effect.getComputedTiming(),delay:h?r.autoPauseDelay:0}),await s((async()=>{p&&h&&p.cancel(),await v((()=>{I(n)}))}),n.delay),await(({cursor:e,options:t,cursorOptions:s})=>{if(!e||!s)return;let i,r=T(e);r&&(t.delay=r.effect.getComputedTiming().delay,i=r.currentTime,r.cancel());let n=w({cursor:e,frames:s.animation.frames,options:t});return i&&(n.currentTime=i),n})({cursor:i,options:d,cursorOptions:r}),e};const S=e=>"value"in e;let N=e=>"function"==typeof e?e():e,A=(e,t=document,s=!1)=>t["querySelector"+(s?"All":"")](e);const E=(e,t)=>Object.assign({},e,t);let L={"font-family":"","font-weight":"","font-size":"","font-style":"","line-height":"",color:"",transform:"translateX(-.125em)"};return class{element;timeouts;cursorPosition;predictedCursorPosition;statuses={started:!1,completed:!1,frozen:!1,destroyed:!1};opts;id;queue;cursor;unfreeze=()=>{};constructor(e,s={}){var i;this.opts=E(n,s),this.element="string"==typeof(i=e)?A(i):i,this.timeouts=[],this.cursorPosition=0,this.unfreeze=()=>{},this.predictedCursorPosition=null,this.statuses=E({},r),this.id=Math.random().toString().substring(2,9),this.queue=function(e){let s=function(e){return t(e).forEach((e=>n.set(Symbol(e.char?.innerText),i({...e})))),this},i=e=>(e.shouldPauseCursor=function(){return Boolean(this.typeable||this.cursorable||this.deletable)},e),r=()=>Array.from(n.values()),n=new Map;return s(e),{add:s,set:function(e,t){let s=[...n.keys()];n.set(s[e],i(t))},wipe:function(){n=new Map,s(e)},done:(e,t=!1)=>t?n.delete(e):n.get(e).done=!0,reset:function(){n.forEach((e=>delete e.done))},destroy:e=>n.delete(e),getItems:(e=!1)=>e?r():r().filter((e=>!e.done)),getQueue:()=>n,getTypeable:()=>r().filter((e=>e.typeable))}}([{delay:this.opts.startDelay}]),this.#e(s),this.cursor=this.#t(),this.element.dataset.typeitId=this.id,l(o),this.opts.strings.length&&this.#s()}go(){return this.statuses.started?this:(this.#i(),this.opts.waitUntilVisible?(e=this.element,t=this.#r.bind(this),new IntersectionObserver(((s,i)=>{s.forEach((s=>{s.isIntersecting&&(t(),i.unobserve(e))}))}),{threshold:1}).observe(e),this):(this.#r(),this));var e,t}destroy(e=!0){this.timeouts=(this.timeouts.forEach(clearTimeout),[]),N(e)&&this.cursor&&this.#n(this.cursor),this.statuses.destroyed=!0}reset(e){!this.is("destroyed")&&this.destroy(),e?(this.queue.wipe(),e(this)):this.queue.reset(),this.cursorPosition=0;for(let t in this.statuses)this.statuses[t]=!1;return this.element[this.#o()?"value":"innerHTML"]="",this}is=function(e){return this.statuses[e]};type(e,t={}){e=N(e);let{instant:s}=t,i=this.#a(t),r=g(e,this.opts.html).map((e=>{return{func:()=>this.#u(e),char:e,delay:s||(t=e,/<(.+)>(.*?)<\/(.+)>/.test(t.outerHTML))?0:this.#l(),typeable:e.nodeType===Node.TEXT_NODE};var t})),n=[i[0],{func:async()=>await this.opts.beforeString(e,this)},...r,{func:async()=>await this.opts.afterString(e,this)},i[1]];return this.#h(n,t)}break(e={}){return this.#h({func:()=>this.#u(a("BR")),typeable:!0},e)}move(e,t={}){e=N(e);let s=this.#a(t),{instant:i,to:r}=t,n=P({queueItems:this.queue.getTypeable(),selector:null===e?"":e,to:r,cursorPosition:this.#d}),o=n<0?-1:1;return this.predictedCursorPosition=this.#d+n,this.#h([s[0],...C({func:()=>this.#p(o),delay:i?0:this.#l(),cursorable:!0},Math.abs(n)),s[1]],t)}exec(e,t={}){let s=this.#a(t);return this.#h([s[0],{func:()=>e(this)},s[1]],t)}options(e,t={}){return e=N(e),this.#c(e),this.#h({},t)}pause(e,t={}){return this.#h({delay:N(e)},t)}delete(e=null,t={}){e=N(e);let s=this.#a(t),i=e,{instant:r,to:n}=t,o=this.queue.getTypeable(),a=(()=>null===i?o.length:b(i)?i:P({queueItems:o,selector:i,cursorPosition:this.#d,to:n}))();return this.#h([s[0],...C({func:this.#m.bind(this),delay:r?0:this.#l(1),deletable:!0},a),s[1]],t)}freeze(){this.statuses.frozen=!0}flush(e=(()=>{})){return this.#i(),this.#r(!1).then(e),this}getQueue(){return this.queue}getOptions(){return this.opts}updateOptions(e){return this.#c(e)}getElement(){return this.element}empty(e={}){return this.#h({func:this.#f.bind(this)},e)}async#f(){this.#o()?this.element.value="":this.#y.forEach(this.#n.bind(this))}async#r(e=!0){this.statuses.started=!0;let t=t=>{this.queue.done(t,!e)};try{let s=[...this.queue.getQueue()];for(let e=0;e<s.length;e++){let[i,r]=s[e];if(!r.done){if(!r.deletable||r.deletable&&this.#y.length){let i=await this.#g(e,s);Array(i-e).fill(e+1).map(((e,t)=>e+t)).forEach((e=>{let[i]=s[e];t(i)})),e=i}t(i)}}if(!e)return this;if(this.statuses.completed=!0,await this.opts.afterComplete(this),!this.opts.loop)throw"";let i=this.opts.loopDelay;this.#b((async()=>{await this.#P(i[0]),this.#r()}),i[1])}catch(s){}return this}async#p(e){var t,s,r;this.cursorPosition=(t=e,s=this.cursorPosition,r=this.#y,Math.min(Math.max(s+t,0),r.length)),((e,t,s)=>{let r=t[s-1],n=A(`.${i}`,e);(e=r?.parentNode||e).insertBefore(n,r||null)})(this.element,this.#y,this.cursorPosition)}async#P(e){let t=this.#d;t&&await this.#p({value:t});let s=this.#y.map((e=>[Symbol(),{func:this.#m.bind(this),delay:this.#l(1),deletable:!0,shouldPauseCursor:()=>!0}]));for(let i=0;i<s.length;i++)await this.#g(i,s);this.queue.reset(),this.queue.set(0,{delay:e})}#g(e,t){return q({index:e,queueItems:t,wait:this.#b.bind(this),cursor:this.cursor,cursorOptions:this.opts.cursor})}async#b(e,t,s=!1){this.statuses.frozen&&await new Promise((e=>{this.unfreeze=()=>{this.statuses.frozen=!1,e()}})),s||await this.opts.beforeStep(this),await((e,t,s)=>new Promise((i=>{s.push(setTimeout((async()=>{await e(),i()}),t||0))})))(e,t,this.timeouts),s||await this.opts.afterStep(this)}async#i(){if(!this.#o()&&this.cursor&&this.element.appendChild(this.cursor),this.#C){((e,t)=>{let r=`[${s}='${e}'] .${i}`,n=getComputedStyle(t),o=Object.entries(L).reduce(((e,[t,s])=>`${e} ${t}: var(--ti-cursor-${t}, ${s||n[t]});`),"");l(`${r} { display: inline-block; width: 0; ${o} }`,e)})(this.id,this.element),this.cursor.dataset.tiAnimationId=this.id;let{animation:e}=this.opts.cursor,{frames:t,options:r}=e;w({frames:t,cursor:this.cursor,options:{duration:this.opts.cursorSpeed,...r}})}}#o(){return S(this.element)}#h(e,t){return this.queue.add(e),this.#v(t),this}#v(e={}){let t=e.delay;t&&this.queue.add({delay:t})}#a(e={}){return[{func:()=>this.#c(e)},{func:()=>this.#c(this.opts)}]}async#c(e){this.opts=E(this.opts,e)}#s(){let e=this.opts.strings.filter((e=>!!e));e.forEach(((t,s)=>{if(this.type(t),s+1===e.length)return;let i=this.opts.breakLines?[{func:()=>this.#u(a("BR")),typeable:!0}]:C({func:this.#m.bind(this),delay:this.#l(1)},this.queue.getTypeable().length);this.#T(i)}))}#e=e=>{e.cursor=(e=>{if("object"==typeof e){let t={},{frames:s,options:i}=n.cursor.animation;return t.animation=e.animation||{},t.animation.frames=e.animation?.frames||s,t.animation.options=E(i,e.animation?.options||{}),t.autoPause=e.autoPause??n.cursor.autoPause,t.autoPauseDelay=e.autoPauseDelay||n.cursor.autoPauseDelay,t}return!0===e?n.cursor:e})(e.cursor??n.cursor),this.opts.strings=this.#w(t(this.opts.strings)),this.opts=E(this.opts,{html:!this.#I&&this.opts.html,nextStringDelay:h(this.opts.nextStringDelay),loopDelay:h(this.opts.loopDelay)})};#w(e){let t=this.element.innerHTML;return t?(this.element.innerHTML="",this.opts.startDelete?(this.element.innerHTML=t,m(this.element),this.#T(C({func:this.#m.bind(this),delay:this.#l(1),deletable:!0},this.#y.length)),e):(s=t,s.replace(/<!--(.+?)-->/g,"").trim().split(/<br(?:\s*?)(?:\/)?>/)).concat(e)):e;var s}#t(){if(this.#I)return null;let e=a("span");return e.className=i,this.#C?(e.innerHTML=f(this.opts.cursorChar).innerHTML,e):(e.style.visibility="hidden",e)}#T(e){let t=this.opts.nextStringDelay;this.queue.add([{delay:t[0]},...e,{delay:t[1]}])}#u(e){((e,t)=>{if(S(e))return void(e.value=`${e.value}${t.textContent}`);t.innerHTML="";let s=(r=t.originalParent,/body/i.test(r?.tagName)?e:t.originalParent||e);var r;s.insertBefore(t,A("."+i,s)||null)})(this.element,e)}#m(){this.#y.length&&(this.#I?this.element.value=this.element.value.slice(0,-1):this.#n(this.#y[this.cursorPosition]))}#n(e){((e,t)=>{if(!e)return;let s=e.parentNode;(s.childNodes.length>1||s.isSameNode(t)?e:s).remove()})(e,this.element)}#l(e=0){return function(e){let{speed:t,deleteSpeed:s,lifeLike:i}=e;return s=null!==s?s:t/3,i?[d(t,p(t)),d(s,p(s))]:[t,s]}(this.opts)[e]}get#d(){return this.predictedCursorPosition??this.cursorPosition}get#I(){return S(this.element)}get#C(){return!!this.opts.cursor&&!this.#I}get#y(){return e=this.element,S(e)?c(e.value):y(e,!0).filter((e=>!(e.childNodes.length>0)));var e}}})); | ||
| !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self).TypeIt=t()}(this,(function(){"use strict";const e=e=>Array.isArray(e),t=t=>e(t)?t:[t];const s="data-typeit-id",i="ti-cursor",r={started:!1,completed:!1,frozen:!1,destroyed:!1},n={breakLines:!0,cursor:{autoPause:!0,autoPauseDelay:500,animation:{frames:[0,0,1].map((e=>({opacity:e}))),options:{iterations:1/0,easing:"steps(2, start)",fill:"forwards"}}},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:()=>{}},o=`[${s}]:before {content: '.'; display: inline-block; width: 0; visibility: hidden;}`,a=e=>document.createElement(e),u=e=>document.createTextNode(e),l=(e,t="")=>{let s=a("style");s.id=t,s.appendChild(u(e)),document.head.appendChild(s)},h=t=>(e(t)||(t=[t/2,t/2]),t),d=(e,t)=>Math.abs(Math.random()*(e+t-(e-t))+(e-t));let p=e=>e/2;const c=e=>Array.from(e);let m=e=>([...e.childNodes].forEach((e=>{if(e.nodeValue)return[...e.nodeValue].forEach((t=>{e.parentNode.insertBefore(u(t),e)})),void e.remove();m(e)})),e);const f=e=>{let t=document.implementation.createHTMLDocument();return t.body.innerHTML=e,m(t.body)};function y(e,t=!1,s=!1){let r,n=e.querySelector(`.${i}`),o=document.createTreeWalker(e,NodeFilter.SHOW_ALL,{acceptNode:e=>{if(n&&s){if(e.classList?.contains(i))return NodeFilter.FILTER_ACCEPT;if(n.contains(e))return NodeFilter.FILTER_REJECT}return e.classList?.contains(i)?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}}),a=[];for(;r=o.nextNode();)r.originalParent||(r.originalParent=r.parentNode),a.push(r);return t?a.reverse():a}function g(e,t=!0){return t?y(f(e)):c(e).map(u)}const b=({index:e,newIndex:t,queueItems:s,cleanUp:i})=>{for(let r=e+1;r<t+1;r++)i(s[r][0])},P=e=>Number.isInteger(e),C=({queueItems:e,selector:t,cursorPosition:s,to:i})=>{if(P(t))return-1*t;let r=new RegExp("END","i").test(i),n=t?[...e].reverse().findIndex((({char:e})=>{let s=e.parentElement,i=s.matches(t);return!(!r||!i)||i&&s.firstChild.isSameNode(e)})):-1;return n<0&&(n=r?0:e.length-1),n-s+(r?0:1)},I=(e,t)=>new Array(t).fill(e);let v=e=>new Promise((t=>{requestAnimationFrame((async()=>{t(await e())}))})),w=e=>e?.getAnimations().find((t=>t.id===e.dataset.tiAnimationId)),T=({cursor:e,frames:t,options:s})=>{let i=e.animate(t,s);return i.pause(),i.id=e.dataset.tiAnimationId,v((()=>{v((()=>{i.play()}))})),i},q=e=>e.func?.call(null),S=async({index:e,queueItems:t,wait:s,cursor:i,cursorOptions:r})=>{let n=t[e][1],o=[],a=e,u=n,l=()=>u&&!u.delay,h=n.shouldPauseCursor()&&r.autoPause;for(;l();)o.push(u),l()&&a++,u=t[a]?t[a][1]:null;if(o.length)return await v((async()=>{for(let e of o)await q(e)})),a-1;let d,p=w(i);return p&&(d={...p.effect.getComputedTiming(),delay:h?r.autoPauseDelay:0}),await s((async()=>{p&&h&&p.cancel(),await v((()=>{q(n)}))}),n.delay),await(({cursor:e,options:t,cursorOptions:s})=>{if(!e||!s)return;let i,r=w(e);r&&(t.delay=r.effect.getComputedTiming().delay,i=r.currentTime,r.cancel());let n=T({cursor:e,frames:s.animation.frames,options:t});return i&&(n.currentTime=i),n})({cursor:i,options:d,cursorOptions:r}),e};const N=e=>"value"in e;let A=e=>"function"==typeof e?e():e,E=(e,t=document,s=!1)=>t["querySelector"+(s?"All":"")](e);const L=(e,t)=>Object.assign({},e,t);let x={"font-family":"","font-weight":"","font-size":"","font-style":"","line-height":"",color:"",transform:"translateX(-.125em)"};return class{element;timeouts;cursorPosition;predictedCursorPosition;statuses={started:!1,completed:!1,frozen:!1,destroyed:!1};opts;id;queue;cursor;unfreeze=()=>{};constructor(e,s={}){var i;this.opts=L(n,s),this.element="string"==typeof(i=e)?E(i):i,this.timeouts=[],this.cursorPosition=0,this.unfreeze=()=>{},this.predictedCursorPosition=null,this.statuses=L({},r),this.id=Math.random().toString().substring(2,9),this.queue=function(e){let s=function(e){return t(e).forEach((e=>n.set(Symbol(e.char?.innerText),i({...e})))),this},i=e=>(e.shouldPauseCursor=function(){return Boolean(this.typeable||this.cursorable||this.deletable)},e),r=()=>Array.from(n.values()),n=new Map;return s(e),{add:s,set:function(e,t){let s=[...n.keys()];n.set(s[e],i(t))},wipe:function(){n=new Map,s(e)},done:(e,t=!1)=>t?n.delete(e):n.get(e).done=!0,reset:function(){n.forEach((e=>delete e.done))},destroy:e=>n.delete(e),getItems:(e=!1)=>e?r():r().filter((e=>!e.done)),getQueue:()=>n,getTypeable:()=>r().filter((e=>e.typeable))}}([{delay:this.opts.startDelay}]),this.#e(s),this.cursor=this.#t(),this.element.dataset.typeitId=this.id,l(o),this.opts.strings.length&&this.#s()}go(){return this.statuses.started?this:(this.#i(),this.opts.waitUntilVisible?(e=this.element,t=this.#r.bind(this),new IntersectionObserver(((s,i)=>{s.forEach((s=>{s.isIntersecting&&(t(),i.unobserve(e))}))}),{threshold:1}).observe(e),this):(this.#r(),this));var e,t}destroy(e=!0){this.timeouts=(this.timeouts.forEach(clearTimeout),[]),A(e)&&this.cursor&&this.#n(this.cursor),this.statuses.destroyed=!0}reset(e){!this.is("destroyed")&&this.destroy(),e?(this.queue.wipe(),e(this)):this.queue.reset(),this.cursorPosition=0;for(let t in this.statuses)this.statuses[t]=!1;return this.element[this.#o()?"value":"innerHTML"]="",this}is=function(e){return this.statuses[e]};type(e,t={}){e=A(e);let{instant:s}=t,i=this.#a(t),r=g(e,this.opts.html).map((e=>{return{func:()=>this.#u(e),char:e,delay:s||(t=e,/<(.+)>(.*?)<\/(.+)>/.test(t.outerHTML))?0:this.#l(),typeable:e.nodeType===Node.TEXT_NODE};var t})),n=[i[0],{func:async()=>await this.opts.beforeString(e,this)},...r,{func:async()=>await this.opts.afterString(e,this)},i[1]];return this.#h(n,t)}break(e={}){return this.#h({func:()=>this.#u(a("BR")),typeable:!0},e)}move(e,t={}){e=A(e);let s=this.#a(t),{instant:i,to:r}=t,n=C({queueItems:this.queue.getTypeable(),selector:null===e?"":e,to:r,cursorPosition:this.#d}),o=n<0?-1:1;return this.predictedCursorPosition=this.#d+n,this.#h([s[0],...I({func:()=>this.#p(o),delay:i?0:this.#l(),cursorable:!0},Math.abs(n)),s[1]],t)}exec(e,t={}){let s=this.#a(t);return this.#h([s[0],{func:()=>e(this)},s[1]],t)}options(e,t={}){return e=A(e),this.#c(e),this.#h({},t)}pause(e,t={}){return this.#h({delay:A(e)},t)}delete(e=null,t={}){e=A(e);let s=this.#a(t),i=e,{instant:r,to:n}=t,o=this.queue.getTypeable(),a=(()=>null===i?o.length:P(i)?i:C({queueItems:o,selector:i,cursorPosition:this.#d,to:n}))();return this.#h([s[0],...I({func:this.#m.bind(this),delay:r?0:this.#l(1),deletable:!0},a),s[1]],t)}freeze(){this.statuses.frozen=!0}flush(e=()=>{}){return this.#i(),this.#r(!1).then(e),this}getQueue(){return this.queue}getOptions(){return this.opts}updateOptions(e){return this.#c(e)}getElement(){return this.element}empty(e={}){return this.#h({func:this.#f.bind(this)},e)}async#f(){this.#o()?this.element.value="":this.#y.forEach(this.#n.bind(this))}async#r(e=!0){this.statuses.started=!0;let t=t=>{this.queue.done(t,!e)};try{let s=[...this.queue.getQueue()];for(let e=0;e<s.length;e++){let[i,r]=s[e];if(!r.done){if(!r.deletable||r.deletable&&this.#y.length){let i=await this.#g(e,s);b({index:e,newIndex:i,queueItems:s,cleanUp:t}),e=i}t(i)}}if(!e)return this;if(this.statuses.completed=!0,await this.opts.afterComplete(this),!this.opts.loop)throw"";let i=this.opts.loopDelay;this.#b((async()=>{await this.#P(i[0]),this.#r()}),i[1])}catch(s){}return this}async#p(e){var t,s,r;this.cursorPosition=(t=e,s=this.cursorPosition,r=this.#y,Math.min(Math.max(s+t,0),r.length)),((e,t,s)=>{let r=t[s-1],n=E(`.${i}`,e);(e=r?.parentNode||e).insertBefore(n,r||null)})(this.element,this.#y,this.cursorPosition)}async#P(e){let t=this.#d;t&&await this.#p({value:t});let s=this.#y.map((e=>[Symbol(),{func:this.#m.bind(this),delay:this.#l(1),deletable:!0,shouldPauseCursor:()=>!0}]));for(let i=0;i<s.length;i++)await this.#g(i,s);this.queue.reset(),this.queue.set(0,{delay:e})}#g(e,t){return S({index:e,queueItems:t,wait:this.#b.bind(this),cursor:this.cursor,cursorOptions:this.opts.cursor})}async#b(e,t,s=!1){this.statuses.frozen&&await new Promise((e=>{this.unfreeze=()=>{this.statuses.frozen=!1,e()}})),s||await this.opts.beforeStep(this),await((e,t,s)=>new Promise((i=>{s.push(setTimeout((async()=>{await e(),i()}),t||0))})))(e,t,this.timeouts),s||await this.opts.afterStep(this)}async#i(){if(!this.#o()&&this.cursor&&this.element.appendChild(this.cursor),this.#C){((e,t)=>{let r=`[${s}='${e}'] .${i}`,n=getComputedStyle(t),o=Object.entries(x).reduce(((e,[t,s])=>`${e} ${t}: var(--ti-cursor-${t}, ${s||n[t]});`),"");l(`${r} { display: inline-block; width: 0; ${o} }`,e)})(this.id,this.element),this.cursor.dataset.tiAnimationId=this.id;let{animation:e}=this.opts.cursor,{frames:t,options:r}=e;T({frames:t,cursor:this.cursor,options:{duration:this.opts.cursorSpeed,...r}})}}#o(){return N(this.element)}#h(e,t){return this.queue.add(e),this.#I(t),this}#I(e={}){let t=e.delay;t&&this.queue.add({delay:t})}#a(e={}){return[{func:()=>this.#c(e)},{func:()=>this.#c(this.opts)}]}async#c(e){this.opts=L(this.opts,e)}#s(){let e=this.opts.strings.filter((e=>!!e));e.forEach(((t,s)=>{if(this.type(t),s+1===e.length)return;let i=this.opts.breakLines?[{func:()=>this.#u(a("BR")),typeable:!0}]:I({func:this.#m.bind(this),delay:this.#l(1)},this.queue.getTypeable().length);this.#v(i)}))}#e=e=>{e.cursor=(e=>{if("object"==typeof e){let t={},{frames:s,options:i}=n.cursor.animation;return t.animation=e.animation||{},t.animation.frames=e.animation?.frames||s,t.animation.options=L(i,e.animation?.options||{}),t.autoPause=e.autoPause??n.cursor.autoPause,t.autoPauseDelay=e.autoPauseDelay||n.cursor.autoPauseDelay,t}return!0===e?n.cursor:e})(e.cursor??n.cursor),this.opts.strings=this.#w(t(this.opts.strings)),this.opts=L(this.opts,{html:!this.#T&&this.opts.html,nextStringDelay:h(this.opts.nextStringDelay),loopDelay:h(this.opts.loopDelay)})};#w(e){let t=this.element.innerHTML;return t?(this.element.innerHTML="",this.opts.startDelete?(this.element.innerHTML=t,m(this.element),this.#v(I({func:this.#m.bind(this),delay:this.#l(1),deletable:!0},this.#y.length)),e):(s=t,s.replace(/<!--(.+?)-->/g,"").trim().split(/<br(?:\s*?)(?:\/)?>/)).concat(e)):e;var s}#t(){if(this.#T)return null;let e=a("span");return e.className=i,this.#C?(e.innerHTML=f(this.opts.cursorChar).innerHTML,e):(e.style.visibility="hidden",e)}#v(e){let t=this.opts.nextStringDelay;this.queue.add([{delay:t[0]},...e,{delay:t[1]}])}#u(e){((e,t)=>{if(N(e))return void(e.value=`${e.value}${t.textContent}`);t.innerHTML="";let s=(r=t.originalParent,/body/i.test(r?.tagName)?e:t.originalParent||e);var r;s.insertBefore(t,E("."+i,s)||null)})(this.element,e)}#m(){this.#y.length&&(this.#T?this.element.value=this.element.value.slice(0,-1):this.#n(this.#y[this.cursorPosition]))}#n(e){((e,t)=>{if(!e)return;let s=e.parentNode;(s.childNodes.length>1||s.isSameNode(t)?e:s).remove()})(e,this.element)}#l(e=0){return function(e){let{speed:t,deleteSpeed:s,lifeLike:i}=e;return s=null!==s?s:t/3,i?[d(t,p(t)),d(s,p(s))]:[t,s]}(this.opts)[e]}get#d(){return this.predictedCursorPosition??this.cursorPosition}get#T(){return N(this.element)}get#C(){return!!this.opts.cursor&&!this.#T}get#y(){return e=this.element,N(e)?c(e.value):y(e,!0).filter((e=>!(e.childNodes.length>0)));var e}}})); |
@@ -1,2 +0,1 @@ | ||
| /// <reference types="web-animations-js" /> | ||
| export type Character = { | ||
@@ -3,0 +2,0 @@ node: El | null; |
| { | ||
| "name": "typeit", | ||
| "version": "8.8.3", | ||
| "version": "8.8.4", | ||
| "description": "The most versatile animated typing utility on the planet.", | ||
@@ -42,6 +42,6 @@ "author": "Alex MacArthur <alex@macarthur.me> (https://macarthur.me)", | ||
| "devDependencies": { | ||
| "terser": "^5.26.0", | ||
| "typescript": "^5.3.3", | ||
| "vite": "^5.0.11", | ||
| "vitest": "^1.2.0" | ||
| "terser": "^5.31.3", | ||
| "typescript": "^5.5.4", | ||
| "vite": "^5.3.4", | ||
| "vitest": "^2.0.4" | ||
| }, | ||
@@ -48,0 +48,0 @@ "dependencies": { |
@@ -10,3 +10,3 @@ import { El } from "../types"; | ||
| shouldReverse: boolean = false, | ||
| shouldIncludeCursor: boolean = false | ||
| shouldIncludeCursor: boolean = false, | ||
| ): El[] { | ||
@@ -71,5 +71,5 @@ let cursor = (element as HTMLElement).querySelector(`.${CURSOR_CLASS}`); | ||
| str: string, | ||
| asHtml = true | ||
| asHtml = true, | ||
| ): Partial<El>[] { | ||
| return asHtml ? chunkStringAsHtml(str) : toArray(str).map(createTextNode); | ||
| } |
@@ -11,3 +11,3 @@ export default (element: HTMLElement, func: Function): void => { | ||
| }, | ||
| { threshold: 1.0 } | ||
| { threshold: 1.0 }, | ||
| ); | ||
@@ -14,0 +14,0 @@ |
@@ -16,3 +16,3 @@ import isInput from "./isInput"; | ||
| return walkElementNodes(element, true).filter( | ||
| (c) => !(c.childNodes.length > 0) | ||
| (c) => !(c.childNodes.length > 0), | ||
| ); | ||
@@ -19,0 +19,0 @@ }; |
@@ -28,3 +28,3 @@ import isInput from "./isInput"; | ||
| character as El, | ||
| (select("." + CURSOR_CLASS, target) as Node) || null | ||
| (select("." + CURSOR_CLASS, target) as Node) || null, | ||
| ); | ||
@@ -31,0 +31,0 @@ }; |
@@ -1,3 +0,3 @@ | ||
| export default (el: HTMLElement): el is HTMLInputElement => { | ||
| return "value" in el; | ||
| } | ||
| export default (el: HTMLElement): el is HTMLInputElement => { | ||
| return "value" in el; | ||
| }; |
@@ -6,3 +6,3 @@ import { DEFAULT_OPTIONS } from "../constants"; | ||
| let processCursorOptions = ( | ||
| cursorOptions: boolean | CursorOptions | ||
| cursorOptions: boolean | CursorOptions, | ||
| ): boolean | CursorOptions => { | ||
@@ -19,3 +19,3 @@ if (typeof cursorOptions === "object") { | ||
| defaultOptions, | ||
| cursorOptions.animation?.options || {} | ||
| cursorOptions.animation?.options || {}, | ||
| ); | ||
@@ -22,0 +22,0 @@ newOptions.autoPause = |
| export default (value: number, range: number): number => { | ||
| return Math.abs( | ||
| Math.random() * (value + range - (value - range)) + (value - range) | ||
| Math.random() * (value + range - (value - range)) + (value - range), | ||
| ); | ||
| }; |
@@ -8,3 +8,3 @@ import { CURSOR_CLASS } from "../constants"; | ||
| allChars: any[], | ||
| newCursorPosition: number | ||
| newCursorPosition: number, | ||
| ): void => { | ||
@@ -11,0 +11,0 @@ let nodeToInsertBefore = allChars[newCursorPosition - 1]; |
| let select = ( | ||
| selector: string, | ||
| element: Node = document, | ||
| all: boolean = false | ||
| all: boolean = false, | ||
| ): Node | NodeList | null => { | ||
@@ -6,0 +6,0 @@ return element[`querySelector${all ? "All" : ""}`](selector); |
@@ -25,3 +25,3 @@ import { CURSOR_CLASS, DATA_ATTRIBUTE } from "../constants"; | ||
| }, | ||
| "" | ||
| "", | ||
| ); | ||
@@ -32,4 +32,4 @@ | ||
| `${cursorSelector} { display: inline-block; width: 0; ${customProperties} }`, | ||
| id | ||
| id, | ||
| ); | ||
| }; |
| let updateCursorPosition = ( | ||
| steps: number, | ||
| cursorPosition: number, | ||
| printedCharacters: Element[] | ||
| printedCharacters: Element[], | ||
| ) => { | ||
| return Math.min( | ||
| Math.max(cursorPosition + steps, 0), | ||
| printedCharacters.length | ||
| printedCharacters.length, | ||
| ); | ||
@@ -10,0 +10,0 @@ }; |
@@ -7,3 +7,3 @@ /** | ||
| delay: number | undefined, | ||
| timeouts: number[] | ||
| timeouts: number[], | ||
| ) => { | ||
@@ -10,0 +10,0 @@ return new Promise<void>((resolve) => { |
@@ -13,2 +13,3 @@ import Queue, { QueueI } from "./Queue"; | ||
| import { maybeChunkStringAsHtml } from "./helpers/chunkStrings"; | ||
| import cleanUpSkipped from "./helpers/cleanUpSkipped"; | ||
| import countStepsToSelector from "./helpers/countStepsToSelector"; | ||
@@ -179,3 +180,3 @@ import createElement from "./helpers/createElement"; | ||
| }, | ||
| actionOpts | ||
| actionOpts, | ||
| ); | ||
@@ -186,3 +187,3 @@ } | ||
| movementArg: string | number | (() => string | number) | null, | ||
| actionOpts: ActionOpts = {} | ||
| actionOpts: ActionOpts = {}, | ||
| ) { | ||
@@ -213,7 +214,7 @@ movementArg = handleFunctionalArg<string | number>(movementArg); | ||
| }, | ||
| Math.abs(numberOfSteps) | ||
| Math.abs(numberOfSteps), | ||
| ), | ||
| bookEndQueueItems[1], | ||
| ], | ||
| actionOpts | ||
| actionOpts, | ||
| ); | ||
@@ -227,3 +228,3 @@ } | ||
| [bookEndQueueItems[0], { func: () => func(this) }, bookEndQueueItems[1]], | ||
| actionOpts | ||
| actionOpts, | ||
| ); | ||
@@ -243,3 +244,3 @@ } | ||
| { delay: handleFunctionalArg<number>(milliseconds) }, | ||
| actionOpts | ||
| actionOpts, | ||
| ); | ||
@@ -250,3 +251,3 @@ } | ||
| numCharacters: number | string | (() => number | null) = null, | ||
| actionOpts: ActionOpts = {} | ||
| actionOpts: ActionOpts = {}, | ||
| ) { | ||
@@ -285,7 +286,7 @@ numCharacters = handleFunctionalArg<number>(numCharacters); | ||
| }, | ||
| rounds | ||
| rounds, | ||
| ), | ||
| bookEndQueueItems[1], | ||
| ], | ||
| actionOpts | ||
| actionOpts, | ||
| ); | ||
@@ -355,13 +356,3 @@ } | ||
| // @todo remove this eventually.. | ||
| // console.log( | ||
| // "Total time:", | ||
| // queueItems.reduce((total, step) => { | ||
| // total = total + step.delay; | ||
| // return total; | ||
| // }, 0) | ||
| // ); | ||
| let cleanUp = (qKey) => { | ||
| let cleanUp = (qKey: Symbol) => { | ||
| this.queue.done(qKey, !remember); | ||
@@ -389,16 +380,9 @@ }; | ||
| // Ensure each skipped item goes through the cleanup process, | ||
| // so that methods like .flush() don't get messed up. There | ||
| // should only be a difference if the cursor moved. | ||
| // | ||
| // @todo Refactor this. Gotta be a more efficient way. | ||
| Array(newIndex - index) | ||
| .fill(index + 1) | ||
| .map((x, y) => x + y) | ||
| .forEach((i) => { | ||
| let [key] = queueItems[i]; | ||
| cleanUpSkipped({ | ||
| index, | ||
| newIndex, | ||
| queueItems, | ||
| cleanUp, | ||
| }); | ||
| cleanUp(key); | ||
| }); | ||
| index = newIndex; | ||
@@ -437,3 +421,3 @@ } | ||
| this.cursorPosition, | ||
| this.#allChars | ||
| this.#allChars, | ||
| ); | ||
@@ -482,3 +466,3 @@ | ||
| index: number, | ||
| queueItems: QueueMapPair[] | ||
| queueItems: QueueMapPair[], | ||
| ): Promise<number> { | ||
@@ -497,3 +481,3 @@ return fireItem({ | ||
| delay: number | undefined, | ||
| silent: boolean = false | ||
| silent: boolean = false, | ||
| ): Promise<void> { | ||
@@ -592,3 +576,3 @@ if (this.statuses.frozen) { | ||
| }, | ||
| this.queue.getTypeable().length | ||
| this.queue.getTypeable().length, | ||
| ); | ||
@@ -602,7 +586,7 @@ | ||
| options.cursor = processCursorOptions( | ||
| options.cursor ?? DEFAULT_OPTIONS.cursor | ||
| options.cursor ?? DEFAULT_OPTIONS.cursor, | ||
| ); | ||
| this.opts.strings = this.#prependHardcodedStrings( | ||
| asArray<string>(this.opts.strings) | ||
| asArray<string>(this.opts.strings), | ||
| ); | ||
@@ -640,4 +624,4 @@ | ||
| }, | ||
| this.#allChars.length | ||
| ) | ||
| this.#allChars.length, | ||
| ), | ||
| ); | ||
@@ -691,3 +675,5 @@ | ||
| if (this.#isInput) { | ||
| (this.element as HTMLInputElement).value = ((this.element as HTMLInputElement).value as string).slice(0, -1); | ||
| (this.element as HTMLInputElement).value = ( | ||
| (this.element as HTMLInputElement).value as string | ||
| ).slice(0, -1); | ||
| } else { | ||
@@ -694,0 +680,0 @@ this.#removeNode(this.#allChars[this.cursorPosition]); |
@@ -80,3 +80,5 @@ export type Character = { | ||
| export type El = (HTMLElement | HTMLInputElement) & { originalParent?: HTMLElement }; | ||
| export type El = (HTMLElement | HTMLInputElement) & { | ||
| originalParent?: HTMLElement; | ||
| }; | ||
@@ -83,0 +85,0 @@ // export type NewEl = (HTMLElement | HTMLInputElement) & { originalParent?: HTMLElement }; |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by0.44%
92306
- Number of package files
- increased by2.15%
95
- Lines of code
- increased by0.96%
2623
No dependency changes