refactor: rewrite form and dropdown in ts (#2683)

components/dropdown/dropdown-button.tsx

@@ -5,7 +5,18 @@ import Dropdown from './dropdown';
 const ButtonGroup = Button.Group;
 import classNames from 'classnames';
 import splitObject from '../_util/splitObject';
-export default class DropdownButton extends React.Component {
+
+export interface DropdownButtonProps {
+  type?: 'primary' | 'ghost' | 'dash';
+  onClick?: React.FormEventHandler;
+  trigger?: 'click' | 'hover';
+  overlay: React.ReactNode;
+  visible?: boolean;
+  onVisibleChange?: (visible: boolean) => void;
+  style?: React.CSSProperties;
+}
+
+export default class DropdownButton extends React.Component<DropdownButtonProps, any> {
   static defaultProps = {
     align: {
       points: ['tr', 'br'],

components/dropdown/dropdown.tsx

@@ -2,10 +2,11 @@ import * as React from 'react';
 import RcDropdown from 'rc-dropdown';
 
 export interface DropDownProps {
-  trigger: string[];
+  trigger?: Array<'click'|'hover'>;
   overlay: React.ReactNode;
-  visible: boolean;
+  style?: React.CSSProperties;
   onVisibleChange: (visible: boolean) => void;
+  visible: boolean;
 }
 
 export default class Dropdown extends React.Component<DropDownProps, any> {

components/form/Form.tsx

@@ -3,8 +3,84 @@ import classNames from 'classnames';
 import PureRenderMixin from 'react-addons-pure-render-mixin';
 import omit from 'object.omit';
 import warning from 'warning';
+import FormItem from './FormItem';
 
-export default class Form extends React.Component {
+interface FormCreateOption {
+  onFieldsChange?: (props: any, fields: Array<any>) => void;
+  /**  把 props 转为对应的值，可用于把 Redux store 中的值读出 */
+  mapPropsToFields?: (props: any) => void;
+}
+
+interface FormProps {
+  prefixCls?: string;
+  /** 水平排列布局*/
+  horizontal?: boolean;
+  /** 行内排列布局*/
+  inline?: boolean;
+  /** 经 `Form.create()` 包装过的组件会自带 `this.props.form` 属性，直接传给 Form 即可*/
+  form?: Object;
+  /** 数据验证成功后回调事件*/
+  onSubmit?: React.FormEventHandler;
+
+  style?: React.CSSProperties;
+  className?: string;
+  vertical?: boolean;
+}
+
+// function  create
+type CreateFormOptions = {
+  /** 获取一组输入控件的值，如不传入参数，则获取全部组件的值*/
+  getFieldsValue(): (fieldNames?: Array<string>) => any;
+  /** 获取一个输入控件的值*/
+  getFieldValue(): (fieldName: string) => any;
+  /** 设置一组输入控件的值*/
+  setFieldsValue(): (obj: Object) => void;
+  /** 设置一组输入控件的值*/
+  setFields(): (obj: Object) => void;
+  /** 校验并获取一组输入域的值与 Error*/
+  validateFields(): (fieldNames?: Array<string>, options?: Object, callback?: (erros: any, values: any) => void) => any;
+  /** 与 `validateFields` 相似，但校验完后，如果校验不通过的菜单域不在可见范围内，则自动滚动进可见范围 */
+  validateFieldsAndScroll(): (
+    fieldNames?: Array<string>,
+    options?: Object,
+    callback?: (erros: any, values: any) => void
+  ) => any;
+  /** 获取某个输入控件的 Error */
+  getFieldError(): (name: string) => Object;
+  /** 判断一个输入控件是否在校验状态*/
+  isFieldValidating(): (name: string) => Object;
+  /**重置一组输入控件的值与状态，如不传入参数，则重置所有组件*/
+  resetFields(): (names?: Array<string>) => void;
+
+  getFieldsValue(): (id: string, options: {
+    /** 子节点的值的属性，如 Checkbox 的是 'checked'*/
+    valuePropName?: string;
+    /** 子节点的初始值，类型、可选值均由子节点决定*/
+    initialValue?: any;
+    /** 收集子节点的值的时机*/
+    trigger?: string;
+    /** 校验子节点值的时机*/
+    validateTrigger?: string;
+    /** 校验规则，参见 [async-validator](https://github.com/yiminghe/async-validator) */
+    rules?: Array<any>;
+    /** 必填输入控件唯一标志*/
+    id?: string;
+  }) => Array<any>;
+}
+
+interface FormComponentProps {
+  form: CreateFormOptions;
+}
+
+export class FormComponent extends React.Component<FormComponentProps, {}> {
+}
+
+interface ComponentDecorator {
+  <T extends (typeof FormComponent)>(component: T): T;
+}
+
+export default class Form extends React.Component<FormProps, any> {
+  static Item: typeof FormItem;
   static defaultProps = {
     prefixCls: 'ant-form',
     onSubmit(e) {
@@ -21,6 +97,7 @@ export default class Form extends React.Component {
     onSubmit: React.PropTypes.func,
   };
 
+  static create(options?: FormCreateOption): ComponentDecorator;
   constructor(props) {
     super(props);
 

components/form/FormItem.tsx

@@ -5,7 +5,26 @@ import Row from '../row';
 import Col from '../col';
 import { FIELD_META_PROP } from './constants';
 
-export default class FormItem extends React.Component {
+export interface FormItemLabelColOption {
+  span: number;
+  offset: number;
+}
+
+export interface FormItemProps {
+  prefixCls?: string;
+  label?: React.ReactNode;
+  labelCol?: FormItemLabelColOption;
+  wrapperCol?: FormItemLabelColOption;
+  help?: React.ReactNode;
+  extra?: string;
+  validateStatus?: 'success' | 'warning' | 'error' | 'validating';
+  hasFeedback?: boolean;
+  className?: string;
+  required?: boolean;
+  style?: React.CSSProperties;
+}
+
+export default class FormItem extends React.Component<FormItemProps, any> {
   static defaultProps = {
     hasFeedback: false,
     prefixCls: 'ant-form',