chore: update to ts

.gitignore

@@ -36,9 +36,6 @@ build/Release
 node_modules/
 jspm_packages/
 
-# Typescript v1 declaration files
-typings/
-
 # Optional npm cache directory
 .npm
 

antdv-demo

@@ -1 +1 @@
-Subproject commit 83ab203d1ab9861132f6efd1e74015507c0e45f6
+Subproject commit 955716e4e9533bc628c651d6ba6c8d1eb9b21a9d

components/_util/callMoment.ts

@@ -1,4 +0,0 @@
-// https://github.com/moment/moment/issues/3650
-export default function callMoment(moment, ...args) {
-  return (moment.default || moment)(...args);
-}

components/_util/createRef.js

@@ -1,8 +0,0 @@
-function createRef() {
-  const func = function setRef(node) {
-    func.current = node;
-  };
-  return func;
-}
-
-export default createRef;

components/_util/createRef.ts

@@ -0,0 +1,12 @@
+interface RefObject<T> extends Function {
+  current?: T | null;
+}
+
+function createRef<T>(): RefObject<T> {
+  const func: RefObject<T> = (node: T | null) => {
+    func.current = node;
+  };
+  return func;
+}
+
+export default createRef;

components/_util/css-animation/Event.ts

@@ -1,4 +1,4 @@
-const START_EVENT_NAME_MAP = {
+const START_EVENT_NAME_MAP: Record<string, Record<string, string>> = {
   transitionstart: {
     transition: 'transitionstart',
     WebkitTransition: 'webkitTransitionStart',
@@ -16,7 +16,7 @@ const START_EVENT_NAME_MAP = {
   },
 };
 
-const END_EVENT_NAME_MAP = {
+const END_EVENT_NAME_MAP: Record<string, Record<string, string>> = {
   transitionend: {
     transition: 'transitionend',
     WebkitTransition: 'webkitTransitionEnd',
@@ -34,8 +34,8 @@ const END_EVENT_NAME_MAP = {
   },
 };
 
-const startEvents = [];
+const startEvents: any[] = [];
-const endEvents = [];
+const endEvents: any[] = [];
 
 function detectEvents() {
   const testEl = document.createElement('div');
@@ -51,7 +51,7 @@ function detectEvents() {
     delete END_EVENT_NAME_MAP.transitionend.transition;
   }
 
-  function process(EVENT_NAME_MAP, events) {
+  function process(EVENT_NAME_MAP: Record<string, Record<string, string>>, events: any[]) {
     for (const baseEventName in EVENT_NAME_MAP) {
       if (EVENT_NAME_MAP.hasOwnProperty(baseEventName)) {
         const baseEvents = EVENT_NAME_MAP[baseEventName];
@@ -73,11 +73,11 @@ if (typeof window !== 'undefined' && typeof document !== 'undefined') {
   detectEvents();
 }
 
-function addEventListener(node, eventName, eventListener) {
+function addEventListener(node: Element, eventName: string, eventListener: any) {
   node.addEventListener(eventName, eventListener, false);
 }
 
-function removeEventListener(node, eventName, eventListener) {
+function removeEventListener(node: Element, eventName: string, eventListener: any) {
   node.removeEventListener(eventName, eventListener, false);
 }
 
@@ -85,7 +85,7 @@ const TransitionEvents = {
   // Start events
   startEvents,
 
-  addStartEventListener(node, eventListener) {
+  addStartEventListener(node: Element, eventListener: any) {
     if (startEvents.length === 0) {
       window.setTimeout(eventListener, 0);
       return;
@@ -95,7 +95,7 @@ const TransitionEvents = {
     });
   },
 
-  removeStartEventListener(node, eventListener) {
+  removeStartEventListener(node: Element, eventListener: any) {
     if (startEvents.length === 0) {
       return;
     }
@@ -107,7 +107,7 @@ const TransitionEvents = {
   // End events
   endEvents,
 
-  addEndEventListener(node, eventListener) {
+  addEndEventListener(node: Element, eventListener: any) {
     if (endEvents.length === 0) {
       window.setTimeout(eventListener, 0);
       return;
@@ -117,7 +117,7 @@ const TransitionEvents = {
     });
   },
 
-  removeEndEventListener(node, eventListener) {
+  removeEndEventListener(node: Element, eventListener: any) {
     if (endEvents.length === 0) {
       return;
     }

components/_util/css-animation/index.ts

@@ -14,7 +14,13 @@ const capitalPrefixes = [
 ];
 const prefixes = ['-webkit-', '-moz-', '-o-', 'ms-', ''];
 
-function getStyleProperty(node, name) {
+interface CustomHTMLElement extends HTMLElement {
+  rcEndAnimTimeout?: any;
+  rcAnimTimeout?: any;
+  rcEndListener?: Function | null;
+}
+
+function getStyleProperty(node: HTMLElement, name: string) {
   // old ff need null, https://developer.mozilla.org/en-US/docs/Web/API/Window/getComputedStyle
   const style = window.getComputedStyle(node, null);
   let ret = '';
@@ -27,7 +33,7 @@ function getStyleProperty(node, name) {
   return ret;
 }
 
-function fixBrowserByTimeout(node) {
+function fixBrowserByTimeout(node: CustomHTMLElement) {
   if (isCssAnimationSupported) {
     const transitionDelay = parseFloat(getStyleProperty(node, 'transition-delay')) || 0;
     const transitionDuration = parseFloat(getStyleProperty(node, 'transition-duration')) || 0;
@@ -44,20 +50,29 @@ function fixBrowserByTimeout(node) {
   }
 }
 
-function clearBrowserBugTimeout(node) {
+function clearBrowserBugTimeout(node: CustomHTMLElement) {
   if (node.rcEndAnimTimeout) {
     clearTimeout(node.rcEndAnimTimeout);
     node.rcEndAnimTimeout = null;
   }
 }
-
+interface TransitionName {
-const cssAnimation = (node, transitionName, endCallback) => {
+  name?: string;
+  active?: string;
+}
+const cssAnimation = (
+  node: CustomHTMLElement,
+  transitionName: string | TransitionName,
+  endCallback?: any,
+) => {
   const nameIsObj = typeof transitionName === 'object';
-  const className = nameIsObj ? transitionName.name : transitionName;
+  const className = nameIsObj ? (transitionName as TransitionName).name : transitionName;
-  const activeClassName = nameIsObj ? transitionName.active : `${transitionName}-active`;
+  const activeClassName = nameIsObj
+    ? (transitionName as TransitionName).active
+    : `${transitionName}-active`;
   let end = endCallback;
   let start;
-  let active;
+  let active: any;
   const nodeClasses = classes(node);
 
   if (endCallback && Object.prototype.toString.call(endCallback) === '[object Object]') {
@@ -70,7 +85,7 @@ const cssAnimation = (node, transitionName, endCallback) => {
     node.rcEndListener();
   }
 
-  node.rcEndListener = e => {
+  node.rcEndListener = (e: Event) => {
     if (e && e.target !== node) {
       return;
     }
@@ -124,12 +139,12 @@ const cssAnimation = (node, transitionName, endCallback) => {
   };
 };
 
-cssAnimation.style = (node, style, callback) => {
+cssAnimation.style = (node: CustomHTMLElement, style: Record<string, any>, callback?: Function) => {
   if (node.rcEndListener) {
     node.rcEndListener();
   }
 
-  node.rcEndListener = e => {
+  node.rcEndListener = (e: Event) => {
     if (e && e.target !== node) {
       return;
     }
@@ -156,7 +171,7 @@ cssAnimation.style = (node, style, callback) => {
   node.rcAnimTimeout = requestAnimationTimeout(() => {
     for (const s in style) {
       if (style.hasOwnProperty(s)) {
-        node.style[s] = style[s];
+        node.style[s as any] = style[s];
       }
     }
     node.rcAnimTimeout = null;
@@ -164,7 +179,7 @@ cssAnimation.style = (node, style, callback) => {
   }, 0);
 };
 
-cssAnimation.setTransition = (node, p, value) => {
+cssAnimation.setTransition = (node: HTMLElement, p?: any, value?: any) => {
   let property = p;
   let v = value;
   if (value === undefined) {
@@ -173,7 +188,7 @@ cssAnimation.setTransition = (node, p, value) => {
   }
   property = property || '';
   capitalPrefixes.forEach(prefix => {
-    node.style[`${prefix}Transition${property}`] = v;
+    node.style[`${prefix}Transition${property}` as any] = v;
   });
 };
 

components/_util/openAnimation.ts

@@ -2,10 +2,10 @@ import cssAnimation from './css-animation';
 import raf from 'raf';
 import { nextTick } from 'vue';
 
-function animate(node, show, done) {
+function animate(node: HTMLElement, show: boolean, done: () => void) {
-  let height;
+  let height: number;
-  let requestAnimationFrameId;
+  let requestAnimationFrameId: number;
-  let appearRequestAnimationFrameId;
+  let appearRequestAnimationFrameId: number;
   return cssAnimation(node, 'ant-motion-collapse-legacy', {
     start() {
       if (appearRequestAnimationFrameId) {
@@ -54,12 +54,12 @@ function animate(node, show, done) {
 }
 
 const animation = {
-  onEnter(node, done) {
+  onEnter(node: HTMLElement, done: () => void) {
     nextTick(() => {
       animate(node, true, done);
     });
   },
-  onLeave(node, done) {
+  onLeave(node: HTMLElement, done: () => void) {
     return animate(node, false, done);
   },
 };

package.json

@@ -197,6 +197,7 @@
   },
   "dependencies": {
     "@ant-design-vue/use": "^0.0.1-0",
+    "@ant-design/css-animation": "^1.7.3",
     "@ant-design/icons-vue": "^5.1.5",
     "@babel/runtime": "^7.10.5",
     "@simonwep/pickr": "~1.7.0",

typings/custom-typings.d.ts

@@ -0,0 +1,2 @@
+declare module '@ant-design/css-animation*';
+declare module 'component-classes';