chore(Animate): rename file to ts suffix

alibaba-fusion · Jan 13, 2024 · 9fbc0aa · 9fbc0aa
1 parent 71f9004
commit 9fbc0aa
Show file tree

Hide file tree

Showing 9 changed files with 50 additions and 18 deletions.
diff --git a/components/animate/__tests__/index-spec.js → components/animate/__tests__/index-spec.tsx b/components/animate/__tests__/index-spec.js → components/animate/__tests__/index-spec.tsx
@@ -82,7 +82,7 @@ describe('Animate', () => {
     }
 
     it('should play appear animation', () => {
-        return co(function*() {
+        return co(function* () {
             ReactDOM.render(<Demo visible />, mountNode);
             const demo = document.querySelector('.basic-demo');
             assert(hasClass(demo, 'my-zoom-appear'));
@@ -95,7 +95,7 @@ describe('Animate', () => {
     });
 
     it('should not play appear animation if set animationAppear to false', () => {
-        return co(function*() {
+        return co(function* () {
             ReactDOM.render(<Demo visible animationAppear={false} />, mountNode);
             const demo = document.querySelector('.basic-demo');
             assert(!hasClass(demo, 'my-zoom-appear'));
@@ -105,7 +105,7 @@ describe('Animate', () => {
     });
 
     it('should play enter animation', () => {
-        return co(function*() {
+        return co(function* () {
             ReactDOM.render(<Demo />, mountNode);
             const btn = document.querySelector('button');
             btn.click();
@@ -120,7 +120,7 @@ describe('Animate', () => {
     });
 
     it('should play leave animation', () => {
-        return co(function*() {
+        return co(function* () {
             ReactDOM.render(<Demo visible animationAppear={false} />, mountNode);
             const btn = document.querySelector('button');
             btn.click();
@@ -134,7 +134,7 @@ describe('Animate', () => {
     });
 
     it('should support passing object to animation property', () => {
-        return co(function*() {
+        return co(function* () {
             ReactDOM.render(
                 <Demo
                     animation={{
@@ -164,7 +164,7 @@ describe('Animate', () => {
     });
 
     it('should play expand animation', () => {
-        return co(function*() {
+        return co(function* () {
             ReactDOM.render(<Demo visible={false} expand animation="expand" />, mountNode);
             const btn = document.querySelector('button');
             btn.click();

diff --git a/components/animate/animate.jsx → components/animate/animate.tsx b/components/animate/animate.jsx → components/animate/animate.tsx
@@ -161,7 +161,11 @@ class Animate extends Component {
         });
 
         return (
-            <TransitionGroup appear={animationAppear} component={singleMode ? FirstChild : component} {...others}>
+            <TransitionGroup
+                appear={animationAppear}
+                component={singleMode ? FirstChild : component}
+                {...others}
+            >
                 {animateChildren}
             </TransitionGroup>
         );

diff --git a/components/animate/child.jsx → components/animate/child.tsx b/components/animate/child.jsx → components/animate/child.tsx
@@ -100,26 +100,44 @@ export default class AnimateChild extends Component {
 
             this.node = node;
             if (support.transition) {
-                const transitionEndListener = this.generateEndListener(node, done, 'transitionend', id);
+                const transitionEndListener = this.generateEndListener(
+                    node,
+                    done,
+                    'transitionend',
+                    id
+                );
                 on(node, 'transitionend', transitionEndListener);
                 this.endListeners.transitionend.push(transitionEndListener);
             }
             if (support.animation) {
-                const animationEndListener = this.generateEndListener(node, done, 'animationend', id);
+                const animationEndListener = this.generateEndListener(
+                    node,
+                    done,
+                    'animationend',
+                    id
+                );
                 on(node, 'animationend', animationEndListener);
                 this.endListeners.animationend.push(animationEndListener);
             }
 
             setTimeout(() => {
                 const transitionDelay = parseFloat(getStyleProperty(node, 'transition-delay')) || 0;
-                const transitionDuration = parseFloat(getStyleProperty(node, 'transition-duration')) || 0;
+                const transitionDuration =
+                    parseFloat(getStyleProperty(node, 'transition-duration')) || 0;
                 const animationDelay = parseFloat(getStyleProperty(node, 'animation-delay')) || 0;
-                const animationDuration = parseFloat(getStyleProperty(node, 'animation-duration')) || 0;
-                const time = Math.max(transitionDuration + transitionDelay, animationDuration + animationDelay);
+                const animationDuration =
+                    parseFloat(getStyleProperty(node, 'animation-duration')) || 0;
+                const time = Math.max(
+                    transitionDuration + transitionDelay,
+                    animationDuration + animationDelay
+                );
                 if (time) {
-                    this.timeoutMap[id] = setTimeout(() => {
-                        done();
-                    }, time * 1000 + 200);
+                    this.timeoutMap[id] = setTimeout(
+                        () => {
+                            done();
+                        },
+                        time * 1000 + 200
+                    );
                 }
             }, 15);
         } else {
@@ -166,7 +184,9 @@ export default class AnimateChild extends Component {
     handleEntered(node, isAppearing) {
         const { names } = this.props;
         if (names) {
-            const classNames = isAppearing ? [names.appear, names.appearActive] : [names.enter, names.enterActive];
+            const classNames = isAppearing
+                ? [names.appear, names.appearActive]
+                : [names.enter, names.enterActive];
             classNames.forEach(className => {
                 removeClass(node, className);
             });

diff --git a/components/animate/expand.jsx → components/animate/expand.tsx b/components/animate/expand.jsx → components/animate/expand.tsx
@@ -28,7 +28,14 @@ export default class Expand extends Component {
 
     constructor(props) {
         super(props);
-        func.bindCtx(this, ['beforeEnter', 'onEnter', 'afterEnter', 'beforeLeave', 'onLeave', 'afterLeave']);
+        func.bindCtx(this, [
+            'beforeEnter',
+            'onEnter',
+            'afterEnter',
+            'beforeLeave',
+            'onLeave',
+            'afterLeave',
+        ]);
     }
 
     beforeEnter(node) {

diff --git a/components/animate/index.jsx → components/animate/index.tsx b/components/animate/index.jsx → components/animate/index.tsx
diff --git a/components/animate/mobile/index.jsx → components/animate/mobile/index.tsx b/components/animate/mobile/index.jsx → components/animate/mobile/index.tsx
diff --git a/components/animate/overlay-animate.jsx → components/animate/overlay-animate.tsx b/components/animate/overlay-animate.jsx → components/animate/overlay-animate.tsx
@@ -46,7 +46,8 @@ const OverlayAnimate = props => {
         }
     });
 
-    const animationMap = typeof animation === 'string' ? { in: animation, out: animation } : animation;
+    const animationMap =
+        typeof animation === 'string' ? { in: animation, out: animation } : animation;
 
     const animateClsMap = animation
         ? {

diff --git a/components/animate/style.js → components/animate/style.ts b/components/animate/style.js → components/animate/style.ts
diff --git a/components/animate/index.d.ts → components/animate/types.ts b/components/animate/index.d.ts → components/animate/types.ts