@progress/kendo-react-animation
Version:
React Animation component assists with animating HTML elements. KendoReact Animation package
9 lines (8 loc) • 2.27 kB
JavaScript
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2026 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the package root for more information
*-------------------------------------------------------------------------------------------
*/
;Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const F=require("react"),i=require("prop-types"),N=require("./Animation.js"),h=require("./util.js");function _(e){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const a=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(o,r,a.get?a:{enumerable:!0,get:()=>e[r]})}}return o.default=e,Object.freeze(o)}const s=_(F),p=e=>{const[o,r]=s.useState(),[a,E]=s.useState(),[u,y]=s.useState({}),{appear:v=l.appear,enter:W=l.enter,exit:O=l.exit,transitionEnterDuration:D=l.transitionEnterDuration,transitionExitDuration:H=l.transitionExitDuration,direction:f=l.direction,children:T,childFactory:g,...b}=e;let c;f==="vertical"?c={maxHeight:o?`${o}px`:""}:c={maxWidth:a?`${a}px`:""};const S={maxHeight:c.maxHeight,maxWidth:c.maxWidth};s.useEffect(()=>{e&&u.name&&e[u.name]&&e[u.name].call(void 0,u.event)},[o,a,u]);const j=t=>{const{onBeforeEnter:n}=e;n&&n.call(void 0,t),m(t,"onEnter")},P=t=>{m(t,"onEntering")},q=t=>{m(t,"onExit")},m=(t,n)=>{var x;const d=(x=t.animatedElement)==null?void 0:x.firstChild;if(d){const R=h.outerHeight(d),w=h.outerWidth(d);r(R),E(w),y({name:n,event:t})}},M=t=>{const n=g?g(t):t;return n.props.in?n:s.cloneElement(n,{...n.props,style:{...n.props.style,maxHeight:c.maxHeight,maxWidth:c.maxWidth}})};return s.createElement(N.Animation,{...b,appear:v,enter:W,exit:O,transitionEnterDuration:D,transitionExitDuration:H,childFactory:M,onEnter:j,onEntering:P,onExit:q,animationEnteringStyle:S,transitionName:`reveal-${f}`},T)},l={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"vertical"};p.propTypes={children:i.oneOfType([i.arrayOf(i.node),i.node]),childFactory:i.any,className:i.string,direction:i.oneOf(["horizontal","vertical"]),component:i.node,id:i.string,style:i.any};exports.Reveal=p;