@progress/kendo-react-animation 9.4.0-develop.6 → 9.4.0-develop.7
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 +1 -1
- package/Animation.mjs +4 -5
- package/AnimationChild.js +1 -1
- package/AnimationChild.mjs +15 -16
- package/Expand.js +1 -1
- package/Expand.mjs +4 -5
- package/Fade.js +1 -1
- package/Fade.mjs +7 -8
- package/Push.js +1 -1
- package/Push.mjs +8 -9
- package/Reveal.js +1 -1
- package/Reveal.mjs +4 -5
- package/Slide.js +1 -1
- package/Slide.mjs +7 -8
- package/Zoom.js +1 -1
- package/Zoom.mjs +4 -5
- package/hooks/useAnimation.js +1 -1
- package/hooks/useAnimation.mjs +12 -13
- package/index.js +2 -1
- package/index.mjs +6 -6
- package/package-metadata.js +1 -1
- package/package-metadata.mjs +2 -3
- package/package.json +3 -3
- package/util.js +1 -1
- package/util.mjs +2 -3
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
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const R=require("react"),e=require("prop-types"),r=require("@progress/kendo-react-common"),C=require("./AnimationChild.js"),N=require("react-transition-group"),O=require("./package-metadata.js");function A(t){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const n in t)if(n!=="default"){const o=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(i,n,o.get?o:{enumerable:!0,get:()=>t[n]})}}return i.default=t,Object.freeze(i)}const s=A(R),c=t=>{r.validatePackage(O.packageMetadata);const{id:i,style:n,children:o,component:l="div",className:u,childFactory:d,stackChildren:T,componentChildStyle:m,componentChildClassName:p,...y}=t,g=r.useUnstyled(),a=t.unstyled||g,b=a&&a.uAnimation,f={id:i,style:n,component:l,childFactory:d,className:r.classNames(r.uAnimation.child({c:b}),u)},h=s.Children.map(o||null,q=>s.createElement(C.AnimationChild,{...y,unstyled:a,style:m,className:p},q));return s.createElement(N.TransitionGroup,{...f},h)};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};exports.Animation=c;
|
package/Animation.mjs
CHANGED
|
@@ -5,7 +5,6 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use client";
|
|
9
8
|
import * as n from "react";
|
|
10
9
|
import e from "prop-types";
|
|
11
10
|
import { validatePackage as R, useUnstyled as g, classNames as q, uAnimation as C } from "@progress/kendo-react-common";
|
|
@@ -17,8 +16,8 @@ const E = (i) => {
|
|
|
17
16
|
const {
|
|
18
17
|
id: o,
|
|
19
18
|
style: r,
|
|
20
|
-
children:
|
|
21
|
-
component:
|
|
19
|
+
children: a,
|
|
20
|
+
component: s = "div",
|
|
22
21
|
className: c,
|
|
23
22
|
childFactory: l,
|
|
24
23
|
stackChildren: T,
|
|
@@ -28,10 +27,10 @@ const E = (i) => {
|
|
|
28
27
|
} = i, u = g(), t = i.unstyled || u, y = t && t.uAnimation, h = {
|
|
29
28
|
id: o,
|
|
30
29
|
style: r,
|
|
31
|
-
component:
|
|
30
|
+
component: s,
|
|
32
31
|
childFactory: l,
|
|
33
32
|
className: q(C.child({ c: y }), c)
|
|
34
|
-
}, f = n.Children.map(
|
|
33
|
+
}, f = n.Children.map(a || null, (N) => /* @__PURE__ */ n.createElement(b, { ...p, unstyled: t, style: m, className: d }, N));
|
|
35
34
|
return /* @__PURE__ */ n.createElement(A, { ...h }, f);
|
|
36
35
|
};
|
|
37
36
|
E.propTypes = {
|
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
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const G=require("react"),t=require("prop-types"),n=require("@progress/kendo-react-common"),K=require("react-transition-group");function B(r){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const e in r)if(e!=="default"){const m=Object.getOwnPropertyDescriptor(r,e);Object.defineProperty(s,e,m.get?m:{enumerable:!0,get:()=>r[e]})}}return s.default=r,Object.freeze(s)}const c=B(G),d=c.forwardRef((r,s)=>{const e=c.useRef(null),{mountOnEnter:m=i.mountOnEnter,unmountOnExit:O=i.unmountOnExit,onEnter:E=i.onEnter,onEntering:x=i.onEntering,onEntered:g=i.onEntered,onExit:f=i.onExit,onExiting:p=i.onExiting,onExited:y=i.onExited,onAfterExited:S=i.onAfterExited,animationEnteringStyle:R=i.animationEnteringStyle,animationEnteredStyle:j=i.animationEnteredStyle,animationExitingStyle:D=i.animationExitingStyle,animationExitedStyle:h=i.animationExitedStyle,children:C,style:T,appear:q,enter:P,exit:_,transitionName:u,transitionEnterDuration:A,transitionExitDuration:b,className:k,unstyled:v,...w}=r,H={transitionDelay:"0ms",...T},l=v&&v.uAnimation,I=n.classNames(k,n.uAnimation.childContainer({c:l})),o=c.useRef({element:e.current,props:r}),a=c.useRef(null);c.useImperativeHandle(a,()=>({element:e.current,props:r})),c.useImperativeHandle(s,()=>a.current,[]);const M={entering:{transitionDuration:`${A}ms`,...R},entered:{...j},exiting:{transitionDuration:`${b}ms`,...D},exited:{...h}},$={in:r.in,appear:q,enter:P,exit:_,mountOnEnter:m,unmountOnExit:O,timeout:{enter:A,exit:b},onEnter:()=>{E&&E.call(void 0,{animatedElement:e.current,target:a.current||o.current})},onEntering:()=>{x&&x.call(void 0,{animatedElement:e.current,target:a.current||o.current})},onEntered:()=>{g&&g.call(void 0,{animatedElement:e.current,target:a.current||o.current})},onExit:()=>{f&&f.call(void 0,{animatedElement:e.current,target:a.current||o.current})},onExiting:()=>{p&&p.call(void 0,{animatedElement:e.current,target:a.current||o.current})},onExited:()=>{S&&S.call(void 0,{animatedElement:e.current,target:a.current||o.current}),y&&y.call(void 0,{animatedElement:e.current,target:a.current||o.current})},classNames:{appear:n.classNames(n.uAnimation.appear({c:l,transitionName:u})),appearActive:n.classNames(n.uAnimation.appearActive({c:l,transitionName:u})),enter:n.classNames(n.uAnimation.enter({c:l,transitionName:u})),enterActive:n.classNames(n.uAnimation.enterActive({c:l,transitionName:u})),exit:n.classNames(n.uAnimation.exit({c:l,transitionName:u})),exitActive:n.classNames(n.uAnimation.exitActive({c:l,transitionName:u}))}};return c.createElement(K.CSSTransition,{...$,...w,nodeRef:e},z=>c.createElement("div",{style:{...H,...M[z]},className:I,ref:N=>{e.current=N,o.current.element=N}},C))}),i={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:{}};d.displayName="KendoReactAnimationChild";d.propTypes={in:t.bool,children:t.oneOfType([t.arrayOf(t.node),t.node]),transitionName:t.string.isRequired,className:t.string,appear:t.bool,enter:t.bool,exit:t.bool,transitionEnterDuration:t.number.isRequired,transitionExitDuration:t.number.isRequired,mountOnEnter:t.bool,unmountOnExit:t.bool,animationEnteringStyle:t.object,animationEnteredStyle:t.object,animationExitingStyle:t.object,animationExitedStyle:t.object};exports.AnimationChild=d;
|
package/AnimationChild.mjs
CHANGED
|
@@ -5,10 +5,9 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use client";
|
|
9
8
|
import * as a from "react";
|
|
10
9
|
import t from "prop-types";
|
|
11
|
-
import { classNames as l, uAnimation as
|
|
10
|
+
import { classNames as l, uAnimation as m, noop as c } from "@progress/kendo-react-common";
|
|
12
11
|
import { CSSTransition as J } from "react-transition-group";
|
|
13
12
|
const R = a.forwardRef(
|
|
14
13
|
(E, O) => {
|
|
@@ -40,7 +39,7 @@ const R = a.forwardRef(
|
|
|
40
39
|
} = E, k = {
|
|
41
40
|
transitionDelay: "0ms",
|
|
42
41
|
...P
|
|
43
|
-
}, o = A && A.uAnimation, z = l(w,
|
|
42
|
+
}, o = A && A.uAnimation, z = l(w, m.childContainer({ c: o })), r = a.useRef({
|
|
44
43
|
element: e.current,
|
|
45
44
|
props: E
|
|
46
45
|
}), i = a.useRef(null);
|
|
@@ -108,12 +107,12 @@ const R = a.forwardRef(
|
|
|
108
107
|
});
|
|
109
108
|
},
|
|
110
109
|
classNames: {
|
|
111
|
-
appear: l(
|
|
112
|
-
appearActive: l(
|
|
113
|
-
enter: l(
|
|
114
|
-
enterActive: l(
|
|
115
|
-
exit: l(
|
|
116
|
-
exitActive: l(
|
|
110
|
+
appear: l(m.appear({ c: o, transitionName: u })),
|
|
111
|
+
appearActive: l(m.appearActive({ c: o, transitionName: u })),
|
|
112
|
+
enter: l(m.enter({ c: o, transitionName: u })),
|
|
113
|
+
enterActive: l(m.enterActive({ c: o, transitionName: u })),
|
|
114
|
+
exit: l(m.exit({ c: o, transitionName: u })),
|
|
115
|
+
exitActive: l(m.exitActive({ c: o, transitionName: u }))
|
|
117
116
|
}
|
|
118
117
|
};
|
|
119
118
|
return /* @__PURE__ */ a.createElement(J, { ...F, ...K, nodeRef: e }, (G) => /* @__PURE__ */ a.createElement(
|
|
@@ -134,13 +133,13 @@ const R = a.forwardRef(
|
|
|
134
133
|
), n = {
|
|
135
134
|
mountOnEnter: !0,
|
|
136
135
|
unmountOnExit: !1,
|
|
137
|
-
onEnter:
|
|
138
|
-
onEntering:
|
|
139
|
-
onEntered:
|
|
140
|
-
onExit:
|
|
141
|
-
onExiting:
|
|
142
|
-
onExited:
|
|
143
|
-
onAfterExited:
|
|
136
|
+
onEnter: c,
|
|
137
|
+
onEntering: c,
|
|
138
|
+
onEntered: c,
|
|
139
|
+
onExit: c,
|
|
140
|
+
onExiting: c,
|
|
141
|
+
onExited: c,
|
|
142
|
+
onAfterExited: c,
|
|
144
143
|
animationEnteringStyle: {},
|
|
145
144
|
animationEnteredStyle: {},
|
|
146
145
|
animationExitingStyle: {},
|
package/Expand.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
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("react"),t=require("prop-types"),y=require("./Animation.js");function m(e){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const o=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(i,n,o.get?o:{enumerable:!0,get:()=>e[n]})}}return i.default=e,Object.freeze(i)}const g=m(f),a=e=>{const{appear:i=r.appear,enter:n=r.enter,exit:o=r.exit,transitionEnterDuration:c=r.transitionEnterDuration,transitionExitDuration:s=r.transitionExitDuration,direction:u=r.direction,children:p,...l}=e,d={transitionName:`expand-${u}`};return g.createElement(y.Animation,{...d,appear:i,enter:n,exit:o,transitionEnterDuration:c,transitionExitDuration:s,...l},p)},r={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"vertical"};a.propTypes={children:t.oneOfType([t.arrayOf(t.node),t.node]),childFactory:t.any,className:t.string,direction:t.oneOf(["horizontal","vertical"]),component:t.string,id:t.string,style:t.any};exports.Expand=a;
|
package/Expand.mjs
CHANGED
|
@@ -5,8 +5,7 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
|
|
9
|
-
import * as m from "react";
|
|
8
|
+
import * as l from "react";
|
|
10
9
|
import t from "prop-types";
|
|
11
10
|
import { Animation as u } from "./Animation.mjs";
|
|
12
11
|
const x = (r) => {
|
|
@@ -19,13 +18,13 @@ const x = (r) => {
|
|
|
19
18
|
direction: p = n.direction,
|
|
20
19
|
children: c,
|
|
21
20
|
...d
|
|
22
|
-
} = r,
|
|
21
|
+
} = r, m = {
|
|
23
22
|
transitionName: `expand-${p}`
|
|
24
23
|
};
|
|
25
|
-
return /* @__PURE__ */
|
|
24
|
+
return /* @__PURE__ */ l.createElement(
|
|
26
25
|
u,
|
|
27
26
|
{
|
|
28
|
-
...
|
|
27
|
+
...m,
|
|
29
28
|
appear: i,
|
|
30
29
|
enter: e,
|
|
31
30
|
exit: o,
|
package/Fade.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
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("react"),t=require("prop-types"),f=require("./Animation.js");function y(e){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const i=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(r,n,i.get?i:{enumerable:!0,get:()=>e[n]})}}return r.default=e,Object.freeze(r)}const m=y(d),o=e=>{const{appear:r=a.appear,enter:n=a.enter,exit:i=a.exit,transitionEnterDuration:s=a.transitionEnterDuration,transitionExitDuration:c=a.transitionExitDuration,children:u,...p}=e,l={transitionName:"fade"};return m.createElement(f.Animation,{...l,appear:r,enter:n,exit:i,transitionEnterDuration:s,transitionExitDuration:c,...p},u)},a={appear:!1,enter:!0,exit:!1,transitionEnterDuration:500,transitionExitDuration:500};o.propTypes={children:t.oneOfType([t.arrayOf(t.node),t.node]),childFactory:t.any,className:t.string,component:t.string,id:t.string,style:t.any};exports.Fade=o;
|
package/Fade.mjs
CHANGED
|
@@ -5,11 +5,10 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
|
|
9
|
-
import * as l from "react";
|
|
8
|
+
import * as d from "react";
|
|
10
9
|
import t from "prop-types";
|
|
11
|
-
import { Animation as
|
|
12
|
-
const
|
|
10
|
+
import { Animation as f } from "./Animation.mjs";
|
|
11
|
+
const l = (r) => {
|
|
13
12
|
const {
|
|
14
13
|
appear: e = n.appear,
|
|
15
14
|
enter: i = n.enter,
|
|
@@ -21,8 +20,8 @@ const d = (r) => {
|
|
|
21
20
|
} = r, m = {
|
|
22
21
|
transitionName: "fade"
|
|
23
22
|
};
|
|
24
|
-
return /* @__PURE__ */
|
|
25
|
-
|
|
23
|
+
return /* @__PURE__ */ d.createElement(
|
|
24
|
+
f,
|
|
26
25
|
{
|
|
27
26
|
...m,
|
|
28
27
|
appear: e,
|
|
@@ -41,7 +40,7 @@ const d = (r) => {
|
|
|
41
40
|
transitionEnterDuration: 500,
|
|
42
41
|
transitionExitDuration: 500
|
|
43
42
|
};
|
|
44
|
-
|
|
43
|
+
l.propTypes = {
|
|
45
44
|
children: t.oneOfType([t.arrayOf(t.node), t.node]),
|
|
46
45
|
childFactory: t.any,
|
|
47
46
|
className: t.string,
|
|
@@ -50,5 +49,5 @@ d.propTypes = {
|
|
|
50
49
|
style: t.any
|
|
51
50
|
};
|
|
52
51
|
export {
|
|
53
|
-
|
|
52
|
+
l as Fade
|
|
54
53
|
};
|
package/Push.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
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("react"),t=require("prop-types"),h=require("./Animation.js");function y(e){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const o=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(i,r,o.get?o:{enumerable:!0,get:()=>e[r]})}}return i.default=e,Object.freeze(i)}const g=y(f),m={position:"absolute",top:"0",left:"0"},a=e=>{const{appear:i=n.appear,enter:r=n.enter,exit:o=n.exit,transitionEnterDuration:s=n.transitionEnterDuration,transitionExitDuration:c=n.transitionExitDuration,stackChildren:l=n.stackChildren,direction:u=n.direction,children:d,...p}=e;return g.createElement(h.Animation,{appear:i,enter:r,exit:o,transitionEnterDuration:s,transitionExitDuration:c,stackChildren:l,...p,transitionName:`push-${u}`,animationExitingStyle:e.stackChildren?m:void 0},d)},n={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"right",stackChildren:!1};a.propTypes={children:t.oneOfType([t.arrayOf(t.node),t.node]),childFactory:t.any,className:t.string,direction:t.oneOf(["up","down","left","right"]),component:t.string,id:t.string,style:t.any,stackChildren:t.bool};exports.Push=a;
|
package/Push.mjs
CHANGED
|
@@ -5,36 +5,35 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use client";
|
|
9
8
|
import * as u from "react";
|
|
10
9
|
import t from "prop-types";
|
|
11
10
|
import { Animation as h } from "./Animation.mjs";
|
|
12
11
|
const m = { position: "absolute", top: "0", left: "0" }, f = (i) => {
|
|
13
12
|
const {
|
|
14
|
-
appear:
|
|
15
|
-
enter:
|
|
13
|
+
appear: r = n.appear,
|
|
14
|
+
enter: e = n.enter,
|
|
16
15
|
exit: o = n.exit,
|
|
17
16
|
transitionEnterDuration: a = n.transitionEnterDuration,
|
|
18
17
|
transitionExitDuration: s = n.transitionExitDuration,
|
|
19
18
|
stackChildren: c = n.stackChildren,
|
|
20
|
-
direction:
|
|
21
|
-
children:
|
|
19
|
+
direction: p = n.direction,
|
|
20
|
+
children: l,
|
|
22
21
|
...d
|
|
23
22
|
} = i;
|
|
24
23
|
return /* @__PURE__ */ u.createElement(
|
|
25
24
|
h,
|
|
26
25
|
{
|
|
27
|
-
appear:
|
|
28
|
-
enter:
|
|
26
|
+
appear: r,
|
|
27
|
+
enter: e,
|
|
29
28
|
exit: o,
|
|
30
29
|
transitionEnterDuration: a,
|
|
31
30
|
transitionExitDuration: s,
|
|
32
31
|
stackChildren: c,
|
|
33
32
|
...d,
|
|
34
|
-
transitionName: `push-${
|
|
33
|
+
transitionName: `push-${p}`,
|
|
35
34
|
animationExitingStyle: i.stackChildren ? m : void 0
|
|
36
35
|
},
|
|
37
|
-
|
|
36
|
+
l
|
|
38
37
|
);
|
|
39
38
|
}, n = {
|
|
40
39
|
appear: !1,
|
package/Reveal.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
|
|
8
|
+
"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 r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const o in e)if(o!=="default"){const a=Object.getOwnPropertyDescriptor(e,o);Object.defineProperty(r,o,a.get?a:{enumerable:!0,get:()=>e[o]})}}return r.default=e,Object.freeze(r)}const s=N(w),h=e=>{const[r,o]=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:r?`${r}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)},[r,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);o(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.string,id:i.string,style:i.any};exports.Reveal=h;
|
package/Reveal.mjs
CHANGED
|
@@ -5,14 +5,13 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use client";
|
|
9
8
|
import * as o from "react";
|
|
10
9
|
import n from "prop-types";
|
|
11
10
|
import { Animation as N } from "./Animation.mjs";
|
|
12
11
|
import p from "./util.mjs";
|
|
13
12
|
const P = (a) => {
|
|
14
|
-
const [c, E] = o.useState(), [m, f] = o.useState(), [s,
|
|
15
|
-
appear:
|
|
13
|
+
const [c, E] = o.useState(), [m, f] = o.useState(), [s, g] = o.useState({}), {
|
|
14
|
+
appear: u = r.appear,
|
|
16
15
|
enter: y = r.enter,
|
|
17
16
|
exit: W = r.exit,
|
|
18
17
|
transitionEnterDuration: H = r.transitionEnterDuration,
|
|
@@ -42,7 +41,7 @@ const P = (a) => {
|
|
|
42
41
|
const x = t.animatedElement.firstChild;
|
|
43
42
|
if (x) {
|
|
44
43
|
const w = p.outerHeight(x), C = p.outerWidth(x);
|
|
45
|
-
E(w), f(C),
|
|
44
|
+
E(w), f(C), g({
|
|
46
45
|
name: e,
|
|
47
46
|
event: t
|
|
48
47
|
});
|
|
@@ -62,7 +61,7 @@ const P = (a) => {
|
|
|
62
61
|
N,
|
|
63
62
|
{
|
|
64
63
|
...T,
|
|
65
|
-
appear:
|
|
64
|
+
appear: u,
|
|
66
65
|
enter: y,
|
|
67
66
|
exit: W,
|
|
68
67
|
transitionEnterDuration: H,
|
package/Slide.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
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("react"),t=require("prop-types"),y=require("./Animation.js");function m(e){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const o=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(i,n,o.get?o:{enumerable:!0,get:()=>e[n]})}}return i.default=e,Object.freeze(i)}const g=m(f),a=e=>{const{appear:i=r.appear,enter:n=r.enter,exit:o=r.exit,transitionEnterDuration:c=r.transitionEnterDuration,transitionExitDuration:s=r.transitionExitDuration,direction:u=r.direction,children:l,...d}=e,p={transitionName:`slide-${u}`};return g.createElement(y.Animation,{...p,appear:i,enter:n,exit:o,transitionEnterDuration:c,transitionExitDuration:s,...d},l)},r={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"down"};a.propTypes={children:t.oneOfType([t.arrayOf(t.node),t.node]),childFactory:t.any,className:t.string,direction:t.oneOf(["up","down","left","right"]),component:t.string,id:t.string,style:t.any};exports.Slide=a;
|
package/Slide.mjs
CHANGED
|
@@ -5,13 +5,12 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
|
|
9
|
-
import * as m from "react";
|
|
8
|
+
import * as l from "react";
|
|
10
9
|
import t from "prop-types";
|
|
11
10
|
import { Animation as u } from "./Animation.mjs";
|
|
12
|
-
const f = (
|
|
11
|
+
const f = (r) => {
|
|
13
12
|
const {
|
|
14
|
-
appear:
|
|
13
|
+
appear: i = n.appear,
|
|
15
14
|
enter: e = n.enter,
|
|
16
15
|
exit: o = n.exit,
|
|
17
16
|
transitionEnterDuration: a = n.transitionEnterDuration,
|
|
@@ -19,14 +18,14 @@ const f = (i) => {
|
|
|
19
18
|
direction: p = n.direction,
|
|
20
19
|
children: c,
|
|
21
20
|
...d
|
|
22
|
-
} =
|
|
21
|
+
} = r, m = {
|
|
23
22
|
transitionName: `slide-${p}`
|
|
24
23
|
};
|
|
25
|
-
return /* @__PURE__ */
|
|
24
|
+
return /* @__PURE__ */ l.createElement(
|
|
26
25
|
u,
|
|
27
26
|
{
|
|
28
|
-
...
|
|
29
|
-
appear:
|
|
27
|
+
...m,
|
|
28
|
+
appear: i,
|
|
30
29
|
enter: e,
|
|
31
30
|
exit: o,
|
|
32
31
|
transitionEnterDuration: a,
|
package/Zoom.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
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("react"),t=require("prop-types"),m=require("./Animation.js");function y(e){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const i in e)if(i!=="default"){const o=Object.getOwnPropertyDescriptor(e,i);Object.defineProperty(r,i,o.get?o:{enumerable:!0,get:()=>e[i]})}}return r.default=e,Object.freeze(r)}const g=y(f),b={position:"absolute",top:"0",left:"0"},a=e=>{const{appear:r=n.appear,enter:i=n.enter,exit:o=n.exit,transitionEnterDuration:c=n.transitionEnterDuration,transitionExitDuration:s=n.transitionExitDuration,stackChildren:l=n.stackChildren,direction:u=n.direction,children:d,...p}=e;return g.createElement(m.Animation,{appear:r,enter:i,exit:o,transitionEnterDuration:c,transitionExitDuration:s,stackChildren:l,...p,transitionName:`zoom-${u}`,animationExitingStyle:e.stackChildren?b:void 0},d)},n={appear:!1,enter:!0,exit:!0,transitionEnterDuration:300,transitionExitDuration:300,direction:"out",stackChildren:!1};a.propTypes={children:t.oneOfType([t.arrayOf(t.node),t.node]),childFactory:t.any,className:t.string,direction:t.oneOf(["in","out"]),component:t.string,id:t.string,style:t.any,stackChildren:t.bool};exports.Zoom=a;
|
package/Zoom.mjs
CHANGED
|
@@ -5,14 +5,13 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use client";
|
|
9
8
|
import * as m from "react";
|
|
10
9
|
import t from "prop-types";
|
|
11
10
|
import { Animation as u } from "./Animation.mjs";
|
|
12
11
|
const f = { position: "absolute", top: "0", left: "0" }, E = (i) => {
|
|
13
12
|
const {
|
|
14
|
-
appear:
|
|
15
|
-
enter:
|
|
13
|
+
appear: r = n.appear,
|
|
14
|
+
enter: e = n.enter,
|
|
16
15
|
exit: o = n.exit,
|
|
17
16
|
transitionEnterDuration: a = n.transitionEnterDuration,
|
|
18
17
|
transitionExitDuration: s = n.transitionExitDuration,
|
|
@@ -24,8 +23,8 @@ const f = { position: "absolute", top: "0", left: "0" }, E = (i) => {
|
|
|
24
23
|
return /* @__PURE__ */ m.createElement(
|
|
25
24
|
u,
|
|
26
25
|
{
|
|
27
|
-
appear:
|
|
28
|
-
enter:
|
|
26
|
+
appear: r,
|
|
27
|
+
enter: e,
|
|
29
28
|
exit: o,
|
|
30
29
|
transitionEnterDuration: a,
|
|
31
30
|
transitionExitDuration: s,
|
package/hooks/useAnimation.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
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("react");function g(t){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const e in t)if(e!=="default"){const c=Object.getOwnPropertyDescriptor(t,e);Object.defineProperty(r,e,c.get?c:{enumerable:!0,get:()=>t[e]})}}return r.default=t,Object.freeze(r)}const o=g(b),w=(t,r)=>{const e=o.useRef(0),c=o.useRef(!1),u=o.useRef(),d=n=>{const m=n.duration;let a,f;const p=e.current&&1-e.current;n.onStart&&n.onStart();const i=l=>{a||(a=l),f=l-a+1;const s=f/m+p;s<=1?(n.onUpdate&&n.onUpdate(s),u.current=window.requestAnimationFrame(i),e.current=s):(n.onEnd&&n.onEnd(1),e.current=0)};u.current=window.requestAnimationFrame(i)};o.useEffect(()=>(d(t),()=>{u.current&&window.cancelAnimationFrame(u.current)}),r),o.useEffect(()=>{c.current=!0},[])};exports.useAnimation=w;
|
package/hooks/useAnimation.mjs
CHANGED
|
@@ -5,25 +5,24 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use client";
|
|
9
8
|
import * as t from "react";
|
|
10
|
-
const p = (
|
|
11
|
-
const n = t.useRef(0),
|
|
12
|
-
const
|
|
9
|
+
const p = (s, m) => {
|
|
10
|
+
const n = t.useRef(0), i = t.useRef(!1), r = t.useRef(), d = (e) => {
|
|
11
|
+
const w = e.duration;
|
|
13
12
|
let o, u;
|
|
14
|
-
const
|
|
13
|
+
const l = n.current && 1 - n.current;
|
|
15
14
|
e.onStart && e.onStart();
|
|
16
|
-
const
|
|
17
|
-
o || (o =
|
|
18
|
-
const c = u /
|
|
19
|
-
c <= 1 ? (e.onUpdate && e.onUpdate(c), r.current = window.requestAnimationFrame(
|
|
15
|
+
const a = (f) => {
|
|
16
|
+
o || (o = f), u = f - o + 1;
|
|
17
|
+
const c = u / w + l;
|
|
18
|
+
c <= 1 ? (e.onUpdate && e.onUpdate(c), r.current = window.requestAnimationFrame(a), n.current = c) : (e.onEnd && e.onEnd(1), n.current = 0);
|
|
20
19
|
};
|
|
21
|
-
r.current = window.requestAnimationFrame(
|
|
20
|
+
r.current = window.requestAnimationFrame(a);
|
|
22
21
|
};
|
|
23
|
-
t.useEffect(() => (d(
|
|
22
|
+
t.useEffect(() => (d(s), () => {
|
|
24
23
|
r.current && window.cancelAnimationFrame(r.current);
|
|
25
|
-
}),
|
|
26
|
-
|
|
24
|
+
}), m), t.useEffect(() => {
|
|
25
|
+
i.current = !0;
|
|
27
26
|
}, []);
|
|
28
27
|
};
|
|
29
28
|
export {
|
package/index.js
CHANGED
|
@@ -5,4 +5,5 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use client";
|
|
8
|
+
"use client";
|
|
9
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./Animation.js"),i=require("./AnimationChild.js"),n=require("./Fade.js"),o=require("./Expand.js"),t=require("./Push.js"),r=require("./Slide.js"),a=require("./Zoom.js"),u=require("./Reveal.js"),s=require("./hooks/useAnimation.js");exports.Animation=e.Animation;exports.AnimationChild=i.AnimationChild;exports.Fade=n.Fade;exports.Expand=o.Expand;exports.Push=t.Push;exports.Slide=r.Slide;exports.Zoom=a.Zoom;exports.Reveal=u.Reveal;exports.useAnimation=s.useAnimation;
|
package/index.mjs
CHANGED
|
@@ -12,17 +12,17 @@ import { Fade as x } from "./Fade.mjs";
|
|
|
12
12
|
import { Expand as i } from "./Expand.mjs";
|
|
13
13
|
import { Push as a } from "./Push.mjs";
|
|
14
14
|
import { Slide as l } from "./Slide.mjs";
|
|
15
|
-
import { Zoom as
|
|
16
|
-
import { Reveal as
|
|
17
|
-
import { useAnimation as
|
|
15
|
+
import { Zoom as h } from "./Zoom.mjs";
|
|
16
|
+
import { Reveal as u } from "./Reveal.mjs";
|
|
17
|
+
import { useAnimation as C } from "./hooks/useAnimation.mjs";
|
|
18
18
|
export {
|
|
19
19
|
e as Animation,
|
|
20
20
|
t as AnimationChild,
|
|
21
21
|
i as Expand,
|
|
22
22
|
x as Fade,
|
|
23
23
|
a as Push,
|
|
24
|
-
|
|
24
|
+
u as Reveal,
|
|
25
25
|
l as Slide,
|
|
26
|
-
|
|
27
|
-
|
|
26
|
+
h as Zoom,
|
|
27
|
+
C as useAnimation
|
|
28
28
|
};
|
package/package-metadata.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
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={name:"@progress/kendo-react-animation",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate: 1738076996,version:"9.4.0-develop.7",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"};exports.packageMetadata=e;
|
package/package-metadata.mjs
CHANGED
|
@@ -5,14 +5,13 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use client";
|
|
9
8
|
const e = {
|
|
10
9
|
name: "@progress/kendo-react-animation",
|
|
11
10
|
productName: "KendoReact",
|
|
12
11
|
productCode: "KENDOUIREACT",
|
|
13
12
|
productCodes: ["KENDOUIREACT"],
|
|
14
|
-
publishDate:
|
|
15
|
-
version: "9.4.0-develop.
|
|
13
|
+
publishDate: 1738076996,
|
|
14
|
+
version: "9.4.0-develop.7",
|
|
16
15
|
licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/components/my-license/"
|
|
17
16
|
};
|
|
18
17
|
export {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@progress/kendo-react-animation",
|
|
3
|
-
"version": "9.4.0-develop.
|
|
3
|
+
"version": "9.4.0-develop.7",
|
|
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",
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
"sideEffects": false,
|
|
27
27
|
"peerDependencies": {
|
|
28
28
|
"@progress/kendo-licensing": "^1.3.4",
|
|
29
|
-
"@progress/kendo-react-common": "9.4.0-develop.
|
|
29
|
+
"@progress/kendo-react-common": "9.4.0-develop.7",
|
|
30
30
|
"@progress/kendo-svg-icons": "^4.0.0",
|
|
31
31
|
"react": "^16.8.2 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc",
|
|
32
32
|
"react-dom": "^16.8.2 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc",
|
|
@@ -53,7 +53,7 @@
|
|
|
53
53
|
"package": {
|
|
54
54
|
"productName": "KendoReact",
|
|
55
55
|
"productCode": "KENDOUIREACT",
|
|
56
|
-
"publishDate":
|
|
56
|
+
"publishDate": 1738076996,
|
|
57
57
|
"licensingDocsUrl": "https://www.telerik.com/kendo-react-ui/components/my-license/"
|
|
58
58
|
}
|
|
59
59
|
},
|
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
|
|
8
|
+
"use strict";const e=require("@progress/kendo-react-common"),a=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},i=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:a,outerWidth:i,styles:e.animationStyles};module.exports=c;
|
package/util.mjs
CHANGED
|
@@ -5,8 +5,7 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
|
|
9
|
-
import { animationStyles as a } from "@progress/kendo-react-common";
|
|
8
|
+
import { animationStyles as s } from "@progress/kendo-react-common";
|
|
10
9
|
const e = (t) => {
|
|
11
10
|
if (!t || !t.ownerDocument.defaultView)
|
|
12
11
|
return 0;
|
|
@@ -20,7 +19,7 @@ const e = (t) => {
|
|
|
20
19
|
}, c = {
|
|
21
20
|
outerHeight: e,
|
|
22
21
|
outerWidth: i,
|
|
23
|
-
styles:
|
|
22
|
+
styles: s
|
|
24
23
|
};
|
|
25
24
|
export {
|
|
26
25
|
c as default
|