@progress/kendo-react-animation 8.3.0-develop.3 → 8.3.0-develop.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/Animation.js CHANGED
@@ -5,4 +5,4 @@
5
5
  * Licensed under commercial license. See LICENSE.md in the package root for more information
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
- "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const q=require("react"),e=require("prop-types"),c=require("@progress/kendo-react-common"),C=require("./AnimationChild.js"),R=require("react-transition-group"),N=require("./package-metadata.js"),O=require("./util.js");function P(r){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const n in r)if(n!=="default"){const i=Object.getOwnPropertyDescriptor(r,n);Object.defineProperty(t,n,i.get?i:{enumerable:!0,get:()=>r[n]})}}return t.default=r,Object.freeze(t)}const o=P(q),l=O.styles,a=class a extends o.Component{constructor(t){super(t),c.validatePackage(N.packageMetadata)}render(){const{id:t,style:n,children:i,component:u,className:d,childFactory:p,stackChildren:T,componentChildStyle:m,componentChildClassName:y,...g}=this.props,h={id:t,style:n,component:u,childFactory:p,className:c.classNames(l["animation-container"],l["animation-container-relative"],d)},b=o.Children.map(i||null,f=>o.createElement(C.AnimationChild,{...g,style:m,className:y},f));return o.createElement(R.TransitionGroup,{...h},b)}};a.propTypes={children:e.oneOfType([e.arrayOf(e.node),e.node]),childFactory:e.any,className:e.string,component:e.string,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},a.defaultProps={component:"div"};let s=a;exports.Animation=s;
8
+ "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const q=require("react"),e=require("prop-types"),s=require("@progress/kendo-react-common"),C=require("./AnimationChild.js"),R=require("react-transition-group"),N=require("./package-metadata.js");function O(r){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const n in r)if(n!=="default"){const o=Object.getOwnPropertyDescriptor(r,n);Object.defineProperty(t,n,o.get?o:{enumerable:!0,get:()=>r[n]})}}return t.default=r,Object.freeze(t)}const i=O(q),c=class c extends i.Component{constructor(t){super(t),s.validatePackage(N.packageMetadata)}render(){const{id:t,style:n,children:o,component:l,className:u,childFactory:d,stackChildren:T,componentChildStyle:p,componentChildClassName:m,...y}=this.props,h=this.context&&this.context.uAnimation,g={id:t,style:n,component:l,childFactory:d,className:s.classNames(s.uAnimation.child({c:h}),u)},b=i.Children.map(o||null,f=>i.createElement(C.AnimationChild,{...y,style:p,className:m},f));return i.createElement(R.TransitionGroup,{...g},b)}};c.propTypes={children:e.oneOfType([e.arrayOf(e.node),e.node]),childFactory:e.any,className:e.string,component:e.string,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},c.defaultProps={component:"div"};let a=c;a.contextType=s.UnstyledContext;exports.Animation=a;
package/Animation.mjs CHANGED
@@ -6,74 +6,70 @@
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
8
  "use client";
9
- import * as t from "react";
10
- import e from "prop-types";
11
- import { validatePackage as C, classNames as N } from "@progress/kendo-react-common";
12
- import { AnimationChild as R } from "./AnimationChild.mjs";
13
- import { TransitionGroup as g } from "react-transition-group";
14
- import { packageMetadata as q } from "./package-metadata.mjs";
15
- import b from "./util.mjs";
16
- const i = b.styles, r = class r extends t.Component {
17
- constructor(o) {
18
- super(o), C(q);
9
+ import * as e from "react";
10
+ import t from "prop-types";
11
+ import { validatePackage as x, classNames as C, uAnimation as N, UnstyledContext as R } from "@progress/kendo-react-common";
12
+ import { AnimationChild as g } from "./AnimationChild.mjs";
13
+ import { TransitionGroup as q } from "react-transition-group";
14
+ import { packageMetadata as b } from "./package-metadata.mjs";
15
+ const o = class o extends e.Component {
16
+ constructor(n) {
17
+ super(n), x(b);
19
18
  }
20
19
  /**
21
20
  * @hidden
22
21
  */
23
22
  render() {
24
23
  const {
25
- id: o,
26
- style: s,
27
- children: a,
28
- component: c,
29
- className: l,
30
- childFactory: m,
31
- stackChildren: x,
32
- componentChildStyle: p,
33
- componentChildClassName: d,
34
- ...u
35
- } = this.props, y = {
36
- id: o,
37
- style: s,
38
- component: c,
39
- childFactory: m,
40
- className: N(
41
- i["animation-container"],
42
- i["animation-container-relative"],
43
- l
44
- )
45
- }, h = t.Children.map(a || null, (f) => /* @__PURE__ */ t.createElement(
46
- R,
24
+ id: n,
25
+ style: i,
26
+ children: s,
27
+ component: a,
28
+ className: c,
29
+ childFactory: l,
30
+ stackChildren: T,
31
+ componentChildStyle: m,
32
+ componentChildClassName: p,
33
+ ...d
34
+ } = this.props, u = this.context && this.context.uAnimation, h = {
35
+ id: n,
36
+ style: i,
37
+ component: a,
38
+ childFactory: l,
39
+ className: C(N.child({ c: u }), c)
40
+ }, y = e.Children.map(s || null, (f) => /* @__PURE__ */ e.createElement(
41
+ g,
47
42
  {
48
- ...u,
49
- style: p,
50
- className: d
43
+ ...d,
44
+ style: m,
45
+ className: p
51
46
  },
52
47
  f
53
48
  ));
54
- return /* @__PURE__ */ t.createElement(g, { ...y }, h);
49
+ return /* @__PURE__ */ e.createElement(q, { ...h }, y);
55
50
  }
56
51
  };
57
- r.propTypes = {
58
- children: e.oneOfType([
59
- e.arrayOf(e.node),
60
- e.node
52
+ o.propTypes = {
53
+ children: t.oneOfType([
54
+ t.arrayOf(t.node),
55
+ t.node
61
56
  ]),
62
- childFactory: e.any,
63
- className: e.string,
64
- component: e.string,
65
- id: e.string,
66
- style: e.any,
67
- transitionName: e.string.isRequired,
68
- appear: e.bool.isRequired,
69
- enter: e.bool.isRequired,
70
- exit: e.bool.isRequired,
71
- transitionEnterDuration: e.number.isRequired,
72
- transitionExitDuration: e.number.isRequired
73
- }, r.defaultProps = {
57
+ childFactory: t.any,
58
+ className: t.string,
59
+ component: t.string,
60
+ id: t.string,
61
+ style: t.any,
62
+ transitionName: t.string.isRequired,
63
+ appear: t.bool.isRequired,
64
+ enter: t.bool.isRequired,
65
+ exit: t.bool.isRequired,
66
+ transitionEnterDuration: t.number.isRequired,
67
+ transitionExitDuration: t.number.isRequired
68
+ }, o.defaultProps = {
74
69
  component: "div"
75
70
  };
76
- let n = r;
71
+ let r = o;
72
+ r.contextType = R;
77
73
  export {
78
- n as Animation
74
+ r as Animation
79
75
  };
package/AnimationChild.js CHANGED
@@ -5,4 +5,4 @@
5
5
  * Licensed under commercial license. See LICENSE.md in the package root for more information
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
- "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const M=require("react"),e=require("prop-types"),n=require("@progress/kendo-react-common"),w=require("react-transition-group"),z=require("./util.js");function G(a){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(a){for(const o in a)if(o!=="default"){const s=Object.getOwnPropertyDescriptor(a,o);Object.defineProperty(r,o,s.get?s:{enumerable:!0,get:()=>a[o]})}}return r.default=a,Object.freeze(r)}const l=G(M),i=z.styles,c=class c extends l.Component{constructor(){super(...arguments),this.elementRef=l.createRef()}get element(){return this.elementRef.current}render(){const{children:r,style:o,appear:s,enter:b,exit:S,transitionName:t,transitionEnterDuration:u,transitionExitDuration:d,className:v,onEnter:E,onEntering:p,onEntered:x,onExit:g,onExiting:f,onExited:y,onAfterExited:h,mountOnEnter:O,unmountOnExit:$,animationEnteringStyle:R,animationEnteredStyle:j,animationExitingStyle:D,animationExitedStyle:N,...q}=this.props,T=n.classNames(v,i["child-animation-container"]),P={transitionDelay:"0ms",...o},A={entering:{transitionDuration:`${u}ms`,...R},entered:{...j},exiting:{transitionDuration:`${d}ms`,...D},exited:{...N}},C={in:this.props.in,appear:s,enter:b,exit:S,mountOnEnter:O,unmountOnExit:$,timeout:{enter:u,exit:d},onEnter:()=>{E&&E.call(void 0,{animatedElement:this.element,target:this})},onEntering:()=>{p&&p.call(void 0,{animatedElement:this.element,target:this})},onEntered:()=>{x&&x.call(void 0,{animatedElement:this.element,target:this})},onExit:()=>{g&&g.call(void 0,{animatedElement:this.element,target:this})},onExiting:()=>{f&&f.call(void 0,{animatedElement:this.element,target:this})},onExited:()=>{h&&h.call(void 0,{animatedElement:this.element,target:this}),y&&y.call(void 0,{animatedElement:this.element,target:this})},classNames:{appear:i[`${t}-appear`]||`${t}-appear`,appearActive:i[`${t}-appear-active`]||`${t}-appear-active`,enter:i[`${t}-enter`]||`${t}-enter`,enterActive:i[`${t}-enter-active`]||`${t}-enter-active`,exit:i[`${t}-exit`]||`${t}-exit`,exitActive:i[`${t}-exit-active`]||`${t}-exit-active`}};return l.createElement(w.CSSTransition,{...C,...q,nodeRef:this.elementRef},k=>l.createElement("div",{style:{...P,...A[k]},className:T,ref:this.elementRef},r))}};c.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},c.defaultProps={mountOnEnter:!0,unmountOnExit:!1,onEnter:n.noop,onEntering:n.noop,onEntered:n.noop,onExit:n.noop,onExiting:n.noop,onExited:n.noop,onAfterExited:n.noop,animationEnteringStyle:{},animationEnteredStyle:{},animationExitingStyle:{},animationExitedStyle:{}};let m=c;exports.AnimationChild=m;
8
+ "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const $=require("react"),e=require("prop-types"),t=require("@progress/kendo-react-common"),w=require("react-transition-group");function z(a){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(a){for(const i in a)if(i!=="default"){const s=Object.getOwnPropertyDescriptor(a,i);Object.defineProperty(r,i,s.get?s:{enumerable:!0,get:()=>a[i]})}}return r.default=a,Object.freeze(r)}const l=z($),c=class c extends l.Component{constructor(){super(...arguments),this.elementRef=l.createRef()}get element(){return this.elementRef.current}render(){const{children:r,style:i,appear:s,enter:b,exit:S,transitionName:o,transitionEnterDuration:u,transitionExitDuration:d,className:v,onEnter:E,onEntering:p,onEntered:x,onExit:g,onExiting:f,onExited:y,onAfterExited:h,mountOnEnter:A,unmountOnExit:N,animationEnteringStyle:O,animationEnteredStyle:R,animationExitingStyle:j,animationExitedStyle:D,...T}=this.props,n=this.context&&this.context.uAnimation,q=t.classNames(v,t.uAnimation.childContainer({c:n})),P={transitionDelay:"0ms",...i},C={entering:{transitionDuration:`${u}ms`,...O},entered:{...R},exiting:{transitionDuration:`${d}ms`,...j},exited:{...D}},k={in:this.props.in,appear:s,enter:b,exit:S,mountOnEnter:A,unmountOnExit:N,timeout:{enter:u,exit:d},onEnter:()=>{E&&E.call(void 0,{animatedElement:this.element,target:this})},onEntering:()=>{p&&p.call(void 0,{animatedElement:this.element,target:this})},onEntered:()=>{x&&x.call(void 0,{animatedElement:this.element,target:this})},onExit:()=>{g&&g.call(void 0,{animatedElement:this.element,target:this})},onExiting:()=>{f&&f.call(void 0,{animatedElement:this.element,target:this})},onExited:()=>{h&&h.call(void 0,{animatedElement:this.element,target:this}),y&&y.call(void 0,{animatedElement:this.element,target:this})},classNames:{appear:t.classNames(t.uAnimation.appear({c:n,transitionName:o})),appearActive:t.classNames(t.uAnimation.appearActive({c:n,transitionName:o})),enter:t.classNames(t.uAnimation.enter({c:n,transitionName:o})),enterActive:t.classNames(t.uAnimation.enterActive({c:n,transitionName:o})),exit:t.classNames(t.uAnimation.exit({c:n,transitionName:o})),exitActive:t.classNames(t.uAnimation.exitActive({c:n,transitionName:o}))}};return l.createElement(w.CSSTransition,{...k,...T,nodeRef:this.elementRef},M=>l.createElement("div",{style:{...P,...C[M]},className:q,ref:this.elementRef},r))}};c.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},c.defaultProps={mountOnEnter:!0,unmountOnExit:!1,onEnter:t.noop,onEntering:t.noop,onEntered:t.noop,onExit:t.noop,onExiting:t.noop,onExited:t.noop,onAfterExited:t.noop,animationEnteringStyle:{},animationEnteredStyle:{},animationExitingStyle:{},animationExitedStyle:{}};let m=c;m.contextType=t.UnstyledContext;exports.AnimationChild=m;
@@ -6,14 +6,13 @@
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
8
  "use client";
9
- import * as a from "react";
9
+ import * as r from "react";
10
10
  import t from "prop-types";
11
- import { noop as n, classNames as M } from "@progress/kendo-react-common";
12
- import { CSSTransition as k } from "react-transition-group";
13
- import w from "./util.mjs";
14
- const i = w.styles, o = class o extends a.Component {
11
+ import { noop as n, classNames as i, uAnimation as o, UnstyledContext as w } from "@progress/kendo-react-common";
12
+ import { CSSTransition as z } from "react-transition-group";
13
+ const s = class s extends r.Component {
15
14
  constructor() {
16
- super(...arguments), this.elementRef = a.createRef();
15
+ super(...arguments), this.elementRef = r.createRef();
17
16
  }
18
17
  /**
19
18
  * The element that is being animated.
@@ -26,93 +25,90 @@ const i = w.styles, o = class o extends a.Component {
26
25
  */
27
26
  render() {
28
27
  const {
29
- children: f,
30
- style: g,
31
- appear: h,
32
- enter: y,
33
- exit: v,
34
- transitionName: e,
35
- transitionEnterDuration: r,
36
- transitionExitDuration: s,
37
- className: S,
38
- onEnter: l,
39
- onEntering: m,
40
- onEntered: E,
41
- onExit: c,
42
- onExiting: d,
43
- onExited: p,
44
- onAfterExited: x,
45
- mountOnEnter: $,
46
- unmountOnExit: b,
47
- animationEnteringStyle: R,
48
- animationEnteredStyle: N,
49
- animationExitingStyle: O,
50
- animationExitedStyle: D,
51
- ...j
52
- } = this.props, T = M(
53
- S,
54
- i["child-animation-container"]
55
- ), q = {
28
+ children: g,
29
+ style: y,
30
+ appear: S,
31
+ enter: v,
32
+ exit: b,
33
+ transitionName: a,
34
+ transitionEnterDuration: m,
35
+ transitionExitDuration: c,
36
+ className: R,
37
+ onEnter: E,
38
+ onEntering: d,
39
+ onEntered: x,
40
+ onExit: u,
41
+ onExiting: p,
42
+ onExited: h,
43
+ onAfterExited: f,
44
+ mountOnEnter: A,
45
+ unmountOnExit: N,
46
+ animationEnteringStyle: O,
47
+ animationEnteredStyle: D,
48
+ animationExitingStyle: T,
49
+ animationExitedStyle: j,
50
+ ...q
51
+ } = this.props, e = this.context && this.context.uAnimation, C = i(R, o.childContainer({ c: e })), P = {
56
52
  transitionDelay: "0ms",
57
- ...g
58
- }, A = {
59
- entering: { transitionDuration: `${r}ms`, ...R },
60
- entered: { ...N },
61
- exiting: { transitionDuration: `${s}ms`, ...O },
62
- exited: { ...D }
63
- }, P = {
53
+ ...y
54
+ }, $ = {
55
+ entering: { transitionDuration: `${m}ms`, ...O },
56
+ entered: { ...D },
57
+ exiting: { transitionDuration: `${c}ms`, ...T },
58
+ exited: { ...j }
59
+ }, U = {
64
60
  in: this.props.in,
65
- appear: h,
66
- enter: y,
67
- exit: v,
68
- mountOnEnter: $,
69
- unmountOnExit: b,
61
+ appear: S,
62
+ enter: v,
63
+ exit: b,
64
+ mountOnEnter: A,
65
+ unmountOnExit: N,
70
66
  timeout: {
71
- enter: r,
72
- exit: s
67
+ enter: m,
68
+ exit: c
73
69
  },
74
70
  onEnter: () => {
75
- l && l.call(void 0, { animatedElement: this.element, target: this });
71
+ E && E.call(void 0, { animatedElement: this.element, target: this });
76
72
  },
77
73
  onEntering: () => {
78
- m && m.call(void 0, { animatedElement: this.element, target: this });
74
+ d && d.call(void 0, { animatedElement: this.element, target: this });
79
75
  },
80
76
  onEntered: () => {
81
- E && E.call(void 0, { animatedElement: this.element, target: this });
77
+ x && x.call(void 0, { animatedElement: this.element, target: this });
82
78
  },
83
79
  onExit: () => {
84
- c && c.call(void 0, { animatedElement: this.element, target: this });
80
+ u && u.call(void 0, { animatedElement: this.element, target: this });
85
81
  },
86
82
  onExiting: () => {
87
- d && d.call(void 0, { animatedElement: this.element, target: this });
83
+ p && p.call(void 0, { animatedElement: this.element, target: this });
88
84
  },
89
85
  onExited: () => {
90
- x && x.call(void 0, { animatedElement: this.element, target: this }), p && p.call(void 0, { animatedElement: this.element, target: this });
86
+ f && f.call(void 0, { animatedElement: this.element, target: this }), h && h.call(void 0, { animatedElement: this.element, target: this });
91
87
  },
92
88
  classNames: {
93
- appear: i[`${e}-appear`] || `${e}-appear`,
94
- appearActive: i[`${e}-appear-active`] || `${e}-appear-active`,
95
- enter: i[`${e}-enter`] || `${e}-enter`,
96
- enterActive: i[`${e}-enter-active`] || `${e}-enter-active`,
97
- exit: i[`${e}-exit`] || `${e}-exit`,
98
- exitActive: i[`${e}-exit-active`] || `${e}-exit-active`
89
+ appear: i(o.appear({ c: e, transitionName: a })),
90
+ appearActive: i(o.appearActive({ c: e, transitionName: a })),
91
+ enter: i(o.enter({ c: e, transitionName: a })),
92
+ enterActive: i(o.enterActive({ c: e, transitionName: a })),
93
+ exit: i(o.exit({ c: e, transitionName: a })),
94
+ exitActive: i(o.exitActive({ c: e, transitionName: a }))
99
95
  }
100
96
  };
101
- return /* @__PURE__ */ a.createElement(k, { ...P, ...j, nodeRef: this.elementRef }, (C) => /* @__PURE__ */ a.createElement(
97
+ return /* @__PURE__ */ r.createElement(z, { ...U, ...q, nodeRef: this.elementRef }, (k) => /* @__PURE__ */ r.createElement(
102
98
  "div",
103
99
  {
104
100
  style: {
105
- ...q,
106
- ...A[C]
101
+ ...P,
102
+ ...$[k]
107
103
  },
108
- className: T,
104
+ className: C,
109
105
  ref: this.elementRef
110
106
  },
111
- f
107
+ g
112
108
  ));
113
109
  }
114
110
  };
115
- o.propTypes = {
111
+ s.propTypes = {
116
112
  in: t.bool,
117
113
  children: t.oneOfType([
118
114
  t.arrayOf(t.node),
@@ -131,7 +127,7 @@ o.propTypes = {
131
127
  animationEnteredStyle: t.object,
132
128
  animationExitingStyle: t.object,
133
129
  animationExitedStyle: t.object
134
- }, o.defaultProps = {
130
+ }, s.defaultProps = {
135
131
  mountOnEnter: !0,
136
132
  unmountOnExit: !1,
137
133
  onEnter: n,
@@ -146,7 +142,8 @@ o.propTypes = {
146
142
  animationExitingStyle: {},
147
143
  animationExitedStyle: {}
148
144
  };
149
- let u = o;
145
+ let l = s;
146
+ l.contextType = w;
150
147
  export {
151
- u as AnimationChild
148
+ l as AnimationChild
152
149
  };
@@ -5,4 +5,4 @@
5
5
  * Licensed under commercial license. See LICENSE.md in the package root for more information
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
- !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(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"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactAnimation={},e.React,e.PropTypes,e.KendoReactCommon,e.ReactTransitionGroup)}(this,(function(e,t,i,n,a){"use strict";function r(e){var t=Object.create(null);return e&&Object.keys(e).forEach((function(i){if("default"!==i){var n=Object.getOwnPropertyDescriptor(e,i);Object.defineProperty(t,i,n.get?n:{enumerable:!0,get:function(){return e[i]}})}})),t.default=e,Object.freeze(t)}var o=r(t);const s=e=>{if(!e||!e.ownerDocument.defaultView)return 0;const t=e.ownerDocument.defaultView.getComputedStyle(e),i=parseFloat(t.marginTop),n=parseFloat(t.marginBottom);return e.offsetHeight+i+n},p=e=>{if(!e||!e.ownerDocument.defaultView)return 0;const t=e.ownerDocument.defaultView.getComputedStyle(e),i=parseFloat(t.marginLeft),n=parseFloat(t.marginRight);return e.offsetWidth+i+n},l={"animation-container":"k-animation-container","animation-container-shown":"k-animation-container-shown","animation-container-relative":"k-animation-container-relative","animation-container-fixed":"k-animation-container-fixed","push-right-enter":"k-push-right-enter","push-right-appear":"k-push-right-appear","push-right-enter-active":"k-push-right-enter-active","push-right-appear-active":"k-push-right-appear-active","push-right-exit":"k-push-right-exit","push-right-exit-active":"k-push-right-exit-active","push-left-enter":"k-push-left-enter","push-left-appear":"k-push-left-appear","push-left-enter-active":"k-push-left-enter-active","push-left-appear-active":"k-push-left-appear-active","push-left-exit":"k-push-left-exit","push-left-exit-active":"k-push-left-exit-active","push-down-enter":"k-push-down-enter","push-down-appear":"k-push-down-appear","push-down-enter-active":"k-push-down-enter-active","push-down-appear-active":"k-push-down-appear-active","push-down-exit":"k-push-down-exit","push-down-exit-active":"k-push-down-exit-active","push-up-enter":"k-push-up-enter","push-up-appear":"k-push-up-appear","push-up-enter-active":"k-push-up-enter-active","push-up-appear-active":"k-push-up-appear-active","push-up-exit":"k-push-up-exit","push-up-exit-active":"k-push-up-exit-active",expand:"k-expand","expand-vertical-enter":"k-expand-vertical-enter","expand-vertical-appear":"k-expand-vertical-appear","expand-vertical-enter-active":"k-expand-vertical-enter-active","expand-vertical-appear-active":"k-expand-vertical-appear-active","expand-vertical-exit":"k-expand-vertical-exit","expand-vertical-exit-active":"k-expand-vertical-exit-active","expand-horizontal-enter":"k-expand-horizontal-enter","expand-horizontal-appear":"k-expand-horizontal-appear","expand-horizontal-enter-active":"k-expand-horizontal-enter-active","expand-horizontal-appear-active":"k-expand-horizontal-appear-active","expand-horizontal-exit":"k-expand-horizontal-exit","expand-horizontal-exit-active":"k-expand-horizontal-exit-active","child-animation-container":"k-child-animation-container","fade-enter":"k-fade-enter","fade-appear":"k-fade-appear","fade-enter-active":"k-fade-enter-active","fade-appear-active":"k-fade-appear-active","fade-exit":"k-fade-exit","fade-exit-active":"k-fade-exit-active","zoom-in-enter":"k-zoom-in-enter","zoom-in-appear":"k-zoom-in-appear","zoom-in-enter-active":"k-zoom-in-enter-active","zoom-in-appear-active":"k-zoom-in-appear-active","zoom-in-exit":"k-zoom-in-exit","zoom-in-exit-active":"k-zoom-in-exit-active","zoom-out-enter":"k-zoom-out-enter","zoom-out-appear":"k-zoom-out-appear","zoom-out-enter-active":"k-zoom-out-enter-active","zoom-out-appear-active":"k-zoom-out-appear-active","zoom-out-exit":"k-zoom-out-exit","zoom-out-exit-active":"k-zoom-out-exit-active","slide-in-appear":"k-slide-in-appear",centered:"k-centered","slide-in-appear-active":"k-slide-in-appear-active","slide-down-enter":"k-slide-down-enter","slide-down-appear":"k-slide-down-appear","slide-down-enter-active":"k-slide-down-enter-active","slide-down-appear-active":"k-slide-down-appear-active","slide-down-exit":"k-slide-down-exit","slide-down-exit-active":"k-slide-down-exit-active","slide-up-enter":"k-slide-up-enter","slide-up-appear":"k-slide-up-appear","slide-up-enter-active":"k-slide-up-enter-active","slide-up-appear-active":"k-slide-up-appear-active","slide-up-exit":"k-slide-up-exit","slide-up-exit-active":"k-slide-up-exit-active","slide-right-enter":"k-slide-right-enter","slide-right-appear":"k-slide-right-appear","slide-right-enter-active":"k-slide-right-enter-active","slide-right-appear-active":"k-slide-right-appear-active","slide-right-exit":"k-slide-right-exit","slide-right-exit-active":"k-slide-right-exit-active","slide-left-enter":"k-slide-left-enter","slide-left-appear":"k-slide-left-appear","slide-left-enter-active":"k-slide-left-enter-active","slide-left-appear-active":"k-slide-left-appear-active","slide-left-exit":"k-slide-left-exit","slide-left-exit-active":"k-slide-left-exit-active","reveal-vertical-enter":"k-reveal-vertical-enter","reveal-vertical-appear":"k-reveal-vertical-appear","reveal-vertical-enter-active":"k-reveal-vertical-enter-active","reveal-vertical-appear-active":"k-reveal-vertical-appear-active","reveal-vertical-exit":"k-reveal-vertical-exit","reveal-vertical-exit-active":"k-reveal-vertical-exit-active","reveal-horizontal-enter":"k-reveal-horizontal-enter","reveal-horizontal-appear":"k-reveal-horizontal-appear","reveal-horizontal-enter-active":"k-reveal-horizontal-enter-active","reveal-horizontal-appear-active":"k-reveal-horizontal-appear-active","reveal-horizontal-exit":"k-reveal-horizontal-exit","reveal-horizontal-exit-active":"k-reveal-horizontal-exit-active"},c=l,d=class extends o.Component{constructor(){super(...arguments),this.elementRef=o.createRef()}get element(){return this.elementRef.current}render(){const{children:e,style:t,appear:i,enter:r,exit:s,transitionName:p,transitionEnterDuration:l,transitionExitDuration:d,className:u,onEnter:m,onEntering:h,onEntered:v,onExit:x,onExiting:f,onExited:k,onAfterExited:g,mountOnEnter:E,unmountOnExit:y,animationEnteringStyle:z,animationEnteredStyle:w,animationExitingStyle:O,animationExitedStyle:D,...C}=this.props,b=n.classNames(u,c["child-animation-container"]),N={transitionDelay:"0ms",...t},R={entering:{transitionDuration:`${l}ms`,...z},entered:{...w},exiting:{transitionDuration:`${d}ms`,...O},exited:{...D}},T={in:this.props.in,appear:i,enter:r,exit:s,mountOnEnter:E,unmountOnExit:y,timeout:{enter:l,exit:d},onEnter:()=>{m&&m.call(void 0,{animatedElement:this.element,target:this})},onEntering:()=>{h&&h.call(void 0,{animatedElement:this.element,target:this})},onEntered:()=>{v&&v.call(void 0,{animatedElement:this.element,target:this})},onExit:()=>{x&&x.call(void 0,{animatedElement:this.element,target:this})},onExiting:()=>{f&&f.call(void 0,{animatedElement:this.element,target:this})},onExited:()=>{g&&g.call(void 0,{animatedElement:this.element,target:this}),k&&k.call(void 0,{animatedElement:this.element,target:this})},classNames:{appear:c[`${p}-appear`]||`${p}-appear`,appearActive:c[`${p}-appear-active`]||`${p}-appear-active`,enter:c[`${p}-enter`]||`${p}-enter`,enterActive:c[`${p}-enter-active`]||`${p}-enter-active`,exit:c[`${p}-exit`]||`${p}-exit`,exitActive:c[`${p}-exit-active`]||`${p}-exit-active`}};return o.createElement(a.CSSTransition,{...T,...C,nodeRef:this.elementRef},(t=>o.createElement("div",{style:{...N,...R[t]},className:b,ref:this.elementRef},e)))}};d.propTypes={in:i.bool,children:i.oneOfType([i.arrayOf(i.node),i.node]),transitionName:i.string.isRequired,className:i.string,appear:i.bool,enter:i.bool,exit:i.bool,transitionEnterDuration:i.number.isRequired,transitionExitDuration:i.number.isRequired,mountOnEnter:i.bool,unmountOnExit:i.bool,animationEnteringStyle:i.object,animationEnteredStyle:i.object,animationExitingStyle:i.object,animationExitedStyle:i.object},d.defaultProps={mountOnEnter:!0,unmountOnExit:!1,onEnter:n.noop,onEntering:n.noop,onEntered:n.noop,onExit:n.noop,onExiting:n.noop,onExited:n.noop,onAfterExited:n.noop,animationEnteringStyle:{},animationEnteredStyle:{},animationExitingStyle:{},animationExitedStyle:{}};let u=d;const m={name:"@progress/kendo-react-animation",productName:"KendoReact",productCodes:["KENDOUIREACT","KENDOUICOMPLETE"],publishDate:0,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"},h=l,v=class extends o.Component{constructor(e){super(e),n.validatePackage(m)}render(){const{id:e,style:t,children:i,component:r,className:s,childFactory:p,stackChildren:l,componentChildStyle:c,componentChildClassName:d,...m}=this.props,v={id:e,style:t,component:r,childFactory:p,className:n.classNames(h["animation-container"],h["animation-container-relative"],s)},x=o.Children.map(i||null,(e=>o.createElement(u,{...m,style:c,className:d},e)));return o.createElement(a.TransitionGroup,{...v},x)}};v.propTypes={children:i.oneOfType([i.arrayOf(i.node),i.node]),childFactory:i.any,className:i.string,component:i.string,id:i.string,style:i.any,transitionName:i.string.isRequired,appear:i.bool.isRequired,enter:i.bool.isRequired,exit:i.bool.isRequired,transitionEnterDuration:i.number.isRequired,transitionExitDuration:i.number.isRequired},v.defaultProps={component:"div"};let x=v;const f=class extends o.Component{render(){const{children:e,...t}=this.props;return o.createElement(x,{transitionName:"fade",...t},e)}};f.propTypes={children:i.oneOfType([i.arrayOf(i.node),i.node]),childFactory:i.any,className:i.string,component:i.string,id:i.string,style:i.any},f.defaultProps={appear:!1,enter:!0,exit:!1,transitionEnterDuration:500,transitionExitDuration:500};let k=f;const g=class extends o.Component{render(){const{direction:e,children:t,...i}=this.props,n={transitionName:`expand-${e}`};return o.createElement(x,{...n,...i},t)}};g.propTypes={children:i.oneOfType([i.arrayOf(i.node),i.node]),childFactory:i.any,className:i.string,direction:i.oneOf(["horizontal","vertical"]),component:i.string,id:i.string,style:i.any},g.defaultProps={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"vertical"};let E=g;const y={position:"absolute",top:"0",left:"0"},z=class extends o.Component{render(){const{children:e,direction:t,...i}=this.props;return o.createElement(x,{...i,transitionName:`push-${t}`,animationExitingStyle:this.props.stackChildren?y:void 0},e)}};z.propTypes={children:i.oneOfType([i.arrayOf(i.node),i.node]),childFactory:i.any,className:i.string,direction:i.oneOf(["up","down","left","right"]),component:i.string,id:i.string,style:i.any,stackChildren:i.bool},z.defaultProps={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"right",stackChildren:!1};let w=z;const O=class extends o.Component{render(){const{direction:e,children:t,...i}=this.props,n={transitionName:`slide-${e}`};return o.createElement(x,{...n,...i},t)}};O.propTypes={children:i.oneOfType([i.arrayOf(i.node),i.node]),childFactory:i.any,className:i.string,direction:i.oneOf(["up","down","left","right"]),component:i.string,id:i.string,style:i.any},O.defaultProps={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"down"};let D=O;const C={position:"absolute",top:"0",left:"0"},b=class extends o.Component{render(){const{children:e,direction:t,...i}=this.props;return o.createElement(x,{...i,transitionName:`zoom-${t}`,animationExitingStyle:this.props.stackChildren?C:void 0},e)}};b.propTypes={children:i.oneOfType([i.arrayOf(i.node),i.node]),childFactory:i.any,className:i.string,direction:i.oneOf(["in","out"]),component:i.string,id:i.string,style:i.any,stackChildren:i.bool},b.defaultProps={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"out",stackChildren:!1};let N=b;const R=class extends o.Component{constructor(){super(...arguments),this.state={maxHeight:void 0,maxWidth:void 0},this.componentWillEnter=e=>{const{onEnter:t,onBeforeEnter:i}=this.props;i&&i.call(void 0,e),this.updateContainerDimensions(e.animatedElement,(()=>{t&&t.call(void 0,e)}))},this.componentIsEntering=e=>{const{onEntering:t}=this.props;this.updateContainerDimensions(e.animatedElement,(()=>{t&&t.call(void 0,e)}))},this.componentWillExit=e=>{const{onExit:t}=this.props;this.updateContainerDimensions(e.animatedElement,(()=>{t&&t.call(void 0,e)}))},this.updateContainerDimensions=(e,t=n.noop)=>{const i=e.firstChild;if(i){const e=s(i),n=p(i);this.setState({maxHeight:e,maxWidth:n},t)}}}render(){const{direction:e,children:t,childFactory:i,...n}=this.props,{maxHeight:a,maxWidth:r}=this.state;let s;s="vertical"===e?{maxHeight:a?`${a}px`:""}:{maxWidth:r?`${r}px`:""};const p={maxHeight:s.maxHeight,maxWidth:s.maxWidth};return o.createElement(x,{...n,childFactory:e=>{let t=i?i(e):e;return t.props.in?t:o.cloneElement(t,{...t.props,style:{...t.props.style,maxHeight:s.maxHeight,maxWidth:s.maxWidth}})},onEnter:this.componentWillEnter,onEntering:this.componentIsEntering,onExit:this.componentWillExit,animationEnteringStyle:p,transitionName:`reveal-${e}`},t)}};R.propTypes={children:i.oneOfType([i.arrayOf(i.node),i.node]),childFactory:i.any,className:i.string,direction:i.oneOf(["horizontal","vertical"]),component:i.string,id:i.string,style:i.any},R.defaultProps={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"vertical"};let T=R;e.Animation=x,e.AnimationChild=u,e.Expand=E,e.Fade=k,e.Push=w,e.Reveal=T,e.Slide=D,e.Zoom=N,e.useAnimation=(e,t)=>{const i=o.useRef(0),n=o.useRef(!1),a=o.useRef();o.useEffect((()=>((e=>{const t=e.duration;let n,r,o=i.current&&1-i.current;e.onStart&&e.onStart();const s=p=>{n||(n=p),r=p-n+1;const l=r/t+o;l<=1?(e.onUpdate&&e.onUpdate(l),a.current=window.requestAnimationFrame(s),i.current=l):(e.onEnd&&e.onEnd(1),i.current=0)};a.current=window.requestAnimationFrame(s)})(e),()=>{a.current&&window.cancelAnimationFrame(a.current)})),t),o.useEffect((()=>{n.current=!0}),[])}}));
8
+ !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(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"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).KendoReactAnimation={},t.React,t.PropTypes,t.KendoReactCommon,t.ReactTransitionGroup)}(this,(function(t,e,n,i,o){"use strict";function r(t){var e=Object.create(null);return t&&Object.keys(t).forEach((function(n){if("default"!==n){var i=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(e,n,i.get?i:{enumerable:!0,get:function(){return t[n]}})}})),e.default=t,Object.freeze(e)}var a=r(e);const s=class extends a.Component{constructor(){super(...arguments),this.elementRef=a.createRef()}get element(){return this.elementRef.current}render(){const{children:t,style:e,appear:n,enter:r,exit:s,transitionName:c,transitionEnterDuration:l,transitionExitDuration:d,className:m,onEnter:p,onEntering:u,onEntered:h,onExit:E,onExiting:y,onExited:x,onAfterExited:f,mountOnEnter:g,unmountOnExit:N,animationEnteringStyle:O,animationEnteredStyle:v,animationExitingStyle:C,animationExitedStyle:D,...b}=this.props,T=this.context&&this.context.uAnimation,A=i.classNames(m,i.uAnimation.childContainer({c:T})),R={transitionDelay:"0ms",...e},S={entering:{transitionDuration:`${l}ms`,...O},entered:{...v},exiting:{transitionDuration:`${d}ms`,...C},exited:{...D}},w={in:this.props.in,appear:n,enter:r,exit:s,mountOnEnter:g,unmountOnExit:N,timeout:{enter:l,exit:d},onEnter:()=>{p&&p.call(void 0,{animatedElement:this.element,target:this})},onEntering:()=>{u&&u.call(void 0,{animatedElement:this.element,target:this})},onEntered:()=>{h&&h.call(void 0,{animatedElement:this.element,target:this})},onExit:()=>{E&&E.call(void 0,{animatedElement:this.element,target:this})},onExiting:()=>{y&&y.call(void 0,{animatedElement:this.element,target:this})},onExited:()=>{f&&f.call(void 0,{animatedElement:this.element,target:this}),x&&x.call(void 0,{animatedElement:this.element,target:this})},classNames:{appear:i.classNames(i.uAnimation.appear({c:T,transitionName:c})),appearActive:i.classNames(i.uAnimation.appearActive({c:T,transitionName:c})),enter:i.classNames(i.uAnimation.enter({c:T,transitionName:c})),enterActive:i.classNames(i.uAnimation.enterActive({c:T,transitionName:c})),exit:i.classNames(i.uAnimation.exit({c:T,transitionName:c})),exitActive:i.classNames(i.uAnimation.exitActive({c:T,transitionName:c}))}};return a.createElement(o.CSSTransition,{...w,...b,nodeRef:this.elementRef},(e=>a.createElement("div",{style:{...R,...S[e]},className:A,ref:this.elementRef},t)))}};s.propTypes={in:n.bool,children:n.oneOfType([n.arrayOf(n.node),n.node]),transitionName:n.string.isRequired,className:n.string,appear:n.bool,enter:n.bool,exit:n.bool,transitionEnterDuration:n.number.isRequired,transitionExitDuration:n.number.isRequired,mountOnEnter:n.bool,unmountOnExit:n.bool,animationEnteringStyle:n.object,animationEnteredStyle:n.object,animationExitingStyle:n.object,animationExitedStyle:n.object},s.defaultProps={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:{}};let c=s;c.contextType=i.UnstyledContext;const l={name:"@progress/kendo-react-animation",productName:"KendoReact",productCodes:["KENDOUIREACT","KENDOUICOMPLETE"],publishDate:0,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"},d=class extends a.Component{constructor(t){super(t),i.validatePackage(l)}render(){const{id:t,style:e,children:n,component:r,className:s,childFactory:l,stackChildren:d,componentChildStyle:m,componentChildClassName:p,...u}=this.props,h=this.context&&this.context.uAnimation,E={id:t,style:e,component:r,childFactory:l,className:i.classNames(i.uAnimation.child({c:h}),s)},y=a.Children.map(n||null,(t=>a.createElement(c,{...u,style:m,className:p},t)));return a.createElement(o.TransitionGroup,{...E},y)}};d.propTypes={children:n.oneOfType([n.arrayOf(n.node),n.node]),childFactory:n.any,className:n.string,component:n.string,id:n.string,style:n.any,transitionName:n.string.isRequired,appear:n.bool.isRequired,enter:n.bool.isRequired,exit:n.bool.isRequired,transitionEnterDuration:n.number.isRequired,transitionExitDuration:n.number.isRequired},d.defaultProps={component:"div"};let m=d;m.contextType=i.UnstyledContext;const p=class extends a.Component{render(){const{children:t,...e}=this.props;return a.createElement(m,{transitionName:"fade",...e},t)}};p.propTypes={children:n.oneOfType([n.arrayOf(n.node),n.node]),childFactory:n.any,className:n.string,component:n.string,id:n.string,style:n.any},p.defaultProps={appear:!1,enter:!0,exit:!1,transitionEnterDuration:500,transitionExitDuration:500};let u=p;const h=class extends a.Component{render(){const{direction:t,children:e,...n}=this.props,i={transitionName:`expand-${t}`};return a.createElement(m,{...i,...n},e)}};h.propTypes={children:n.oneOfType([n.arrayOf(n.node),n.node]),childFactory:n.any,className:n.string,direction:n.oneOf(["horizontal","vertical"]),component:n.string,id:n.string,style:n.any},h.defaultProps={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"vertical"};let E=h;const y={position:"absolute",top:"0",left:"0"},x=class extends a.Component{render(){const{children:t,direction:e,...n}=this.props;return a.createElement(m,{...n,transitionName:`push-${e}`,animationExitingStyle:this.props.stackChildren?y:void 0},t)}};x.propTypes={children:n.oneOfType([n.arrayOf(n.node),n.node]),childFactory:n.any,className:n.string,direction:n.oneOf(["up","down","left","right"]),component:n.string,id:n.string,style:n.any,stackChildren:n.bool},x.defaultProps={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"right",stackChildren:!1};let f=x;const g=class extends a.Component{render(){const{direction:t,children:e,...n}=this.props,i={transitionName:`slide-${t}`};return a.createElement(m,{...i,...n},e)}};g.propTypes={children:n.oneOfType([n.arrayOf(n.node),n.node]),childFactory:n.any,className:n.string,direction:n.oneOf(["up","down","left","right"]),component:n.string,id:n.string,style:n.any},g.defaultProps={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"down"};let N=g;const O={position:"absolute",top:"0",left:"0"},v=class extends a.Component{render(){const{children:t,direction:e,...n}=this.props;return a.createElement(m,{...n,transitionName:`zoom-${e}`,animationExitingStyle:this.props.stackChildren?O:void 0},t)}};v.propTypes={children:n.oneOfType([n.arrayOf(n.node),n.node]),childFactory:n.any,className:n.string,direction:n.oneOf(["in","out"]),component:n.string,id:n.string,style:n.any,stackChildren:n.bool},v.defaultProps={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"out",stackChildren:!1};let C=v;const D=t=>{if(!t||!t.ownerDocument.defaultView)return 0;const e=t.ownerDocument.defaultView.getComputedStyle(t),n=parseFloat(e.marginTop),i=parseFloat(e.marginBottom);return t.offsetHeight+n+i},b=t=>{if(!t||!t.ownerDocument.defaultView)return 0;const e=t.ownerDocument.defaultView.getComputedStyle(t),n=parseFloat(e.marginLeft),i=parseFloat(e.marginRight);return t.offsetWidth+n+i},T=(i.animationStyles,class extends a.Component{constructor(){super(...arguments),this.state={maxHeight:void 0,maxWidth:void 0},this.componentWillEnter=t=>{const{onEnter:e,onBeforeEnter:n}=this.props;n&&n.call(void 0,t),this.updateContainerDimensions(t.animatedElement,(()=>{e&&e.call(void 0,t)}))},this.componentIsEntering=t=>{const{onEntering:e}=this.props;this.updateContainerDimensions(t.animatedElement,(()=>{e&&e.call(void 0,t)}))},this.componentWillExit=t=>{const{onExit:e}=this.props;this.updateContainerDimensions(t.animatedElement,(()=>{e&&e.call(void 0,t)}))},this.updateContainerDimensions=(t,e=i.noop)=>{const n=t.firstChild;if(n){const t=D(n),i=b(n);this.setState({maxHeight:t,maxWidth:i},e)}}}render(){const{direction:t,children:e,childFactory:n,...i}=this.props,{maxHeight:o,maxWidth:r}=this.state;let s;s="vertical"===t?{maxHeight:o?`${o}px`:""}:{maxWidth:r?`${r}px`:""};const c={maxHeight:s.maxHeight,maxWidth:s.maxWidth};return a.createElement(m,{...i,childFactory:t=>{let e=n?n(t):t;return e.props.in?e:a.cloneElement(e,{...e.props,style:{...e.props.style,maxHeight:s.maxHeight,maxWidth:s.maxWidth}})},onEnter:this.componentWillEnter,onEntering:this.componentIsEntering,onExit:this.componentWillExit,animationEnteringStyle:c,transitionName:`reveal-${t}`},e)}});T.propTypes={children:n.oneOfType([n.arrayOf(n.node),n.node]),childFactory:n.any,className:n.string,direction:n.oneOf(["horizontal","vertical"]),component:n.string,id:n.string,style:n.any},T.defaultProps={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"vertical"};let A=T;t.Animation=m,t.AnimationChild=c,t.Expand=E,t.Fade=u,t.Push=f,t.Reveal=A,t.Slide=N,t.Zoom=C,t.useAnimation=(t,e)=>{const n=a.useRef(0),i=a.useRef(!1),o=a.useRef();a.useEffect((()=>((t=>{const e=t.duration;let i,r,a=n.current&&1-n.current;t.onStart&&t.onStart();const s=c=>{i||(i=c),r=c-i+1;const l=r/e+a;l<=1?(t.onUpdate&&t.onUpdate(l),o.current=window.requestAnimationFrame(s),n.current=l):(t.onEnd&&t.onEnd(1),n.current=0)};o.current=window.requestAnimationFrame(s)})(t),()=>{o.current&&window.cancelAnimationFrame(o.current)})),e),a.useEffect((()=>{i.current=!0}),[])}}));
@@ -10,7 +10,7 @@ const e = {
10
10
  name: "@progress/kendo-react-animation",
11
11
  productName: "KendoReact",
12
12
  productCodes: ["KENDOUIREACT", "KENDOUICOMPLETE"],
13
- publishDate: 1723443162,
13
+ publishDate: 1723622241,
14
14
  version: "",
15
15
  licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/components/my-license/"
16
16
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@progress/kendo-react-animation",
3
- "version": "8.3.0-develop.3",
3
+ "version": "8.3.0-develop.4",
4
4
  "description": "React Animation component assists with animating HTML elements. KendoReact Animation package",
5
5
  "author": "Progress",
6
6
  "license": "SEE LICENSE IN LICENSE.md",
@@ -23,7 +23,7 @@
23
23
  "sideEffects": false,
24
24
  "peerDependencies": {
25
25
  "@progress/kendo-licensing": "^1.3.4",
26
- "@progress/kendo-react-common": "8.3.0-develop.3",
26
+ "@progress/kendo-react-common": "8.3.0-develop.4",
27
27
  "@progress/kendo-svg-icons": "^3.0.0",
28
28
  "react": "^16.8.2 || ^17.0.0 || ^18.0.0",
29
29
  "react-dom": "^16.8.2 || ^17.0.0 || ^18.0.0",
package/util.js CHANGED
@@ -5,4 +5,4 @@
5
5
  * Licensed under commercial license. See LICENSE.md in the package root for more information
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
- "use client";"use strict";const p=e=>{if(!e||!e.ownerDocument.defaultView)return 0;const t=e.ownerDocument.defaultView.getComputedStyle(e),a=parseFloat(t.marginTop),i=parseFloat(t.marginBottom);return e.offsetHeight+a+i},n=e=>{if(!e||!e.ownerDocument.defaultView)return 0;const t=e.ownerDocument.defaultView.getComputedStyle(e),a=parseFloat(t.marginLeft),i=parseFloat(t.marginRight);return e.offsetWidth+a+i},o={"animation-container":"k-animation-container","animation-container-shown":"k-animation-container-shown","animation-container-relative":"k-animation-container-relative","animation-container-fixed":"k-animation-container-fixed","push-right-enter":"k-push-right-enter","push-right-appear":"k-push-right-appear","push-right-enter-active":"k-push-right-enter-active","push-right-appear-active":"k-push-right-appear-active","push-right-exit":"k-push-right-exit","push-right-exit-active":"k-push-right-exit-active","push-left-enter":"k-push-left-enter","push-left-appear":"k-push-left-appear","push-left-enter-active":"k-push-left-enter-active","push-left-appear-active":"k-push-left-appear-active","push-left-exit":"k-push-left-exit","push-left-exit-active":"k-push-left-exit-active","push-down-enter":"k-push-down-enter","push-down-appear":"k-push-down-appear","push-down-enter-active":"k-push-down-enter-active","push-down-appear-active":"k-push-down-appear-active","push-down-exit":"k-push-down-exit","push-down-exit-active":"k-push-down-exit-active","push-up-enter":"k-push-up-enter","push-up-appear":"k-push-up-appear","push-up-enter-active":"k-push-up-enter-active","push-up-appear-active":"k-push-up-appear-active","push-up-exit":"k-push-up-exit","push-up-exit-active":"k-push-up-exit-active",expand:"k-expand","expand-vertical-enter":"k-expand-vertical-enter","expand-vertical-appear":"k-expand-vertical-appear","expand-vertical-enter-active":"k-expand-vertical-enter-active","expand-vertical-appear-active":"k-expand-vertical-appear-active","expand-vertical-exit":"k-expand-vertical-exit","expand-vertical-exit-active":"k-expand-vertical-exit-active","expand-horizontal-enter":"k-expand-horizontal-enter","expand-horizontal-appear":"k-expand-horizontal-appear","expand-horizontal-enter-active":"k-expand-horizontal-enter-active","expand-horizontal-appear-active":"k-expand-horizontal-appear-active","expand-horizontal-exit":"k-expand-horizontal-exit","expand-horizontal-exit-active":"k-expand-horizontal-exit-active","child-animation-container":"k-child-animation-container","fade-enter":"k-fade-enter","fade-appear":"k-fade-appear","fade-enter-active":"k-fade-enter-active","fade-appear-active":"k-fade-appear-active","fade-exit":"k-fade-exit","fade-exit-active":"k-fade-exit-active","zoom-in-enter":"k-zoom-in-enter","zoom-in-appear":"k-zoom-in-appear","zoom-in-enter-active":"k-zoom-in-enter-active","zoom-in-appear-active":"k-zoom-in-appear-active","zoom-in-exit":"k-zoom-in-exit","zoom-in-exit-active":"k-zoom-in-exit-active","zoom-out-enter":"k-zoom-out-enter","zoom-out-appear":"k-zoom-out-appear","zoom-out-enter-active":"k-zoom-out-enter-active","zoom-out-appear-active":"k-zoom-out-appear-active","zoom-out-exit":"k-zoom-out-exit","zoom-out-exit-active":"k-zoom-out-exit-active","slide-in-appear":"k-slide-in-appear",centered:"k-centered","slide-in-appear-active":"k-slide-in-appear-active","slide-down-enter":"k-slide-down-enter","slide-down-appear":"k-slide-down-appear","slide-down-enter-active":"k-slide-down-enter-active","slide-down-appear-active":"k-slide-down-appear-active","slide-down-exit":"k-slide-down-exit","slide-down-exit-active":"k-slide-down-exit-active","slide-up-enter":"k-slide-up-enter","slide-up-appear":"k-slide-up-appear","slide-up-enter-active":"k-slide-up-enter-active","slide-up-appear-active":"k-slide-up-appear-active","slide-up-exit":"k-slide-up-exit","slide-up-exit-active":"k-slide-up-exit-active","slide-right-enter":"k-slide-right-enter","slide-right-appear":"k-slide-right-appear","slide-right-enter-active":"k-slide-right-enter-active","slide-right-appear-active":"k-slide-right-appear-active","slide-right-exit":"k-slide-right-exit","slide-right-exit-active":"k-slide-right-exit-active","slide-left-enter":"k-slide-left-enter","slide-left-appear":"k-slide-left-appear","slide-left-enter-active":"k-slide-left-enter-active","slide-left-appear-active":"k-slide-left-appear-active","slide-left-exit":"k-slide-left-exit","slide-left-exit-active":"k-slide-left-exit-active","reveal-vertical-enter":"k-reveal-vertical-enter","reveal-vertical-appear":"k-reveal-vertical-appear","reveal-vertical-enter-active":"k-reveal-vertical-enter-active","reveal-vertical-appear-active":"k-reveal-vertical-appear-active","reveal-vertical-exit":"k-reveal-vertical-exit","reveal-vertical-exit-active":"k-reveal-vertical-exit-active","reveal-horizontal-enter":"k-reveal-horizontal-enter","reveal-horizontal-appear":"k-reveal-horizontal-appear","reveal-horizontal-enter-active":"k-reveal-horizontal-enter-active","reveal-horizontal-appear-active":"k-reveal-horizontal-appear-active","reveal-horizontal-exit":"k-reveal-horizontal-exit","reveal-horizontal-exit-active":"k-reveal-horizontal-exit-active"},l={outerHeight:p,outerWidth:n,styles:o};module.exports=l;
8
+ "use client";"use strict";const s=require("@progress/kendo-react-common"),i=t=>{if(!t||!t.ownerDocument.defaultView)return 0;const o=t.ownerDocument.defaultView.getComputedStyle(t),n=parseFloat(o.marginTop),r=parseFloat(o.marginBottom);return t.offsetHeight+n+r},a=t=>{if(!t||!t.ownerDocument.defaultView)return 0;const o=t.ownerDocument.defaultView.getComputedStyle(t),n=parseFloat(o.marginLeft),r=parseFloat(o.marginRight);return t.offsetWidth+n+r},c={outerHeight:i,outerWidth:a,styles:s.animationStyles};module.exports=c;
package/util.mjs CHANGED
@@ -6,121 +6,22 @@
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
8
  "use client";
9
- const p = (e) => {
10
- if (!e || !e.ownerDocument.defaultView)
9
+ import { animationStyles as a } from "@progress/kendo-react-common";
10
+ const e = (t) => {
11
+ if (!t || !t.ownerDocument.defaultView)
11
12
  return 0;
12
- const t = e.ownerDocument.defaultView.getComputedStyle(e), a = parseFloat(t.marginTop), i = parseFloat(t.marginBottom);
13
- return e.offsetHeight + a + i;
14
- }, n = (e) => {
15
- if (!e || !e.ownerDocument.defaultView)
13
+ const o = t.ownerDocument.defaultView.getComputedStyle(t), n = parseFloat(o.marginTop), r = parseFloat(o.marginBottom);
14
+ return t.offsetHeight + n + r;
15
+ }, i = (t) => {
16
+ if (!t || !t.ownerDocument.defaultView)
16
17
  return 0;
17
- const t = e.ownerDocument.defaultView.getComputedStyle(e), a = parseFloat(t.marginLeft), i = parseFloat(t.marginRight);
18
- return e.offsetWidth + a + i;
19
- }, o = {
20
- "animation-container": "k-animation-container",
21
- "animation-container-shown": "k-animation-container-shown",
22
- "animation-container-relative": "k-animation-container-relative",
23
- "animation-container-fixed": "k-animation-container-fixed",
24
- "push-right-enter": "k-push-right-enter",
25
- "push-right-appear": "k-push-right-appear",
26
- "push-right-enter-active": "k-push-right-enter-active",
27
- "push-right-appear-active": "k-push-right-appear-active",
28
- "push-right-exit": "k-push-right-exit",
29
- "push-right-exit-active": "k-push-right-exit-active",
30
- "push-left-enter": "k-push-left-enter",
31
- "push-left-appear": "k-push-left-appear",
32
- "push-left-enter-active": "k-push-left-enter-active",
33
- "push-left-appear-active": "k-push-left-appear-active",
34
- "push-left-exit": "k-push-left-exit",
35
- "push-left-exit-active": "k-push-left-exit-active",
36
- "push-down-enter": "k-push-down-enter",
37
- "push-down-appear": "k-push-down-appear",
38
- "push-down-enter-active": "k-push-down-enter-active",
39
- "push-down-appear-active": "k-push-down-appear-active",
40
- "push-down-exit": "k-push-down-exit",
41
- "push-down-exit-active": "k-push-down-exit-active",
42
- "push-up-enter": "k-push-up-enter",
43
- "push-up-appear": "k-push-up-appear",
44
- "push-up-enter-active": "k-push-up-enter-active",
45
- "push-up-appear-active": "k-push-up-appear-active",
46
- "push-up-exit": "k-push-up-exit",
47
- "push-up-exit-active": "k-push-up-exit-active",
48
- expand: "k-expand",
49
- "expand-vertical-enter": "k-expand-vertical-enter",
50
- "expand-vertical-appear": "k-expand-vertical-appear",
51
- "expand-vertical-enter-active": "k-expand-vertical-enter-active",
52
- "expand-vertical-appear-active": "k-expand-vertical-appear-active",
53
- "expand-vertical-exit": "k-expand-vertical-exit",
54
- "expand-vertical-exit-active": "k-expand-vertical-exit-active",
55
- "expand-horizontal-enter": "k-expand-horizontal-enter",
56
- "expand-horizontal-appear": "k-expand-horizontal-appear",
57
- "expand-horizontal-enter-active": "k-expand-horizontal-enter-active",
58
- "expand-horizontal-appear-active": "k-expand-horizontal-appear-active",
59
- "expand-horizontal-exit": "k-expand-horizontal-exit",
60
- "expand-horizontal-exit-active": "k-expand-horizontal-exit-active",
61
- "child-animation-container": "k-child-animation-container",
62
- "fade-enter": "k-fade-enter",
63
- "fade-appear": "k-fade-appear",
64
- "fade-enter-active": "k-fade-enter-active",
65
- "fade-appear-active": "k-fade-appear-active",
66
- "fade-exit": "k-fade-exit",
67
- "fade-exit-active": "k-fade-exit-active",
68
- "zoom-in-enter": "k-zoom-in-enter",
69
- "zoom-in-appear": "k-zoom-in-appear",
70
- "zoom-in-enter-active": "k-zoom-in-enter-active",
71
- "zoom-in-appear-active": "k-zoom-in-appear-active",
72
- "zoom-in-exit": "k-zoom-in-exit",
73
- "zoom-in-exit-active": "k-zoom-in-exit-active",
74
- "zoom-out-enter": "k-zoom-out-enter",
75
- "zoom-out-appear": "k-zoom-out-appear",
76
- "zoom-out-enter-active": "k-zoom-out-enter-active",
77
- "zoom-out-appear-active": "k-zoom-out-appear-active",
78
- "zoom-out-exit": "k-zoom-out-exit",
79
- "zoom-out-exit-active": "k-zoom-out-exit-active",
80
- "slide-in-appear": "k-slide-in-appear",
81
- centered: "k-centered",
82
- "slide-in-appear-active": "k-slide-in-appear-active",
83
- "slide-down-enter": "k-slide-down-enter",
84
- "slide-down-appear": "k-slide-down-appear",
85
- "slide-down-enter-active": "k-slide-down-enter-active",
86
- "slide-down-appear-active": "k-slide-down-appear-active",
87
- "slide-down-exit": "k-slide-down-exit",
88
- "slide-down-exit-active": "k-slide-down-exit-active",
89
- "slide-up-enter": "k-slide-up-enter",
90
- "slide-up-appear": "k-slide-up-appear",
91
- "slide-up-enter-active": "k-slide-up-enter-active",
92
- "slide-up-appear-active": "k-slide-up-appear-active",
93
- "slide-up-exit": "k-slide-up-exit",
94
- "slide-up-exit-active": "k-slide-up-exit-active",
95
- "slide-right-enter": "k-slide-right-enter",
96
- "slide-right-appear": "k-slide-right-appear",
97
- "slide-right-enter-active": "k-slide-right-enter-active",
98
- "slide-right-appear-active": "k-slide-right-appear-active",
99
- "slide-right-exit": "k-slide-right-exit",
100
- "slide-right-exit-active": "k-slide-right-exit-active",
101
- "slide-left-enter": "k-slide-left-enter",
102
- "slide-left-appear": "k-slide-left-appear",
103
- "slide-left-enter-active": "k-slide-left-enter-active",
104
- "slide-left-appear-active": "k-slide-left-appear-active",
105
- "slide-left-exit": "k-slide-left-exit",
106
- "slide-left-exit-active": "k-slide-left-exit-active",
107
- "reveal-vertical-enter": "k-reveal-vertical-enter",
108
- "reveal-vertical-appear": "k-reveal-vertical-appear",
109
- "reveal-vertical-enter-active": "k-reveal-vertical-enter-active",
110
- "reveal-vertical-appear-active": "k-reveal-vertical-appear-active",
111
- "reveal-vertical-exit": "k-reveal-vertical-exit",
112
- "reveal-vertical-exit-active": "k-reveal-vertical-exit-active",
113
- "reveal-horizontal-enter": "k-reveal-horizontal-enter",
114
- "reveal-horizontal-appear": "k-reveal-horizontal-appear",
115
- "reveal-horizontal-enter-active": "k-reveal-horizontal-enter-active",
116
- "reveal-horizontal-appear-active": "k-reveal-horizontal-appear-active",
117
- "reveal-horizontal-exit": "k-reveal-horizontal-exit",
118
- "reveal-horizontal-exit-active": "k-reveal-horizontal-exit-active"
119
- }, l = {
120
- outerHeight: p,
121
- outerWidth: n,
122
- styles: o
18
+ const o = t.ownerDocument.defaultView.getComputedStyle(t), n = parseFloat(o.marginLeft), r = parseFloat(o.marginRight);
19
+ return t.offsetWidth + n + r;
20
+ }, c = {
21
+ outerHeight: e,
22
+ outerWidth: i,
23
+ styles: a
123
24
  };
124
25
  export {
125
- l as default
26
+ c as default
126
27
  };