flip-toolkit - npm Package Compare versions

Comparing version 7.0.17 to 7.1.0-0

lib/flip/animateFlippedElements/types.d.ts

@@ -6,3 +6,3 @@ import { BaseFlipArgs, FlippedIds } from '../types';
 import { Spring } from '../../forked-rebound/types';
-export declare type ScopedSelector = (selector: string) => HTMLElement[];
+export type ScopedSelector = (selector: string) => HTMLElement[];
 export interface AnimateFlippedElementsArgs extends BaseFlipArgs {
@@ -19,10 +19,13 @@ flippedIds: FlippedIds;
 }
-export declare type OnUpdate = (spring: Spring) => void;
-export declare type GetOnUpdateFunc = ({ spring, onAnimationEnd }: {
+export type OnUpdate = (spring: Spring) => void;
+export type GetOnUpdateFunc = ({ spring, onAnimationEnd }: {
     spring: Spring;
     onAnimationEnd: () => void;
 }) => OnUpdate;
-export declare type Matrix = number[];
-export declare type InvertedChild = [HTMLElement, Omit<SerializableFlippedProps, 'flipId'>];
-export declare type InvertedChildren = InvertedChild[];
+export type Matrix = number[];
+export type InvertedChild = [
+    HTMLElement,
+    Omit<SerializableFlippedProps, 'flipId'>
+];
+export type InvertedChildren = InvertedChild[];
 export interface AnimatedVals {
@@ -32,4 +35,4 @@ matrix: Matrix;
 }
-export declare type InitializeFlip = () => void;
-export declare type ChildIds = string[];
+export type InitializeFlip = () => void;
+export type ChildIds = string[];
 export interface StaggeredChildren {
@@ -50,5 +53,5 @@ [stagger: string]: FlipDataArray;
 }
-export declare type FlipDataArray = FlipData[];
+export type FlipDataArray = FlipData[];
 export interface FlipDataDict {
     [flipId: string]: FlipData;
 }

lib/flip/animateUnflippedElements/types.d.ts

@@ -5,2 +5,2 @@ import { BaseFlipArgs } from '../types';
 }
-export declare type FragmentTuple = [HTMLElement, DocumentFragment];
+export type FragmentTuple = [HTMLElement, DocumentFragment];

lib/flip/getFlippedElementPositions/getFlippedElementPositionsBeforeUpdate/types.d.ts

@@ -14,3 +14,3 @@ import { BoundingClientRect, BaseFlippedElementPositions } from '../types';
 }
-export declare type CachedOrderedFlipIds = string[];
+export type CachedOrderedFlipIds = string[];
 export interface FlippedElementPositionsBeforeUpdateReturnVals {
@@ -26,4 +26,4 @@ flippedElementPositions: FlippedElementPositionsBeforeUpdate;
 }
-export declare type ParentBCRs = Array<[HTMLElement, BoundingClientRect]>;
-export declare type ChildIdsToParentBCRs = Record<FlipId, BoundingClientRect>;
-export declare type ChildIdsToParents = Record<FlipId, HTMLElement>;
+export type ParentBCRs = Array<[HTMLElement, BoundingClientRect]>;
+export type ChildIdsToParentBCRs = Record<FlipId, BoundingClientRect>;
+export type ChildIdsToParents = Record<FlipId, HTMLElement>;

lib/flip/getFlippedElementPositions/utilities.d.ts

 import { BoundingClientRect } from './types';
 export declare const addTupleToObject: <T>(acc: Record<string, T>, curr: [string, T]) => Record<string, T>;
-export declare const getAllElements: (element?: HTMLElement | undefined, portalKey?: string | undefined) => HTMLElement[];
+export declare const getAllElements: (element?: HTMLElement, portalKey?: string) => HTMLElement[];
 export declare const getRects: (flippedElements: HTMLElement[]) => [HTMLElement, BoundingClientRect][];

lib/flip/types.d.ts

@@ -6,4 +6,4 @@ import { InProgressAnimations, FlipCallbacks, StaggerConfig, HandleEnterUpdateDelete, OnFlipperComplete, OnFlipperStart, DecisionData } from '../types';
 import { SpringOption } from '../springSettings/types';
-export declare type FlippedIds = string[];
-export declare type GetElement = (id: string) => HTMLElement;
+export type FlippedIds = string[];
+export type GetElement = (id: string) => HTMLElement;
 export interface BaseFlipArgs {
@@ -10,0 +10,0 @@ flipCallbacks: FlipCallbacks;

lib/Flipper.d.ts

@@ -22,3 +22,3 @@ import { StaggerConfig, HandleEnterUpdateDelete, OnFlipperComplete, FlippedProps, OnFlipperStart } from './types';
     private flipCallbacks;
-    private snapshot;
+    private snapshot?;
     private onComplete?;
@@ -25,0 +25,0 @@ private onStart?;

lib/forked-rebound/types.d.ts

@@ -1,2 +0,2 @@
-declare type SpringCallback = (spring: Spring) => void;
+type SpringCallback = (spring: Spring) => void;
 export interface AddListenerArgs {
@@ -3,0 +3,0 @@ onSpringActivate?: SpringCallback;

lib/index.es.js

@@ -1,2 +0,2 @@
-import{parse as t,translateX as e,translateY as i,scaleX as n,scaleY as r,multiply as s}from"rematrix";var a=function(t){return"number"==typeof t},o=function(t){return"function"==typeof t},l=function(t){return"[object Object]"===Object.prototype.toString.call(t)},p=function(t){return Array.prototype.slice.apply(t)},c=function(t){var e=t.reduce(function(t,e){return t[e]=(t[e]||0)+1,t},{});return Object.keys(e).filter(function(t){return e[t]>1})};function u(t){return[].slice.call(arguments,1).forEach(function(e){if(e)for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i])}),t}var d,f=function(t,e,i){return t+(e-t)*i},h={__proto__:null,isNumber:a,isFunction:o,isObject:l,toArray:p,getDuplicateValsAsStrings:c,assign:u,tweenProp:f},g={__proto__:null,DATA_FLIP_ID:"data-flip-id",DATA_INVERSE_FLIP_ID:"data-inverse-flip-id",DATA_FLIP_COMPONENT_ID:"data-flip-component-id",DATA_FLIP_CONFIG:"data-flip-config",DATA_PORTAL_KEY:"data-portal-key",DATA_EXIT_CONTAINER:"data-exit-container"},m={noWobble:{stiffness:200,damping:26},gentle:{stiffness:120,damping:14},veryGentle:{stiffness:130,damping:17},wobbly:{stiffness:180,damping:12},stiff:{stiffness:260,damping:26}},v=function(t){return l(t)?t:Object.keys(m).indexOf(t)>-1?m[t]:{}};"undefined"!=typeof window&&(d=window.requestAnimationFrame);var y=d=d||function(t){window.setTimeout(t,1e3/60)},_=Date.now(),S="object"==typeof performance&&"function"==typeof performance.now?function(){return performance.now()}:function(){return Date.now()-_};function E(t,e){var i=t.indexOf(e);-1!==i&&t.splice(i,1)}var A=function(){function t(){}return t.prototype.run=function(){var t=this;y(function(){t.springSystem.loop(S())})},t}(),C=function(){this.position=0,this.velocity=0},b=0,I=function(){function t(t){this._id="s"+b++,this._springSystem=t,this.listeners=[],this._startValue=0,this._currentState=new C,this._displacementFromRestThreshold=.001,this._endValue=0,this._overshootClampingEnabled=!1,this._previousState=new C,this._restSpeedThreshold=.001,this._tempState=new C,this._timeAccumulator=0,this._wasAtRest=!0,this._cachedSpringConfig={}}var e=t.prototype;return e.getId=function(){return this._id},e.destroy=function(){this.listeners=[],this._springSystem.deregisterSpring(this)},e.setSpringConfig=function(t){return this._springConfig=t,this},e.getCurrentValue=function(){return this._currentState.position},e.getDisplacementDistanceForState=function(t){return Math.abs(this._endValue-t.position)},e.setEndValue=function(t){if(t===this._endValue)return this;if(this.prevEndValue=t,this._endValue===t&&this.isAtRest())return this;this._startValue=this.getCurrentValue(),this._endValue=t,this._springSystem.activateSpring(this.getId());for(var e=0,i=this.listeners.length;e<i;e++){var n=this.listeners[e].onSpringEndStateChange;n&&n(this)}return this},e.setVelocity=function(t){return t===this._currentState.velocity||(this._currentState.velocity=t,this._springSystem.activateSpring(this.getId())),this},e.setCurrentValue=function(t){this._startValue=t,this._currentState.position=t;for(var e=0,i=this.listeners.length;e<i;e++){var n=this.listeners[e];n.onSpringUpdate&&n.onSpringUpdate(this)}return this},e.setAtRest=function(){return this._endValue=this._currentState.position,this._tempState.position=this._currentState.position,this._currentState.velocity=0,this},e.setOvershootClampingEnabled=function(t){return this._overshootClampingEnabled=t,this},e.isOvershooting=function(){var t=this._startValue,e=this._endValue;return this._springConfig.tension>0&&(t<e&&this.getCurrentValue()>e||t>e&&this.getCurrentValue()<e)},e.advance=function(t,e){var i=this.isAtRest();if(!i||!this._wasAtRest){var n=e;e>.064&&(n=.064),this._timeAccumulator+=n;for(var r,s,a,o,l,p,c=this._springConfig.tension,u=this._springConfig.friction,d=this._currentState.position,f=this._currentState.velocity,h=this._tempState.position,g=this._tempState.velocity;this._timeAccumulator>=.001;)this._timeAccumulator-=.001,this._timeAccumulator<.001&&(this._previousState.position=d,this._previousState.velocity=f),s=c*(this._endValue-h)-u*f,o=c*(this._endValue-(h=d+.001*(r=f)*.5))-u*(g=f+.001*s*.5),p=c*(this._endValue-(h=d+.001*(a=g)*.5))-u*(g=f+.001*o*.5),h=d+.001*(l=g),d+=1/6*(r+2*(a+l)+(g=f+.001*p))*.001,f+=1/6*(s+2*(o+p)+(c*(this._endValue-h)-u*g))*.001;this._tempState.position=h,this._tempState.velocity=g,this._currentState.position=d,this._currentState.velocity=f,this._timeAccumulator>0&&this._interpolate(this._timeAccumulator/.001),(this.isAtRest()||this._overshootClampingEnabled&&this.isOvershooting())&&(this._springConfig.tension>0?(this._startValue=this._endValue,this._currentState.position=this._endValue):(this._endValue=this._currentState.position,this._startValue=this._endValue),this.setVelocity(0),i=!0);var m=!1;this._wasAtRest&&(this._wasAtRest=!1,m=!0);var v=!1;i&&(this._wasAtRest=!0,v=!0),this.notifyPositionUpdated(m,v)}},e.notifyPositionUpdated=function(t,e){var i=this;this.listeners.filter(Boolean).forEach(function(n){t&&n.onSpringActivate&&!i._onActivateCalled&&(n.onSpringActivate(i),i._onActivateCalled=!0),n.onSpringUpdate&&n.onSpringUpdate(i),e&&n.onSpringAtRest&&n.onSpringAtRest(i)})},e.systemShouldAdvance=function(){return!this.isAtRest()||!this.wasAtRest()},e.wasAtRest=function(){return this._wasAtRest},e.isAtRest=function(){return Math.abs(this._currentState.velocity)<this._restSpeedThreshold&&(this.getDisplacementDistanceForState(this._currentState)<=this._displacementFromRestThreshold||0===this._springConfig.tension)},e._interpolate=function(t){this._currentState.position=this._currentState.position*t+this._previousState.position*(1-t),this._currentState.velocity=this._currentState.velocity*t+this._previousState.velocity*(1-t)},e.addListener=function(t){return this.listeners.push(t),this},e.addOneTimeListener=function(t){var e=this;return Object.keys(t).forEach(function(i){var n;t[i]=(n=t[i],function(){n.apply(void 0,[].slice.call(arguments)),e.removeListener(t)})}),this.listeners.push(t),this},e.removeListener=function(t){return E(this.listeners,t),this},t}(),O=function(){function t(t){this.looper=t||new A,this.looper.springSystem=this,this.listeners=[],this._activeSprings=[],this._idleSpringIndices=[],this._isIdle=!0,this._lastTimeMillis=-1,this._springRegistry={}}var e=t.prototype;return e.createSpring=function(t,e){return this.createSpringWithConfig({tension:t,friction:e})},e.createSpringWithConfig=function(t){var e=new I(this);return this.registerSpring(e),e.setSpringConfig(t),e},e.getIsIdle=function(){return this._isIdle},e.registerSpring=function(t){this._springRegistry[t.getId()]=t},e.deregisterSpring=function(t){E(this._activeSprings,t),delete this._springRegistry[t.getId()]},e.advance=function(t,e){for(var i=this;this._idleSpringIndices.length>0;)this._idleSpringIndices.pop();for(this._activeSprings.filter(Boolean).forEach(function(n){n.systemShouldAdvance()?n.advance(t/1e3,e/1e3):i._idleSpringIndices.push(i._activeSprings.indexOf(n))});this._idleSpringIndices.length>0;){var n=this._idleSpringIndices.pop();n>=0&&this._activeSprings.splice(n,1)}},e.loop=function(t){var e;-1===this._lastTimeMillis&&(this._lastTimeMillis=t-1);var i=t-this._lastTimeMillis;this._lastTimeMillis=t;var n=0,r=this.listeners.length;for(n=0;n<r;n++)(e=this.listeners[n]).onBeforeIntegrate&&e.onBeforeIntegrate(this);for(this.advance(t,i),0===this._activeSprings.length&&(this._isIdle=!0,this._lastTimeMillis=-1),n=0;n<r;n++)(e=this.listeners[n]).onAfterIntegrate&&e.onAfterIntegrate(this);this._isIdle||this.looper.run()},e.activateSpring=function(t){var e=this._springRegistry[t];-1===this._activeSprings.indexOf(e)&&this._activeSprings.push(e),this.getIsIdle()&&(this._isIdle=!1,this.looper.run())},t}(),w=new O,x=function(t){var e=t.springConfig,i=e.overshootClamping,n=t.getOnUpdateFunc,r=t.onAnimationEnd,s=t.onSpringActivate,a=w.createSpring(e.stiffness,e.damping);a.setOvershootClampingEnabled(!!i);var o={onSpringActivate:s,onSpringAtRest:function(){a.destroy(),r()},onSpringUpdate:n({spring:a,onAnimationEnd:r})};return a.addListener(o),a},U=function(t){var e=x(t);return e.setEndValue(1),e},V=function(t,e){if(void 0===e&&(e={}),t&&t.length){e.reverse&&t.reverse();var i,n="number"!=typeof(i=e.speed)?1.1:1+Math.min(Math.max(5*i,0),5),r=1/Math.max(Math.min(t.length,100),10),s=t.map(function(t,e){var i=t.getOnUpdateFunc;return t.getOnUpdateFunc=function(t){var a=i(t);return function(t){var i=t.getCurrentValue();(i=i<.01?0:i>.99?1:i)>=r&&s[e+1]&&s[e+1](Math.max(Math.min(i*n,1),0)),a(t)}},t}).map(function(t){var e=x(t);if(e)return e.setEndValue.bind(e)}).filter(Boolean);s[0]&&s[0](1)}},F=function(t){return[0,1,4,5,12,13].map(function(e){return t[e]})},P=function(t){return t.top<window.innerHeight&&t.bottom>0&&t.left<window.innerWidth&&t.right>0};function R(t){return JSON.parse(t.dataset.flipConfig||"{}")}var T=function(t,e){var i;return u(t,((i={})[e[0]]=e[1],i))},D=function(t,e){return p(e?document.querySelectorAll('[data-portal-key="'+e+'"]'):t.querySelectorAll("[data-flip-id]"))},M=function(t){return t.map(function(t){return[t,t.getBoundingClientRect()]})},k=function(l){var d,h=l.cachedOrderedFlipIds,g=void 0===h?[]:h,y=l.inProgressAnimations,_=void 0===y?{}:y,S=l.flippedElementPositionsBeforeUpdate,E=void 0===S?{}:S,A=l.flipCallbacks,C=void 0===A?{}:A,b=l.containerEl,I=l.applyTransformOrigin,O=l.spring,w=l.debug,x=l.portalKey,k=l.staggerConfig,j=void 0===k?{}:k,B=l.decisionData,N=void 0===B?{}:B,L=l.handleEnterUpdateDelete,q=l.onComplete,W=l.onStart,K=M(D((d={element:b,portalKey:x}).element,d.portalKey)).map(function(t){var e=t[0],i=t[1],n=window.getComputedStyle(e);return[e.dataset.flipId,{element:e,rect:i,opacity:parseFloat(n.opacity),transform:n.transform}]}).reduce(T,{}),X=function(t){var e=t.containerEl,i=t.portalKey;return i?function(t){return function(e){return p(document.querySelectorAll('[data-portal-key="'+t+'"]'+e))}}(i):e?function(t){var e=Math.random().toFixed(5);return t.dataset.flipperId=e,function(i){return p(t.querySelectorAll('[data-flipper-id="'+e+'"] '+i))}}(e):function(){return[]}}({containerEl:b,portalKey:x}),Y=function(t){return function(e){return t('[data-flip-id="'+e+'"]')[0]}}(X),H=function(t){return E[t]&&K[t]},J=Object.keys(E).concat(Object.keys(K)).filter(function(t){return!H(t)}),z={flipCallbacks:C,getElement:Y,flippedElementPositionsBeforeUpdate:E,flippedElementPositionsAfterUpdate:K,inProgressAnimations:_,decisionData:N},G=function(t){var e,i=t.unflippedIds,n=t.flipCallbacks,r=t.getElement,s=t.flippedElementPositionsBeforeUpdate,a=t.flippedElementPositionsAfterUpdate,o=t.inProgressAnimations,l=t.decisionData,p=i.filter(function(t){return a[t]}).filter(function(t){return n[t]&&n[t].onAppear}),c=i.filter(function(t){return s[t]&&n[t]&&n[t].onExit}),u=new Promise(function(t){e=t}),d=[],f=0,h=c.map(function(t,i){var r=s[t].domDataForExitAnimations,a=r.element,p=r.parent,c=r.childPosition,u=c.top,h=c.left,g=c.width,m=c.height;"static"===getComputedStyle(p).position&&(p.style.position="relative"),a.style.transform="matrix(1, 0, 0, 1, 0, 0)",a.style.position="absolute",a.style.top=u+"px",a.style.left=h+"px",a.style.height=m+"px",a.style.width=g+"px";var v=d.filter(function(t){return t[0]===p})[0];v||(v=[p,document.createDocumentFragment()],d.push(v)),v[1].appendChild(a),f+=1;var y=function(){try{p.removeChild(a)}catch(t){}finally{0==(f-=1)&&e()}};return o[t]={stop:y},function(){return n[t].onExit(a,i,y,l)}});return d.forEach(function(t){t[0].appendChild(t[1])}),h.length||e(),{hideEnteringElements:function(){p.forEach(function(t){var e=r(t);e&&(e.style.opacity="0")})},animateEnteringElements:function(){p.forEach(function(t,e){var i=r(t);i&&n[t].onAppear(i,e,l)})},animateExitingElements:function(){return h.forEach(function(t){return t()}),u}}}(u({},z,{unflippedIds:J})),Q=G.hideEnteringElements,Z=G.animateEnteringElements,$=G.animateExitingElements,tt=u({},z,{containerEl:b,flippedIds:g.filter(H),applyTransformOrigin:I,spring:O,debug:w,staggerConfig:j,scopedSelector:X,onComplete:q});W&&W(b,N);var et=function(l){var d,h=l.flippedIds,g=l.flipCallbacks,y=l.inProgressAnimations,_=l.flippedElementPositionsBeforeUpdate,S=l.flippedElementPositionsAfterUpdate,E=l.applyTransformOrigin,A=l.spring,C=l.getElement,b=l.debug,I=l.staggerConfig,O=void 0===I?{}:I,w=l.decisionData,x=void 0===w?{}:w,T=l.onComplete,D=l.containerEl,M=new Promise(function(t){d=t});if(T&&M.then(function(){return T(D,x)}),!h.length)return function(){return d([]),M};var k=[],j=C(h[0]),B=j?j.ownerDocument.querySelector("body"):document.querySelector("body"),N=(c(h),h.map(function(l){var c=_[l].rect,h=S[l].rect,C=_[l].opacity,b=S[l].opacity,I=h.width<1||h.height<1,O=S[l].element;if(!P(c)&&!P(h))return!1;if(!O)return!1;var w,U,V,T=R(O),D=(V=(U=void 0===(w={flipperSpring:A,flippedSpring:T.spring})?{}:w).flippedSpring,u({},m.noWobble,v(U.flipperSpring),v(V))),M=!0===T.stagger?"default":T.stagger,j={element:O,id:l,stagger:M,springConfig:D};if(g[l]&&g[l].shouldFlip&&!g[l].shouldFlip(x.previous,x.current))return!1;var L=Math.abs(c.left-h.left)+Math.abs(c.top-h.top),q=Math.abs(c.width-h.width)+Math.abs(c.height-h.height),W=Math.abs(b-C);if(0===c.height&&0===h.height||0===c.width&&0===h.width||L<.5&&q<.5&&W<.01)return!1;var K=t(S[l].transform),X={matrix:K},Y={matrix:[]},H=[K];T.translate&&(H.push(e(c.left-h.left)),H.push(i(c.top-h.top))),T.scale&&(H.push(n(Math.max(c.width,1)/Math.max(h.width,1))),H.push(r(Math.max(c.height,1)/Math.max(h.height,1)))),T.opacity&&(Y.opacity=C,X.opacity=b);var J=[];if(!g[l]||!g[l].shouldInvert||g[l].shouldInvert(x.previous,x.current)){var z=function(t,e){return p(t.querySelectorAll('[data-inverse-flip-id="'+e+'"]'))}(O,l);J=z.map(function(t){return[t,R(t)]})}Y.matrix=F(H.reduce(s)),X.matrix=F(X.matrix);var G,Q=function(t){var e=t.element,i=t.invertedChildren,n=t.body;return function(t){var r=t.matrix,s=t.opacity,o=t.forceMinVals;if(a(s)&&(e.style.opacity=s+""),o&&(e.style.minHeight="1px",e.style.minWidth="1px"),r){var l=function(t){return"matrix("+t.join(", ")+")"}(r);e.style.transform=l,i&&function(t){var e=t.matrix,i=t.body;t.invertedChildren.forEach(function(t){var n=t[0],r=t[1];if(i.contains(n)){var s=e[0],a=e[3],o=e[5],l={translateX:0,translateY:0,scaleX:1,scaleY:1},p="";r.translate&&(l.translateX=-e[4]/s,l.translateY=-o/a,p+="translate("+l.translateX+"px, "+l.translateY+"px)"),r.scale&&(l.scaleX=1/s,l.scaleY=1/a,p+=" scale("+l.scaleX+", "+l.scaleY+")"),n.style.transform=p}})}({invertedChildren:i,matrix:r,body:n})}}}({element:O,invertedChildren:J,body:B});if(g[l]&&g[l].onComplete){var Z=g[l].onComplete;G=function(){return Z(O,x)}}var $=a(Y.opacity)&&a(X.opacity)&&Y.opacity!==X.opacity,tt=!1;return u({},j,{stagger:M,springConfig:D,getOnUpdateFunc:function(t){var e=t.spring,i=t.onAnimationEnd;return y[l]={destroy:e.destroy.bind(e),onAnimationEnd:i},function(t){g[l]&&g[l].onSpringUpdate&&g[l].onSpringUpdate(t.getCurrentValue()),tt||(tt=!0,g[l]&&g[l].onStart&&g[l].onStart(O,x));var e=t.getCurrentValue();if(B.contains(O)){var i={matrix:[]};i.matrix=Y.matrix.map(function(t,i){return f(t,X.matrix[i],e)}),$&&(i.opacity=f(Y.opacity,X.opacity,e)),Q(i)}else t.destroy()}},initializeFlip:function(){Q({matrix:Y.matrix,opacity:$?Y.opacity:void 0,forceMinVals:I}),g[l]&&g[l].onStartImmediate&&g[l].onStartImmediate(O,x),T.transformOrigin?O.style.transformOrigin=T.transformOrigin:E&&(O.style.transformOrigin="0 0"),J.forEach(function(t){var e=t[0],i=t[1];i.transformOrigin?e.style.transformOrigin=i.transformOrigin:E&&(e.style.transformOrigin="0 0")})},onAnimationEnd:function(t){delete y[l],o(G)&&G(),O.style.transform="",J.forEach(function(t){t[0].style.transform=""}),I&&O&&(O.style.minHeight="",O.style.minWidth=""),t||(k.push(l),k.length>=N.length&&d(k))},delayUntil:T.delayUntil})}).filter(Boolean));if(N.forEach(function(t){return(0,t.initializeFlip)()}),b)return function(){};var L=N.filter(function(t){return t.delayUntil&&(e=t.delayUntil,N.filter(function(t){return t.id===e}).length);var e}),q={},W={},K={};L.forEach(function(t){t.stagger?(K[t.stagger]=!0,W[t.delayUntil]?W[t.delayUntil].push(t.stagger):W[t.delayUntil]=[t.stagger]):q[t.delayUntil]?q[t.delayUntil].push(t):q[t.delayUntil]=[t]});var X=N.filter(function(t){return t.stagger}).reduce(function(t,e){return t[e.stagger]?t[e.stagger].push(e):t[e.stagger]=[e],t},{}),Y=N.filter(function(t){return-1===L.indexOf(t)});return Y.forEach(function(t){t.onSpringActivate=function(){q[t.id]&&q[t.id].forEach(U),W[t.id]&&Object.keys(W[t.id].reduce(function(t,e){var i;return u(t,((i={})[e]=!0,i))},{})).forEach(function(t){V(X[t],O[t])})}}),function(){return N.length||d([]),Y.filter(function(t){return!t.stagger}).forEach(U),Object.keys(X).forEach(function(t){K[t]||V(X[t],O[t])}),M}}(tt);L?L({hideEnteringElements:Q,animateEnteringElements:Z,animateExitingElements:$,animateFlippedElements:et}):(Q(),$().then(Z),et())},j=function(t){var e=t.element,i=t.flipCallbacks,n=void 0===i?{}:i,r=t.inProgressAnimations,s=void 0===r?{}:r,a=D(e,t.portalKey),o=p(e.querySelectorAll("[data-inverse-flip-id]")),l={},c=[],d={};a.filter(function(t){return n&&n[t.dataset.flipId]&&n[t.dataset.flipId].onExit}).forEach(function(t){var e=t.parentNode;if(t.closest){var i=t.closest("[data-exit-container]");i&&(e=i)}var n=c.findIndex(function(t){return t[0]===e});-1===n&&(c.push([e,e.getBoundingClientRect()]),n=c.length-1),l[t.dataset.flipId]=c[n][1],d[t.dataset.flipId]=e});var f=M(a),h=f.map(function(t){var e=t[0],i=t[1],r={};if(n&&n[e.dataset.flipId]&&n[e.dataset.flipId].onExit){var s=l[e.dataset.flipId];u(r,{element:e,parent:d[e.dataset.flipId],childPosition:{top:i.top-s.top,left:i.left-s.left,width:i.width,height:i.height}})}return[e.dataset.flipId,{rect:i,opacity:parseFloat(window.getComputedStyle(e).opacity||"1"),domDataForExitAnimations:r}]}).reduce(T,{});return function(t,e){Object.keys(t).forEach(function(e){t[e].destroy&&t[e].destroy(),t[e].onAnimationEnd&&t[e].onAnimationEnd(!0),delete t[e]}),e.forEach(function(t){t.style.transform="",t.style.opacity=""})}(s,a.concat(o)),{flippedElementPositions:h,cachedOrderedFlipIds:f.map(function(t){return t[0].dataset.flipId})}},B=function(){function t(t){this.applyTransformOrigin=!0,u(this,t),this.inProgressAnimations={},this.flipCallbacks={},this.recordBeforeUpdate=this.recordBeforeUpdate.bind(this),this.update=this.update.bind(this),this.addFlipped=this.addFlipped.bind(this),this.addInverted=this.addInverted.bind(this)}var e=t.prototype;return e.recordBeforeUpdate=function(){this.snapshot=j({element:this.element,flipCallbacks:this.flipCallbacks,inProgressAnimations:this.inProgressAnimations})},e.update=function(t,e){this.snapshot&&(k({flippedElementPositionsBeforeUpdate:this.snapshot.flippedElementPositions,cachedOrderedFlipIds:this.snapshot.cachedOrderedFlipIds,containerEl:this.element,inProgressAnimations:this.inProgressAnimations,flipCallbacks:this.flipCallbacks,applyTransformOrigin:this.applyTransformOrigin,spring:this.spring,debug:this.debug,staggerConfig:this.staggerConfig,handleEnterUpdateDelete:this.handleEnterUpdateDelete,decisionData:{previous:t,current:e},onComplete:this.onComplete,onStart:this.onStart}),delete this.snapshot)},e.addFlipped=function(t){var e=t.element,i=t.flipId,n=t.opacity,r=t.translate,s=t.scale,a=t.transformOrigin,o=t.spring,l=t.stagger,p=t.delayUntil,c=t.onAppear,d=t.onStart,f=t.onSpringUpdate,h=t.onComplete,g=t.onExit,m=t.shouldFlip,v=t.shouldInvert;if(!e)throw new Error("no element provided");if(!i)throw new Error("No flipId provided");var y={scale:s,translate:r,opacity:n,transformOrigin:a,spring:o,stagger:l,delayUntil:p};y.scale||y.translate||y.opacity||u(y,{translate:!0,scale:!0,opacity:!0}),i&&(e.dataset.flipId=String(i)),e.dataset.flipConfig=JSON.stringify(y),this.flipCallbacks[i]={shouldFlip:m,shouldInvert:v,onAppear:c,onStart:d,onSpringUpdate:f,onComplete:h,onExit:g}},e.addInverted=function(t){var e=t.element,i=t.parent,n=t.opacity,r=t.translate,s=t.scale,a=t.transformOrigin;if(!e)throw new Error("no element provided");if(!i)throw new Error("parent must be provided");var o=i.dataset.flipId,l={scale:s,translate:r,opacity:n,transformOrigin:a};l.scale||l.translate||l.opacity||u(l,{translate:!0,scale:!0,opacity:!0}),e.dataset.inverseFlipId=o,e.dataset.flipConfig=JSON.stringify(l)},t}(),N=new O,L=function(t){var e=t.values,i=t.onUpdate,n=t.delay,r=void 0===n?0:n,s=t.onComplete,a=u({},m.noWobble,v(t.config)),o=a.overshootClamping,l=N.createSpring(a.stiffness,a.damping);return l.setOvershootClampingEnabled(!!o),l.addListener({onSpringAtRest:function(t){s&&s(),t.destroy()},onSpringUpdate:function(t){var n=t.getCurrentValue();if(!e)return i(n);var r=Object.keys(e).map(function(t){return[t,f(e[t][0],e[t][1],n)]}).reduce(function(t,e){var i;return Object.assign(t,((i={})[e[0]]=e[1],i))},{});i(r)}}),r?setTimeout(function(){l.setEndValue(1)},r):l.setEndValue(1),l};export{B as Flipper,g as constants,j as getFlippedElementPositionsBeforeUpdate,k as onFlipKeyUpdate,L as spring,h as utilities};
+import*as t from"rematrix";var e=function(t){return"number"==typeof t},i=function(t){return"function"==typeof t},n=function(t){return"[object Object]"===Object.prototype.toString.call(t)},r=function(t){return Array.prototype.slice.apply(t)},s=function(t){var e=t.reduce(function(t,e){return t[e]=(t[e]||0)+1,t},{});return Object.keys(e).filter(function(t){return e[t]>1})};function a(t){return[].slice.call(arguments,1).forEach(function(e){if(e)for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i])}),t}var o,l=function(t,e,i){return t+(e-t)*i},p={__proto__:null,isNumber:e,isFunction:i,isObject:n,toArray:r,getDuplicateValsAsStrings:s,assign:a,tweenProp:l},c="data-flip-id",u="data-inverse-flip-id",d="data-portal-key",f="data-exit-container",h={__proto__:null,DATA_FLIP_ID:c,DATA_INVERSE_FLIP_ID:u,DATA_FLIP_COMPONENT_ID:"data-flip-component-id",DATA_FLIP_CONFIG:"data-flip-config",DATA_PORTAL_KEY:d,DATA_EXIT_CONTAINER:f},g={noWobble:{stiffness:200,damping:26},gentle:{stiffness:120,damping:14},veryGentle:{stiffness:130,damping:17},wobbly:{stiffness:180,damping:12},stiff:{stiffness:260,damping:26}},m=function(t){return n(t)?t:Object.keys(g).indexOf(t)>-1?g[t]:{}};"undefined"!=typeof window&&(o=window.requestAnimationFrame);var v=o=o||function(t){window.setTimeout(t,1e3/60)},y=Date.now(),_="object"==typeof performance&&"function"==typeof performance.now?function(){return performance.now()}:function(){return Date.now()-y};function S(t,e){var i=t.indexOf(e);-1!==i&&t.splice(i,1)}var E=/*#__PURE__*/function(){function t(){}return t.prototype.run=function(){var t=this;v(function(){t.springSystem.loop(_())})},t}(),A=function(){this.position=0,this.velocity=0},C=0,b=.001,I=/*#__PURE__*/function(){function t(t){this._id="s"+C++,this._springSystem=t,this.listeners=[],this._startValue=0,this._currentState=new A,this._displacementFromRestThreshold=.001,this._endValue=0,this._overshootClampingEnabled=!1,this._previousState=new A,this._restSpeedThreshold=.001,this._tempState=new A,this._timeAccumulator=0,this._wasAtRest=!0,this._cachedSpringConfig={}}var e=t.prototype;return e.getId=function(){return this._id},e.destroy=function(){this.listeners=[],this._springSystem.deregisterSpring(this)},e.setSpringConfig=function(t){return this._springConfig=t,this},e.getCurrentValue=function(){return this._currentState.position},e.getDisplacementDistanceForState=function(t){return Math.abs(this._endValue-t.position)},e.setEndValue=function(t){if(t===this._endValue)return this;if(this.prevEndValue=t,this._endValue===t&&this.isAtRest())return this;this._startValue=this.getCurrentValue(),this._endValue=t,this._springSystem.activateSpring(this.getId());for(var e=0,i=this.listeners.length;e<i;e++){var n=this.listeners[e].onSpringEndStateChange;n&&n(this)}return this},e.setVelocity=function(t){return t===this._currentState.velocity||(this._currentState.velocity=t,this._springSystem.activateSpring(this.getId())),this},e.setCurrentValue=function(t){this._startValue=t,this._currentState.position=t;for(var e=0,i=this.listeners.length;e<i;e++){var n=this.listeners[e];n.onSpringUpdate&&n.onSpringUpdate(this)}return this},e.setAtRest=function(){return this._endValue=this._currentState.position,this._tempState.position=this._currentState.position,this._currentState.velocity=0,this},e.setOvershootClampingEnabled=function(t){return this._overshootClampingEnabled=t,this},e.isOvershooting=function(){var t=this._startValue,e=this._endValue;return this._springConfig.tension>0&&(t<e&&this.getCurrentValue()>e||t>e&&this.getCurrentValue()<e)},e.advance=function(t,e){var i=this.isAtRest();if(!i||!this._wasAtRest){var n=e;e>.064&&(n=.064),this._timeAccumulator+=n;for(var r,s,a,o,l,p,c=this._springConfig.tension,u=this._springConfig.friction,d=this._currentState.position,f=this._currentState.velocity,h=this._tempState.position,g=this._tempState.velocity;this._timeAccumulator>=b;)this._timeAccumulator-=b,this._timeAccumulator<b&&(this._previousState.position=d,this._previousState.velocity=f),s=c*(this._endValue-h)-u*f,o=c*(this._endValue-(h=d+(r=f)*b*.5))-u*(g=f+s*b*.5),p=c*(this._endValue-(h=d+(a=g)*b*.5))-u*(g=f+o*b*.5),h=d+(l=g)*b,d+=1/6*(r+2*(a+l)+(g=f+p*b))*b,f+=1/6*(s+2*(o+p)+(c*(this._endValue-h)-u*g))*b;this._tempState.position=h,this._tempState.velocity=g,this._currentState.position=d,this._currentState.velocity=f,this._timeAccumulator>0&&this._interpolate(this._timeAccumulator/b),(this.isAtRest()||this._overshootClampingEnabled&&this.isOvershooting())&&(this._springConfig.tension>0?(this._startValue=this._endValue,this._currentState.position=this._endValue):(this._endValue=this._currentState.position,this._startValue=this._endValue),this.setVelocity(0),i=!0);var m=!1;this._wasAtRest&&(this._wasAtRest=!1,m=!0);var v=!1;i&&(this._wasAtRest=!0,v=!0),this.notifyPositionUpdated(m,v)}},e.notifyPositionUpdated=function(t,e){var i=this;this.listeners.filter(Boolean).forEach(function(n){t&&n.onSpringActivate&&!i._onActivateCalled&&(n.onSpringActivate(i),i._onActivateCalled=!0),n.onSpringUpdate&&n.onSpringUpdate(i),e&&n.onSpringAtRest&&n.onSpringAtRest(i)})},e.systemShouldAdvance=function(){return!this.isAtRest()||!this.wasAtRest()},e.wasAtRest=function(){return this._wasAtRest},e.isAtRest=function(){return Math.abs(this._currentState.velocity)<this._restSpeedThreshold&&(this.getDisplacementDistanceForState(this._currentState)<=this._displacementFromRestThreshold||0===this._springConfig.tension)},e._interpolate=function(t){this._currentState.position=this._currentState.position*t+this._previousState.position*(1-t),this._currentState.velocity=this._currentState.velocity*t+this._previousState.velocity*(1-t)},e.addListener=function(t){return this.listeners.push(t),this},e.addOneTimeListener=function(t){var e=this;return Object.keys(t).forEach(function(i){var n;t[i]=(n=t[i],function(){n.apply(void 0,[].slice.call(arguments)),e.removeListener(t)})}),this.listeners.push(t),this},e.removeListener=function(t){return S(this.listeners,t),this},t}(),w=/*#__PURE__*/function(){function t(t){this.looper=t||new E,this.looper.springSystem=this,this.listeners=[],this._activeSprings=[],this._idleSpringIndices=[],this._isIdle=!0,this._lastTimeMillis=-1,this._springRegistry={}}var e=t.prototype;return e.createSpring=function(t,e){return this.createSpringWithConfig({tension:t,friction:e})},e.createSpringWithConfig=function(t){var e=new I(this);return this.registerSpring(e),e.setSpringConfig(t),e},e.getIsIdle=function(){return this._isIdle},e.registerSpring=function(t){this._springRegistry[t.getId()]=t},e.deregisterSpring=function(t){S(this._activeSprings,t),delete this._springRegistry[t.getId()]},e.advance=function(t,e){for(var i=this;this._idleSpringIndices.length>0;)this._idleSpringIndices.pop();for(this._activeSprings.filter(Boolean).forEach(function(n){n.systemShouldAdvance()?n.advance(t/1e3,e/1e3):i._idleSpringIndices.push(i._activeSprings.indexOf(n))});this._idleSpringIndices.length>0;){var n=this._idleSpringIndices.pop();n>=0&&this._activeSprings.splice(n,1)}},e.loop=function(t){var e;-1===this._lastTimeMillis&&(this._lastTimeMillis=t-1);var i=t-this._lastTimeMillis;this._lastTimeMillis=t;var n=0,r=this.listeners.length;for(n=0;n<r;n++)(e=this.listeners[n]).onBeforeIntegrate&&e.onBeforeIntegrate(this);for(this.advance(t,i),0===this._activeSprings.length&&(this._isIdle=!0,this._lastTimeMillis=-1),n=0;n<r;n++)(e=this.listeners[n]).onAfterIntegrate&&e.onAfterIntegrate(this);this._isIdle||this.looper.run()},e.activateSpring=function(t){var e=this._springRegistry[t];-1===this._activeSprings.indexOf(e)&&this._activeSprings.push(e),this.getIsIdle()&&(this._isIdle=!1,this.looper.run())},t}(),O=new w,x=function(t){var e=t.springConfig,i=e.overshootClamping,n=t.getOnUpdateFunc,r=t.onAnimationEnd,s=t.onSpringActivate,a=O.createSpring(e.stiffness,e.damping);a.setOvershootClampingEnabled(!!i);var o={onSpringActivate:s,onSpringAtRest:function(){a.destroy(),r()},onSpringUpdate:n({spring:a,onAnimationEnd:r})};return a.addListener(o),a},U=function(t){var e=x(t);return e.setEndValue(1),e},V=function(t,e){if(void 0===e&&(e={}),t&&t.length){e.reverse&&t.reverse();var i,n="number"!=typeof(i=e.speed)?1.1:1+Math.min(Math.max(5*i,0),5),r=1/Math.max(Math.min(t.length,100),10),s=t.map(function(t,e){var i=t.getOnUpdateFunc;return t.getOnUpdateFunc=function(t){var a=i(t);return function(t){var i=t.getCurrentValue();(i=i<.01?0:i>.99?1:i)>=r&&s[e+1]&&s[e+1](Math.max(Math.min(i*n,1),0)),a(t)}},t}).map(function(t){var e=x(t);if(e)return e.setEndValue.bind(e)}).filter(Boolean);s[0]&&s[0](1)}},F=function(t){return[0,1,4,5,12,13].map(function(e){return t[e]})},P=function(t){return t.top<window.innerHeight&&t.bottom>0&&t.left<window.innerWidth&&t.right>0};function D(t){return JSON.parse(t.dataset.flipConfig||"{}")}var R=function(t,e){var i;return a(t,((i={})[e[0]]=e[1],i))},T=function(t,e){return r(e?document.querySelectorAll("["+d+'="'+e+'"]'):t.querySelectorAll("["+c+"]"))},M=function(t){return t.map(function(t){return[t,t.getBoundingClientRect()]})},k=function(n){var o=n.cachedOrderedFlipIds,p=void 0===o?[]:o,f=n.inProgressAnimations,h=void 0===f?{}:f,v=n.flippedElementPositionsBeforeUpdate,y=void 0===v?{}:v,_=n.flipCallbacks,S=void 0===_?{}:_,E=n.containerEl,A=n.applyTransformOrigin,C=n.spring,b=n.debug,I=n.portalKey,w=n.staggerConfig,O=void 0===w?{}:w,x=n.decisionData,k=void 0===x?{}:x,j=n.handleEnterUpdateDelete,B=n.onComplete,N=n.onStart;if(!window.matchMedia("(prefers-reduced-motion: reduce)").matches){var L,q=M(T((L={element:E,portalKey:I}).element,L.portalKey)).map(function(t){var e=t[0],i=t[1],n=window.getComputedStyle(e);return[e.dataset.flipId,{element:e,rect:i,opacity:parseFloat(n.opacity),transform:n.transform}]}).reduce(R,{}),X=function(t){var e=t.containerEl,i=t.portalKey;return i?function(t){return function(e){return r(document.querySelectorAll("["+d+'="'+t+'"]'+e))}}(i):e?function(t){var e=Math.random().toFixed(5);return t.dataset.flipperId=e,function(i){return r(t.querySelectorAll('[data-flipper-id="'+e+'"] '+i))}}(e):function(){return[]}}({containerEl:E,portalKey:I}),Y=function(t){return function(e){return t("["+c+'="'+e+'"]')[0]}}(X),W=function(t){return y[t]&&q[t]},K=Object.keys(y).concat(Object.keys(q)).filter(function(t){return!W(t)}),H={flipCallbacks:S,getElement:Y,flippedElementPositionsBeforeUpdate:y,flippedElementPositionsAfterUpdate:q,inProgressAnimations:h,decisionData:k},J=function(t){var e,i=t.unflippedIds,n=t.flipCallbacks,r=t.getElement,s=t.flippedElementPositionsBeforeUpdate,a=t.flippedElementPositionsAfterUpdate,o=t.inProgressAnimations,l=t.decisionData,p=i.filter(function(t){return a[t]}).filter(function(t){return n[t]&&n[t].onAppear}),c=i.filter(function(t){return s[t]&&n[t]&&n[t].onExit}),u=new Promise(function(t){e=t}),d=[],f=0,h=c.map(function(t,i){var r=s[t].domDataForExitAnimations,a=r.element,p=r.parent,c=r.childPosition,u=c.top,h=c.left,g=c.width,m=c.height;"static"===getComputedStyle(p).position&&(p.style.position="relative"),a.style.transform="matrix(1, 0, 0, 1, 0, 0)",a.style.position="absolute",a.style.top=u+"px",a.style.left=h+"px",a.style.height=m+"px",a.style.width=g+"px";var v=d.filter(function(t){return t[0]===p})[0];v||(v=[p,document.createDocumentFragment()],d.push(v)),v[1].appendChild(a),f+=1;var y=function(){try{p.removeChild(a)}catch(t){}finally{0==(f-=1)&&e()}};return o[t]={stop:y},function(){return n[t].onExit(a,i,y,l)}});return d.forEach(function(t){t[0].appendChild(t[1])}),h.length||e(),{hideEnteringElements:function(){p.forEach(function(t){var e=r(t);e&&(e.style.opacity="0")})},animateEnteringElements:function(){p.forEach(function(t,e){var i=r(t);i&&n[t].onAppear(i,e,l)})},animateExitingElements:function(){return h.forEach(function(t){return t()}),u}}}(a({},H,{unflippedIds:K})),z=J.hideEnteringElements,G=J.animateEnteringElements,Q=J.animateExitingElements,Z=a({},H,{containerEl:E,flippedIds:p.filter(W),applyTransformOrigin:A,spring:C,debug:b,staggerConfig:O,scopedSelector:X,onComplete:B});N&&N(E,k);var $=function(n){var o,p=n.flippedIds,c=n.flipCallbacks,d=n.inProgressAnimations,f=n.flippedElementPositionsBeforeUpdate,h=n.flippedElementPositionsAfterUpdate,v=n.applyTransformOrigin,y=n.spring,_=n.getElement,S=n.debug,E=n.staggerConfig,A=void 0===E?{}:E,C=n.decisionData,b=void 0===C?{}:C,I=n.onComplete,w=n.containerEl,O=new Promise(function(t){o=t});if(I&&O.then(function(){return I(w,b)}),!p.length)return function(){return o([]),O};var x=[],R=_(p[0]),T=R?R.ownerDocument.querySelector("body"):document.querySelector("body");s(p);var M=p.map(function(n){var s=f[n].rect,p=h[n].rect,_=f[n].opacity,S=h[n].opacity,E=p.width<1||p.height<1,A=h[n].element;if(!P(s)&&!P(p))return!1;if(!A)return!1;var C,I,w,O=D(A),U=(w=(I=void 0===(C={flipperSpring:y,flippedSpring:O.spring})?{}:C).flippedSpring,a({},g.noWobble,m(I.flipperSpring),m(w))),V=!0===O.stagger?"default":O.stagger,R={element:A,id:n,stagger:V,springConfig:U};if(c[n]&&c[n].shouldFlip&&!c[n].shouldFlip(b.previous,b.current))return!1;var k=Math.abs(s.left-p.left)+Math.abs(s.top-p.top),j=Math.abs(s.width-p.width)+Math.abs(s.height-p.height),B=Math.abs(S-_);if(0===s.height&&0===p.height||0===s.width&&0===p.width||k<.5&&j<.5&&B<.01)return!1;var N=t.parse(h[n].transform),L={matrix:N},q={matrix:[]},X=[N];O.translate&&(X.push(t.translateX(s.left-p.left)),X.push(t.translateY(s.top-p.top))),O.scale&&(X.push(t.scaleX(Math.max(s.width,1)/Math.max(p.width,1))),X.push(t.scaleY(Math.max(s.height,1)/Math.max(p.height,1)))),O.opacity&&(q.opacity=_,L.opacity=S);var Y=[];if(!c[n]||!c[n].shouldInvert||c[n].shouldInvert(b.previous,b.current)){var W=function(t,e){return r(t.querySelectorAll("["+u+'="'+e+'"]'))}(A,n);Y=W.map(function(t){return[t,D(t)]})}q.matrix=F(X.reduce(t.multiply)),L.matrix=F(L.matrix);var K,H=function(t){var i=t.element,n=t.invertedChildren,r=t.body;return function(t){var s=t.matrix,a=t.opacity,o=t.forceMinVals;if(e(a)&&(i.style.opacity=a+""),o&&(i.style.minHeight="1px",i.style.minWidth="1px"),s){var l=function(t){return"matrix("+t.join(", ")+")"}(s);i.style.transform=l,n&&function(t){var e=t.matrix,i=t.body;t.invertedChildren.forEach(function(t){var n=t[0],r=t[1];if(i.contains(n)){var s=e[0],a=e[3],o=e[5],l={translateX:0,translateY:0,scaleX:1,scaleY:1},p="";r.translate&&(l.translateX=-e[4]/s,l.translateY=-o/a,p+="translate("+l.translateX+"px, "+l.translateY+"px)"),r.scale&&(l.scaleX=1/s,l.scaleY=1/a,p+=" scale("+l.scaleX+", "+l.scaleY+")"),n.style.transform=p}})}({invertedChildren:n,matrix:s,body:r})}}}({element:A,invertedChildren:Y,body:T});if(c[n]&&c[n].onComplete){var J=c[n].onComplete;K=function(){return J(A,b)}}var z=e(q.opacity)&&e(L.opacity)&&q.opacity!==L.opacity,G=!1;return a({},R,{stagger:V,springConfig:U,getOnUpdateFunc:function(t){var e=t.spring,i=t.onAnimationEnd;return d[n]={destroy:e.destroy.bind(e),onAnimationEnd:i},function(t){c[n]&&c[n].onSpringUpdate&&c[n].onSpringUpdate(t.getCurrentValue()),G||(G=!0,c[n]&&c[n].onStart&&c[n].onStart(A,b));var e=t.getCurrentValue();if(T.contains(A)){var i={matrix:[]};i.matrix=q.matrix.map(function(t,i){return l(t,L.matrix[i],e)}),z&&(i.opacity=l(q.opacity,L.opacity,e)),H(i)}else t.destroy()}},initializeFlip:function(){H({matrix:q.matrix,opacity:z?q.opacity:void 0,forceMinVals:E}),c[n]&&c[n].onStartImmediate&&c[n].onStartImmediate(A,b),O.transformOrigin?A.style.transformOrigin=O.transformOrigin:v&&(A.style.transformOrigin="0 0"),Y.forEach(function(t){var e=t[0],i=t[1];i.transformOrigin?e.style.transformOrigin=i.transformOrigin:v&&(e.style.transformOrigin="0 0")})},onAnimationEnd:function(t){delete d[n],i(K)&&K(),A.style.transform="",Y.forEach(function(t){t[0].style.transform=""}),E&&A&&(A.style.minHeight="",A.style.minWidth=""),t||(x.push(n),x.length>=M.length&&o(x))},delayUntil:O.delayUntil})}).filter(Boolean);if(M.forEach(function(t){return(0,t.initializeFlip)()}),S)return function(){};var k=M.filter(function(t){return t.delayUntil&&(e=t.delayUntil,M.filter(function(t){return t.id===e}).length);var e}),j={},B={},N={};k.forEach(function(t){t.stagger?(N[t.stagger]=!0,B[t.delayUntil]?B[t.delayUntil].push(t.stagger):B[t.delayUntil]=[t.stagger]):j[t.delayUntil]?j[t.delayUntil].push(t):j[t.delayUntil]=[t]});var L=M.filter(function(t){return t.stagger}).reduce(function(t,e){return t[e.stagger]?t[e.stagger].push(e):t[e.stagger]=[e],t},{}),q=M.filter(function(t){return-1===k.indexOf(t)});return q.forEach(function(t){t.onSpringActivate=function(){j[t.id]&&j[t.id].forEach(U),B[t.id]&&Object.keys(B[t.id].reduce(function(t,e){var i;return a(t,((i={})[e]=!0,i))},{})).forEach(function(t){V(L[t],A[t])})}}),function(){return M.length||o([]),q.filter(function(t){return!t.stagger}).forEach(U),Object.keys(L).forEach(function(t){N[t]||V(L[t],A[t])}),O}}(Z);j?j({hideEnteringElements:z,animateEnteringElements:G,animateExitingElements:Q,animateFlippedElements:$}):(z(),Q().then(G),$())}},j=function(t){var e=t.element,i=t.flipCallbacks,n=void 0===i?{}:i,s=t.inProgressAnimations,o=void 0===s?{}:s,l=T(e,t.portalKey),p=r(e.querySelectorAll("["+u+"]")),c={},d=[],h={};l.filter(function(t){return n&&n[t.dataset.flipId]&&n[t.dataset.flipId].onExit}).forEach(function(t){var e=t.parentNode;if(t.closest){var i=t.closest("["+f+"]");i&&(e=i)}var n=d.findIndex(function(t){return t[0]===e});-1===n&&(d.push([e,e.getBoundingClientRect()]),n=d.length-1),c[t.dataset.flipId]=d[n][1],h[t.dataset.flipId]=e});var g=M(l),m=g.map(function(t){var e=t[0],i=t[1],r={};if(n&&n[e.dataset.flipId]&&n[e.dataset.flipId].onExit){var s=c[e.dataset.flipId];a(r,{element:e,parent:h[e.dataset.flipId],childPosition:{top:i.top-s.top,left:i.left-s.left,width:i.width,height:i.height}})}return[e.dataset.flipId,{rect:i,opacity:parseFloat(window.getComputedStyle(e).opacity||"1"),domDataForExitAnimations:r}]}).reduce(R,{});return function(t,e){Object.keys(t).forEach(function(e){t[e].destroy&&t[e].destroy(),t[e].onAnimationEnd&&t[e].onAnimationEnd(!0),delete t[e]}),e.forEach(function(t){t.style.transform="",t.style.opacity=""})}(o,l.concat(p)),{flippedElementPositions:m,cachedOrderedFlipIds:g.map(function(t){return t[0].dataset.flipId})}},B=/*#__PURE__*/function(){function t(t){this.element=void 0,this.staggerConfig=void 0,this.applyTransformOrigin=!0,this.handleEnterUpdateDelete=void 0,this.debug=void 0,this.spring=void 0,this.inProgressAnimations=void 0,this.flipCallbacks=void 0,this.snapshot=void 0,this.onComplete=void 0,this.onStart=void 0,a(this,t),this.inProgressAnimations={},this.flipCallbacks={},this.recordBeforeUpdate=this.recordBeforeUpdate.bind(this),this.update=this.update.bind(this),this.addFlipped=this.addFlipped.bind(this),this.addInverted=this.addInverted.bind(this)}var e=t.prototype;return e.recordBeforeUpdate=function(){this.snapshot=j({element:this.element,flipCallbacks:this.flipCallbacks,inProgressAnimations:this.inProgressAnimations})},e.update=function(t,e){this.snapshot&&(k({flippedElementPositionsBeforeUpdate:this.snapshot.flippedElementPositions,cachedOrderedFlipIds:this.snapshot.cachedOrderedFlipIds,containerEl:this.element,inProgressAnimations:this.inProgressAnimations,flipCallbacks:this.flipCallbacks,applyTransformOrigin:this.applyTransformOrigin,spring:this.spring,debug:this.debug,staggerConfig:this.staggerConfig,handleEnterUpdateDelete:this.handleEnterUpdateDelete,decisionData:{previous:t,current:e},onComplete:this.onComplete,onStart:this.onStart}),delete this.snapshot)},e.addFlipped=function(t){var e=t.element,i=t.flipId,n=t.opacity,r=t.translate,s=t.scale,o=t.transformOrigin,l=t.spring,p=t.stagger,c=t.delayUntil,u=t.onAppear,d=t.onStart,f=t.onSpringUpdate,h=t.onComplete,g=t.onExit,m=t.shouldFlip,v=t.shouldInvert;if(!e)throw new Error("no element provided");if(!i)throw new Error("No flipId provided");var y={scale:s,translate:r,opacity:n,transformOrigin:o,spring:l,stagger:p,delayUntil:c};y.scale||y.translate||y.opacity||a(y,{translate:!0,scale:!0,opacity:!0}),i&&(e.dataset.flipId=String(i)),e.dataset.flipConfig=JSON.stringify(y),this.flipCallbacks[i]={shouldFlip:m,shouldInvert:v,onAppear:u,onStart:d,onSpringUpdate:f,onComplete:h,onExit:g}},e.addInverted=function(t){var e=t.element,i=t.parent,n=t.opacity,r=t.translate,s=t.scale,o=t.transformOrigin;if(!e)throw new Error("no element provided");if(!i)throw new Error("parent must be provided");var l=i.dataset.flipId,p={scale:s,translate:r,opacity:n,transformOrigin:o};p.scale||p.translate||p.opacity||a(p,{translate:!0,scale:!0,opacity:!0}),e.dataset.inverseFlipId=l,e.dataset.flipConfig=JSON.stringify(p)},t}(),N=new w,L=function(t){var e=t.values,i=t.onUpdate,n=t.delay,r=void 0===n?0:n,s=t.onComplete,o=a({},g.noWobble,m(t.config)),p=o.overshootClamping,c=N.createSpring(o.stiffness,o.damping);return c.setOvershootClampingEnabled(!!p),c.addListener({onSpringAtRest:function(t){s&&s(),t.destroy()},onSpringUpdate:function(t){var n=t.getCurrentValue();if(!e)return i(n);var r=Object.keys(e).map(function(t){return[t,l(e[t][0],e[t][1],n)]}).reduce(function(t,e){var i;return Object.assign(t,((i={})[e[0]]=e[1],i))},{});i(r)}}),r?setTimeout(function(){c.setEndValue(1)},r):c.setEndValue(1),c};export{B as Flipper,h as constants,j as getFlippedElementPositionsBeforeUpdate,k as onFlipKeyUpdate,L as spring,p as utilities};
 //# sourceMappingURL=index.es.js.map

lib/index.js

@@ -1,2 +0,2 @@
-var t=require("rematrix"),e=function(t){return"number"==typeof t},i=function(t){return"function"==typeof t},n=function(t){return"[object Object]"===Object.prototype.toString.call(t)},r=function(t){return Array.prototype.slice.apply(t)},s=function(t){var e=t.reduce(function(t,e){return t[e]=(t[e]||0)+1,t},{});return Object.keys(e).filter(function(t){return e[t]>1})};function a(t){return[].slice.call(arguments,1).forEach(function(e){if(e)for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i])}),t}var o,l=function(t,e,i){return t+(e-t)*i},p={__proto__:null,isNumber:e,isFunction:i,isObject:n,toArray:r,getDuplicateValsAsStrings:s,assign:a,tweenProp:l},c={noWobble:{stiffness:200,damping:26},gentle:{stiffness:120,damping:14},veryGentle:{stiffness:130,damping:17},wobbly:{stiffness:180,damping:12},stiff:{stiffness:260,damping:26}},u=function(t){return n(t)?t:Object.keys(c).indexOf(t)>-1?c[t]:{}};"undefined"!=typeof window&&(o=window.requestAnimationFrame);var d=o=o||function(t){window.setTimeout(t,1e3/60)},f=Date.now(),h="object"==typeof performance&&"function"==typeof performance.now?function(){return performance.now()}:function(){return Date.now()-f};function g(t,e){var i=t.indexOf(e);-1!==i&&t.splice(i,1)}var m=function(){function t(){}return t.prototype.run=function(){var t=this;d(function(){t.springSystem.loop(h())})},t}(),v=function(){this.position=0,this.velocity=0},y=0,_=function(){function t(t){this._id="s"+y++,this._springSystem=t,this.listeners=[],this._startValue=0,this._currentState=new v,this._displacementFromRestThreshold=.001,this._endValue=0,this._overshootClampingEnabled=!1,this._previousState=new v,this._restSpeedThreshold=.001,this._tempState=new v,this._timeAccumulator=0,this._wasAtRest=!0,this._cachedSpringConfig={}}var e=t.prototype;return e.getId=function(){return this._id},e.destroy=function(){this.listeners=[],this._springSystem.deregisterSpring(this)},e.setSpringConfig=function(t){return this._springConfig=t,this},e.getCurrentValue=function(){return this._currentState.position},e.getDisplacementDistanceForState=function(t){return Math.abs(this._endValue-t.position)},e.setEndValue=function(t){if(t===this._endValue)return this;if(this.prevEndValue=t,this._endValue===t&&this.isAtRest())return this;this._startValue=this.getCurrentValue(),this._endValue=t,this._springSystem.activateSpring(this.getId());for(var e=0,i=this.listeners.length;e<i;e++){var n=this.listeners[e].onSpringEndStateChange;n&&n(this)}return this},e.setVelocity=function(t){return t===this._currentState.velocity||(this._currentState.velocity=t,this._springSystem.activateSpring(this.getId())),this},e.setCurrentValue=function(t){this._startValue=t,this._currentState.position=t;for(var e=0,i=this.listeners.length;e<i;e++){var n=this.listeners[e];n.onSpringUpdate&&n.onSpringUpdate(this)}return this},e.setAtRest=function(){return this._endValue=this._currentState.position,this._tempState.position=this._currentState.position,this._currentState.velocity=0,this},e.setOvershootClampingEnabled=function(t){return this._overshootClampingEnabled=t,this},e.isOvershooting=function(){var t=this._startValue,e=this._endValue;return this._springConfig.tension>0&&(t<e&&this.getCurrentValue()>e||t>e&&this.getCurrentValue()<e)},e.advance=function(t,e){var i=this.isAtRest();if(!i||!this._wasAtRest){var n=e;e>.064&&(n=.064),this._timeAccumulator+=n;for(var r,s,a,o,l,p,c=this._springConfig.tension,u=this._springConfig.friction,d=this._currentState.position,f=this._currentState.velocity,h=this._tempState.position,g=this._tempState.velocity;this._timeAccumulator>=.001;)this._timeAccumulator-=.001,this._timeAccumulator<.001&&(this._previousState.position=d,this._previousState.velocity=f),s=c*(this._endValue-h)-u*f,o=c*(this._endValue-(h=d+.001*(r=f)*.5))-u*(g=f+.001*s*.5),p=c*(this._endValue-(h=d+.001*(a=g)*.5))-u*(g=f+.001*o*.5),h=d+.001*(l=g),d+=1/6*(r+2*(a+l)+(g=f+.001*p))*.001,f+=1/6*(s+2*(o+p)+(c*(this._endValue-h)-u*g))*.001;this._tempState.position=h,this._tempState.velocity=g,this._currentState.position=d,this._currentState.velocity=f,this._timeAccumulator>0&&this._interpolate(this._timeAccumulator/.001),(this.isAtRest()||this._overshootClampingEnabled&&this.isOvershooting())&&(this._springConfig.tension>0?(this._startValue=this._endValue,this._currentState.position=this._endValue):(this._endValue=this._currentState.position,this._startValue=this._endValue),this.setVelocity(0),i=!0);var m=!1;this._wasAtRest&&(this._wasAtRest=!1,m=!0);var v=!1;i&&(this._wasAtRest=!0,v=!0),this.notifyPositionUpdated(m,v)}},e.notifyPositionUpdated=function(t,e){var i=this;this.listeners.filter(Boolean).forEach(function(n){t&&n.onSpringActivate&&!i._onActivateCalled&&(n.onSpringActivate(i),i._onActivateCalled=!0),n.onSpringUpdate&&n.onSpringUpdate(i),e&&n.onSpringAtRest&&n.onSpringAtRest(i)})},e.systemShouldAdvance=function(){return!this.isAtRest()||!this.wasAtRest()},e.wasAtRest=function(){return this._wasAtRest},e.isAtRest=function(){return Math.abs(this._currentState.velocity)<this._restSpeedThreshold&&(this.getDisplacementDistanceForState(this._currentState)<=this._displacementFromRestThreshold||0===this._springConfig.tension)},e._interpolate=function(t){this._currentState.position=this._currentState.position*t+this._previousState.position*(1-t),this._currentState.velocity=this._currentState.velocity*t+this._previousState.velocity*(1-t)},e.addListener=function(t){return this.listeners.push(t),this},e.addOneTimeListener=function(t){var e=this;return Object.keys(t).forEach(function(i){var n;t[i]=(n=t[i],function(){n.apply(void 0,[].slice.call(arguments)),e.removeListener(t)})}),this.listeners.push(t),this},e.removeListener=function(t){return g(this.listeners,t),this},t}(),S=function(){function t(t){this.looper=t||new m,this.looper.springSystem=this,this.listeners=[],this._activeSprings=[],this._idleSpringIndices=[],this._isIdle=!0,this._lastTimeMillis=-1,this._springRegistry={}}var e=t.prototype;return e.createSpring=function(t,e){return this.createSpringWithConfig({tension:t,friction:e})},e.createSpringWithConfig=function(t){var e=new _(this);return this.registerSpring(e),e.setSpringConfig(t),e},e.getIsIdle=function(){return this._isIdle},e.registerSpring=function(t){this._springRegistry[t.getId()]=t},e.deregisterSpring=function(t){g(this._activeSprings,t),delete this._springRegistry[t.getId()]},e.advance=function(t,e){for(var i=this;this._idleSpringIndices.length>0;)this._idleSpringIndices.pop();for(this._activeSprings.filter(Boolean).forEach(function(n){n.systemShouldAdvance()?n.advance(t/1e3,e/1e3):i._idleSpringIndices.push(i._activeSprings.indexOf(n))});this._idleSpringIndices.length>0;){var n=this._idleSpringIndices.pop();n>=0&&this._activeSprings.splice(n,1)}},e.loop=function(t){var e;-1===this._lastTimeMillis&&(this._lastTimeMillis=t-1);var i=t-this._lastTimeMillis;this._lastTimeMillis=t;var n=0,r=this.listeners.length;for(n=0;n<r;n++)(e=this.listeners[n]).onBeforeIntegrate&&e.onBeforeIntegrate(this);for(this.advance(t,i),0===this._activeSprings.length&&(this._isIdle=!0,this._lastTimeMillis=-1),n=0;n<r;n++)(e=this.listeners[n]).onAfterIntegrate&&e.onAfterIntegrate(this);this._isIdle||this.looper.run()},e.activateSpring=function(t){var e=this._springRegistry[t];-1===this._activeSprings.indexOf(e)&&this._activeSprings.push(e),this.getIsIdle()&&(this._isIdle=!1,this.looper.run())},t}(),E=new S,A=function(t){var e=t.springConfig,i=e.overshootClamping,n=t.getOnUpdateFunc,r=t.onAnimationEnd,s=t.onSpringActivate,a=E.createSpring(e.stiffness,e.damping);a.setOvershootClampingEnabled(!!i);var o={onSpringActivate:s,onSpringAtRest:function(){a.destroy(),r()},onSpringUpdate:n({spring:a,onAnimationEnd:r})};return a.addListener(o),a},C=function(t){var e=A(t);return e.setEndValue(1),e},b=function(t,e){if(void 0===e&&(e={}),t&&t.length){e.reverse&&t.reverse();var i,n="number"!=typeof(i=e.speed)?1.1:1+Math.min(Math.max(5*i,0),5),r=1/Math.max(Math.min(t.length,100),10),s=t.map(function(t,e){var i=t.getOnUpdateFunc;return t.getOnUpdateFunc=function(t){var a=i(t);return function(t){var i=t.getCurrentValue();(i=i<.01?0:i>.99?1:i)>=r&&s[e+1]&&s[e+1](Math.max(Math.min(i*n,1),0)),a(t)}},t}).map(function(t){var e=A(t);if(e)return e.setEndValue.bind(e)}).filter(Boolean);s[0]&&s[0](1)}},I=function(t){return[0,1,4,5,12,13].map(function(e){return t[e]})},O=function(t){return t.top<window.innerHeight&&t.bottom>0&&t.left<window.innerWidth&&t.right>0};function w(t){return JSON.parse(t.dataset.flipConfig||"{}")}var x=function(t,e){var i;return a(t,((i={})[e[0]]=e[1],i))},U=function(t,e){return r(e?document.querySelectorAll('[data-portal-key="'+e+'"]'):t.querySelectorAll("[data-flip-id]"))},V=function(t){return t.map(function(t){return[t,t.getBoundingClientRect()]})},F=function(n){var o,p=n.cachedOrderedFlipIds,d=void 0===p?[]:p,f=n.inProgressAnimations,h=void 0===f?{}:f,g=n.flippedElementPositionsBeforeUpdate,m=void 0===g?{}:g,v=n.flipCallbacks,y=void 0===v?{}:v,_=n.containerEl,S=n.applyTransformOrigin,E=n.spring,A=n.debug,F=n.portalKey,P=n.staggerConfig,R=void 0===P?{}:P,T=n.decisionData,D=void 0===T?{}:T,M=n.handleEnterUpdateDelete,k=n.onComplete,j=n.onStart,B=V(U((o={element:_,portalKey:F}).element,o.portalKey)).map(function(t){var e=t[0],i=t[1],n=window.getComputedStyle(e);return[e.dataset.flipId,{element:e,rect:i,opacity:parseFloat(n.opacity),transform:n.transform}]}).reduce(x,{}),N=function(t){var e=t.containerEl,i=t.portalKey;return i?function(t){return function(e){return r(document.querySelectorAll('[data-portal-key="'+t+'"]'+e))}}(i):e?function(t){var e=Math.random().toFixed(5);return t.dataset.flipperId=e,function(i){return r(t.querySelectorAll('[data-flipper-id="'+e+'"] '+i))}}(e):function(){return[]}}({containerEl:_,portalKey:F}),L=function(t){return function(e){return t('[data-flip-id="'+e+'"]')[0]}}(N),q=function(t){return m[t]&&B[t]},X=Object.keys(m).concat(Object.keys(B)).filter(function(t){return!q(t)}),Y={flipCallbacks:y,getElement:L,flippedElementPositionsBeforeUpdate:m,flippedElementPositionsAfterUpdate:B,inProgressAnimations:h,decisionData:D},K=function(t){var e,i=t.unflippedIds,n=t.flipCallbacks,r=t.getElement,s=t.flippedElementPositionsBeforeUpdate,a=t.flippedElementPositionsAfterUpdate,o=t.inProgressAnimations,l=t.decisionData,p=i.filter(function(t){return a[t]}).filter(function(t){return n[t]&&n[t].onAppear}),c=i.filter(function(t){return s[t]&&n[t]&&n[t].onExit}),u=new Promise(function(t){e=t}),d=[],f=0,h=c.map(function(t,i){var r=s[t].domDataForExitAnimations,a=r.element,p=r.parent,c=r.childPosition,u=c.top,h=c.left,g=c.width,m=c.height;"static"===getComputedStyle(p).position&&(p.style.position="relative"),a.style.transform="matrix(1, 0, 0, 1, 0, 0)",a.style.position="absolute",a.style.top=u+"px",a.style.left=h+"px",a.style.height=m+"px",a.style.width=g+"px";var v=d.filter(function(t){return t[0]===p})[0];v||(v=[p,document.createDocumentFragment()],d.push(v)),v[1].appendChild(a),f+=1;var y=function(){try{p.removeChild(a)}catch(t){}finally{0==(f-=1)&&e()}};return o[t]={stop:y},function(){return n[t].onExit(a,i,y,l)}});return d.forEach(function(t){t[0].appendChild(t[1])}),h.length||e(),{hideEnteringElements:function(){p.forEach(function(t){var e=r(t);e&&(e.style.opacity="0")})},animateEnteringElements:function(){p.forEach(function(t,e){var i=r(t);i&&n[t].onAppear(i,e,l)})},animateExitingElements:function(){return h.forEach(function(t){return t()}),u}}}(a({},Y,{unflippedIds:X})),W=K.hideEnteringElements,H=K.animateEnteringElements,J=K.animateExitingElements,z=a({},Y,{containerEl:_,flippedIds:d.filter(q),applyTransformOrigin:S,spring:E,debug:A,staggerConfig:R,scopedSelector:N,onComplete:k});j&&j(_,D);var G=function(n){var o,p=n.flippedIds,d=n.flipCallbacks,f=n.inProgressAnimations,h=n.flippedElementPositionsBeforeUpdate,g=n.flippedElementPositionsAfterUpdate,m=n.applyTransformOrigin,v=n.spring,y=n.getElement,_=n.debug,S=n.staggerConfig,E=void 0===S?{}:S,A=n.decisionData,x=void 0===A?{}:A,U=n.onComplete,V=n.containerEl,F=new Promise(function(t){o=t});if(U&&F.then(function(){return U(V,x)}),!p.length)return function(){return o([]),F};var P=[],R=y(p[0]),T=R?R.ownerDocument.querySelector("body"):document.querySelector("body"),D=(s(p),p.map(function(n){var s=h[n].rect,p=g[n].rect,y=h[n].opacity,_=g[n].opacity,S=p.width<1||p.height<1,E=g[n].element;if(!O(s)&&!O(p))return!1;if(!E)return!1;var A,C,b,U=w(E),V=(b=(C=void 0===(A={flipperSpring:v,flippedSpring:U.spring})?{}:A).flippedSpring,a({},c.noWobble,u(C.flipperSpring),u(b))),F=!0===U.stagger?"default":U.stagger,R={element:E,id:n,stagger:F,springConfig:V};if(d[n]&&d[n].shouldFlip&&!d[n].shouldFlip(x.previous,x.current))return!1;var M=Math.abs(s.left-p.left)+Math.abs(s.top-p.top),k=Math.abs(s.width-p.width)+Math.abs(s.height-p.height),j=Math.abs(_-y);if(0===s.height&&0===p.height||0===s.width&&0===p.width||M<.5&&k<.5&&j<.01)return!1;var B=t.parse(g[n].transform),N={matrix:B},L={matrix:[]},q=[B];U.translate&&(q.push(t.translateX(s.left-p.left)),q.push(t.translateY(s.top-p.top))),U.scale&&(q.push(t.scaleX(Math.max(s.width,1)/Math.max(p.width,1))),q.push(t.scaleY(Math.max(s.height,1)/Math.max(p.height,1)))),U.opacity&&(L.opacity=y,N.opacity=_);var X=[];if(!d[n]||!d[n].shouldInvert||d[n].shouldInvert(x.previous,x.current)){var Y=function(t,e){return r(t.querySelectorAll('[data-inverse-flip-id="'+e+'"]'))}(E,n);X=Y.map(function(t){return[t,w(t)]})}L.matrix=I(q.reduce(t.multiply)),N.matrix=I(N.matrix);var K,W=function(t){var i=t.element,n=t.invertedChildren,r=t.body;return function(t){var s=t.matrix,a=t.opacity,o=t.forceMinVals;if(e(a)&&(i.style.opacity=a+""),o&&(i.style.minHeight="1px",i.style.minWidth="1px"),s){var l=function(t){return"matrix("+t.join(", ")+")"}(s);i.style.transform=l,n&&function(t){var e=t.matrix,i=t.body;t.invertedChildren.forEach(function(t){var n=t[0],r=t[1];if(i.contains(n)){var s=e[0],a=e[3],o=e[5],l={translateX:0,translateY:0,scaleX:1,scaleY:1},p="";r.translate&&(l.translateX=-e[4]/s,l.translateY=-o/a,p+="translate("+l.translateX+"px, "+l.translateY+"px)"),r.scale&&(l.scaleX=1/s,l.scaleY=1/a,p+=" scale("+l.scaleX+", "+l.scaleY+")"),n.style.transform=p}})}({invertedChildren:n,matrix:s,body:r})}}}({element:E,invertedChildren:X,body:T});if(d[n]&&d[n].onComplete){var H=d[n].onComplete;K=function(){return H(E,x)}}var J=e(L.opacity)&&e(N.opacity)&&L.opacity!==N.opacity,z=!1;return a({},R,{stagger:F,springConfig:V,getOnUpdateFunc:function(t){var e=t.spring,i=t.onAnimationEnd;return f[n]={destroy:e.destroy.bind(e),onAnimationEnd:i},function(t){d[n]&&d[n].onSpringUpdate&&d[n].onSpringUpdate(t.getCurrentValue()),z||(z=!0,d[n]&&d[n].onStart&&d[n].onStart(E,x));var e=t.getCurrentValue();if(T.contains(E)){var i={matrix:[]};i.matrix=L.matrix.map(function(t,i){return l(t,N.matrix[i],e)}),J&&(i.opacity=l(L.opacity,N.opacity,e)),W(i)}else t.destroy()}},initializeFlip:function(){W({matrix:L.matrix,opacity:J?L.opacity:void 0,forceMinVals:S}),d[n]&&d[n].onStartImmediate&&d[n].onStartImmediate(E,x),U.transformOrigin?E.style.transformOrigin=U.transformOrigin:m&&(E.style.transformOrigin="0 0"),X.forEach(function(t){var e=t[0],i=t[1];i.transformOrigin?e.style.transformOrigin=i.transformOrigin:m&&(e.style.transformOrigin="0 0")})},onAnimationEnd:function(t){delete f[n],i(K)&&K(),E.style.transform="",X.forEach(function(t){t[0].style.transform=""}),S&&E&&(E.style.minHeight="",E.style.minWidth=""),t||(P.push(n),P.length>=D.length&&o(P))},delayUntil:U.delayUntil})}).filter(Boolean));if(D.forEach(function(t){return(0,t.initializeFlip)()}),_)return function(){};var M=D.filter(function(t){return t.delayUntil&&(e=t.delayUntil,D.filter(function(t){return t.id===e}).length);var e}),k={},j={},B={};M.forEach(function(t){t.stagger?(B[t.stagger]=!0,j[t.delayUntil]?j[t.delayUntil].push(t.stagger):j[t.delayUntil]=[t.stagger]):k[t.delayUntil]?k[t.delayUntil].push(t):k[t.delayUntil]=[t]});var N=D.filter(function(t){return t.stagger}).reduce(function(t,e){return t[e.stagger]?t[e.stagger].push(e):t[e.stagger]=[e],t},{}),L=D.filter(function(t){return-1===M.indexOf(t)});return L.forEach(function(t){t.onSpringActivate=function(){k[t.id]&&k[t.id].forEach(C),j[t.id]&&Object.keys(j[t.id].reduce(function(t,e){var i;return a(t,((i={})[e]=!0,i))},{})).forEach(function(t){b(N[t],E[t])})}}),function(){return D.length||o([]),L.filter(function(t){return!t.stagger}).forEach(C),Object.keys(N).forEach(function(t){B[t]||b(N[t],E[t])}),F}}(z);M?M({hideEnteringElements:W,animateEnteringElements:H,animateExitingElements:J,animateFlippedElements:G}):(W(),J().then(H),G())},P=function(t){var e=t.element,i=t.flipCallbacks,n=void 0===i?{}:i,s=t.inProgressAnimations,o=void 0===s?{}:s,l=U(e,t.portalKey),p=r(e.querySelectorAll("[data-inverse-flip-id]")),c={},u=[],d={};l.filter(function(t){return n&&n[t.dataset.flipId]&&n[t.dataset.flipId].onExit}).forEach(function(t){var e=t.parentNode;if(t.closest){var i=t.closest("[data-exit-container]");i&&(e=i)}var n=u.findIndex(function(t){return t[0]===e});-1===n&&(u.push([e,e.getBoundingClientRect()]),n=u.length-1),c[t.dataset.flipId]=u[n][1],d[t.dataset.flipId]=e});var f=V(l),h=f.map(function(t){var e=t[0],i=t[1],r={};if(n&&n[e.dataset.flipId]&&n[e.dataset.flipId].onExit){var s=c[e.dataset.flipId];a(r,{element:e,parent:d[e.dataset.flipId],childPosition:{top:i.top-s.top,left:i.left-s.left,width:i.width,height:i.height}})}return[e.dataset.flipId,{rect:i,opacity:parseFloat(window.getComputedStyle(e).opacity||"1"),domDataForExitAnimations:r}]}).reduce(x,{});return function(t,e){Object.keys(t).forEach(function(e){t[e].destroy&&t[e].destroy(),t[e].onAnimationEnd&&t[e].onAnimationEnd(!0),delete t[e]}),e.forEach(function(t){t.style.transform="",t.style.opacity=""})}(o,l.concat(p)),{flippedElementPositions:h,cachedOrderedFlipIds:f.map(function(t){return t[0].dataset.flipId})}},R=function(){function t(t){this.applyTransformOrigin=!0,a(this,t),this.inProgressAnimations={},this.flipCallbacks={},this.recordBeforeUpdate=this.recordBeforeUpdate.bind(this),this.update=this.update.bind(this),this.addFlipped=this.addFlipped.bind(this),this.addInverted=this.addInverted.bind(this)}var e=t.prototype;return e.recordBeforeUpdate=function(){this.snapshot=P({element:this.element,flipCallbacks:this.flipCallbacks,inProgressAnimations:this.inProgressAnimations})},e.update=function(t,e){this.snapshot&&(F({flippedElementPositionsBeforeUpdate:this.snapshot.flippedElementPositions,cachedOrderedFlipIds:this.snapshot.cachedOrderedFlipIds,containerEl:this.element,inProgressAnimations:this.inProgressAnimations,flipCallbacks:this.flipCallbacks,applyTransformOrigin:this.applyTransformOrigin,spring:this.spring,debug:this.debug,staggerConfig:this.staggerConfig,handleEnterUpdateDelete:this.handleEnterUpdateDelete,decisionData:{previous:t,current:e},onComplete:this.onComplete,onStart:this.onStart}),delete this.snapshot)},e.addFlipped=function(t){var e=t.element,i=t.flipId,n=t.opacity,r=t.translate,s=t.scale,o=t.transformOrigin,l=t.spring,p=t.stagger,c=t.delayUntil,u=t.onAppear,d=t.onStart,f=t.onSpringUpdate,h=t.onComplete,g=t.onExit,m=t.shouldFlip,v=t.shouldInvert;if(!e)throw new Error("no element provided");if(!i)throw new Error("No flipId provided");var y={scale:s,translate:r,opacity:n,transformOrigin:o,spring:l,stagger:p,delayUntil:c};y.scale||y.translate||y.opacity||a(y,{translate:!0,scale:!0,opacity:!0}),i&&(e.dataset.flipId=String(i)),e.dataset.flipConfig=JSON.stringify(y),this.flipCallbacks[i]={shouldFlip:m,shouldInvert:v,onAppear:u,onStart:d,onSpringUpdate:f,onComplete:h,onExit:g}},e.addInverted=function(t){var e=t.element,i=t.parent,n=t.opacity,r=t.translate,s=t.scale,o=t.transformOrigin;if(!e)throw new Error("no element provided");if(!i)throw new Error("parent must be provided");var l=i.dataset.flipId,p={scale:s,translate:r,opacity:n,transformOrigin:o};p.scale||p.translate||p.opacity||a(p,{translate:!0,scale:!0,opacity:!0}),e.dataset.inverseFlipId=l,e.dataset.flipConfig=JSON.stringify(p)},t}(),T=new S;exports.Flipper=R,exports.constants={__proto__:null,DATA_FLIP_ID:"data-flip-id",DATA_INVERSE_FLIP_ID:"data-inverse-flip-id",DATA_FLIP_COMPONENT_ID:"data-flip-component-id",DATA_FLIP_CONFIG:"data-flip-config",DATA_PORTAL_KEY:"data-portal-key",DATA_EXIT_CONTAINER:"data-exit-container"},exports.getFlippedElementPositionsBeforeUpdate=P,exports.onFlipKeyUpdate=F,exports.spring=function(t){var e=t.values,i=t.onUpdate,n=t.delay,r=void 0===n?0:n,s=t.onComplete,o=a({},c.noWobble,u(t.config)),p=o.overshootClamping,d=T.createSpring(o.stiffness,o.damping);return d.setOvershootClampingEnabled(!!p),d.addListener({onSpringAtRest:function(t){s&&s(),t.destroy()},onSpringUpdate:function(t){var n=t.getCurrentValue();if(!e)return i(n);var r=Object.keys(e).map(function(t){return[t,l(e[t][0],e[t][1],n)]}).reduce(function(t,e){var i;return Object.assign(t,((i={})[e[0]]=e[1],i))},{});i(r)}}),r?setTimeout(function(){d.setEndValue(1)},r):d.setEndValue(1),d},exports.utilities=p;
+function t(t){if(t&&t.__esModule)return t;var e=Object.create(null);return t&&Object.keys(t).forEach(function(i){if("default"!==i){var n=Object.getOwnPropertyDescriptor(t,i);Object.defineProperty(e,i,n.get?n:{enumerable:!0,get:function(){return t[i]}})}}),e.default=t,e}var e=/*#__PURE__*/t(require("rematrix")),i=function(t){return"number"==typeof t},n=function(t){return"function"==typeof t},r=function(t){return"[object Object]"===Object.prototype.toString.call(t)},s=function(t){return Array.prototype.slice.apply(t)},o=function(t){var e=t.reduce(function(t,e){return t[e]=(t[e]||0)+1,t},{});return Object.keys(e).filter(function(t){return e[t]>1})};function a(t){return[].slice.call(arguments,1).forEach(function(e){if(e)for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i])}),t}var l,p=function(t,e,i){return t+(e-t)*i},c={__proto__:null,isNumber:i,isFunction:n,isObject:r,toArray:s,getDuplicateValsAsStrings:o,assign:a,tweenProp:p},u="data-flip-id",d="data-inverse-flip-id",f="data-portal-key",h="data-exit-container",g={__proto__:null,DATA_FLIP_ID:u,DATA_INVERSE_FLIP_ID:d,DATA_FLIP_COMPONENT_ID:"data-flip-component-id",DATA_FLIP_CONFIG:"data-flip-config",DATA_PORTAL_KEY:f,DATA_EXIT_CONTAINER:h},m={noWobble:{stiffness:200,damping:26},gentle:{stiffness:120,damping:14},veryGentle:{stiffness:130,damping:17},wobbly:{stiffness:180,damping:12},stiff:{stiffness:260,damping:26}},v=function(t){return r(t)?t:Object.keys(m).indexOf(t)>-1?m[t]:{}};"undefined"!=typeof window&&(l=window.requestAnimationFrame);var y=l=l||function(t){window.setTimeout(t,1e3/60)},_=Date.now(),S="object"==typeof performance&&"function"==typeof performance.now?function(){return performance.now()}:function(){return Date.now()-_};function E(t,e){var i=t.indexOf(e);-1!==i&&t.splice(i,1)}var A=/*#__PURE__*/function(){function t(){}return t.prototype.run=function(){var t=this;y(function(){t.springSystem.loop(S())})},t}(),C=function(){this.position=0,this.velocity=0},b=0,I=.001,O=/*#__PURE__*/function(){function t(t){this._id="s"+b++,this._springSystem=t,this.listeners=[],this._startValue=0,this._currentState=new C,this._displacementFromRestThreshold=.001,this._endValue=0,this._overshootClampingEnabled=!1,this._previousState=new C,this._restSpeedThreshold=.001,this._tempState=new C,this._timeAccumulator=0,this._wasAtRest=!0,this._cachedSpringConfig={}}var e=t.prototype;return e.getId=function(){return this._id},e.destroy=function(){this.listeners=[],this._springSystem.deregisterSpring(this)},e.setSpringConfig=function(t){return this._springConfig=t,this},e.getCurrentValue=function(){return this._currentState.position},e.getDisplacementDistanceForState=function(t){return Math.abs(this._endValue-t.position)},e.setEndValue=function(t){if(t===this._endValue)return this;if(this.prevEndValue=t,this._endValue===t&&this.isAtRest())return this;this._startValue=this.getCurrentValue(),this._endValue=t,this._springSystem.activateSpring(this.getId());for(var e=0,i=this.listeners.length;e<i;e++){var n=this.listeners[e].onSpringEndStateChange;n&&n(this)}return this},e.setVelocity=function(t){return t===this._currentState.velocity||(this._currentState.velocity=t,this._springSystem.activateSpring(this.getId())),this},e.setCurrentValue=function(t){this._startValue=t,this._currentState.position=t;for(var e=0,i=this.listeners.length;e<i;e++){var n=this.listeners[e];n.onSpringUpdate&&n.onSpringUpdate(this)}return this},e.setAtRest=function(){return this._endValue=this._currentState.position,this._tempState.position=this._currentState.position,this._currentState.velocity=0,this},e.setOvershootClampingEnabled=function(t){return this._overshootClampingEnabled=t,this},e.isOvershooting=function(){var t=this._startValue,e=this._endValue;return this._springConfig.tension>0&&(t<e&&this.getCurrentValue()>e||t>e&&this.getCurrentValue()<e)},e.advance=function(t,e){var i=this.isAtRest();if(!i||!this._wasAtRest){var n=e;e>.064&&(n=.064),this._timeAccumulator+=n;for(var r,s,o,a,l,p,c=this._springConfig.tension,u=this._springConfig.friction,d=this._currentState.position,f=this._currentState.velocity,h=this._tempState.position,g=this._tempState.velocity;this._timeAccumulator>=I;)this._timeAccumulator-=I,this._timeAccumulator<I&&(this._previousState.position=d,this._previousState.velocity=f),s=c*(this._endValue-h)-u*f,a=c*(this._endValue-(h=d+(r=f)*I*.5))-u*(g=f+s*I*.5),p=c*(this._endValue-(h=d+(o=g)*I*.5))-u*(g=f+a*I*.5),h=d+(l=g)*I,d+=1/6*(r+2*(o+l)+(g=f+p*I))*I,f+=1/6*(s+2*(a+p)+(c*(this._endValue-h)-u*g))*I;this._tempState.position=h,this._tempState.velocity=g,this._currentState.position=d,this._currentState.velocity=f,this._timeAccumulator>0&&this._interpolate(this._timeAccumulator/I),(this.isAtRest()||this._overshootClampingEnabled&&this.isOvershooting())&&(this._springConfig.tension>0?(this._startValue=this._endValue,this._currentState.position=this._endValue):(this._endValue=this._currentState.position,this._startValue=this._endValue),this.setVelocity(0),i=!0);var m=!1;this._wasAtRest&&(this._wasAtRest=!1,m=!0);var v=!1;i&&(this._wasAtRest=!0,v=!0),this.notifyPositionUpdated(m,v)}},e.notifyPositionUpdated=function(t,e){var i=this;this.listeners.filter(Boolean).forEach(function(n){t&&n.onSpringActivate&&!i._onActivateCalled&&(n.onSpringActivate(i),i._onActivateCalled=!0),n.onSpringUpdate&&n.onSpringUpdate(i),e&&n.onSpringAtRest&&n.onSpringAtRest(i)})},e.systemShouldAdvance=function(){return!this.isAtRest()||!this.wasAtRest()},e.wasAtRest=function(){return this._wasAtRest},e.isAtRest=function(){return Math.abs(this._currentState.velocity)<this._restSpeedThreshold&&(this.getDisplacementDistanceForState(this._currentState)<=this._displacementFromRestThreshold||0===this._springConfig.tension)},e._interpolate=function(t){this._currentState.position=this._currentState.position*t+this._previousState.position*(1-t),this._currentState.velocity=this._currentState.velocity*t+this._previousState.velocity*(1-t)},e.addListener=function(t){return this.listeners.push(t),this},e.addOneTimeListener=function(t){var e=this;return Object.keys(t).forEach(function(i){var n;t[i]=(n=t[i],function(){n.apply(void 0,[].slice.call(arguments)),e.removeListener(t)})}),this.listeners.push(t),this},e.removeListener=function(t){return E(this.listeners,t),this},t}(),w=/*#__PURE__*/function(){function t(t){this.looper=t||new A,this.looper.springSystem=this,this.listeners=[],this._activeSprings=[],this._idleSpringIndices=[],this._isIdle=!0,this._lastTimeMillis=-1,this._springRegistry={}}var e=t.prototype;return e.createSpring=function(t,e){return this.createSpringWithConfig({tension:t,friction:e})},e.createSpringWithConfig=function(t){var e=new O(this);return this.registerSpring(e),e.setSpringConfig(t),e},e.getIsIdle=function(){return this._isIdle},e.registerSpring=function(t){this._springRegistry[t.getId()]=t},e.deregisterSpring=function(t){E(this._activeSprings,t),delete this._springRegistry[t.getId()]},e.advance=function(t,e){for(var i=this;this._idleSpringIndices.length>0;)this._idleSpringIndices.pop();for(this._activeSprings.filter(Boolean).forEach(function(n){n.systemShouldAdvance()?n.advance(t/1e3,e/1e3):i._idleSpringIndices.push(i._activeSprings.indexOf(n))});this._idleSpringIndices.length>0;){var n=this._idleSpringIndices.pop();n>=0&&this._activeSprings.splice(n,1)}},e.loop=function(t){var e;-1===this._lastTimeMillis&&(this._lastTimeMillis=t-1);var i=t-this._lastTimeMillis;this._lastTimeMillis=t;var n=0,r=this.listeners.length;for(n=0;n<r;n++)(e=this.listeners[n]).onBeforeIntegrate&&e.onBeforeIntegrate(this);for(this.advance(t,i),0===this._activeSprings.length&&(this._isIdle=!0,this._lastTimeMillis=-1),n=0;n<r;n++)(e=this.listeners[n]).onAfterIntegrate&&e.onAfterIntegrate(this);this._isIdle||this.looper.run()},e.activateSpring=function(t){var e=this._springRegistry[t];-1===this._activeSprings.indexOf(e)&&this._activeSprings.push(e),this.getIsIdle()&&(this._isIdle=!1,this.looper.run())},t}(),x=new w,U=function(t){var e=t.springConfig,i=e.overshootClamping,n=t.getOnUpdateFunc,r=t.onAnimationEnd,s=t.onSpringActivate,o=x.createSpring(e.stiffness,e.damping);o.setOvershootClampingEnabled(!!i);var a={onSpringActivate:s,onSpringAtRest:function(){o.destroy(),r()},onSpringUpdate:n({spring:o,onAnimationEnd:r})};return o.addListener(a),o},V=function(t){var e=U(t);return e.setEndValue(1),e},F=function(t,e){if(void 0===e&&(e={}),t&&t.length){e.reverse&&t.reverse();var i,n="number"!=typeof(i=e.speed)?1.1:1+Math.min(Math.max(5*i,0),5),r=1/Math.max(Math.min(t.length,100),10),s=t.map(function(t,e){var i=t.getOnUpdateFunc;return t.getOnUpdateFunc=function(t){var o=i(t);return function(t){var i=t.getCurrentValue();(i=i<.01?0:i>.99?1:i)>=r&&s[e+1]&&s[e+1](Math.max(Math.min(i*n,1),0)),o(t)}},t}).map(function(t){var e=U(t);if(e)return e.setEndValue.bind(e)}).filter(Boolean);s[0]&&s[0](1)}},P=function(t){return[0,1,4,5,12,13].map(function(e){return t[e]})},D=function(t){return t.top<window.innerHeight&&t.bottom>0&&t.left<window.innerWidth&&t.right>0};function M(t){return JSON.parse(t.dataset.flipConfig||"{}")}var R=function(t,e){var i;return a(t,((i={})[e[0]]=e[1],i))},T=function(t,e){return s(e?document.querySelectorAll("["+f+'="'+e+'"]'):t.querySelectorAll("["+u+"]"))},k=function(t){return t.map(function(t){return[t,t.getBoundingClientRect()]})},j=function(t){var r=t.cachedOrderedFlipIds,l=void 0===r?[]:r,c=t.inProgressAnimations,h=void 0===c?{}:c,g=t.flippedElementPositionsBeforeUpdate,y=void 0===g?{}:g,_=t.flipCallbacks,S=void 0===_?{}:_,E=t.containerEl,A=t.applyTransformOrigin,C=t.spring,b=t.debug,I=t.portalKey,O=t.staggerConfig,w=void 0===O?{}:O,x=t.decisionData,U=void 0===x?{}:x,j=t.handleEnterUpdateDelete,B=t.onComplete,N=t.onStart;if(!window.matchMedia("(prefers-reduced-motion: reduce)").matches){var L,q=k(T((L={element:E,portalKey:I}).element,L.portalKey)).map(function(t){var e=t[0],i=t[1],n=window.getComputedStyle(e);return[e.dataset.flipId,{element:e,rect:i,opacity:parseFloat(n.opacity),transform:n.transform}]}).reduce(R,{}),X=function(t){var e=t.containerEl,i=t.portalKey;return i?function(t){return function(e){return s(document.querySelectorAll("["+f+'="'+t+'"]'+e))}}(i):e?function(t){var e=Math.random().toFixed(5);return t.dataset.flipperId=e,function(i){return s(t.querySelectorAll('[data-flipper-id="'+e+'"] '+i))}}(e):function(){return[]}}({containerEl:E,portalKey:I}),Y=function(t){return function(e){return t("["+u+'="'+e+'"]')[0]}}(X),K=function(t){return y[t]&&q[t]},W=Object.keys(y).concat(Object.keys(q)).filter(function(t){return!K(t)}),H={flipCallbacks:S,getElement:Y,flippedElementPositionsBeforeUpdate:y,flippedElementPositionsAfterUpdate:q,inProgressAnimations:h,decisionData:U},J=function(t){var e,i=t.unflippedIds,n=t.flipCallbacks,r=t.getElement,s=t.flippedElementPositionsBeforeUpdate,o=t.flippedElementPositionsAfterUpdate,a=t.inProgressAnimations,l=t.decisionData,p=i.filter(function(t){return o[t]}).filter(function(t){return n[t]&&n[t].onAppear}),c=i.filter(function(t){return s[t]&&n[t]&&n[t].onExit}),u=new Promise(function(t){e=t}),d=[],f=0,h=c.map(function(t,i){var r=s[t].domDataForExitAnimations,o=r.element,p=r.parent,c=r.childPosition,u=c.top,h=c.left,g=c.width,m=c.height;"static"===getComputedStyle(p).position&&(p.style.position="relative"),o.style.transform="matrix(1, 0, 0, 1, 0, 0)",o.style.position="absolute",o.style.top=u+"px",o.style.left=h+"px",o.style.height=m+"px",o.style.width=g+"px";var v=d.filter(function(t){return t[0]===p})[0];v||(v=[p,document.createDocumentFragment()],d.push(v)),v[1].appendChild(o),f+=1;var y=function(){try{p.removeChild(o)}catch(t){}finally{0==(f-=1)&&e()}};return a[t]={stop:y},function(){return n[t].onExit(o,i,y,l)}});return d.forEach(function(t){t[0].appendChild(t[1])}),h.length||e(),{hideEnteringElements:function(){p.forEach(function(t){var e=r(t);e&&(e.style.opacity="0")})},animateEnteringElements:function(){p.forEach(function(t,e){var i=r(t);i&&n[t].onAppear(i,e,l)})},animateExitingElements:function(){return h.forEach(function(t){return t()}),u}}}(a({},H,{unflippedIds:W})),z=J.hideEnteringElements,G=J.animateEnteringElements,Q=J.animateExitingElements,Z=a({},H,{containerEl:E,flippedIds:l.filter(K),applyTransformOrigin:A,spring:C,debug:b,staggerConfig:w,scopedSelector:X,onComplete:B});N&&N(E,U);var $=function(t){var r,l=t.flippedIds,c=t.flipCallbacks,u=t.inProgressAnimations,f=t.flippedElementPositionsBeforeUpdate,h=t.flippedElementPositionsAfterUpdate,g=t.applyTransformOrigin,y=t.spring,_=t.getElement,S=t.debug,E=t.staggerConfig,A=void 0===E?{}:E,C=t.decisionData,b=void 0===C?{}:C,I=t.onComplete,O=t.containerEl,w=new Promise(function(t){r=t});if(I&&w.then(function(){return I(O,b)}),!l.length)return function(){return r([]),w};var x=[],U=_(l[0]),R=U?U.ownerDocument.querySelector("body"):document.querySelector("body");o(l);var T=l.map(function(t){var o=f[t].rect,l=h[t].rect,_=f[t].opacity,S=h[t].opacity,E=l.width<1||l.height<1,A=h[t].element;if(!D(o)&&!D(l))return!1;if(!A)return!1;var C,I,O,w=M(A),U=(O=(I=void 0===(C={flipperSpring:y,flippedSpring:w.spring})?{}:C).flippedSpring,a({},m.noWobble,v(I.flipperSpring),v(O))),V=!0===w.stagger?"default":w.stagger,F={element:A,id:t,stagger:V,springConfig:U};if(c[t]&&c[t].shouldFlip&&!c[t].shouldFlip(b.previous,b.current))return!1;var k=Math.abs(o.left-l.left)+Math.abs(o.top-l.top),j=Math.abs(o.width-l.width)+Math.abs(o.height-l.height),B=Math.abs(S-_);if(0===o.height&&0===l.height||0===o.width&&0===l.width||k<.5&&j<.5&&B<.01)return!1;var N=e.parse(h[t].transform),L={matrix:N},q={matrix:[]},X=[N];w.translate&&(X.push(e.translateX(o.left-l.left)),X.push(e.translateY(o.top-l.top))),w.scale&&(X.push(e.scaleX(Math.max(o.width,1)/Math.max(l.width,1))),X.push(e.scaleY(Math.max(o.height,1)/Math.max(l.height,1)))),w.opacity&&(q.opacity=_,L.opacity=S);var Y=[];if(!c[t]||!c[t].shouldInvert||c[t].shouldInvert(b.previous,b.current)){var K=function(t,e){return s(t.querySelectorAll("["+d+'="'+e+'"]'))}(A,t);Y=K.map(function(t){return[t,M(t)]})}q.matrix=P(X.reduce(e.multiply)),L.matrix=P(L.matrix);var W,H=function(t){var e=t.element,n=t.invertedChildren,r=t.body;return function(t){var s=t.matrix,o=t.opacity,a=t.forceMinVals;if(i(o)&&(e.style.opacity=o+""),a&&(e.style.minHeight="1px",e.style.minWidth="1px"),s){var l=function(t){return"matrix("+t.join(", ")+")"}(s);e.style.transform=l,n&&function(t){var e=t.matrix,i=t.body;t.invertedChildren.forEach(function(t){var n=t[0],r=t[1];if(i.contains(n)){var s=e[0],o=e[3],a=e[5],l={translateX:0,translateY:0,scaleX:1,scaleY:1},p="";r.translate&&(l.translateX=-e[4]/s,l.translateY=-a/o,p+="translate("+l.translateX+"px, "+l.translateY+"px)"),r.scale&&(l.scaleX=1/s,l.scaleY=1/o,p+=" scale("+l.scaleX+", "+l.scaleY+")"),n.style.transform=p}})}({invertedChildren:n,matrix:s,body:r})}}}({element:A,invertedChildren:Y,body:R});if(c[t]&&c[t].onComplete){var J=c[t].onComplete;W=function(){return J(A,b)}}var z=i(q.opacity)&&i(L.opacity)&&q.opacity!==L.opacity,G=!1;return a({},F,{stagger:V,springConfig:U,getOnUpdateFunc:function(e){var i=e.spring,n=e.onAnimationEnd;return u[t]={destroy:i.destroy.bind(i),onAnimationEnd:n},function(e){c[t]&&c[t].onSpringUpdate&&c[t].onSpringUpdate(e.getCurrentValue()),G||(G=!0,c[t]&&c[t].onStart&&c[t].onStart(A,b));var i=e.getCurrentValue();if(R.contains(A)){var n={matrix:[]};n.matrix=q.matrix.map(function(t,e){return p(t,L.matrix[e],i)}),z&&(n.opacity=p(q.opacity,L.opacity,i)),H(n)}else e.destroy()}},initializeFlip:function(){H({matrix:q.matrix,opacity:z?q.opacity:void 0,forceMinVals:E}),c[t]&&c[t].onStartImmediate&&c[t].onStartImmediate(A,b),w.transformOrigin?A.style.transformOrigin=w.transformOrigin:g&&(A.style.transformOrigin="0 0"),Y.forEach(function(t){var e=t[0],i=t[1];i.transformOrigin?e.style.transformOrigin=i.transformOrigin:g&&(e.style.transformOrigin="0 0")})},onAnimationEnd:function(e){delete u[t],n(W)&&W(),A.style.transform="",Y.forEach(function(t){t[0].style.transform=""}),E&&A&&(A.style.minHeight="",A.style.minWidth=""),e||(x.push(t),x.length>=T.length&&r(x))},delayUntil:w.delayUntil})}).filter(Boolean);if(T.forEach(function(t){return(0,t.initializeFlip)()}),S)return function(){};var k=T.filter(function(t){return t.delayUntil&&(e=t.delayUntil,T.filter(function(t){return t.id===e}).length);var e}),j={},B={},N={};k.forEach(function(t){t.stagger?(N[t.stagger]=!0,B[t.delayUntil]?B[t.delayUntil].push(t.stagger):B[t.delayUntil]=[t.stagger]):j[t.delayUntil]?j[t.delayUntil].push(t):j[t.delayUntil]=[t]});var L=T.filter(function(t){return t.stagger}).reduce(function(t,e){return t[e.stagger]?t[e.stagger].push(e):t[e.stagger]=[e],t},{}),q=T.filter(function(t){return-1===k.indexOf(t)});return q.forEach(function(t){t.onSpringActivate=function(){j[t.id]&&j[t.id].forEach(V),B[t.id]&&Object.keys(B[t.id].reduce(function(t,e){var i;return a(t,((i={})[e]=!0,i))},{})).forEach(function(t){F(L[t],A[t])})}}),function(){return T.length||r([]),q.filter(function(t){return!t.stagger}).forEach(V),Object.keys(L).forEach(function(t){N[t]||F(L[t],A[t])}),w}}(Z);j?j({hideEnteringElements:z,animateEnteringElements:G,animateExitingElements:Q,animateFlippedElements:$}):(z(),Q().then(G),$())}},B=function(t){var e=t.element,i=t.flipCallbacks,n=void 0===i?{}:i,r=t.inProgressAnimations,o=void 0===r?{}:r,l=T(e,t.portalKey),p=s(e.querySelectorAll("["+d+"]")),c={},u=[],f={};l.filter(function(t){return n&&n[t.dataset.flipId]&&n[t.dataset.flipId].onExit}).forEach(function(t){var e=t.parentNode;if(t.closest){var i=t.closest("["+h+"]");i&&(e=i)}var n=u.findIndex(function(t){return t[0]===e});-1===n&&(u.push([e,e.getBoundingClientRect()]),n=u.length-1),c[t.dataset.flipId]=u[n][1],f[t.dataset.flipId]=e});var g=k(l),m=g.map(function(t){var e=t[0],i=t[1],r={};if(n&&n[e.dataset.flipId]&&n[e.dataset.flipId].onExit){var s=c[e.dataset.flipId];a(r,{element:e,parent:f[e.dataset.flipId],childPosition:{top:i.top-s.top,left:i.left-s.left,width:i.width,height:i.height}})}return[e.dataset.flipId,{rect:i,opacity:parseFloat(window.getComputedStyle(e).opacity||"1"),domDataForExitAnimations:r}]}).reduce(R,{});return function(t,e){Object.keys(t).forEach(function(e){t[e].destroy&&t[e].destroy(),t[e].onAnimationEnd&&t[e].onAnimationEnd(!0),delete t[e]}),e.forEach(function(t){t.style.transform="",t.style.opacity=""})}(o,l.concat(p)),{flippedElementPositions:m,cachedOrderedFlipIds:g.map(function(t){return t[0].dataset.flipId})}},N=/*#__PURE__*/function(){function t(t){this.element=void 0,this.staggerConfig=void 0,this.applyTransformOrigin=!0,this.handleEnterUpdateDelete=void 0,this.debug=void 0,this.spring=void 0,this.inProgressAnimations=void 0,this.flipCallbacks=void 0,this.snapshot=void 0,this.onComplete=void 0,this.onStart=void 0,a(this,t),this.inProgressAnimations={},this.flipCallbacks={},this.recordBeforeUpdate=this.recordBeforeUpdate.bind(this),this.update=this.update.bind(this),this.addFlipped=this.addFlipped.bind(this),this.addInverted=this.addInverted.bind(this)}var e=t.prototype;return e.recordBeforeUpdate=function(){this.snapshot=B({element:this.element,flipCallbacks:this.flipCallbacks,inProgressAnimations:this.inProgressAnimations})},e.update=function(t,e){this.snapshot&&(j({flippedElementPositionsBeforeUpdate:this.snapshot.flippedElementPositions,cachedOrderedFlipIds:this.snapshot.cachedOrderedFlipIds,containerEl:this.element,inProgressAnimations:this.inProgressAnimations,flipCallbacks:this.flipCallbacks,applyTransformOrigin:this.applyTransformOrigin,spring:this.spring,debug:this.debug,staggerConfig:this.staggerConfig,handleEnterUpdateDelete:this.handleEnterUpdateDelete,decisionData:{previous:t,current:e},onComplete:this.onComplete,onStart:this.onStart}),delete this.snapshot)},e.addFlipped=function(t){var e=t.element,i=t.flipId,n=t.opacity,r=t.translate,s=t.scale,o=t.transformOrigin,l=t.spring,p=t.stagger,c=t.delayUntil,u=t.onAppear,d=t.onStart,f=t.onSpringUpdate,h=t.onComplete,g=t.onExit,m=t.shouldFlip,v=t.shouldInvert;if(!e)throw new Error("no element provided");if(!i)throw new Error("No flipId provided");var y={scale:s,translate:r,opacity:n,transformOrigin:o,spring:l,stagger:p,delayUntil:c};y.scale||y.translate||y.opacity||a(y,{translate:!0,scale:!0,opacity:!0}),i&&(e.dataset.flipId=String(i)),e.dataset.flipConfig=JSON.stringify(y),this.flipCallbacks[i]={shouldFlip:m,shouldInvert:v,onAppear:u,onStart:d,onSpringUpdate:f,onComplete:h,onExit:g}},e.addInverted=function(t){var e=t.element,i=t.parent,n=t.opacity,r=t.translate,s=t.scale,o=t.transformOrigin;if(!e)throw new Error("no element provided");if(!i)throw new Error("parent must be provided");var l=i.dataset.flipId,p={scale:s,translate:r,opacity:n,transformOrigin:o};p.scale||p.translate||p.opacity||a(p,{translate:!0,scale:!0,opacity:!0}),e.dataset.inverseFlipId=l,e.dataset.flipConfig=JSON.stringify(p)},t}(),L=new w;exports.Flipper=N,exports.constants=g,exports.getFlippedElementPositionsBeforeUpdate=B,exports.onFlipKeyUpdate=j,exports.spring=function(t){var e=t.values,i=t.onUpdate,n=t.delay,r=void 0===n?0:n,s=t.onComplete,o=a({},m.noWobble,v(t.config)),l=o.overshootClamping,c=L.createSpring(o.stiffness,o.damping);return c.setOvershootClampingEnabled(!!l),c.addListener({onSpringAtRest:function(t){s&&s(),t.destroy()},onSpringUpdate:function(t){var n=t.getCurrentValue();if(!e)return i(n);var r=Object.keys(e).map(function(t){return[t,p(e[t][0],e[t][1],n)]}).reduce(function(t,e){var i;return Object.assign(t,((i={})[e[0]]=e[1],i))},{});i(r)}}),r?setTimeout(function(){c.setEndValue(1)},r):c.setEndValue(1),c},exports.utilities=c;
 //# sourceMappingURL=index.js.map

lib/index.umd.js

@@ -1,2 +0,2 @@
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("rematrix")):"function"==typeof define&&define.amd?define(["exports","rematrix"],e):e((t=t||self).FlipToolkit={},t.Rematrix)}(this,function(t,e){var i=function(t){return"number"==typeof t},n=function(t){return"function"==typeof t},r=function(t){return"[object Object]"===Object.prototype.toString.call(t)},s=function(t){return Array.prototype.slice.apply(t)},a=function(t){var e=t.reduce(function(t,e){return t[e]=(t[e]||0)+1,t},{});return Object.keys(e).filter(function(t){return e[t]>1})};function o(t){return[].slice.call(arguments,1).forEach(function(e){if(e)for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i])}),t}var l,p=function(t,e,i){return t+(e-t)*i},c={__proto__:null,isNumber:i,isFunction:n,isObject:r,toArray:s,getDuplicateValsAsStrings:a,assign:o,tweenProp:p},u={noWobble:{stiffness:200,damping:26},gentle:{stiffness:120,damping:14},veryGentle:{stiffness:130,damping:17},wobbly:{stiffness:180,damping:12},stiff:{stiffness:260,damping:26}},d=function(t){return r(t)?t:Object.keys(u).indexOf(t)>-1?u[t]:{}};"undefined"!=typeof window&&(l=window.requestAnimationFrame);var f=l=l||function(t){window.setTimeout(t,1e3/60)},h=Date.now(),g="object"==typeof performance&&"function"==typeof performance.now?function(){return performance.now()}:function(){return Date.now()-h};function m(t,e){var i=t.indexOf(e);-1!==i&&t.splice(i,1)}var v=function(){function t(){}return t.prototype.run=function(){var t=this;f(function(){t.springSystem.loop(g())})},t}(),y=function(){this.position=0,this.velocity=0},_=0,S=function(){function t(t){this._id="s"+_++,this._springSystem=t,this.listeners=[],this._startValue=0,this._currentState=new y,this._displacementFromRestThreshold=.001,this._endValue=0,this._overshootClampingEnabled=!1,this._previousState=new y,this._restSpeedThreshold=.001,this._tempState=new y,this._timeAccumulator=0,this._wasAtRest=!0,this._cachedSpringConfig={}}var e=t.prototype;return e.getId=function(){return this._id},e.destroy=function(){this.listeners=[],this._springSystem.deregisterSpring(this)},e.setSpringConfig=function(t){return this._springConfig=t,this},e.getCurrentValue=function(){return this._currentState.position},e.getDisplacementDistanceForState=function(t){return Math.abs(this._endValue-t.position)},e.setEndValue=function(t){if(t===this._endValue)return this;if(this.prevEndValue=t,this._endValue===t&&this.isAtRest())return this;this._startValue=this.getCurrentValue(),this._endValue=t,this._springSystem.activateSpring(this.getId());for(var e=0,i=this.listeners.length;e<i;e++){var n=this.listeners[e].onSpringEndStateChange;n&&n(this)}return this},e.setVelocity=function(t){return t===this._currentState.velocity||(this._currentState.velocity=t,this._springSystem.activateSpring(this.getId())),this},e.setCurrentValue=function(t){this._startValue=t,this._currentState.position=t;for(var e=0,i=this.listeners.length;e<i;e++){var n=this.listeners[e];n.onSpringUpdate&&n.onSpringUpdate(this)}return this},e.setAtRest=function(){return this._endValue=this._currentState.position,this._tempState.position=this._currentState.position,this._currentState.velocity=0,this},e.setOvershootClampingEnabled=function(t){return this._overshootClampingEnabled=t,this},e.isOvershooting=function(){var t=this._startValue,e=this._endValue;return this._springConfig.tension>0&&(t<e&&this.getCurrentValue()>e||t>e&&this.getCurrentValue()<e)},e.advance=function(t,e){var i=this.isAtRest();if(!i||!this._wasAtRest){var n=e;e>.064&&(n=.064),this._timeAccumulator+=n;for(var r,s,a,o,l,p,c=this._springConfig.tension,u=this._springConfig.friction,d=this._currentState.position,f=this._currentState.velocity,h=this._tempState.position,g=this._tempState.velocity;this._timeAccumulator>=.001;)this._timeAccumulator-=.001,this._timeAccumulator<.001&&(this._previousState.position=d,this._previousState.velocity=f),s=c*(this._endValue-h)-u*f,o=c*(this._endValue-(h=d+.001*(r=f)*.5))-u*(g=f+.001*s*.5),p=c*(this._endValue-(h=d+.001*(a=g)*.5))-u*(g=f+.001*o*.5),h=d+.001*(l=g),d+=1/6*(r+2*(a+l)+(g=f+.001*p))*.001,f+=1/6*(s+2*(o+p)+(c*(this._endValue-h)-u*g))*.001;this._tempState.position=h,this._tempState.velocity=g,this._currentState.position=d,this._currentState.velocity=f,this._timeAccumulator>0&&this._interpolate(this._timeAccumulator/.001),(this.isAtRest()||this._overshootClampingEnabled&&this.isOvershooting())&&(this._springConfig.tension>0?(this._startValue=this._endValue,this._currentState.position=this._endValue):(this._endValue=this._currentState.position,this._startValue=this._endValue),this.setVelocity(0),i=!0);var m=!1;this._wasAtRest&&(this._wasAtRest=!1,m=!0);var v=!1;i&&(this._wasAtRest=!0,v=!0),this.notifyPositionUpdated(m,v)}},e.notifyPositionUpdated=function(t,e){var i=this;this.listeners.filter(Boolean).forEach(function(n){t&&n.onSpringActivate&&!i._onActivateCalled&&(n.onSpringActivate(i),i._onActivateCalled=!0),n.onSpringUpdate&&n.onSpringUpdate(i),e&&n.onSpringAtRest&&n.onSpringAtRest(i)})},e.systemShouldAdvance=function(){return!this.isAtRest()||!this.wasAtRest()},e.wasAtRest=function(){return this._wasAtRest},e.isAtRest=function(){return Math.abs(this._currentState.velocity)<this._restSpeedThreshold&&(this.getDisplacementDistanceForState(this._currentState)<=this._displacementFromRestThreshold||0===this._springConfig.tension)},e._interpolate=function(t){this._currentState.position=this._currentState.position*t+this._previousState.position*(1-t),this._currentState.velocity=this._currentState.velocity*t+this._previousState.velocity*(1-t)},e.addListener=function(t){return this.listeners.push(t),this},e.addOneTimeListener=function(t){var e=this;return Object.keys(t).forEach(function(i){var n;t[i]=(n=t[i],function(){n.apply(void 0,[].slice.call(arguments)),e.removeListener(t)})}),this.listeners.push(t),this},e.removeListener=function(t){return m(this.listeners,t),this},t}(),E=function(){function t(t){this.looper=t||new v,this.looper.springSystem=this,this.listeners=[],this._activeSprings=[],this._idleSpringIndices=[],this._isIdle=!0,this._lastTimeMillis=-1,this._springRegistry={}}var e=t.prototype;return e.createSpring=function(t,e){return this.createSpringWithConfig({tension:t,friction:e})},e.createSpringWithConfig=function(t){var e=new S(this);return this.registerSpring(e),e.setSpringConfig(t),e},e.getIsIdle=function(){return this._isIdle},e.registerSpring=function(t){this._springRegistry[t.getId()]=t},e.deregisterSpring=function(t){m(this._activeSprings,t),delete this._springRegistry[t.getId()]},e.advance=function(t,e){for(var i=this;this._idleSpringIndices.length>0;)this._idleSpringIndices.pop();for(this._activeSprings.filter(Boolean).forEach(function(n){n.systemShouldAdvance()?n.advance(t/1e3,e/1e3):i._idleSpringIndices.push(i._activeSprings.indexOf(n))});this._idleSpringIndices.length>0;){var n=this._idleSpringIndices.pop();n>=0&&this._activeSprings.splice(n,1)}},e.loop=function(t){var e;-1===this._lastTimeMillis&&(this._lastTimeMillis=t-1);var i=t-this._lastTimeMillis;this._lastTimeMillis=t;var n=0,r=this.listeners.length;for(n=0;n<r;n++)(e=this.listeners[n]).onBeforeIntegrate&&e.onBeforeIntegrate(this);for(this.advance(t,i),0===this._activeSprings.length&&(this._isIdle=!0,this._lastTimeMillis=-1),n=0;n<r;n++)(e=this.listeners[n]).onAfterIntegrate&&e.onAfterIntegrate(this);this._isIdle||this.looper.run()},e.activateSpring=function(t){var e=this._springRegistry[t];-1===this._activeSprings.indexOf(e)&&this._activeSprings.push(e),this.getIsIdle()&&(this._isIdle=!1,this.looper.run())},t}(),A=new E,C=function(t){var e=t.springConfig,i=e.overshootClamping,n=t.getOnUpdateFunc,r=t.onAnimationEnd,s=t.onSpringActivate,a=A.createSpring(e.stiffness,e.damping);a.setOvershootClampingEnabled(!!i);var o={onSpringActivate:s,onSpringAtRest:function(){a.destroy(),r()},onSpringUpdate:n({spring:a,onAnimationEnd:r})};return a.addListener(o),a},b=function(t){var e=C(t);return e.setEndValue(1),e},I=function(t,e){if(void 0===e&&(e={}),t&&t.length){e.reverse&&t.reverse();var i,n="number"!=typeof(i=e.speed)?1.1:1+Math.min(Math.max(5*i,0),5),r=1/Math.max(Math.min(t.length,100),10),s=t.map(function(t,e){var i=t.getOnUpdateFunc;return t.getOnUpdateFunc=function(t){var a=i(t);return function(t){var i=t.getCurrentValue();(i=i<.01?0:i>.99?1:i)>=r&&s[e+1]&&s[e+1](Math.max(Math.min(i*n,1),0)),a(t)}},t}).map(function(t){var e=C(t);if(e)return e.setEndValue.bind(e)}).filter(Boolean);s[0]&&s[0](1)}},O=function(t){return[0,1,4,5,12,13].map(function(e){return t[e]})},w=function(t){return t.top<window.innerHeight&&t.bottom>0&&t.left<window.innerWidth&&t.right>0};function x(t){return JSON.parse(t.dataset.flipConfig||"{}")}var U=function(t,e){var i;return o(t,((i={})[e[0]]=e[1],i))},V=function(t,e){return s(e?document.querySelectorAll('[data-portal-key="'+e+'"]'):t.querySelectorAll("[data-flip-id]"))},F=function(t){return t.map(function(t){return[t,t.getBoundingClientRect()]})},P=function(t){var r,l=t.cachedOrderedFlipIds,c=void 0===l?[]:l,f=t.inProgressAnimations,h=void 0===f?{}:f,g=t.flippedElementPositionsBeforeUpdate,m=void 0===g?{}:g,v=t.flipCallbacks,y=void 0===v?{}:v,_=t.containerEl,S=t.applyTransformOrigin,E=t.spring,A=t.debug,C=t.portalKey,P=t.staggerConfig,R=void 0===P?{}:P,T=t.decisionData,D=void 0===T?{}:T,M=t.handleEnterUpdateDelete,k=t.onComplete,j=t.onStart,B=F(V((r={element:_,portalKey:C}).element,r.portalKey)).map(function(t){var e=t[0],i=t[1],n=window.getComputedStyle(e);return[e.dataset.flipId,{element:e,rect:i,opacity:parseFloat(n.opacity),transform:n.transform}]}).reduce(U,{}),N=function(t){var e=t.containerEl,i=t.portalKey;return i?function(t){return function(e){return s(document.querySelectorAll('[data-portal-key="'+t+'"]'+e))}}(i):e?function(t){var e=Math.random().toFixed(5);return t.dataset.flipperId=e,function(i){return s(t.querySelectorAll('[data-flipper-id="'+e+'"] '+i))}}(e):function(){return[]}}({containerEl:_,portalKey:C}),L=function(t){return function(e){return t('[data-flip-id="'+e+'"]')[0]}}(N),q=function(t){return m[t]&&B[t]},X=Object.keys(m).concat(Object.keys(B)).filter(function(t){return!q(t)}),Y={flipCallbacks:y,getElement:L,flippedElementPositionsBeforeUpdate:m,flippedElementPositionsAfterUpdate:B,inProgressAnimations:h,decisionData:D},K=function(t){var e,i=t.unflippedIds,n=t.flipCallbacks,r=t.getElement,s=t.flippedElementPositionsBeforeUpdate,a=t.flippedElementPositionsAfterUpdate,o=t.inProgressAnimations,l=t.decisionData,p=i.filter(function(t){return a[t]}).filter(function(t){return n[t]&&n[t].onAppear}),c=i.filter(function(t){return s[t]&&n[t]&&n[t].onExit}),u=new Promise(function(t){e=t}),d=[],f=0,h=c.map(function(t,i){var r=s[t].domDataForExitAnimations,a=r.element,p=r.parent,c=r.childPosition,u=c.top,h=c.left,g=c.width,m=c.height;"static"===getComputedStyle(p).position&&(p.style.position="relative"),a.style.transform="matrix(1, 0, 0, 1, 0, 0)",a.style.position="absolute",a.style.top=u+"px",a.style.left=h+"px",a.style.height=m+"px",a.style.width=g+"px";var v=d.filter(function(t){return t[0]===p})[0];v||(v=[p,document.createDocumentFragment()],d.push(v)),v[1].appendChild(a),f+=1;var y=function(){try{p.removeChild(a)}catch(t){}finally{0==(f-=1)&&e()}};return o[t]={stop:y},function(){return n[t].onExit(a,i,y,l)}});return d.forEach(function(t){t[0].appendChild(t[1])}),h.length||e(),{hideEnteringElements:function(){p.forEach(function(t){var e=r(t);e&&(e.style.opacity="0")})},animateEnteringElements:function(){p.forEach(function(t,e){var i=r(t);i&&n[t].onAppear(i,e,l)})},animateExitingElements:function(){return h.forEach(function(t){return t()}),u}}}(o({},Y,{unflippedIds:X})),W=K.hideEnteringElements,H=K.animateEnteringElements,J=K.animateExitingElements,z=o({},Y,{containerEl:_,flippedIds:c.filter(q),applyTransformOrigin:S,spring:E,debug:A,staggerConfig:R,scopedSelector:N,onComplete:k});j&&j(_,D);var G=function(t){var r,l=t.flippedIds,c=t.flipCallbacks,f=t.inProgressAnimations,h=t.flippedElementPositionsBeforeUpdate,g=t.flippedElementPositionsAfterUpdate,m=t.applyTransformOrigin,v=t.spring,y=t.getElement,_=t.debug,S=t.staggerConfig,E=void 0===S?{}:S,A=t.decisionData,C=void 0===A?{}:A,U=t.onComplete,V=t.containerEl,F=new Promise(function(t){r=t});if(U&&F.then(function(){return U(V,C)}),!l.length)return function(){return r([]),F};var P=[],R=y(l[0]),T=R?R.ownerDocument.querySelector("body"):document.querySelector("body"),D=(a(l),l.map(function(t){var a=h[t].rect,l=g[t].rect,y=h[t].opacity,_=g[t].opacity,S=l.width<1||l.height<1,E=g[t].element;if(!w(a)&&!w(l))return!1;if(!E)return!1;var A,b,I,U=x(E),V=(I=(b=void 0===(A={flipperSpring:v,flippedSpring:U.spring})?{}:A).flippedSpring,o({},u.noWobble,d(b.flipperSpring),d(I))),F=!0===U.stagger?"default":U.stagger,R={element:E,id:t,stagger:F,springConfig:V};if(c[t]&&c[t].shouldFlip&&!c[t].shouldFlip(C.previous,C.current))return!1;var M=Math.abs(a.left-l.left)+Math.abs(a.top-l.top),k=Math.abs(a.width-l.width)+Math.abs(a.height-l.height),j=Math.abs(_-y);if(0===a.height&&0===l.height||0===a.width&&0===l.width||M<.5&&k<.5&&j<.01)return!1;var B=e.parse(g[t].transform),N={matrix:B},L={matrix:[]},q=[B];U.translate&&(q.push(e.translateX(a.left-l.left)),q.push(e.translateY(a.top-l.top))),U.scale&&(q.push(e.scaleX(Math.max(a.width,1)/Math.max(l.width,1))),q.push(e.scaleY(Math.max(a.height,1)/Math.max(l.height,1)))),U.opacity&&(L.opacity=y,N.opacity=_);var X=[];if(!c[t]||!c[t].shouldInvert||c[t].shouldInvert(C.previous,C.current)){var Y=function(t,e){return s(t.querySelectorAll('[data-inverse-flip-id="'+e+'"]'))}(E,t);X=Y.map(function(t){return[t,x(t)]})}L.matrix=O(q.reduce(e.multiply)),N.matrix=O(N.matrix);var K,W=function(t){var e=t.element,n=t.invertedChildren,r=t.body;return function(t){var s=t.matrix,a=t.opacity,o=t.forceMinVals;if(i(a)&&(e.style.opacity=a+""),o&&(e.style.minHeight="1px",e.style.minWidth="1px"),s){var l=function(t){return"matrix("+t.join(", ")+")"}(s);e.style.transform=l,n&&function(t){var e=t.matrix,i=t.body;t.invertedChildren.forEach(function(t){var n=t[0],r=t[1];if(i.contains(n)){var s=e[0],a=e[3],o=e[5],l={translateX:0,translateY:0,scaleX:1,scaleY:1},p="";r.translate&&(l.translateX=-e[4]/s,l.translateY=-o/a,p+="translate("+l.translateX+"px, "+l.translateY+"px)"),r.scale&&(l.scaleX=1/s,l.scaleY=1/a,p+=" scale("+l.scaleX+", "+l.scaleY+")"),n.style.transform=p}})}({invertedChildren:n,matrix:s,body:r})}}}({element:E,invertedChildren:X,body:T});if(c[t]&&c[t].onComplete){var H=c[t].onComplete;K=function(){return H(E,C)}}var J=i(L.opacity)&&i(N.opacity)&&L.opacity!==N.opacity,z=!1;return o({},R,{stagger:F,springConfig:V,getOnUpdateFunc:function(e){var i=e.spring,n=e.onAnimationEnd;return f[t]={destroy:i.destroy.bind(i),onAnimationEnd:n},function(e){c[t]&&c[t].onSpringUpdate&&c[t].onSpringUpdate(e.getCurrentValue()),z||(z=!0,c[t]&&c[t].onStart&&c[t].onStart(E,C));var i=e.getCurrentValue();if(T.contains(E)){var n={matrix:[]};n.matrix=L.matrix.map(function(t,e){return p(t,N.matrix[e],i)}),J&&(n.opacity=p(L.opacity,N.opacity,i)),W(n)}else e.destroy()}},initializeFlip:function(){W({matrix:L.matrix,opacity:J?L.opacity:void 0,forceMinVals:S}),c[t]&&c[t].onStartImmediate&&c[t].onStartImmediate(E,C),U.transformOrigin?E.style.transformOrigin=U.transformOrigin:m&&(E.style.transformOrigin="0 0"),X.forEach(function(t){var e=t[0],i=t[1];i.transformOrigin?e.style.transformOrigin=i.transformOrigin:m&&(e.style.transformOrigin="0 0")})},onAnimationEnd:function(e){delete f[t],n(K)&&K(),E.style.transform="",X.forEach(function(t){t[0].style.transform=""}),S&&E&&(E.style.minHeight="",E.style.minWidth=""),e||(P.push(t),P.length>=D.length&&r(P))},delayUntil:U.delayUntil})}).filter(Boolean));if(D.forEach(function(t){return(0,t.initializeFlip)()}),_)return function(){};var M=D.filter(function(t){return t.delayUntil&&(e=t.delayUntil,D.filter(function(t){return t.id===e}).length);var e}),k={},j={},B={};M.forEach(function(t){t.stagger?(B[t.stagger]=!0,j[t.delayUntil]?j[t.delayUntil].push(t.stagger):j[t.delayUntil]=[t.stagger]):k[t.delayUntil]?k[t.delayUntil].push(t):k[t.delayUntil]=[t]});var N=D.filter(function(t){return t.stagger}).reduce(function(t,e){return t[e.stagger]?t[e.stagger].push(e):t[e.stagger]=[e],t},{}),L=D.filter(function(t){return-1===M.indexOf(t)});return L.forEach(function(t){t.onSpringActivate=function(){k[t.id]&&k[t.id].forEach(b),j[t.id]&&Object.keys(j[t.id].reduce(function(t,e){var i;return o(t,((i={})[e]=!0,i))},{})).forEach(function(t){I(N[t],E[t])})}}),function(){return D.length||r([]),L.filter(function(t){return!t.stagger}).forEach(b),Object.keys(N).forEach(function(t){B[t]||I(N[t],E[t])}),F}}(z);M?M({hideEnteringElements:W,animateEnteringElements:H,animateExitingElements:J,animateFlippedElements:G}):(W(),J().then(H),G())},R=function(t){var e=t.element,i=t.flipCallbacks,n=void 0===i?{}:i,r=t.inProgressAnimations,a=void 0===r?{}:r,l=V(e,t.portalKey),p=s(e.querySelectorAll("[data-inverse-flip-id]")),c={},u=[],d={};l.filter(function(t){return n&&n[t.dataset.flipId]&&n[t.dataset.flipId].onExit}).forEach(function(t){var e=t.parentNode;if(t.closest){var i=t.closest("[data-exit-container]");i&&(e=i)}var n=u.findIndex(function(t){return t[0]===e});-1===n&&(u.push([e,e.getBoundingClientRect()]),n=u.length-1),c[t.dataset.flipId]=u[n][1],d[t.dataset.flipId]=e});var f=F(l),h=f.map(function(t){var e=t[0],i=t[1],r={};if(n&&n[e.dataset.flipId]&&n[e.dataset.flipId].onExit){var s=c[e.dataset.flipId];o(r,{element:e,parent:d[e.dataset.flipId],childPosition:{top:i.top-s.top,left:i.left-s.left,width:i.width,height:i.height}})}return[e.dataset.flipId,{rect:i,opacity:parseFloat(window.getComputedStyle(e).opacity||"1"),domDataForExitAnimations:r}]}).reduce(U,{});return function(t,e){Object.keys(t).forEach(function(e){t[e].destroy&&t[e].destroy(),t[e].onAnimationEnd&&t[e].onAnimationEnd(!0),delete t[e]}),e.forEach(function(t){t.style.transform="",t.style.opacity=""})}(a,l.concat(p)),{flippedElementPositions:h,cachedOrderedFlipIds:f.map(function(t){return t[0].dataset.flipId})}},T=function(){function t(t){this.applyTransformOrigin=!0,o(this,t),this.inProgressAnimations={},this.flipCallbacks={},this.recordBeforeUpdate=this.recordBeforeUpdate.bind(this),this.update=this.update.bind(this),this.addFlipped=this.addFlipped.bind(this),this.addInverted=this.addInverted.bind(this)}var e=t.prototype;return e.recordBeforeUpdate=function(){this.snapshot=R({element:this.element,flipCallbacks:this.flipCallbacks,inProgressAnimations:this.inProgressAnimations})},e.update=function(t,e){this.snapshot&&(P({flippedElementPositionsBeforeUpdate:this.snapshot.flippedElementPositions,cachedOrderedFlipIds:this.snapshot.cachedOrderedFlipIds,containerEl:this.element,inProgressAnimations:this.inProgressAnimations,flipCallbacks:this.flipCallbacks,applyTransformOrigin:this.applyTransformOrigin,spring:this.spring,debug:this.debug,staggerConfig:this.staggerConfig,handleEnterUpdateDelete:this.handleEnterUpdateDelete,decisionData:{previous:t,current:e},onComplete:this.onComplete,onStart:this.onStart}),delete this.snapshot)},e.addFlipped=function(t){var e=t.element,i=t.flipId,n=t.opacity,r=t.translate,s=t.scale,a=t.transformOrigin,l=t.spring,p=t.stagger,c=t.delayUntil,u=t.onAppear,d=t.onStart,f=t.onSpringUpdate,h=t.onComplete,g=t.onExit,m=t.shouldFlip,v=t.shouldInvert;if(!e)throw new Error("no element provided");if(!i)throw new Error("No flipId provided");var y={scale:s,translate:r,opacity:n,transformOrigin:a,spring:l,stagger:p,delayUntil:c};y.scale||y.translate||y.opacity||o(y,{translate:!0,scale:!0,opacity:!0}),i&&(e.dataset.flipId=String(i)),e.dataset.flipConfig=JSON.stringify(y),this.flipCallbacks[i]={shouldFlip:m,shouldInvert:v,onAppear:u,onStart:d,onSpringUpdate:f,onComplete:h,onExit:g}},e.addInverted=function(t){var e=t.element,i=t.parent,n=t.opacity,r=t.translate,s=t.scale,a=t.transformOrigin;if(!e)throw new Error("no element provided");if(!i)throw new Error("parent must be provided");var l=i.dataset.flipId,p={scale:s,translate:r,opacity:n,transformOrigin:a};p.scale||p.translate||p.opacity||o(p,{translate:!0,scale:!0,opacity:!0}),e.dataset.inverseFlipId=l,e.dataset.flipConfig=JSON.stringify(p)},t}(),D=new E;t.Flipper=T,t.constants={__proto__:null,DATA_FLIP_ID:"data-flip-id",DATA_INVERSE_FLIP_ID:"data-inverse-flip-id",DATA_FLIP_COMPONENT_ID:"data-flip-component-id",DATA_FLIP_CONFIG:"data-flip-config",DATA_PORTAL_KEY:"data-portal-key",DATA_EXIT_CONTAINER:"data-exit-container"},t.getFlippedElementPositionsBeforeUpdate=R,t.onFlipKeyUpdate=P,t.spring=function(t){var e=t.values,i=t.onUpdate,n=t.delay,r=void 0===n?0:n,s=t.onComplete,a=o({},u.noWobble,d(t.config)),l=a.overshootClamping,c=D.createSpring(a.stiffness,a.damping);return c.setOvershootClampingEnabled(!!l),c.addListener({onSpringAtRest:function(t){s&&s(),t.destroy()},onSpringUpdate:function(t){var n=t.getCurrentValue();if(!e)return i(n);var r=Object.keys(e).map(function(t){return[t,p(e[t][0],e[t][1],n)]}).reduce(function(t,e){var i;return Object.assign(t,((i={})[e[0]]=e[1],i))},{});i(r)}}),r?setTimeout(function(){c.setEndValue(1)},r):c.setEndValue(1),c},t.utilities=c});
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("rematrix")):"function"==typeof define&&define.amd?define(["exports","rematrix"],e):e((t||self).FlipToolkit={},t.Rematrix)}(this,function(t,e){function i(t){if(t&&t.__esModule)return t;var e=Object.create(null);return t&&Object.keys(t).forEach(function(i){if("default"!==i){var n=Object.getOwnPropertyDescriptor(t,i);Object.defineProperty(e,i,n.get?n:{enumerable:!0,get:function(){return t[i]}})}}),e.default=t,e}var n=/*#__PURE__*/i(e),r=function(t){return"number"==typeof t},s=function(t){return"function"==typeof t},o=function(t){return"[object Object]"===Object.prototype.toString.call(t)},a=function(t){return Array.prototype.slice.apply(t)},l=function(t){var e=t.reduce(function(t,e){return t[e]=(t[e]||0)+1,t},{});return Object.keys(e).filter(function(t){return e[t]>1})};function p(t){return[].slice.call(arguments,1).forEach(function(e){if(e)for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i])}),t}var c,u=function(t,e,i){return t+(e-t)*i},d={__proto__:null,isNumber:r,isFunction:s,isObject:o,toArray:a,getDuplicateValsAsStrings:l,assign:p,tweenProp:u},f="data-flip-id",h="data-inverse-flip-id",g="data-portal-key",m="data-exit-container",v={__proto__:null,DATA_FLIP_ID:f,DATA_INVERSE_FLIP_ID:h,DATA_FLIP_COMPONENT_ID:"data-flip-component-id",DATA_FLIP_CONFIG:"data-flip-config",DATA_PORTAL_KEY:g,DATA_EXIT_CONTAINER:m},y={noWobble:{stiffness:200,damping:26},gentle:{stiffness:120,damping:14},veryGentle:{stiffness:130,damping:17},wobbly:{stiffness:180,damping:12},stiff:{stiffness:260,damping:26}},_=function(t){return o(t)?t:Object.keys(y).indexOf(t)>-1?y[t]:{}};"undefined"!=typeof window&&(c=window.requestAnimationFrame);var S=c=c||function(t){window.setTimeout(t,1e3/60)},E=Date.now(),A="object"==typeof performance&&"function"==typeof performance.now?function(){return performance.now()}:function(){return Date.now()-E};function b(t,e){var i=t.indexOf(e);-1!==i&&t.splice(i,1)}var C=/*#__PURE__*/function(){function t(){}return t.prototype.run=function(){var t=this;S(function(){t.springSystem.loop(A())})},t}(),I=function(){this.position=0,this.velocity=0},O=0,w=.001,x=/*#__PURE__*/function(){function t(t){this._id="s"+O++,this._springSystem=t,this.listeners=[],this._startValue=0,this._currentState=new I,this._displacementFromRestThreshold=.001,this._endValue=0,this._overshootClampingEnabled=!1,this._previousState=new I,this._restSpeedThreshold=.001,this._tempState=new I,this._timeAccumulator=0,this._wasAtRest=!0,this._cachedSpringConfig={}}var e=t.prototype;return e.getId=function(){return this._id},e.destroy=function(){this.listeners=[],this._springSystem.deregisterSpring(this)},e.setSpringConfig=function(t){return this._springConfig=t,this},e.getCurrentValue=function(){return this._currentState.position},e.getDisplacementDistanceForState=function(t){return Math.abs(this._endValue-t.position)},e.setEndValue=function(t){if(t===this._endValue)return this;if(this.prevEndValue=t,this._endValue===t&&this.isAtRest())return this;this._startValue=this.getCurrentValue(),this._endValue=t,this._springSystem.activateSpring(this.getId());for(var e=0,i=this.listeners.length;e<i;e++){var n=this.listeners[e].onSpringEndStateChange;n&&n(this)}return this},e.setVelocity=function(t){return t===this._currentState.velocity||(this._currentState.velocity=t,this._springSystem.activateSpring(this.getId())),this},e.setCurrentValue=function(t){this._startValue=t,this._currentState.position=t;for(var e=0,i=this.listeners.length;e<i;e++){var n=this.listeners[e];n.onSpringUpdate&&n.onSpringUpdate(this)}return this},e.setAtRest=function(){return this._endValue=this._currentState.position,this._tempState.position=this._currentState.position,this._currentState.velocity=0,this},e.setOvershootClampingEnabled=function(t){return this._overshootClampingEnabled=t,this},e.isOvershooting=function(){var t=this._startValue,e=this._endValue;return this._springConfig.tension>0&&(t<e&&this.getCurrentValue()>e||t>e&&this.getCurrentValue()<e)},e.advance=function(t,e){var i=this.isAtRest();if(!i||!this._wasAtRest){var n=e;e>.064&&(n=.064),this._timeAccumulator+=n;for(var r,s,o,a,l,p,c=this._springConfig.tension,u=this._springConfig.friction,d=this._currentState.position,f=this._currentState.velocity,h=this._tempState.position,g=this._tempState.velocity;this._timeAccumulator>=w;)this._timeAccumulator-=w,this._timeAccumulator<w&&(this._previousState.position=d,this._previousState.velocity=f),s=c*(this._endValue-h)-u*f,a=c*(this._endValue-(h=d+(r=f)*w*.5))-u*(g=f+s*w*.5),p=c*(this._endValue-(h=d+(o=g)*w*.5))-u*(g=f+a*w*.5),h=d+(l=g)*w,d+=1/6*(r+2*(o+l)+(g=f+p*w))*w,f+=1/6*(s+2*(a+p)+(c*(this._endValue-h)-u*g))*w;this._tempState.position=h,this._tempState.velocity=g,this._currentState.position=d,this._currentState.velocity=f,this._timeAccumulator>0&&this._interpolate(this._timeAccumulator/w),(this.isAtRest()||this._overshootClampingEnabled&&this.isOvershooting())&&(this._springConfig.tension>0?(this._startValue=this._endValue,this._currentState.position=this._endValue):(this._endValue=this._currentState.position,this._startValue=this._endValue),this.setVelocity(0),i=!0);var m=!1;this._wasAtRest&&(this._wasAtRest=!1,m=!0);var v=!1;i&&(this._wasAtRest=!0,v=!0),this.notifyPositionUpdated(m,v)}},e.notifyPositionUpdated=function(t,e){var i=this;this.listeners.filter(Boolean).forEach(function(n){t&&n.onSpringActivate&&!i._onActivateCalled&&(n.onSpringActivate(i),i._onActivateCalled=!0),n.onSpringUpdate&&n.onSpringUpdate(i),e&&n.onSpringAtRest&&n.onSpringAtRest(i)})},e.systemShouldAdvance=function(){return!this.isAtRest()||!this.wasAtRest()},e.wasAtRest=function(){return this._wasAtRest},e.isAtRest=function(){return Math.abs(this._currentState.velocity)<this._restSpeedThreshold&&(this.getDisplacementDistanceForState(this._currentState)<=this._displacementFromRestThreshold||0===this._springConfig.tension)},e._interpolate=function(t){this._currentState.position=this._currentState.position*t+this._previousState.position*(1-t),this._currentState.velocity=this._currentState.velocity*t+this._previousState.velocity*(1-t)},e.addListener=function(t){return this.listeners.push(t),this},e.addOneTimeListener=function(t){var e=this;return Object.keys(t).forEach(function(i){var n;t[i]=(n=t[i],function(){n.apply(void 0,[].slice.call(arguments)),e.removeListener(t)})}),this.listeners.push(t),this},e.removeListener=function(t){return b(this.listeners,t),this},t}(),U=/*#__PURE__*/function(){function t(t){this.looper=t||new C,this.looper.springSystem=this,this.listeners=[],this._activeSprings=[],this._idleSpringIndices=[],this._isIdle=!0,this._lastTimeMillis=-1,this._springRegistry={}}var e=t.prototype;return e.createSpring=function(t,e){return this.createSpringWithConfig({tension:t,friction:e})},e.createSpringWithConfig=function(t){var e=new x(this);return this.registerSpring(e),e.setSpringConfig(t),e},e.getIsIdle=function(){return this._isIdle},e.registerSpring=function(t){this._springRegistry[t.getId()]=t},e.deregisterSpring=function(t){b(this._activeSprings,t),delete this._springRegistry[t.getId()]},e.advance=function(t,e){for(var i=this;this._idleSpringIndices.length>0;)this._idleSpringIndices.pop();for(this._activeSprings.filter(Boolean).forEach(function(n){n.systemShouldAdvance()?n.advance(t/1e3,e/1e3):i._idleSpringIndices.push(i._activeSprings.indexOf(n))});this._idleSpringIndices.length>0;){var n=this._idleSpringIndices.pop();n>=0&&this._activeSprings.splice(n,1)}},e.loop=function(t){var e;-1===this._lastTimeMillis&&(this._lastTimeMillis=t-1);var i=t-this._lastTimeMillis;this._lastTimeMillis=t;var n=0,r=this.listeners.length;for(n=0;n<r;n++)(e=this.listeners[n]).onBeforeIntegrate&&e.onBeforeIntegrate(this);for(this.advance(t,i),0===this._activeSprings.length&&(this._isIdle=!0,this._lastTimeMillis=-1),n=0;n<r;n++)(e=this.listeners[n]).onAfterIntegrate&&e.onAfterIntegrate(this);this._isIdle||this.looper.run()},e.activateSpring=function(t){var e=this._springRegistry[t];-1===this._activeSprings.indexOf(e)&&this._activeSprings.push(e),this.getIsIdle()&&(this._isIdle=!1,this.looper.run())},t}(),V=new U,F=function(t){var e=t.springConfig,i=e.overshootClamping,n=t.getOnUpdateFunc,r=t.onAnimationEnd,s=t.onSpringActivate,o=V.createSpring(e.stiffness,e.damping);o.setOvershootClampingEnabled(!!i);var a={onSpringActivate:s,onSpringAtRest:function(){o.destroy(),r()},onSpringUpdate:n({spring:o,onAnimationEnd:r})};return o.addListener(a),o},P=function(t){var e=F(t);return e.setEndValue(1),e},T=function(t,e){if(void 0===e&&(e={}),t&&t.length){e.reverse&&t.reverse();var i,n="number"!=typeof(i=e.speed)?1.1:1+Math.min(Math.max(5*i,0),5),r=1/Math.max(Math.min(t.length,100),10),s=t.map(function(t,e){var i=t.getOnUpdateFunc;return t.getOnUpdateFunc=function(t){var o=i(t);return function(t){var i=t.getCurrentValue();(i=i<.01?0:i>.99?1:i)>=r&&s[e+1]&&s[e+1](Math.max(Math.min(i*n,1),0)),o(t)}},t}).map(function(t){var e=F(t);if(e)return e.setEndValue.bind(e)}).filter(Boolean);s[0]&&s[0](1)}},D=function(t){return[0,1,4,5,12,13].map(function(e){return t[e]})},R=function(t){return t.top<window.innerHeight&&t.bottom>0&&t.left<window.innerWidth&&t.right>0};function M(t){return JSON.parse(t.dataset.flipConfig||"{}")}var k=function(t,e){var i;return p(t,((i={})[e[0]]=e[1],i))},j=function(t,e){return a(e?document.querySelectorAll("["+g+'="'+e+'"]'):t.querySelectorAll("["+f+"]"))},B=function(t){return t.map(function(t){return[t,t.getBoundingClientRect()]})},N=function(t){var e=t.cachedOrderedFlipIds,i=void 0===e?[]:e,o=t.inProgressAnimations,c=void 0===o?{}:o,d=t.flippedElementPositionsBeforeUpdate,m=void 0===d?{}:d,v=t.flipCallbacks,S=void 0===v?{}:v,E=t.containerEl,A=t.applyTransformOrigin,b=t.spring,C=t.debug,I=t.portalKey,O=t.staggerConfig,w=void 0===O?{}:O,x=t.decisionData,U=void 0===x?{}:x,V=t.handleEnterUpdateDelete,F=t.onComplete,N=t.onStart;if(!window.matchMedia("(prefers-reduced-motion: reduce)").matches){var L,q=B(j((L={element:E,portalKey:I}).element,L.portalKey)).map(function(t){var e=t[0],i=t[1],n=window.getComputedStyle(e);return[e.dataset.flipId,{element:e,rect:i,opacity:parseFloat(n.opacity),transform:n.transform}]}).reduce(k,{}),X=function(t){var e=t.containerEl,i=t.portalKey;return i?function(t){return function(e){return a(document.querySelectorAll("["+g+'="'+t+'"]'+e))}}(i):e?function(t){var e=Math.random().toFixed(5);return t.dataset.flipperId=e,function(i){return a(t.querySelectorAll('[data-flipper-id="'+e+'"] '+i))}}(e):function(){return[]}}({containerEl:E,portalKey:I}),Y=function(t){return function(e){return t("["+f+'="'+e+'"]')[0]}}(X),K=function(t){return m[t]&&q[t]},W=Object.keys(m).concat(Object.keys(q)).filter(function(t){return!K(t)}),H={flipCallbacks:S,getElement:Y,flippedElementPositionsBeforeUpdate:m,flippedElementPositionsAfterUpdate:q,inProgressAnimations:c,decisionData:U},J=function(t){var e,i=t.unflippedIds,n=t.flipCallbacks,r=t.getElement,s=t.flippedElementPositionsBeforeUpdate,o=t.flippedElementPositionsAfterUpdate,a=t.inProgressAnimations,l=t.decisionData,p=i.filter(function(t){return o[t]}).filter(function(t){return n[t]&&n[t].onAppear}),c=i.filter(function(t){return s[t]&&n[t]&&n[t].onExit}),u=new Promise(function(t){e=t}),d=[],f=0,h=c.map(function(t,i){var r=s[t].domDataForExitAnimations,o=r.element,p=r.parent,c=r.childPosition,u=c.top,h=c.left,g=c.width,m=c.height;"static"===getComputedStyle(p).position&&(p.style.position="relative"),o.style.transform="matrix(1, 0, 0, 1, 0, 0)",o.style.position="absolute",o.style.top=u+"px",o.style.left=h+"px",o.style.height=m+"px",o.style.width=g+"px";var v=d.filter(function(t){return t[0]===p})[0];v||(v=[p,document.createDocumentFragment()],d.push(v)),v[1].appendChild(o),f+=1;var y=function(){try{p.removeChild(o)}catch(t){}finally{0==(f-=1)&&e()}};return a[t]={stop:y},function(){return n[t].onExit(o,i,y,l)}});return d.forEach(function(t){t[0].appendChild(t[1])}),h.length||e(),{hideEnteringElements:function(){p.forEach(function(t){var e=r(t);e&&(e.style.opacity="0")})},animateEnteringElements:function(){p.forEach(function(t,e){var i=r(t);i&&n[t].onAppear(i,e,l)})},animateExitingElements:function(){return h.forEach(function(t){return t()}),u}}}(p({},H,{unflippedIds:W})),z=J.hideEnteringElements,G=J.animateEnteringElements,Q=J.animateExitingElements,Z=p({},H,{containerEl:E,flippedIds:i.filter(K),applyTransformOrigin:A,spring:b,debug:C,staggerConfig:w,scopedSelector:X,onComplete:F});N&&N(E,U);var $=function(t){var e,i=t.flippedIds,o=t.flipCallbacks,c=t.inProgressAnimations,d=t.flippedElementPositionsBeforeUpdate,f=t.flippedElementPositionsAfterUpdate,g=t.applyTransformOrigin,m=t.spring,v=t.getElement,S=t.debug,E=t.staggerConfig,A=void 0===E?{}:E,b=t.decisionData,C=void 0===b?{}:b,I=t.onComplete,O=t.containerEl,w=new Promise(function(t){e=t});if(I&&w.then(function(){return I(O,C)}),!i.length)return function(){return e([]),w};var x=[],U=v(i[0]),V=U?U.ownerDocument.querySelector("body"):document.querySelector("body");l(i);var F=i.map(function(t){var i=d[t].rect,l=f[t].rect,v=d[t].opacity,S=f[t].opacity,E=l.width<1||l.height<1,A=f[t].element;if(!R(i)&&!R(l))return!1;if(!A)return!1;var b,I,O,w=M(A),U=(O=(I=void 0===(b={flipperSpring:m,flippedSpring:w.spring})?{}:b).flippedSpring,p({},y.noWobble,_(I.flipperSpring),_(O))),P=!0===w.stagger?"default":w.stagger,T={element:A,id:t,stagger:P,springConfig:U};if(o[t]&&o[t].shouldFlip&&!o[t].shouldFlip(C.previous,C.current))return!1;var k=Math.abs(i.left-l.left)+Math.abs(i.top-l.top),j=Math.abs(i.width-l.width)+Math.abs(i.height-l.height),B=Math.abs(S-v);if(0===i.height&&0===l.height||0===i.width&&0===l.width||k<.5&&j<.5&&B<.01)return!1;var N=n.parse(f[t].transform),L={matrix:N},q={matrix:[]},X=[N];w.translate&&(X.push(n.translateX(i.left-l.left)),X.push(n.translateY(i.top-l.top))),w.scale&&(X.push(n.scaleX(Math.max(i.width,1)/Math.max(l.width,1))),X.push(n.scaleY(Math.max(i.height,1)/Math.max(l.height,1)))),w.opacity&&(q.opacity=v,L.opacity=S);var Y=[];if(!o[t]||!o[t].shouldInvert||o[t].shouldInvert(C.previous,C.current)){var K=function(t,e){return a(t.querySelectorAll("["+h+'="'+e+'"]'))}(A,t);Y=K.map(function(t){return[t,M(t)]})}q.matrix=D(X.reduce(n.multiply)),L.matrix=D(L.matrix);var W,H=function(t){var e=t.element,i=t.invertedChildren,n=t.body;return function(t){var s=t.matrix,o=t.opacity,a=t.forceMinVals;if(r(o)&&(e.style.opacity=o+""),a&&(e.style.minHeight="1px",e.style.minWidth="1px"),s){var l=function(t){return"matrix("+t.join(", ")+")"}(s);e.style.transform=l,i&&function(t){var e=t.matrix,i=t.body;t.invertedChildren.forEach(function(t){var n=t[0],r=t[1];if(i.contains(n)){var s=e[0],o=e[3],a=e[5],l={translateX:0,translateY:0,scaleX:1,scaleY:1},p="";r.translate&&(l.translateX=-e[4]/s,l.translateY=-a/o,p+="translate("+l.translateX+"px, "+l.translateY+"px)"),r.scale&&(l.scaleX=1/s,l.scaleY=1/o,p+=" scale("+l.scaleX+", "+l.scaleY+")"),n.style.transform=p}})}({invertedChildren:i,matrix:s,body:n})}}}({element:A,invertedChildren:Y,body:V});if(o[t]&&o[t].onComplete){var J=o[t].onComplete;W=function(){return J(A,C)}}var z=r(q.opacity)&&r(L.opacity)&&q.opacity!==L.opacity,G=!1;return p({},T,{stagger:P,springConfig:U,getOnUpdateFunc:function(e){var i=e.spring,n=e.onAnimationEnd;return c[t]={destroy:i.destroy.bind(i),onAnimationEnd:n},function(e){o[t]&&o[t].onSpringUpdate&&o[t].onSpringUpdate(e.getCurrentValue()),G||(G=!0,o[t]&&o[t].onStart&&o[t].onStart(A,C));var i=e.getCurrentValue();if(V.contains(A)){var n={matrix:[]};n.matrix=q.matrix.map(function(t,e){return u(t,L.matrix[e],i)}),z&&(n.opacity=u(q.opacity,L.opacity,i)),H(n)}else e.destroy()}},initializeFlip:function(){H({matrix:q.matrix,opacity:z?q.opacity:void 0,forceMinVals:E}),o[t]&&o[t].onStartImmediate&&o[t].onStartImmediate(A,C),w.transformOrigin?A.style.transformOrigin=w.transformOrigin:g&&(A.style.transformOrigin="0 0"),Y.forEach(function(t){var e=t[0],i=t[1];i.transformOrigin?e.style.transformOrigin=i.transformOrigin:g&&(e.style.transformOrigin="0 0")})},onAnimationEnd:function(i){delete c[t],s(W)&&W(),A.style.transform="",Y.forEach(function(t){t[0].style.transform=""}),E&&A&&(A.style.minHeight="",A.style.minWidth=""),i||(x.push(t),x.length>=F.length&&e(x))},delayUntil:w.delayUntil})}).filter(Boolean);if(F.forEach(function(t){return(0,t.initializeFlip)()}),S)return function(){};var k=F.filter(function(t){return t.delayUntil&&(e=t.delayUntil,F.filter(function(t){return t.id===e}).length);var e}),j={},B={},N={};k.forEach(function(t){t.stagger?(N[t.stagger]=!0,B[t.delayUntil]?B[t.delayUntil].push(t.stagger):B[t.delayUntil]=[t.stagger]):j[t.delayUntil]?j[t.delayUntil].push(t):j[t.delayUntil]=[t]});var L=F.filter(function(t){return t.stagger}).reduce(function(t,e){return t[e.stagger]?t[e.stagger].push(e):t[e.stagger]=[e],t},{}),q=F.filter(function(t){return-1===k.indexOf(t)});return q.forEach(function(t){t.onSpringActivate=function(){j[t.id]&&j[t.id].forEach(P),B[t.id]&&Object.keys(B[t.id].reduce(function(t,e){var i;return p(t,((i={})[e]=!0,i))},{})).forEach(function(t){T(L[t],A[t])})}}),function(){return F.length||e([]),q.filter(function(t){return!t.stagger}).forEach(P),Object.keys(L).forEach(function(t){N[t]||T(L[t],A[t])}),w}}(Z);V?V({hideEnteringElements:z,animateEnteringElements:G,animateExitingElements:Q,animateFlippedElements:$}):(z(),Q().then(G),$())}},L=function(t){var e=t.element,i=t.flipCallbacks,n=void 0===i?{}:i,r=t.inProgressAnimations,s=void 0===r?{}:r,o=j(e,t.portalKey),l=a(e.querySelectorAll("["+h+"]")),c={},u=[],d={};o.filter(function(t){return n&&n[t.dataset.flipId]&&n[t.dataset.flipId].onExit}).forEach(function(t){var e=t.parentNode;if(t.closest){var i=t.closest("["+m+"]");i&&(e=i)}var n=u.findIndex(function(t){return t[0]===e});-1===n&&(u.push([e,e.getBoundingClientRect()]),n=u.length-1),c[t.dataset.flipId]=u[n][1],d[t.dataset.flipId]=e});var f=B(o),g=f.map(function(t){var e=t[0],i=t[1],r={};if(n&&n[e.dataset.flipId]&&n[e.dataset.flipId].onExit){var s=c[e.dataset.flipId];p(r,{element:e,parent:d[e.dataset.flipId],childPosition:{top:i.top-s.top,left:i.left-s.left,width:i.width,height:i.height}})}return[e.dataset.flipId,{rect:i,opacity:parseFloat(window.getComputedStyle(e).opacity||"1"),domDataForExitAnimations:r}]}).reduce(k,{});return function(t,e){Object.keys(t).forEach(function(e){t[e].destroy&&t[e].destroy(),t[e].onAnimationEnd&&t[e].onAnimationEnd(!0),delete t[e]}),e.forEach(function(t){t.style.transform="",t.style.opacity=""})}(s,o.concat(l)),{flippedElementPositions:g,cachedOrderedFlipIds:f.map(function(t){return t[0].dataset.flipId})}},q=/*#__PURE__*/function(){function t(t){this.element=void 0,this.staggerConfig=void 0,this.applyTransformOrigin=!0,this.handleEnterUpdateDelete=void 0,this.debug=void 0,this.spring=void 0,this.inProgressAnimations=void 0,this.flipCallbacks=void 0,this.snapshot=void 0,this.onComplete=void 0,this.onStart=void 0,p(this,t),this.inProgressAnimations={},this.flipCallbacks={},this.recordBeforeUpdate=this.recordBeforeUpdate.bind(this),this.update=this.update.bind(this),this.addFlipped=this.addFlipped.bind(this),this.addInverted=this.addInverted.bind(this)}var e=t.prototype;return e.recordBeforeUpdate=function(){this.snapshot=L({element:this.element,flipCallbacks:this.flipCallbacks,inProgressAnimations:this.inProgressAnimations})},e.update=function(t,e){this.snapshot&&(N({flippedElementPositionsBeforeUpdate:this.snapshot.flippedElementPositions,cachedOrderedFlipIds:this.snapshot.cachedOrderedFlipIds,containerEl:this.element,inProgressAnimations:this.inProgressAnimations,flipCallbacks:this.flipCallbacks,applyTransformOrigin:this.applyTransformOrigin,spring:this.spring,debug:this.debug,staggerConfig:this.staggerConfig,handleEnterUpdateDelete:this.handleEnterUpdateDelete,decisionData:{previous:t,current:e},onComplete:this.onComplete,onStart:this.onStart}),delete this.snapshot)},e.addFlipped=function(t){var e=t.element,i=t.flipId,n=t.opacity,r=t.translate,s=t.scale,o=t.transformOrigin,a=t.spring,l=t.stagger,c=t.delayUntil,u=t.onAppear,d=t.onStart,f=t.onSpringUpdate,h=t.onComplete,g=t.onExit,m=t.shouldFlip,v=t.shouldInvert;if(!e)throw new Error("no element provided");if(!i)throw new Error("No flipId provided");var y={scale:s,translate:r,opacity:n,transformOrigin:o,spring:a,stagger:l,delayUntil:c};y.scale||y.translate||y.opacity||p(y,{translate:!0,scale:!0,opacity:!0}),i&&(e.dataset.flipId=String(i)),e.dataset.flipConfig=JSON.stringify(y),this.flipCallbacks[i]={shouldFlip:m,shouldInvert:v,onAppear:u,onStart:d,onSpringUpdate:f,onComplete:h,onExit:g}},e.addInverted=function(t){var e=t.element,i=t.parent,n=t.opacity,r=t.translate,s=t.scale,o=t.transformOrigin;if(!e)throw new Error("no element provided");if(!i)throw new Error("parent must be provided");var a=i.dataset.flipId,l={scale:s,translate:r,opacity:n,transformOrigin:o};l.scale||l.translate||l.opacity||p(l,{translate:!0,scale:!0,opacity:!0}),e.dataset.inverseFlipId=a,e.dataset.flipConfig=JSON.stringify(l)},t}(),X=new U;t.Flipper=q,t.constants=v,t.getFlippedElementPositionsBeforeUpdate=L,t.onFlipKeyUpdate=N,t.spring=function(t){var e=t.values,i=t.onUpdate,n=t.delay,r=void 0===n?0:n,s=t.onComplete,o=p({},y.noWobble,_(t.config)),a=o.overshootClamping,l=X.createSpring(o.stiffness,o.damping);return l.setOvershootClampingEnabled(!!a),l.addListener({onSpringAtRest:function(t){s&&s(),t.destroy()},onSpringUpdate:function(t){var n=t.getCurrentValue();if(!e)return i(n);var r=Object.keys(e).map(function(t){return[t,u(e[t][0],e[t][1],n)]}).reduce(function(t,e){var i;return Object.assign(t,((i={})[e[0]]=e[1],i))},{});i(r)}}),r?setTimeout(function(){l.setEndValue(1)},r):l.setEndValue(1),l},t.utilities=d});
 //# sourceMappingURL=index.umd.js.map

lib/Spring/index.d.ts

@@ -6,3 +6,3 @@ import { SimpleSpringOptions } from './types';
  * */
-declare const createSimpleSpring: ({ config, values, onUpdate, delay, onComplete }: SimpleSpringOptions) => import("../forked-rebound/types").Spring;
+declare const createSimpleSpring: ({ config, values, onUpdate, delay, onComplete }: SimpleSpringOptions) => import("../forked-rebound/types.d").Spring;
 export default createSimpleSpring;

lib/Spring/types.d.ts

 import { SpringOption } from '../springSettings/types';
-declare type TweenStart = number;
-declare type TweenEnd = number;
-declare type Values = Record<string, [TweenStart, TweenEnd]>;
-declare type SpringSnapshot = Record<string, number>;
+type TweenStart = number;
+type TweenEnd = number;
+type Values = Record<string, [TweenStart, TweenEnd]>;
+type SpringSnapshot = Record<string, number>;
 export interface SimpleSpringOptions {
@@ -7,0 +7,0 @@ /** Provide a string referencing one of the spring presets — noWobble (default), veryGentle, gentle, wobbly, or stiff, OR provide an object with stiffness and damping parameters. */

lib/springSettings/index.d.ts

@@ -5,4 +5,4 @@ import { SpringPresets, SpringConfig, SpringOption } from './types';
 export declare const getSpringConfig: ({ flipperSpring, flippedSpring }?: {
-    flipperSpring?: string | number | SpringConfig | undefined;
-    flippedSpring?: string | number | SpringConfig | undefined;
-}) => Record<string, any>;
+    flipperSpring?: SpringOption | undefined;
+    flippedSpring?: SpringOption | undefined;
+}) => import("../utilities/types").IndexableObject;

lib/springSettings/types.d.ts

@@ -14,2 +14,2 @@ import { IndexableObject } from '../utilities/types';
 }
-export declare type SpringOption = SpringConfig | keyof SpringPresets;
+export type SpringOption = SpringConfig | keyof SpringPresets;

lib/types.d.ts

 /// <reference types="react" />
 import { SpringOption } from './springSettings/types';
-export { FlippedElementPositionsBeforeUpdateReturnVals } from './flip/getFlippedElementPositions/getFlippedElementPositionsBeforeUpdate/types';
-export declare type FlipId = string | number;
-export declare type ChildAsFunction = (props: object) => React.ReactNode;
-export declare type FlippedChildren = React.ReactNode | ChildAsFunction;
+export type { FlippedElementPositionsBeforeUpdateReturnVals } from './flip/getFlippedElementPositions/getFlippedElementPositionsBeforeUpdate/types';
+export type FlipId = string | number;
+export type ChildAsFunction = (props: object) => React.ReactNode;
+export type FlippedChildren = React.ReactNode | ChildAsFunction;
 export interface SerializableFlippedProps {
@@ -44,4 +44,4 @@ children: FlippedChildren;
 }
-export declare type FlippedProps = CallbackFlippedProps & SerializableFlippedProps;
-export declare type DelayUntil = (previousDecisionData: any, currentDecisionData: any) => FlipId;
+export type FlippedProps = CallbackFlippedProps & SerializableFlippedProps;
+export type DelayUntil = (previousDecisionData: any, currentDecisionData: any) => FlipId;
 export interface StaggerConfigValue {
@@ -62,3 +62,3 @@ reverse?: boolean;
 }
-export declare type HandleEnterUpdateDelete = (args: HandleEnterUpdateDeleteArgs) => void;
+export type HandleEnterUpdateDelete = (args: HandleEnterUpdateDeleteArgs) => void;
 export interface DecisionData {
@@ -68,4 +68,4 @@ previous?: any;
 }
-export declare type OnFlipperComplete = (flipperEl: HTMLElement, decisionData: DecisionData) => void;
-export declare type OnFlipperStart = (flipperEl: HTMLElement, decisionData: DecisionData) => void;
+export type OnFlipperComplete = (flipperEl: HTMLElement, decisionData: DecisionData) => void;
+export type OnFlipperStart = (flipperEl: HTMLElement, decisionData: DecisionData) => void;
 export interface FlipperProps {
@@ -72,0 +72,0 @@ /** Changing this key will initiate a FLIP animation */

lib/utilities/index.d.ts

@@ -7,3 +7,3 @@ import { IndexableObject } from './types';
 export declare const getDuplicateValsAsStrings: (arr: string[]) => string[];
-export declare function assign(target: IndexableObject, ...args: IndexableObject[]): Record<string, any>;
+export declare function assign(target: IndexableObject, ...args: IndexableObject[]): IndexableObject;
 export declare const tweenProp: (start: number, end: number, position: number) => number;

lib/utilities/types.d.ts

@@ -1,1 +0,1 @@
-export declare type IndexableObject = Record<string, any>;
+export type IndexableObject = Record<string, any>;

package.json

 {
   "name": "flip-toolkit",
-  "version": "7.0.17",
+  "version": "7.1.0-0",
   "description": "Configurable FLIP animation helpers",
@@ -41,8 +41,8 @@ "license": "MIT",
   "devDependencies": {
-    "@babel/core": "^7.12.3",
-    "chai": "^4.2.0",
-    "microbundle": "^0.12.4",
-    "mocha": "^8.2.1",
+    "@babel/core": "^7.21.8",
+    "chai": "^4.3.7",
+    "microbundle": "^0.15.1",
+    "mocha": "^8.4.0",
     "parcel": "^1.12.4",
-    "prettier": "2.1.2"
+    "prettier": "2.8.8"
   },
@@ -49,0 +49,0 @@ "files": [

New alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

500453

increased by3.43%

Lines of code

1014

increased by0.9%

Worsened metrics

Number of low quality alerts

4

increased by33.33%

No dependency changes