@i-is-as-i-does/valva/dist/Valva.min.js

Vâlvă is a small JS library for elegant transitions.

!function(global,factory){"object"==typeof exports&&"undefined"!=typeof module?factory(exports):"function"==typeof define&&define.amd?define(["exports"],factory):factory((global="undefined"!=typeof globalThis?globalThis:global||self).Valva={})}(this,(function(exports){"use strict";const props={spacing:["padding-top","padding-bottom","margin-top","margin-bottom"],transitions:["transition-duration","transition-timing-function","transition-property"],heights:["height","overflow"]},slide={target:"height, margin, padding",toReset:["height"].concat(props.spacing),removeInFirst:props.spacing,removeInThen:props.heights.concat(props.transitions),removeOut:props.heights.concat(props.spacing,props.transitions)},fade={target:"opacity",toReset:["opacity"],removeInFirst:["opacity"],removeInThen:props.transitions,removeOut:["opacity"].concat(props.transitions)},ease={target:slide.target+", "+fade.target,toReset:["opacity"].concat(slide.toReset),removeInFirst:props.spacing.concat(["opacity"]),removeInThen:slide.removeInThen,removeOut:["opacity"].concat(slide.removeOut)},profl={slide:slide,fade:fade,ease:ease},deflt_type="ease",deflt_duration=300,deflt_callback=null,deflt_timing="ease-in-out",deflt_delay=1e3,deflt_reverse=!1,deflt_prepend=!1;function isHidden(elm){if(!elm)return!1;do{if(elm instanceof Element){if(elm.hidden||!elm.offsetHeight)return!0;var style=window.getComputedStyle(elm);if("0"===style.width||"0"===style.height||"0"===style.opacity||"none"===style.display||"hidden"===style.visibility)return!0}}while(elm=elm.parentNode);return!1}function resetDisplay(elm){elm.style.removeProperty("display");let display=window.getComputedStyle(elm).display;"none"===display&&(display="block"),elm.style.display=display}function setTransition(elm,type,duration,timing){elm.style.setProperty("transition-property",profl[type].target),elm.style.setProperty("transition-timing-function",timing),elm.style.setProperty("transition-duration",duration+"ms")}function resetStyle(elm,type){profl[type].toReset.forEach(p=>{elm.style.setProperty(p,0)})}function removeProp(elm,type,key){profl[type][key].forEach(p=>{elm.style.removeProperty(p)})}function changeThenAct(parent,child,placeAction,placeCallBack){parent instanceof Element||(parent=document.body);var tmpclass="m"+Math.random().toString(20).substring(2);return child.classList.add(tmpclass),new Promise(resolve=>{var observer=new MutationObserver(()=>{parent.querySelector("."+tmpclass)&&(child.classList.remove(tmpclass),observer.disconnect(),placeCallBack(),resolve(!0))});observer.observe(parent,{childList:!0}),placeAction()})}function vHide(elm,type=deflt_type,duration=deflt_duration,callback=null,timing=deflt_timing){setTransition(elm,type,duration,timing),"fade"!==type&&(elm.style.setProperty("box-sizing","border-box"),elm.style.setProperty("height",elm.offsetHeight+"px"),elm.offsetHeight,elm.style.setProperty("overflow","hidden")),resetStyle(elm,type),window.setTimeout(()=>{elm.style.setProperty("display","none"),removeProp(elm,type,"removeOut"),"function"==typeof callback&&callback()},duration)}function vShow(elm,type=deflt_type,duration=deflt_duration,callback=null,timing=deflt_timing){if("fade"===type)resetStyle(elm,"fade"),resetDisplay(elm),setTransition(elm,"fade",duration,timing);else{resetDisplay(elm);var height=elm.offsetHeight;elm.style.setProperty("overflow","hidden"),resetStyle(elm,type),elm.offsetHeight,elm.style.setProperty("box-sizing","border-box"),setTransition(elm,type,duration,timing),elm.style.setProperty("height",height+"px")}removeProp(elm,type,"removeInFirst"),window.setTimeout(()=>{removeProp(elm,type,"removeInThen"),"function"==typeof callback&&callback()},duration)}function vToggle(elm,type=deflt_type,duration=deflt_duration,callback=null,timing=deflt_timing){isHidden(elm)?vShow(elm,type,duration,callback,timing):vHide(elm,type,duration,callback,timing)}function vTempToggle(elm,type=deflt_type,delay=deflt_delay,duration=deflt_duration,callback=null,timing=deflt_timing){var methods=[vHide,vShow];isHidden(elm)&&methods.reverse();var transcallback=function(){"function"==typeof callback&&callback(),window.setTimeout(()=>{methods[1](elm,type,duration,callback,timing)},delay)};methods[0](elm,type,duration,transcallback,timing)}function vToggleResolve(elm,callback=null,type=deflt_type,duration=deflt_duration,timing=deflt_timing,reverse=!1){"function"!=typeof callback&&(callback=function(){});var methods=[vHide,vShow];reverse&&methods.reverse(),methods[0](elm,type,duration,(function(){Promise.resolve(callback()).then(()=>methods[1](elm,type,duration,null,timing))}),timing)}function vPlace(parent,child,prepend=!1,type=deflt_type,duration=deflt_duration,callback=null,timing=deflt_timing){var placeAction,placeCallback;child.style.setProperty("display","none"),placeAction=prepend?function(){parent.prepend(child)}:function(){parent.append(child)},changeThenAct(parent,child,placeAction,(function(){vShow(child,type,duration,callback,timing)}))}function vReplace(oldElm,newElm,duration=deflt_duration,callback=null,timing=deflt_timing){newElm.style.opacity=0;var parent=oldElm.parentNode,preh=oldElm.offsetHeight,placeAction=function(){oldElm.replaceWith(newElm)},placeCallback=function(){vShowAdapt(newElm,preh,duration,callback,timing)},transcallback;vHide(oldElm,"fade",duration,(function(){changeThenAct(parent,newElm,placeAction,placeCallback)}),timing)}function vShowAdapt(elm,prevHeight,duration=deflt_duration,callback=null,timing=deflt_timing){var type="ease";elm.offsetHeight===prevHeight&&(type="fade"),vShow(elm,type,duration,callback,timing)}function vSplitFlap(elm,text,speed=20){var ntext=elm.textContent.split(""),stext=text.split(""),prevLen=ntext.length,newLen=stext.length,l,stop,solve;prevLen>newLen?(l=prevLen,stop=0,solve=function(){l>newLen?ntext.pop():ntext[l-1]=stext[l-1],l--}):(l=0,stop=newLen,solve=function(){l<prevLen?ntext[l]=stext[l]:ntext.push(stext[l]),l++});var repl=setInterval((function(){solve(),elm.textContent=ntext.join(""),l===stop&&clearInterval(repl)}),speed)}exports.vHide=vHide,exports.vPlace=vPlace,exports.vReplace=vReplace,exports.vShow=vShow,exports.vShowAdapt=vShowAdapt,exports.vSplitFlap=vSplitFlap,exports.vTempToggle=vTempToggle,exports.vToggle=vToggle,exports.vToggleResolve=vToggleResolve,Object.defineProperty(exports,"__esModule",{value:!0})}));