@progress/kendo-react-animation 14.3.0-develop.1 → 14.3.0-develop.11

package/Reveal.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const w=require("react"),i=require("prop-types"),F=require("./Animation.js"),x=require("./util.js");function N(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=N(w),h=e=>{const[o,r]=s.useState(),[a,p]=s.useState(),[u,E]=s.useState({}),{appear:y=l.appear,enter:v=l.enter,exit:W=l.exit,transitionEnterDuration:O=l.transitionEnterDuration,transitionExitDuration:D=l.transitionExitDuration,direction:f=l.direction,children:H,childFactory:g,...T}=e;let c;f==="vertical"?c={maxHeight:o?`${o}px`:""}:c={maxWidth:a?`${a}px`:""};const b={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 S=t=>{const{onBeforeEnter:n}=e;n&&n.call(void 0,t),m(t,"onEnter")},j=t=>{m(t,"onEntering")},P=t=>{m(t,"onExit")},m=(t,n)=>{const d=t.animatedElement.firstChild;if(d){const M=x.outerHeight(d),R=x.outerWidth(d);r(M),p(R),E({name:n,event:t})}},q=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(F.Animation,{...T,appear:y,enter:v,exit:W,transitionEnterDuration:O,transitionExitDuration:D,childFactory:q,onEnter:S,onEntering:j,onExit:P,animationEnteringStyle:b,transitionName:`reveal-${f}`},H)},l={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"vertical"};h.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=h;
+"use strict";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;

package/Reveal.mjs

@@ -7,46 +7,47 @@
  */
 import * as o from "react";
 import n from "prop-types";
-import { Animation as N } from "./Animation.mjs";
-import p from "./util.mjs";
-const P = (a) => {
-  const [c, E] = o.useState(), [m, f] = o.useState(), [s, u] = o.useState({}), {
-    appear: g = r.appear,
-    enter: y = r.enter,
-    exit: W = r.exit,
-    transitionEnterDuration: H = r.transitionEnterDuration,
-    transitionExitDuration: v = r.transitionExitDuration,
+import { Animation as P } from "./Animation.mjs";
+import E from "./util.mjs";
+const R = (a) => {
+  const [c, f] = o.useState(), [m, u] = o.useState(), [s, g] = o.useState({}), {
+    appear: y = r.appear,
+    enter: W = r.enter,
+    exit: H = r.exit,
+    transitionEnterDuration: v = r.transitionEnterDuration,
+    transitionExitDuration: D = r.transitionExitDuration,
     direction: x = r.direction,
-    children: D,
+    children: T,
     childFactory: h,
-    ...T
+    ...O
   } = a;
   let i;
   x === "vertical" ? i = { maxHeight: c ? `${c}px` : "" } : i = { maxWidth: m ? `${m}px` : "" };
-  const O = {
+  const S = {
     maxHeight: i.maxHeight,
     maxWidth: i.maxWidth
   };
   o.useEffect(() => {
     a && s.name && a[s.name] && a[s.name].call(void 0, s.event);
   }, [c, m, s]);
-  const S = (t) => {
+  const F = (t) => {
     const { onBeforeEnter: e } = a;
     e && e.call(void 0, t), l(t, "onEnter");
-  }, F = (t) => {
-    l(t, "onEntering");
   }, M = (t) => {
+    l(t, "onEntering");
+  }, $ = (t) => {
     l(t, "onExit");
   }, l = (t, e) => {
-    const d = t.animatedElement.firstChild;
+    var p;
+    const d = (p = t.animatedElement) == null ? void 0 : p.firstChild;
     if (d) {
-      const w = p.outerHeight(d), C = p.outerWidth(d);
-      E(w), f(C), u({
+      const C = E.outerHeight(d), N = E.outerWidth(d);
+      f(C), u(N), g({
         name: e,
         event: t
       });
     }
-  }, $ = (t) => {
+  }, w = (t) => {
     const e = h ? h(t) : t;
     return e.props.in ? e : o.cloneElement(e, {
       ...e.props,
@@ -58,22 +59,22 @@ const P = (a) => {
     });
   };
   return /* @__PURE__ */ o.createElement(
-    N,
+    P,
     {
-      ...T,
-      appear: g,
-      enter: y,
-      exit: W,
-      transitionEnterDuration: H,
-      transitionExitDuration: v,
-      childFactory: $,
-      onEnter: S,
-      onEntering: F,
-      onExit: M,
-      animationEnteringStyle: O,
+      ...O,
+      appear: y,
+      enter: W,
+      exit: H,
+      transitionEnterDuration: v,
+      transitionExitDuration: D,
+      childFactory: w,
+      onEnter: F,
+      onEntering: M,
+      onExit: $,
+      animationEnteringStyle: S,
       transitionName: `reveal-${x}`
     },
-    D
+    T
   );
 }, r = {
   appear: !1,
@@ -83,7 +84,7 @@ const P = (a) => {
   transitionExitDuration: 300,
   direction: "vertical"
 };
-P.propTypes = {
+R.propTypes = {
   children: n.oneOfType([n.arrayOf(n.node), n.node]),
   childFactory: n.any,
   className: n.string,
@@ -93,5 +94,5 @@ P.propTypes = {
   style: n.any
 };
 export {
-  P as Reveal
+  R as Reveal
 };

package/dist/cdn/js/kendo-react-animation.js

@@ -12,4 +12,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-!function(t,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react"),require("prop-types"),require("@progress/kendo-react-common"),require("react-transition-group")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@progress/kendo-react-common","react-transition-group"],n):n((t="undefined"!=typeof globalThis?globalThis:t||self).KendoReactAnimation={},t.React,t.PropTypes,t.KendoReactCommon,t.ReactTransitionGroup)}(this,function(t,n,e,i,r){"use strict";function a(t){var n=Object.create(null);return t&&Object.keys(t).forEach(function(e){if("default"!==e){var i=Object.getOwnPropertyDescriptor(t,e);Object.defineProperty(n,e,i.get?i:{enumerable:!0,get:function(){return t[e]}})}}),n.default=t,Object.freeze(n)}var o=a(n);const s=o.forwardRef((t,n)=>{const e=o.useRef(null),{mountOnEnter:a=c.mountOnEnter,unmountOnExit:s=c.unmountOnExit,onEnter:l=c.onEnter,onEntering:u=c.onEntering,onEntered:d=c.onEntered,onExit:m=c.onExit,onExiting:p=c.onExiting,onExited:E=c.onExited,onAfterExited:x=c.onAfterExited,animationEnteringStyle:y=c.animationEnteringStyle,animationEnteredStyle:f=c.animationEnteredStyle,animationExitingStyle:g=c.animationExitingStyle,animationExitedStyle:h=c.animationExitedStyle,children:D,style:N,appear:O,enter:v,exit:S,transitionName:b,transitionEnterDuration:A,transitionExitDuration:C,className:R,unstyled:T,...w}=t,F={transitionDelay:"0ms",...N},k=T&&T.uAnimation,q=i.classNames(R,i.uAnimation.childContainer({c:k})),j=o.useRef({element:e.current,props:t}),$=o.useRef(null);o.useImperativeHandle($,()=>({element:e.current,props:t})),o.useImperativeHandle(n,()=>$.current,[]);const H={entering:{transitionDuration:`${A}ms`,...y},entered:{...f},exiting:{transitionDuration:`${C}ms`,...g},exited:{...h}},W={in:t.in,appear:O,enter:v,exit:S,mountOnEnter:a,unmountOnExit:s,timeout:{enter:A,exit:C},onEnter:()=>{l&&l.call(void 0,{animatedElement:e.current,target:$.current||j.current})},onEntering:()=>{u&&u.call(void 0,{animatedElement:e.current,target:$.current||j.current})},onEntered:()=>{d&&d.call(void 0,{animatedElement:e.current,target:$.current||j.current})},onExit:()=>{m&&m.call(void 0,{animatedElement:e.current,target:$.current||j.current})},onExiting:()=>{p&&p.call(void 0,{animatedElement:e.current,target:$.current||j.current})},onExited:()=>{x&&x.call(void 0,{animatedElement:e.current,target:$.current||j.current}),E&&E.call(void 0,{animatedElement:e.current,target:$.current||j.current})},classNames:{appear:i.classNames(i.uAnimation.appear({c:k,transitionName:b})),appearActive:i.classNames(i.uAnimation.appearActive({c:k,transitionName:b})),enter:i.classNames(i.uAnimation.enter({c:k,transitionName:b})),enterActive:i.classNames(i.uAnimation.enterActive({c:k,transitionName:b})),exit:i.classNames(i.uAnimation.exit({c:k,transitionName:b})),exitActive:i.classNames(i.uAnimation.exitActive({c:k,transitionName:b}))}};return o.createElement(r.CSSTransition,{...W,...w,nodeRef:e},t=>o.createElement("div",{style:{...F,...H[t]},className:q,ref:t=>{e.current=t,j.current.element=t}},D))}),c={mountOnEnter:!0,unmountOnExit:!1,onEnter:i.noop,onEntering:i.noop,onEntered:i.noop,onExit:i.noop,onExiting:i.noop,onExited:i.noop,onAfterExited:i.noop,animationEnteringStyle:{},animationEnteredStyle:{},animationExitingStyle:{},animationExitedStyle:{}};s.displayName="KendoReactAnimationChild",s.propTypes={in:e.bool,children:e.oneOfType([e.arrayOf(e.node),e.node]),transitionName:e.string.isRequired,className:e.string,appear:e.bool,enter:e.bool,exit:e.bool,transitionEnterDuration:e.number.isRequired,transitionExitDuration:e.number.isRequired,mountOnEnter:e.bool,unmountOnExit:e.bool,animationEnteringStyle:e.object,animationEnteredStyle:e.object,animationExitingStyle:e.object,animationExitedStyle:e.object};const l=t=>{const{id:n,style:e,children:a,component:c="div",className:l,childFactory:u,stackChildren:d,componentChildStyle:m,componentChildClassName:p,...E}=t,x=i.useUnstyled(),y=t.unstyled||x,f=y&&y.uAnimation,g={id:n,style:e,component:c,childFactory:u,className:i.classNames(i.uAnimation.child({c:f}),l)},h=o.Children.map(a||null,t=>o.createElement(s,{...E,unstyled:y,style:m,className:p},t));return o.createElement(r.TransitionGroup,{...g},h)};l.propTypes={children:e.oneOfType([e.arrayOf(e.node),e.node]),childFactory:e.any,className:e.string,component:e.node,id:e.string,style:e.any,transitionName:e.string.isRequired,appear:e.bool.isRequired,enter:e.bool.isRequired,exit:e.bool.isRequired,transitionEnterDuration:e.number.isRequired,transitionExitDuration:e.number.isRequired};const u=t=>{const{appear:n=d.appear,enter:e=d.enter,exit:i=d.exit,transitionEnterDuration:r=d.transitionEnterDuration,transitionExitDuration:a=d.transitionExitDuration,children:s,...c}=t;return o.createElement(l,{transitionName:"fade",appear:n,enter:e,exit:i,transitionEnterDuration:r,transitionExitDuration:a,...c},s)},d={appear:!1,enter:!0,exit:!1,transitionEnterDuration:500,transitionExitDuration:500};u.propTypes={children:e.oneOfType([e.arrayOf(e.node),e.node]),childFactory:e.any,className:e.string,component:e.node,id:e.string,style:e.any};const m=t=>{const{appear:n=p.appear,enter:e=p.enter,exit:i=p.exit,transitionEnterDuration:r=p.transitionEnterDuration,transitionExitDuration:a=p.transitionExitDuration,direction:s=p.direction,children:c,...u}=t,d={transitionName:`expand-${s}`};return o.createElement(l,{...d,appear:n,enter:e,exit:i,transitionEnterDuration:r,transitionExitDuration:a,...u},c)},p={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"vertical"};m.propTypes={children:e.oneOfType([e.arrayOf(e.node),e.node]),childFactory:e.any,className:e.string,direction:e.oneOf(["horizontal","vertical"]),component:e.node,id:e.string,style:e.any};const E={position:"absolute",top:"0",left:"0"},x=t=>{const{appear:n=y.appear,enter:e=y.enter,exit:i=y.exit,transitionEnterDuration:r=y.transitionEnterDuration,transitionExitDuration:a=y.transitionExitDuration,stackChildren:s=y.stackChildren,direction:c=y.direction,children:u,...d}=t;return o.createElement(l,{appear:n,enter:e,exit:i,transitionEnterDuration:r,transitionExitDuration:a,stackChildren:s,...d,transitionName:`push-${c}`,animationExitingStyle:t.stackChildren?E:void 0},u)},y={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"right",stackChildren:!1};x.propTypes={children:e.oneOfType([e.arrayOf(e.node),e.node]),childFactory:e.any,className:e.string,direction:e.oneOf(["up","down","left","right"]),component:e.node,id:e.string,style:e.any,stackChildren:e.bool};const f=t=>{const{appear:n=g.appear,enter:e=g.enter,exit:i=g.exit,transitionEnterDuration:r=g.transitionEnterDuration,transitionExitDuration:a=g.transitionExitDuration,direction:s=g.direction,children:c,...u}=t,d={transitionName:`slide-${s}`};return o.createElement(l,{...d,appear:n,enter:e,exit:i,transitionEnterDuration:r,transitionExitDuration:a,...u},c)},g={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"down"};f.propTypes={children:e.oneOfType([e.arrayOf(e.node),e.node]),childFactory:e.any,className:e.string,direction:e.oneOf(["up","down","left","right"]),component:e.node,id:e.string,style:e.any};const h={position:"absolute",top:"0",left:"0"},D=t=>{const{appear:n=N.appear,enter:e=N.enter,exit:i=N.exit,transitionEnterDuration:r=N.transitionEnterDuration,transitionExitDuration:a=N.transitionExitDuration,stackChildren:s=N.stackChildren,direction:c=N.direction,children:u,...d}=t;return o.createElement(l,{appear:n,enter:e,exit:i,transitionEnterDuration:r,transitionExitDuration:a,stackChildren:s,...d,transitionName:`zoom-${c}`,animationExitingStyle:t.stackChildren?h:void 0},u)},N={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"out",stackChildren:!1};D.propTypes={children:e.oneOfType([e.arrayOf(e.node),e.node]),childFactory:e.any,className:e.string,direction:e.oneOf(["in","out"]),component:e.node,id:e.string,style:e.any,stackChildren:e.bool};const O=t=>{if(!t||!t.ownerDocument.defaultView)return 0;const n=t.ownerDocument.defaultView.getComputedStyle(t),e=parseFloat(n.marginTop),i=parseFloat(n.marginBottom);return t.offsetHeight+e+i},v=t=>{if(!t||!t.ownerDocument.defaultView)return 0;const n=t.ownerDocument.defaultView.getComputedStyle(t),e=parseFloat(n.marginLeft),i=parseFloat(n.marginRight);return t.offsetWidth+e+i},S=(i.animationStyles,t=>{const[n,e]=o.useState(),[i,r]=o.useState(),[a,s]=o.useState({}),{appear:c=b.appear,enter:u=b.enter,exit:d=b.exit,transitionEnterDuration:m=b.transitionEnterDuration,transitionExitDuration:p=b.transitionExitDuration,direction:E=b.direction,children:x,childFactory:y,...f}=t;let g;g="vertical"===E?{maxHeight:n?`${n}px`:""}:{maxWidth:i?`${i}px`:""};const h={maxHeight:g.maxHeight,maxWidth:g.maxWidth};o.useEffect(()=>{t&&a.name&&t[a.name]&&t[a.name].call(void 0,a.event)},[n,i,a]);const D=(t,n)=>{const i=t.animatedElement.firstChild;if(i){const a=O(i),o=v(i);e(a),r(o),s({name:n,event:t})}};return o.createElement(l,{...f,appear:c,enter:u,exit:d,transitionEnterDuration:m,transitionExitDuration:p,childFactory:t=>{const n=y?y(t):t;return n.props.in?n:o.cloneElement(n,{...n.props,style:{...n.props.style,maxHeight:g.maxHeight,maxWidth:g.maxWidth}})},onEnter:n=>{const{onBeforeEnter:e}=t;e&&e.call(void 0,n),D(n,"onEnter")},onEntering:t=>{D(t,"onEntering")},onExit:t=>{D(t,"onExit")},animationEnteringStyle:h,transitionName:`reveal-${E}`},x)}),b={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"vertical"};S.propTypes={children:e.oneOfType([e.arrayOf(e.node),e.node]),childFactory:e.any,className:e.string,direction:e.oneOf(["horizontal","vertical"]),component:e.node,id:e.string,style:e.any};t.Animation=l,t.AnimationChild=s,t.Expand=m,t.Fade=u,t.Push=x,t.Reveal=S,t.Slide=f,t.Zoom=D,t.useAnimation=(t,n)=>{const e=o.useRef(0),i=o.useRef(!1),r=o.useRef(null);o.useEffect(()=>((t=>{const n=t.duration;let i,a;const o=e.current&&1-e.current;t.onStart&&t.onStart();const s=c=>{i||(i=c),a=c-i+1;const l=a/n+o;l<=1?(t.onUpdate&&t.onUpdate(l),r.current=window.requestAnimationFrame(s),e.current=l):(t.onEnd&&t.onEnd(1),e.current=0)};r.current=window.requestAnimationFrame(s)})(t),()=>{r.current&&window.cancelAnimationFrame(r.current)}),n),o.useEffect(()=>{i.current=!0},[])}});
+!function(t,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react"),require("prop-types"),require("@progress/kendo-react-common"),require("react-transition-group")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@progress/kendo-react-common","react-transition-group"],n):n((t="undefined"!=typeof globalThis?globalThis:t||self).KendoReactAnimation={},t.React,t.PropTypes,t.KendoReactCommon,t.ReactTransitionGroup)}(this,function(t,n,e,i,r){"use strict";function a(t){var n=Object.create(null);return t&&Object.keys(t).forEach(function(e){if("default"!==e){var i=Object.getOwnPropertyDescriptor(t,e);Object.defineProperty(n,e,i.get?i:{enumerable:!0,get:function(){return t[e]}})}}),n.default=t,Object.freeze(n)}var o=a(n);const s=o.forwardRef((t,n)=>{const e=o.useRef(null),{mountOnEnter:a=c.mountOnEnter,unmountOnExit:s=c.unmountOnExit,onEnter:l=c.onEnter,onEntering:u=c.onEntering,onEntered:d=c.onEntered,onExit:m=c.onExit,onExiting:p=c.onExiting,onExited:E=c.onExited,onAfterExited:x=c.onAfterExited,animationEnteringStyle:y=c.animationEnteringStyle,animationEnteredStyle:f=c.animationEnteredStyle,animationExitingStyle:g=c.animationExitingStyle,animationExitedStyle:h=c.animationExitedStyle,children:D,style:N,appear:O,enter:v,exit:S,transitionName:b,transitionEnterDuration:A,transitionExitDuration:C,className:R,unstyled:T,...w}=t,F={transitionDelay:"0ms",...N},k=T&&T.uAnimation,q=i.classNames(R,i.uAnimation.childContainer({c:k})),j=o.useRef({element:e.current,props:t}),$=o.useRef(null);o.useImperativeHandle($,()=>({element:e.current,props:t})),o.useImperativeHandle(n,()=>$.current,[]);const H={entering:{transitionDuration:`${A}ms`,...y},entered:{...f},exiting:{transitionDuration:`${C}ms`,...g},exited:{...h}},W={in:t.in,appear:O,enter:v,exit:S,mountOnEnter:a,unmountOnExit:s,timeout:{enter:A,exit:C},onEnter:()=>{l&&l.call(void 0,{animatedElement:e.current,target:$.current||j.current})},onEntering:()=>{u&&u.call(void 0,{animatedElement:e.current,target:$.current||j.current})},onEntered:()=>{d&&d.call(void 0,{animatedElement:e.current,target:$.current||j.current})},onExit:()=>{m&&m.call(void 0,{animatedElement:e.current,target:$.current||j.current})},onExiting:()=>{p&&p.call(void 0,{animatedElement:e.current,target:$.current||j.current})},onExited:()=>{x&&x.call(void 0,{animatedElement:e.current,target:$.current||j.current}),E&&E.call(void 0,{animatedElement:e.current,target:$.current||j.current})},classNames:{appear:i.classNames(i.uAnimation.appear({c:k,transitionName:b})),appearActive:i.classNames(i.uAnimation.appearActive({c:k,transitionName:b})),enter:i.classNames(i.uAnimation.enter({c:k,transitionName:b})),enterActive:i.classNames(i.uAnimation.enterActive({c:k,transitionName:b})),exit:i.classNames(i.uAnimation.exit({c:k,transitionName:b})),exitActive:i.classNames(i.uAnimation.exitActive({c:k,transitionName:b}))}};return o.createElement(r.CSSTransition,{...W,...w,nodeRef:e},t=>o.createElement("div",{style:{...F,...H[t]},className:q,ref:t=>{e.current=t,j.current.element=t}},D))}),c={mountOnEnter:!0,unmountOnExit:!1,onEnter:i.noop,onEntering:i.noop,onEntered:i.noop,onExit:i.noop,onExiting:i.noop,onExited:i.noop,onAfterExited:i.noop,animationEnteringStyle:{},animationEnteredStyle:{},animationExitingStyle:{},animationExitedStyle:{}};s.displayName="KendoReactAnimationChild",s.propTypes={in:e.bool,children:e.oneOfType([e.arrayOf(e.node),e.node]),transitionName:e.string.isRequired,className:e.string,appear:e.bool,enter:e.bool,exit:e.bool,transitionEnterDuration:e.number.isRequired,transitionExitDuration:e.number.isRequired,mountOnEnter:e.bool,unmountOnExit:e.bool,animationEnteringStyle:e.object,animationEnteredStyle:e.object,animationExitingStyle:e.object,animationExitedStyle:e.object};const l=t=>{const{id:n,style:e,children:a,component:c="div",className:l,childFactory:u,stackChildren:d,componentChildStyle:m,componentChildClassName:p,...E}=t,x=i.useUnstyled(),y=t.unstyled||x,f=y&&y.uAnimation,g={id:n,style:e,component:c,childFactory:u,className:i.classNames(i.uAnimation.child({c:f}),l)},h=o.Children.map(a||null,t=>o.createElement(s,{...E,unstyled:y,style:m,className:p},t));return o.createElement(r.TransitionGroup,{...g},h)};l.propTypes={children:e.oneOfType([e.arrayOf(e.node),e.node]),childFactory:e.any,className:e.string,component:e.node,id:e.string,style:e.any,transitionName:e.string.isRequired,appear:e.bool.isRequired,enter:e.bool.isRequired,exit:e.bool.isRequired,transitionEnterDuration:e.number.isRequired,transitionExitDuration:e.number.isRequired};const u=t=>{const{appear:n=d.appear,enter:e=d.enter,exit:i=d.exit,transitionEnterDuration:r=d.transitionEnterDuration,transitionExitDuration:a=d.transitionExitDuration,children:s,...c}=t;return o.createElement(l,{transitionName:"fade",appear:n,enter:e,exit:i,transitionEnterDuration:r,transitionExitDuration:a,...c},s)},d={appear:!1,enter:!0,exit:!1,transitionEnterDuration:500,transitionExitDuration:500};u.propTypes={children:e.oneOfType([e.arrayOf(e.node),e.node]),childFactory:e.any,className:e.string,component:e.node,id:e.string,style:e.any};const m=t=>{const{appear:n=p.appear,enter:e=p.enter,exit:i=p.exit,transitionEnterDuration:r=p.transitionEnterDuration,transitionExitDuration:a=p.transitionExitDuration,direction:s=p.direction,children:c,...u}=t,d={transitionName:`expand-${s}`};return o.createElement(l,{...d,appear:n,enter:e,exit:i,transitionEnterDuration:r,transitionExitDuration:a,...u},c)},p={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"vertical"};m.propTypes={children:e.oneOfType([e.arrayOf(e.node),e.node]),childFactory:e.any,className:e.string,direction:e.oneOf(["horizontal","vertical"]),component:e.node,id:e.string,style:e.any};const E={position:"absolute",top:"0",left:"0"},x=t=>{const{appear:n=y.appear,enter:e=y.enter,exit:i=y.exit,transitionEnterDuration:r=y.transitionEnterDuration,transitionExitDuration:a=y.transitionExitDuration,stackChildren:s=y.stackChildren,direction:c=y.direction,children:u,...d}=t;return o.createElement(l,{appear:n,enter:e,exit:i,transitionEnterDuration:r,transitionExitDuration:a,stackChildren:s,...d,transitionName:`push-${c}`,animationExitingStyle:t.stackChildren?E:void 0},u)},y={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"right",stackChildren:!1};x.propTypes={children:e.oneOfType([e.arrayOf(e.node),e.node]),childFactory:e.any,className:e.string,direction:e.oneOf(["up","down","left","right"]),component:e.node,id:e.string,style:e.any,stackChildren:e.bool};const f=t=>{const{appear:n=g.appear,enter:e=g.enter,exit:i=g.exit,transitionEnterDuration:r=g.transitionEnterDuration,transitionExitDuration:a=g.transitionExitDuration,direction:s=g.direction,children:c,...u}=t,d={transitionName:`slide-${s}`};return o.createElement(l,{...d,appear:n,enter:e,exit:i,transitionEnterDuration:r,transitionExitDuration:a,...u},c)},g={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"down"};f.propTypes={children:e.oneOfType([e.arrayOf(e.node),e.node]),childFactory:e.any,className:e.string,direction:e.oneOf(["up","down","left","right"]),component:e.node,id:e.string,style:e.any};const h={position:"absolute",top:"0",left:"0"},D=t=>{const{appear:n=N.appear,enter:e=N.enter,exit:i=N.exit,transitionEnterDuration:r=N.transitionEnterDuration,transitionExitDuration:a=N.transitionExitDuration,stackChildren:s=N.stackChildren,direction:c=N.direction,children:u,...d}=t;return o.createElement(l,{appear:n,enter:e,exit:i,transitionEnterDuration:r,transitionExitDuration:a,stackChildren:s,...d,transitionName:`zoom-${c}`,animationExitingStyle:t.stackChildren?h:void 0},u)},N={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"out",stackChildren:!1};D.propTypes={children:e.oneOfType([e.arrayOf(e.node),e.node]),childFactory:e.any,className:e.string,direction:e.oneOf(["in","out"]),component:e.node,id:e.string,style:e.any,stackChildren:e.bool};const O=t=>{if(!t||!t.ownerDocument.defaultView)return 0;const n=t.ownerDocument.defaultView.getComputedStyle(t),e=parseFloat(n.marginTop),i=parseFloat(n.marginBottom);return t.offsetHeight+e+i},v=t=>{if(!t||!t.ownerDocument.defaultView)return 0;const n=t.ownerDocument.defaultView.getComputedStyle(t),e=parseFloat(n.marginLeft),i=parseFloat(n.marginRight);return t.offsetWidth+e+i},S=(i.animationStyles,t=>{const[n,e]=o.useState(),[i,r]=o.useState(),[a,s]=o.useState({}),{appear:c=b.appear,enter:u=b.enter,exit:d=b.exit,transitionEnterDuration:m=b.transitionEnterDuration,transitionExitDuration:p=b.transitionExitDuration,direction:E=b.direction,children:x,childFactory:y,...f}=t;let g;g="vertical"===E?{maxHeight:n?`${n}px`:""}:{maxWidth:i?`${i}px`:""};const h={maxHeight:g.maxHeight,maxWidth:g.maxWidth};o.useEffect(()=>{t&&a.name&&t[a.name]&&t[a.name].call(void 0,a.event)},[n,i,a]);const D=(t,n)=>{var i;const a=null==(i=t.animatedElement)?void 0:i.firstChild;if(a){const i=O(a),o=v(a);e(i),r(o),s({name:n,event:t})}};return o.createElement(l,{...f,appear:c,enter:u,exit:d,transitionEnterDuration:m,transitionExitDuration:p,childFactory:t=>{const n=y?y(t):t;return n.props.in?n:o.cloneElement(n,{...n.props,style:{...n.props.style,maxHeight:g.maxHeight,maxWidth:g.maxWidth}})},onEnter:n=>{const{onBeforeEnter:e}=t;e&&e.call(void 0,n),D(n,"onEnter")},onEntering:t=>{D(t,"onEntering")},onExit:t=>{D(t,"onExit")},animationEnteringStyle:h,transitionName:`reveal-${E}`},x)}),b={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"vertical"};S.propTypes={children:e.oneOfType([e.arrayOf(e.node),e.node]),childFactory:e.any,className:e.string,direction:e.oneOf(["horizontal","vertical"]),component:e.node,id:e.string,style:e.any};t.Animation=l,t.AnimationChild=s,t.Expand=m,t.Fade=u,t.Push=x,t.Reveal=S,t.Slide=f,t.Zoom=D,t.useAnimation=(t,n)=>{const e=o.useRef(0),i=o.useRef(!1),r=o.useRef(null);o.useEffect(()=>((t=>{const n=t.duration;let i,a;const o=e.current&&1-e.current;t.onStart&&t.onStart();const s=c=>{i||(i=c),a=c-i+1;const l=a/n+o;l<=1?(t.onUpdate&&t.onUpdate(l),r.current=window.requestAnimationFrame(s),e.current=l):(t.onEnd&&t.onEnd(1),e.current=0)};r.current=window.requestAnimationFrame(s)})(t),()=>{r.current&&window.cancelAnimationFrame(r.current)}),n),o.useEffect(()=>{i.current=!0},[])}});

package/package-metadata.mjs

@@ -7,7 +7,7 @@ export const packageMetadata = Object.freeze({
     productName: 'KendoReact',
     productCode: 'KENDOUIREACT',
     productCodes: ['KENDOUIREACT'],
-    publishDate: 0,
-    version: '14.3.0-develop.1',
+    publishDate: 1774616503,
+    version: '14.3.0-develop.11',
     licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/components/my-license/'
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-react-animation",
-  "version": "14.3.0-develop.1",
+  "version": "14.3.0-develop.11",
   "description": "React Animation component assists with animating HTML elements. KendoReact Animation package",
   "author": "Progress",
   "license": "SEE LICENSE IN LICENSE.md",
@@ -26,7 +26,7 @@
   "sideEffects": false,
   "peerDependencies": {
     "@progress/kendo-licensing": "^1.7.2",
-    "@progress/kendo-react-common": "14.3.0-develop.1",
+    "@progress/kendo-react-common": "14.3.0-develop.11",
     "@progress/kendo-svg-icons": "^4.0.0",
     "react": "^18.0.0 || ^19.0.0",
     "react-dom": "^18.0.0 || ^19.0.0",
@@ -61,7 +61,7 @@
     "package": {
       "productName": "KendoReact",
       "productCode": "KENDOUIREACT",
-      "publishDate": 1773393903,
+      "publishDate": 1774616503,
       "licensingDocsUrl": "https://www.telerik.com/kendo-react-ui/components/my-license/"
     }
   },