react-motion-prefixed
Version:
A spring that solves your animation problems.
2 lines (1 loc) • 14.1 kB
JavaScript
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).ReactMotion={},e.React)}(this,function(e,t){"use strict";function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=n(t);function p(){return(p=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n,r=arguments[t];for(n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e}).apply(this,arguments)}function a(e,t){return(a=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function l(e,t){e.prototype=Object.create(t.prototype),a(e.prototype.constructor=e,t)}function I(e){var t,n={};for(t in e)Object.prototype.hasOwnProperty.call(e,t)&&(n[t]=0);return n}function o(e){var t,n={};for(t in e)Object.prototype.hasOwnProperty.call(e,t)&&(n[t]="number"==typeof e[t]?e[t]:e[t].val);return n}var s=[0,0];function D(e,t,n,r,a,l,i){a=n+(-a*(t-r)+-l*n)*e,l=t+a*e;return Math.abs(a)<i&&Math.abs(l-r)<i?(s[0]=r,s[1]=0):(s[0]=l,s[1]=a),s}for(var i,u,c,t="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:{},f={exports:{}},k=(!function(){var e,t,n,r,a,l;"undefined"!=typeof performance&&null!==performance&&performance.now?f.exports=function(){return performance.now()}:"undefined"!=typeof process&&null!==process&&process.hrtime?(f.exports=function(){return(e()-a)/1e6},t=process.hrtime,r=(e=function(){var e=t();return 1e9*e[0]+e[1]})(),l=1e9*process.uptime(),a=r-l):n=Date.now?(f.exports=function(){return Date.now()-n},Date.now()):(f.exports=function(){return(new Date).getTime()-n},(new Date).getTime())}.call(t),f.exports),y={exports:{}},m=f.exports,d="undefined"==typeof window?t:window,h=["moz","webkit"],v="AnimationFrame",S=d["request"+v],g=d["cancel"+v]||d["cancelRequest"+v],T=0;!S&&T<h.length;T++)S=d[h[T]+"Request"+v],g=d[h[T]+"Cancel"+v]||d[h[T]+"CancelRequest"+v];S&&g||(u=i=0,c=[],S=function(e){var t,n;return 0===c.length&&(t=m(),n=Math.max(0,1e3/60-(t-i)),i=n+t,setTimeout(function(){for(var e=c.slice(0),t=c.length=0;t<e.length;t++)if(!e[t].cancelled)try{e[t].callback(i)}catch(e){setTimeout(function(){throw e},0)}},Math.round(n))),c.push({handle:++u,callback:e,cancelled:!1}),u},g=function(e){for(var t=0;t<c.length;t++)c[t].handle===e&&(c[t].cancelled=!0)}),y.exports=function(e){return S.call(d,e)},y.exports.cancel=function(){g.apply(d,arguments)},y.exports.polyfill=function(e){(e=e||d).requestAnimationFrame=S,e.cancelAnimationFrame=g};var P=y.exports;function O(e,t,n){for(var r in t)if(Object.prototype.hasOwnProperty.call(t,r)){if(0!==n[r])return;var a="number"==typeof t[r]?t[r]:t[r].val;if(e[r]!==a)return}return 1}var b=1e3/60,t=function(t){function e(e){var v=t.call(this,e)||this;return v.unmounting=!1,v.wasAnimating=!1,v.animationID=null,v.prevTime=0,v.accumulatedTime=0,v.unreadPropStyle=null,v.clearUnreadPropStyle=function(e){var t,n,r=!1,a=v.state,l=a.currentStyle,i=a.currentVelocity,o=a.lastIdealStyle,s=a.lastIdealVelocity;for(t in e)Object.prototype.hasOwnProperty.call(e,t)&&("number"==typeof(n=e[t])&&(r||(r=!0,l=p({},l),i=p({},i),o=p({},o),s=p({},s)),l[t]=n,i[t]=0,o[t]=n,s[t]=0));r&&v.setState({currentStyle:l,currentVelocity:i,lastIdealStyle:o,lastIdealVelocity:s})},v.startAnimationIfNecessary=function(){v.unmounting||null!=v.animationID||(v.animationID=P(function(e){if(!v.unmounting){var t=v.props.style;if(O(v.state.currentStyle,t,v.state.currentVelocity))return v.wasAnimating&&v.props.onRest&&v.props.onRest(),v.animationID=null,v.wasAnimating=!1,void(v.accumulatedTime=0);v.wasAnimating=!0;var e=e||k(),n=e-v.prevTime;if(v.prevTime=e,v.accumulatedTime=v.accumulatedTime+n,v.accumulatedTime>10*b&&(v.accumulatedTime=0),0===v.accumulatedTime)return v.animationID=null,void v.startAnimationIfNecessary();var r,a=(v.accumulatedTime-Math.floor(v.accumulatedTime/b)*b)/b,l=Math.floor(v.accumulatedTime/b),i={},o={},s={},u={};for(r in t)if(Object.prototype.hasOwnProperty.call(t,r)){var c=t[r];if("number"==typeof c)s[r]=c,u[r]=0,i[r]=c,o[r]=0;else{for(var f=v.state.lastIdealStyle[r],p=v.state.lastIdealVelocity[r],y=0;y<l;y++)var m=D(b/1e3,f,p,c.val,c.stiffness,c.damping,c.precision),f=m[0],p=m[1];var d=D(b/1e3,f,p,c.val,c.stiffness,c.damping,c.precision),h=d[0],d=d[1];s[r]=f+(h-f)*a,u[r]=p+(d-p)*a,i[r]=f,o[r]=p}}v.animationID=null,v.accumulatedTime-=l*b,v.setState({currentStyle:s,currentVelocity:u,lastIdealStyle:i,lastIdealVelocity:o}),v.unreadPropStyle=null,v.startAnimationIfNecessary()}}))},v.state=v.defaultState(),v}l(e,t);var n=e.prototype;return n.defaultState=function(){var e=this.props,t=e.defaultStyle,e=e.style,t=t||o(e),e=I(t);return{currentStyle:t,currentVelocity:e,lastIdealStyle:t,lastIdealVelocity:e}},n.componentDidMount=function(){this.prevTime=k(),this.startAnimationIfNecessary()},n.UNSAFE_componentWillReceiveProps=function(e){null!=this.unreadPropStyle&&this.clearUnreadPropStyle(this.unreadPropStyle),this.unreadPropStyle=e.style,null==this.animationID&&(this.prevTime=k(),this.startAnimationIfNecessary())},n.componentWillUnmount=function(){this.unmounting=!0,null!=this.animationID&&(P.cancel(this.animationID),this.animationID=null)},n.render=function(){var e=this.props.children(this.state.currentStyle);return e&&r.default.Children.only(e)},e}(r.default.Component),w=1e3/60;y=function(t){function e(e){var b=t.call(this,e)||this;return b.unmounting=!1,b.animationID=null,b.prevTime=0,b.accumulatedTime=0,b.unreadPropStyles=null,b.clearUnreadPropStyle=function(e){for(var t=b.state,n=t.currentStyles,r=t.currentVelocities,a=t.lastIdealStyles,l=t.lastIdealVelocities,i=!1,o=0;o<e.length;o++){var s,u,c=e[o],f=!1;for(s in c)Object.prototype.hasOwnProperty.call(c,s)&&("number"==typeof(u=c[s])&&(f||(i=f=!0,n[o]=p({},n[o]),r[o]=p({},r[o]),a[o]=p({},a[o]),l[o]=p({},l[o])),n[o][s]=u,r[o][s]=0,a[o][s]=u,l[o][s]=0))}i&&b.setState({currentStyles:n,currentVelocities:r,lastIdealStyles:a,lastIdealVelocities:l})},b.startAnimationIfNecessary=function(){b.unmounting||null!=b.animationID||(b.animationID=P(function(e){if(!b.unmounting){var t=b.props.styles(b.state.lastIdealStyles);if(function(e,t,n){for(var r=0;r<e.length;r++)if(!O(e[r],t[r],n[r]))return;return 1}(b.state.currentStyles,t,b.state.currentVelocities))return b.animationID=null,void(b.accumulatedTime=0);var e=e||k(),n=e-b.prevTime;if(b.prevTime=e,b.accumulatedTime=b.accumulatedTime+n,b.accumulatedTime>10*w&&(b.accumulatedTime=0),0===b.accumulatedTime)return b.animationID=null,void b.startAnimationIfNecessary();for(var r=(b.accumulatedTime-Math.floor(b.accumulatedTime/w)*w)/w,a=Math.floor(b.accumulatedTime/w),l=[],i=[],o=[],s=[],u=0;u<t.length;u++){var c,f=t[u],p={},y={},m={},d={};for(c in f)if(Object.prototype.hasOwnProperty.call(f,c)){var h=f[c];if("number"==typeof h)p[c]=h,y[c]=0,m[c]=h,d[c]=0;else{for(var v=b.state.lastIdealStyles[u][c],S=b.state.lastIdealVelocities[u][c],I=0;I<a;I++)var g=D(w/1e3,v,S,h.val,h.stiffness,h.damping,h.precision),v=g[0],S=g[1];var T=D(w/1e3,v,S,h.val,h.stiffness,h.damping,h.precision),P=T[0],T=T[1];p[c]=v+(P-v)*r,y[c]=S+(T-S)*r,m[c]=v,d[c]=S}}o[u]=p,s[u]=y,l[u]=m,i[u]=d}b.animationID=null,b.accumulatedTime-=a*w,b.setState({currentStyles:o,currentVelocities:s,lastIdealStyles:l,lastIdealVelocities:i}),b.unreadPropStyles=null,b.startAnimationIfNecessary()}}))},b.state=b.defaultState(),b}l(e,t);var n=e.prototype;return n.defaultState=function(){var e=this.props,t=e.defaultStyles,e=e.styles,t=t||e().map(o),e=t.map(I);return{currentStyles:t,currentVelocities:e,lastIdealStyles:t,lastIdealVelocities:e}},n.componentDidMount=function(){this.prevTime=k(),this.startAnimationIfNecessary()},n.UNSAFE_componentWillReceiveProps=function(e){null!=this.unreadPropStyles&&this.clearUnreadPropStyle(this.unreadPropStyles),this.unreadPropStyles=e.styles(this.state.lastIdealStyles),null==this.animationID&&(this.prevTime=k(),this.startAnimationIfNecessary())},n.componentWillUnmount=function(){this.unmounting=!0,null!=this.animationID&&(P.cancel(this.animationID),this.animationID=null)},n.render=function(){var e=this.props.children(this.state.currentStyles);return e&&r.default.Children.only(e)},e}(r.default.Component);var V=1e3/60;function A(e,t,r){var a=t;return null==a?e.map(function(e,t){return{key:e.key,data:e.data,style:r[t]}}):e.map(function(e,t){for(var n=0;n<a.length;n++)if(a[n].key===e.key)return{key:a[n].key,data:a[n].data,style:r[t]};return{key:e.key,data:e.data,style:r[t]}})}function j(e,r,a,t,n,l,i,o,s){for(var u=function(e,c,t){for(var f={},n=0;n<e.length;n++)f[e[n].key]=n;for(var p={},r=0;r<c.length;r++)p[c[r].key]=r;for(var a=[],l=0;l<c.length;l++)a[l]=c[l];for(var i,o=0;o<e.length;o++)Object.prototype.hasOwnProperty.call(p,e[o].key)||null!=(i=t(o,e[o]))&&a.push(i);return a.sort(function(e,t){var n=p[e.key],r=p[t.key],a=f[e.key],l=f[t.key];if(null!=n&&null!=r)return p[e.key]-p[t.key];if(null!=a&&null!=l)return f[e.key]-f[t.key];if(null!=n){for(var i=0;i<c.length;i++){var o=c[i].key;if(Object.prototype.hasOwnProperty.call(f,o)){if(n<p[o]&&l>f[o])return-1;if(n>p[o]&&l<f[o])return 1}}return 1}for(var s=0;s<c.length;s++){var u=c[s].key;if(Object.prototype.hasOwnProperty.call(f,u)){if(r<p[u]&&a>f[u])return 1;if(r>p[u]&&a<f[u])return-1}}return-1})}(t,n,function(e,t){var n=r(t);return null==n||O(l[e],n,i[e])?(a({key:t.key,data:t.data}),null):{key:t.key,data:t.data,style:n}}),c=[],f=[],p=[],y=[],m=0;m<u.length;m++){for(var d,h=u[m],v=null,S=0;S<t.length;S++)if(t[S].key===h.key){v=S;break}null==v?(d=e(h),c[m]=d,p[m]=d,d=I(h.style),f[m]=d,y[m]=d):(c[m]=l[v],p[m]=o[v],f[m]=i[v],y[m]=s[v])}return[u,c,f,p,y]}var M=function(t){function e(e){var w=t.call(this,e)||this;return w.unmounting=!1,w.animationID=null,w.prevTime=0,w.accumulatedTime=0,w.unreadPropStyles=null,w.clearUnreadPropStyle=function(e){for(var t=j(w.props.willEnter,w.props.willLeave,w.props.didLeave,w.state.mergedPropsStyles,e,w.state.currentStyles,w.state.currentVelocities,w.state.lastIdealStyles,w.state.lastIdealVelocities),n=t[0],r=t[1],a=t[2],l=t[3],i=t[4],o=0;o<e.length;o++){var s,u,c=e[o].style,f=!1;for(s in c)Object.prototype.hasOwnProperty.call(c,s)&&("number"==typeof(u=c[s])&&(f||(f=!0,r[o]=p({},r[o]),a[o]=p({},a[o]),l[o]=p({},l[o]),i[o]=p({},i[o]),n[o]={key:n[o].key,data:n[o].data,style:p({},n[o].style)}),r[o][s]=u,a[o][s]=0,l[o][s]=u,i[o][s]=0,n[o].style[s]=u))}w.setState({currentStyles:r,currentVelocities:a,mergedPropsStyles:n,lastIdealStyles:l,lastIdealVelocities:i})},w.startAnimationIfNecessary=function(){w.unmounting||null!=w.animationID||(w.animationID=P(function(e){if(!w.unmounting){var t=w.props.styles,t="function"==typeof t?t(A(w.state.mergedPropsStyles,w.unreadPropStyles,w.state.lastIdealStyles)):t;if(function(e,t,n,r){if(r.length===t.length){for(var a=0;a<r.length;a++)if(r[a].key!==t[a].key)return;for(var l=0;l<r.length;l++)if(!O(e[l],t[l].style,n[l]))return;return 1}}(w.state.currentStyles,t,w.state.currentVelocities,w.state.mergedPropsStyles))return w.animationID=null,void(w.accumulatedTime=0);var e=e||k(),n=e-w.prevTime;if(w.prevTime=e,w.accumulatedTime=w.accumulatedTime+n,w.accumulatedTime>10*V&&(w.accumulatedTime=0),0===w.accumulatedTime)return w.animationID=null,void w.startAnimationIfNecessary();for(var r=(w.accumulatedTime-Math.floor(w.accumulatedTime/V)*V)/V,a=Math.floor(w.accumulatedTime/V),e=j(w.props.willEnter,w.props.willLeave,w.props.didLeave,w.state.mergedPropsStyles,t,w.state.currentStyles,w.state.currentVelocities,w.state.lastIdealStyles,w.state.lastIdealVelocities),l=e[0],i=e[1],o=e[2],s=e[3],u=e[4],c=0;c<l.length;c++){var f,p=l[c].style,y={},m={},d={},h={};for(f in p)if(Object.prototype.hasOwnProperty.call(p,f)){var v=p[f];if("number"==typeof v)y[f]=v,m[f]=0,d[f]=v,h[f]=0;else{for(var S=s[c][f],I=u[c][f],g=0;g<a;g++)var T=D(V/1e3,S,I,v.val,v.stiffness,v.damping,v.precision),S=T[0],I=T[1];var P=D(V/1e3,S,I,v.val,v.stiffness,v.damping,v.precision),b=P[0],P=P[1];y[f]=S+(b-S)*r,m[f]=I+(P-I)*r,d[f]=S,h[f]=I}}s[c]=d,u[c]=h,i[c]=y,o[c]=m}w.animationID=null,w.accumulatedTime-=a*V,w.setState({currentStyles:i,currentVelocities:o,lastIdealStyles:s,lastIdealVelocities:u,mergedPropsStyles:l}),w.unreadPropStyles=null,w.startAnimationIfNecessary()}}))},w.state=w.defaultState(),w}l(e,t);var n=e.prototype;return n.defaultState=function(){var e=this.props,t=e.defaultStyles,n=e.styles,r=e.willEnter,a=e.willLeave,e=e.didLeave,l="function"==typeof n?n(t):n,n=null==t?l:t.map(function(e){for(var t=0;t<l.length;t++)if(l[t].key===e.key)return l[t];return e}),i=null==t?l.map(function(e){return o(e.style)}):t.map(function(e){return o(e.style)}),t=null==t?l.map(function(e){return I(e.style)}):t.map(function(e){return I(e.style)}),r=j(r,a,e,n,l,i,t,i,t),a=r[0];return{currentStyles:r[1],currentVelocities:r[2],lastIdealStyles:r[3],lastIdealVelocities:r[4],mergedPropsStyles:a}},n.componentDidMount=function(){this.prevTime=k(),this.startAnimationIfNecessary()},n.UNSAFE_componentWillReceiveProps=function(e){this.unreadPropStyles&&this.clearUnreadPropStyle(this.unreadPropStyles);e=e.styles;this.unreadPropStyles="function"==typeof e?e(A(this.state.mergedPropsStyles,this.unreadPropStyles,this.state.lastIdealStyles)):e,null==this.animationID&&(this.prevTime=k(),this.startAnimationIfNecessary())},n.componentWillUnmount=function(){this.unmounting=!0,null!=this.animationID&&(P.cancel(this.animationID),this.animationID=null)},n.render=function(){var e=A(this.state.mergedPropsStyles,this.unreadPropStyles,this.state.currentStyles),e=this.props.children(e);return e&&r.default.Children.only(e)},e}(r.default.Component),N=(M.defaultProps={willEnter:function(e){return o(e.style)},willLeave:function(){return null},didLeave:function(){}},{noWobble:{stiffness:170,damping:26},gentle:{stiffness:120,damping:14},wobbly:{stiffness:180,damping:12},stiff:{stiffness:210,damping:20}}),x=p({},N.noWobble,{precision:.01});e.Motion=t,e.StaggeredMotion=y,e.TransitionMotion=M,e.presets=N,e.reorderKeys=function(){},e.spring=function(e,t){return p({},x,t,{val:e})},e.stripStyle=o,Object.defineProperty(e,"__esModule",{value:!0})});