react-flip-toolkit/lib/index.es.js

Configurable FLIP animation helpers for React

import{getFlippedElementPositionsBeforeUpdate as e,onFlipKeyUpdate as t,utilities as r,constants as n}from"flip-toolkit";export{disableFlip,enableFlip,isFlipEnabled,spring}from"flip-toolkit";import i,{createContext as o,Component as p,Children as l,cloneElement as a}from"react";import"prop-types";function s(){return s=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},s.apply(this,arguments)}function c(e,t){return c=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},c(e,t)}function d(e,t){if(null==e)return{};var r,n,i={},o=Object.keys(e);for(n=0;n<o.length;n++)t.indexOf(r=o[n])>=0||(i[r]=e[r]);return i}var f=/*#__PURE__*/o({}),u=/*#__PURE__*/o("portal"),h=/*#__PURE__*/function(r){var n,o;function p(){for(var e,t=arguments.length,n=new Array(t),i=0;i<t;i++)n[i]=arguments[i];return(e=r.call.apply(r,[this].concat(n))||this).inProgressAnimations={},e.flipCallbacks={},e.el=void 0,e}o=r,(n=p).prototype=Object.create(o.prototype),n.prototype.constructor=n,c(n,o);var l=p.prototype;return l.getSnapshotBeforeUpdate=function(t){return t.flipKey!==this.props.flipKey&&this.el?e({element:this.el,flipCallbacks:this.flipCallbacks,inProgressAnimations:this.inProgressAnimations,portalKey:this.props.portalKey}):null},l.componentDidUpdate=function(e,r,n){this.props.flipKey!==e.flipKey&&this.el&&t({flippedElementPositionsBeforeUpdate:n.flippedElementPositions,cachedOrderedFlipIds:n.cachedOrderedFlipIds,containerEl:this.el,inProgressAnimations:this.inProgressAnimations,flipCallbacks:this.flipCallbacks,applyTransformOrigin:this.props.applyTransformOrigin,spring:this.props.spring,debug:this.props.debug,portalKey:this.props.portalKey,staggerConfig:this.props.staggerConfig,handleEnterUpdateDelete:this.props.handleEnterUpdateDelete,decisionData:{previous:e.decisionData,current:this.props.decisionData},onComplete:this.props.onComplete,onStart:this.props.onStart})},l.render=function(){var e=this,t=this.props,r=t.portalKey,n=/*#__PURE__*/i.createElement(f.Provider,{value:this.flipCallbacks},/*#__PURE__*/i.createElement(t.element,{className:t.className,ref:function(t){return e.el=t}},this.props.children));return r&&(n=/*#__PURE__*/i.createElement(u.Provider,{value:r},n)),n},p}(p);h.defaultProps={applyTransformOrigin:!0,element:"div"};var m=["children","flipId","inverseFlipId","portalKey"],y=["children","flipId","shouldFlip","shouldInvert","onAppear","onStart","onStartImmediate","onComplete","onExit","onSpringUpdate"],g=function(e){var t,i=e.children,o=e.flipId,p=e.inverseFlipId,s=e.portalKey,c=d(e,m),f=i,u=function(e){return"function"==typeof e}(f);if(!u)try{f=l.only(i)}catch(e){throw new Error("Each Flipped component must wrap a single child")}c.scale||c.translate||c.opacity||r.assign(c,{translate:!0,scale:!0,opacity:!0});var h=((t={})[n.DATA_FLIP_CONFIG]=JSON.stringify(c),t);return void 0!==o?h[n.DATA_FLIP_ID]=String(o):p&&(h[n.DATA_INVERSE_FLIP_ID]=String(p)),void 0!==s&&(h[n.DATA_PORTAL_KEY]=s),u?f(h):/*#__PURE__*/a(f,h)},v=function(e){var t=e.children,n=e.flipId,o=e.shouldFlip,p=e.shouldInvert,l=e.onAppear,a=e.onStart,c=e.onStartImmediate,h=e.onComplete,m=e.onExit,v=e.onSpringUpdate,I=d(e,y);return t?I.inverseFlipId?/*#__PURE__*/i.createElement(g,s({},I),t):/*#__PURE__*/i.createElement(u.Consumer,null,function(e){/*#__PURE__*/return i.createElement(f.Consumer,null,function(d){return r.isObject(d)&&n&&(d[n]={shouldFlip:o,shouldInvert:p,onAppear:l,onStart:a,onStartImmediate:c,onComplete:h,onExit:m,onSpringUpdate:v}),/*#__PURE__*/i.createElement(g,s({flipId:n},I,{portalKey:e}),t)})}):null};v.displayName="Flipped";var I=function(e){var t;/*#__PURE__*/return a(e.children,((t={})[n.DATA_EXIT_CONTAINER]=!0,t))};export{I as ExitContainer,v as Flipped,h as Flipper};
//# sourceMappingURL=index.es.js.map