From 5dcce12c2c7dd603b39b6771d5607307927c3743 Mon Sep 17 00:00:00 2001 From: Benjy Cui Date: Mon, 22 Aug 2016 17:26:14 +0800 Subject: [PATCH] fix: some tsc errors (#2804) --- components/auto-complete/index.tsx | 2 +- components/button/button.tsx | 1 + components/calendar/locale/en_US.tsx | 3 ++- components/calendar/locale/ru_RU.tsx | 3 ++- components/calendar/locale/zh_CN.tsx | 3 ++- components/carousel/index.tsx | 5 ++-- components/checkbox/Group.tsx | 1 + components/date-picker/createPicker.tsx | 6 ++--- components/date-picker/wrapPicker.tsx | 2 +- components/form/Form.tsx | 28 ++++++++++----------- components/form/FormItem.tsx | 13 ++++++++-- components/form/index.tsx | 3 ++- components/icon/index.tsx | 1 + components/input/Group.tsx | 8 +++--- components/input/Input.tsx | 14 +++++++---- components/input/demo/search-input.md | 4 +-- components/layout/col.tsx | 12 ++++++--- components/layout/row.tsx | 4 ++- components/modal/confirm.tsx | 7 +++++- components/pagination/locale/en_US.tsx | 3 ++- components/pagination/locale/zh_CN.tsx | 3 ++- components/select/index.tsx | 2 ++ components/table/filterDropdown.tsx | 6 ++++- components/tag/index.tsx | 2 +- components/time-picker/index.tsx | 16 +++++++++--- components/timeline/TimelineItem.tsx | 1 + components/tooltip/index.tsx | 1 + custom-typings.d.ts | 33 +++++++++++++++++++------ package.json | 1 + 29 files changed, 131 insertions(+), 57 deletions(-) diff --git a/components/auto-complete/index.tsx b/components/auto-complete/index.tsx index 063ce0092f..8e92ccd1be 100644 --- a/components/auto-complete/index.tsx +++ b/components/auto-complete/index.tsx @@ -3,7 +3,7 @@ import Select, { Option, OptGroup } from '../select'; import classNames from 'classnames'; export interface AutoCompleteProps { - size?: string; + size?: 'large' | 'small' | 'default'; className?: string; notFoundContent?: Element; dataSource: Array; diff --git a/components/button/button.tsx b/components/button/button.tsx index 10a7a189a9..b95679b4ec 100644 --- a/components/button/button.tsx +++ b/components/button/button.tsx @@ -35,6 +35,7 @@ interface ButtonProps { shape?: ButtonShape; size?: ButtonSize; onClick?: React.FormEventHandler; + onMouseUp?: React.FormEventHandler; loading?: boolean; disabled?: boolean; style?: React.CSSProperties; diff --git a/components/calendar/locale/en_US.tsx b/components/calendar/locale/en_US.tsx index 1fde2c098a..6847cc35d8 100644 --- a/components/calendar/locale/en_US.tsx +++ b/components/calendar/locale/en_US.tsx @@ -1 +1,2 @@ -module.exports = require('../../date-picker/locale/en_US'); +import en_US from '../../date-picker/locale/en_US'; +export default en_US; diff --git a/components/calendar/locale/ru_RU.tsx b/components/calendar/locale/ru_RU.tsx index aea2dd9a41..c1feaedaea 100644 --- a/components/calendar/locale/ru_RU.tsx +++ b/components/calendar/locale/ru_RU.tsx @@ -1 +1,2 @@ -module.exports = require('../../date-picker/locale/ru_RU'); +import ru_RU from '../../date-picker/locale/ru_RU'; +export default ru_RU; diff --git a/components/calendar/locale/zh_CN.tsx b/components/calendar/locale/zh_CN.tsx index 1880b1a980..9c83ec8453 100644 --- a/components/calendar/locale/zh_CN.tsx +++ b/components/calendar/locale/zh_CN.tsx @@ -1 +1,2 @@ -module.exports = require('../../date-picker/locale/zh_CN'); +import zh_CN from '../../date-picker/locale/zh_CN'; +export default zh_CN; diff --git a/components/carousel/index.tsx b/components/carousel/index.tsx index 721af47654..af7feeba4a 100644 --- a/components/carousel/index.tsx +++ b/components/carousel/index.tsx @@ -2,8 +2,9 @@ // https://github.com/WickyNilliams/enquire.js/issues/82 import assign from 'object-assign'; if (typeof window !== 'undefined') { - const matchMediaPolyfill = function matchMediaPolyfill() { + const matchMediaPolyfill = function matchMediaPolyfill(mediaQuery: string): MediaQueryList { return { + media: mediaQuery, matches: false, addListener() { }, @@ -23,7 +24,7 @@ export interface CarouselProps { /** 动画效果函数,可取 scrollx, fade */ effect?: CarouselEffect; /** 是否显示面板指示点 */ - dots?: SlickCarouselboolean; + dots?: boolean; /** 垂直显示 */ vertical?: boolean; /** 是否自动切换 */ diff --git a/components/checkbox/Group.tsx b/components/checkbox/Group.tsx index 24cc6fb05b..c9380834b1 100644 --- a/components/checkbox/Group.tsx +++ b/components/checkbox/Group.tsx @@ -59,6 +59,7 @@ export default class CheckboxGroup extends React.Component { if (typeof option === 'string') { return { diff --git a/components/date-picker/createPicker.tsx b/components/date-picker/createPicker.tsx index 0aea0d27fa..6940e1bf9f 100644 --- a/components/date-picker/createPicker.tsx +++ b/components/date-picker/createPicker.tsx @@ -60,10 +60,10 @@ export default function createPicker(TheCalendar) { }); // 需要选择时间时,点击 ok 时才触发 onChange - let pickerChangeHandler = { + let pickerChangeHandler: Object = { onChange: this.handleChange, }; - let calendarHandler = { + let calendarHandler: Object = { onOk: this.handleChange, // fix https://github.com/ant-design/ant-design/issues/1902 onSelect: (value, cause) => { @@ -95,7 +95,7 @@ export default function createPicker(TheCalendar) { ); // default width for showTime - const pickerStyle = {}; + const pickerStyle = { width: undefined }; if (props.showTime) { pickerStyle.width = 180; } diff --git a/components/date-picker/wrapPicker.tsx b/components/date-picker/wrapPicker.tsx index 773ae22fca..bfb93b465c 100644 --- a/components/date-picker/wrapPicker.tsx +++ b/components/date-picker/wrapPicker.tsx @@ -46,7 +46,7 @@ export default function wrapPicker(Picker, defaultFormat?) { getFormatter() { const format = this.props.format; - const formatter = new DateTimeFormat(format, this.getLocale().lang.format); + const formatter = new DateTimeFormat(format as string, this.getLocale().lang.format); return formatter; }, diff --git a/components/form/Form.tsx b/components/form/Form.tsx index 7a295a94af..000365baf8 100644 --- a/components/form/Form.tsx +++ b/components/form/Form.tsx @@ -28,31 +28,31 @@ export interface FormProps { } // function create -export type CreateFormOptions = { +export type WrappedFormUtils = { /** 获取一组输入控件的值,如不传入参数,则获取全部组件的值*/ - getFieldsValue(): (fieldNames?: Array) => any; + getFieldsValue(fieldNames?: Array): Object; /** 获取一个输入控件的值*/ - getFieldValue(): (fieldName: string) => any; + getFieldValue(fieldName: string): any; /** 设置一组输入控件的值*/ - setFieldsValue(): (obj: Object) => void; + setFieldsValue(obj: Object): void; /** 设置一组输入控件的值*/ - setFields(): (obj: Object) => void; + setFields(obj: Object): void; /** 校验并获取一组输入域的值与 Error*/ - validateFields(): (fieldNames?: Array, options?: Object, callback?: (erros: any, values: any) => void) => any; + validateFields(fieldNames?: Array, options?: Object, callback?: (erros: any, values: any) => void): any; /** 与 `validateFields` 相似,但校验完后,如果校验不通过的菜单域不在可见范围内,则自动滚动进可见范围 */ - validateFieldsAndScroll(): ( + validateFieldsAndScroll( fieldNames?: Array, options?: Object, callback?: (erros: any, values: any) => void - ) => any; + ): void; /** 获取某个输入控件的 Error */ - getFieldError(): (name: string) => Object; + getFieldError(name: string): Object[]; /** 判断一个输入控件是否在校验状态*/ - isFieldValidating(): (name: string) => Object; + isFieldValidating(name: string): boolean; /**重置一组输入控件的值与状态,如不传入参数,则重置所有组件*/ - resetFields(): (names?: Array) => void; + resetFields(names?: Array): void; - getFieldsValue(): (id: string, options: { + getFieldProps(id: string, options: { /** 子节点的值的属性,如 Checkbox 的是 'checked'*/ valuePropName?: string; /** 子节点的初始值,类型、可选值均由子节点决定*/ @@ -65,11 +65,11 @@ export type CreateFormOptions = { rules?: Array; /** 必填输入控件唯一标志*/ id?: string; - }) => Array; + }): Array; } export interface FormComponentProps { - form: CreateFormOptions; + form: WrappedFormUtils; } export class FormComponent extends React.Component { diff --git a/components/form/FormItem.tsx b/components/form/FormItem.tsx index 7f1d826d4d..1d10807eb2 100644 --- a/components/form/FormItem.tsx +++ b/components/form/FormItem.tsx @@ -3,6 +3,7 @@ import classNames from 'classnames'; import PureRenderMixin from 'react-addons-pure-render-mixin'; import Row from '../row'; import Col from '../col'; +import { WrappedFormUtils } from './Form'; import { FIELD_META_PROP } from './constants'; export interface FormItemLabelColOption { @@ -12,7 +13,8 @@ export interface FormItemLabelColOption { export interface FormItemProps { prefixCls?: string; - label?: React.ReactNode; + id?: string; + label?: string; labelCol?: FormItemLabelColOption; wrapperCol?: FormItemLabelColOption; help?: React.ReactNode; @@ -22,6 +24,11 @@ export interface FormItemProps { className?: string; required?: boolean; style?: React.CSSProperties; + colon?: boolean; +} + +export interface FormItemContext { + form: WrappedFormUtils; } export default class FormItem extends React.Component { @@ -33,7 +40,7 @@ export default class FormItem extends React.Component { static propTypes = { prefixCls: React.PropTypes.string, - label: React.PropTypes.node, + label: React.PropTypes.string, labelCol: React.PropTypes.object, help: React.PropTypes.oneOfType([React.PropTypes.node, React.PropTypes.bool]), validateStatus: React.PropTypes.oneOf(['', 'success', 'warning', 'error', 'validating']), @@ -49,6 +56,8 @@ export default class FormItem extends React.Component { form: React.PropTypes.object, }; + context: FormItemContext; + shouldComponentUpdate(...args) { return PureRenderMixin.shouldComponentUpdate.apply(this, args); } diff --git a/components/form/index.tsx b/components/form/index.tsx index f1300440e0..d7bf5d60e9 100644 --- a/components/form/index.tsx +++ b/components/form/index.tsx @@ -1,4 +1,5 @@ -import React, { PropTypes } from 'react'; +import * as React from 'react'; +import { PropTypes } from 'react'; import createDOMForm from 'rc-form/lib/createDOMForm'; import Form from './Form'; import FormItem from './FormItem'; diff --git a/components/icon/index.tsx b/components/icon/index.tsx index 37e1a1dc8b..26b4bb0b11 100644 --- a/components/icon/index.tsx +++ b/components/icon/index.tsx @@ -3,6 +3,7 @@ import * as React from 'react'; export interface IconProps { type: string; className?: string; + title?: string; onClick?: (e) => void; } diff --git a/components/input/Group.tsx b/components/input/Group.tsx index fa44e047b8..560d3b08d7 100644 --- a/components/input/Group.tsx +++ b/components/input/Group.tsx @@ -2,13 +2,13 @@ import * as React from 'react'; import classNames from 'classnames'; export interface GroupProps { - size?: 'large' | 'small' | 'default'; className?: string; + size?: 'large' | 'small' | 'default'; children?: any; style?: React.CSSProperties; } -export default function Group(props: GroupProps) { +const Group: React.StatelessComponent = (props) => { const className = classNames({ 'ant-input-group': true, 'ant-input-group-lg': props.size === 'large', @@ -20,8 +20,10 @@ export default function Group(props: GroupProps) { {props.children} ); -} +}; Group.propTypes = { children: React.PropTypes.any, }; + +export default Group; diff --git a/components/input/Input.tsx b/components/input/Input.tsx index 5ff840cf63..35cbd4055d 100644 --- a/components/input/Input.tsx +++ b/components/input/Input.tsx @@ -34,21 +34,25 @@ interface AutoSizeType { export interface InputProps { prefixCls?: string; + className?: string; type: string; id?: number | string; value?: any; defaultValue?: any; + placeholder?: string; size?: 'large' | 'default' | 'small'; disabled?: boolean; + readOnly?: boolean; addonBefore?: React.ReactNode; addonAfter?: React.ReactNode; - onPressEnter?: (e) => any; - onKeyDown?: (e) => any; - onChange?: (e) => any; + onPressEnter?: React.FormEventHandler; + onKeyDown?: React.FormEventHandler; + onChange?: React.FormEventHandler; autosize?: boolean | AutoSizeType; } export default class Input extends Component { + static Group: any; static defaultProps = { defaultValue: '', disabled: false, @@ -121,8 +125,8 @@ export default class Input extends Component { if (type !== 'textarea' || !autosize || !this.refs.input) { return; } - const minRows = autosize ? autosize.minRows : null; - const maxRows = autosize ? autosize.maxRows : null; + const minRows = autosize ? (autosize as AutoSizeType).minRows : null; + const maxRows = autosize ? (autosize as AutoSizeType).maxRows : null; const textareaStyles = calculateNodeHeight(this.refs.input, false, minRows, maxRows); this.setState({ textareaStyles }); } diff --git a/components/input/demo/search-input.md b/components/input/demo/search-input.md index f5495e8126..76aa93e1f0 100644 --- a/components/input/demo/search-input.md +++ b/components/input/demo/search-input.md @@ -5,11 +5,11 @@ title: en-US: Search box --- -## zh-CN: +## zh-CN 带有搜索按钮的输入框。 -## en-US: +## en-US Example of creating a search box by grouping a standard input with a search button. diff --git a/components/layout/col.tsx b/components/layout/col.tsx index 899fe8cacf..bad0db3a6f 100644 --- a/components/layout/col.tsx +++ b/components/layout/col.tsx @@ -1,10 +1,11 @@ -import { PropTypes } from 'react'; import * as React from 'react'; +import { PropTypes } from 'react'; import classNames from 'classnames'; import assign from 'object-assign'; +import splitObject from '../_util/splitObject'; + const stringOrNumber = PropTypes.oneOfType([PropTypes.string, PropTypes.number]); const objectOrNumber = PropTypes.oneOfType([PropTypes.object, PropTypes.number]); -import splitObject from '../_util/splitObject'; interface ColSize { span?: number; @@ -15,6 +16,7 @@ interface ColSize { } export interface ColProps { + className?: string; span?: number; order?: number; offset?: number; @@ -26,7 +28,7 @@ export interface ColProps { lg?: ColSize; } -export default function Col(props: ColProps) { +const Col: React.StatelessComponent = (props) => { const [{ span, order, offset, push, pull, className, children }, others] = splitObject(props, ['span', 'order', 'offset', 'push', 'pull', 'className', 'children']); let sizeClassObj = {}; @@ -58,7 +60,7 @@ export default function Col(props: ColProps) { }, sizeClassObj)); return
{children}
; -} +}; Col.propTypes = { span: stringOrNumber, @@ -73,3 +75,5 @@ Col.propTypes = { md: objectOrNumber, lg: objectOrNumber, }; + +export default Col; diff --git a/components/layout/row.tsx b/components/layout/row.tsx index 84ef675dd0..2da231588b 100644 --- a/components/layout/row.tsx +++ b/components/layout/row.tsx @@ -5,10 +5,12 @@ import assign from 'object-assign'; import splitObject from '../_util/splitObject'; export interface RowProps { + className?: string; gutter?: number; type?: 'flex'; align?: 'top' | 'middle' | 'bottom'; justify?: 'start' | 'end' | 'center' | 'space-around' | 'space-between'; + style?: React.CSSProperties; } export default class Row extends React.Component { @@ -37,7 +39,7 @@ export default class Row extends React.Component { marginLeft: gutter / -2, marginRight: gutter / -2, }, style) : style; - const cols = Children.map(children, col => { + const cols = Children.map(children, (col) => { if (!col) { return null; } diff --git a/components/modal/confirm.tsx b/components/modal/confirm.tsx index d83d4680a1..5ba9c46bfd 100644 --- a/components/modal/confirm.tsx +++ b/components/modal/confirm.tsx @@ -7,7 +7,12 @@ import classNames from 'classnames'; import { getConfirmLocale } from './locale'; import assign from 'object-assign'; -class ActionButton extends React.Component { +export interface ActionButtonProps { + type: 'primary' | 'ghost' | 'dashed'; + actionFn: Function; + closeModal: Function; +} +class ActionButton extends React.Component { constructor(props) { super(props); this.state = { diff --git a/components/pagination/locale/en_US.tsx b/components/pagination/locale/en_US.tsx index 52ac7907a5..3a508c34d7 100644 --- a/components/pagination/locale/en_US.tsx +++ b/components/pagination/locale/en_US.tsx @@ -1 +1,2 @@ -module.exports = require('rc-pagination/lib/locale/en_US'); +import en_US from 'rc-pagination/lib/locale/en_US'; +export default en_US; diff --git a/components/pagination/locale/zh_CN.tsx b/components/pagination/locale/zh_CN.tsx index ae8c1226a4..fd6c5fd979 100644 --- a/components/pagination/locale/zh_CN.tsx +++ b/components/pagination/locale/zh_CN.tsx @@ -1 +1,2 @@ -module.exports = require('rc-pagination/lib/locale/zh_CN'); +import zh_CN from 'rc-pagination/lib/locale/zh_CN'; +export default zh_CN; diff --git a/components/select/index.tsx b/components/select/index.tsx index 1904417556..8eb00c61a1 100644 --- a/components/select/index.tsx +++ b/components/select/index.tsx @@ -42,6 +42,8 @@ export interface SelectContext { }; } +export { Option, OptGroup } + export default class Select extends React.Component { static Option = Option; static OptGroup = OptGroup; diff --git a/components/table/filterDropdown.tsx b/components/table/filterDropdown.tsx index a60621a427..dbb560fe64 100644 --- a/components/table/filterDropdown.tsx +++ b/components/table/filterDropdown.tsx @@ -5,7 +5,11 @@ import Icon from '../icon'; import Checkbox from '../checkbox'; import Radio from '../radio'; -const FilterDropdownMenuWrapper = ({ onClick, children }) => ( +export interface FilterDropdownMenuWrapperProps { + onClick?: Function; + children?: any; +} +const FilterDropdownMenuWrapper: React.StatelessComponent = ({ onClick, children }) => (
{children}
); diff --git a/components/tag/index.tsx b/components/tag/index.tsx index fcb48a56c2..5dbcd052c7 100644 --- a/components/tag/index.tsx +++ b/components/tag/index.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import ReactDOM from 'react-dom'; +import * as ReactDOM from 'react-dom'; import Animate from 'rc-animate'; import Icon from '../icon'; import classNames from 'classnames'; diff --git a/components/time-picker/index.tsx b/components/time-picker/index.tsx index 211a566a4d..e35fe70c19 100644 --- a/components/time-picker/index.tsx +++ b/components/time-picker/index.tsx @@ -8,6 +8,7 @@ import assign from 'object-assign'; // TimePicker export interface TimePickerProps { + size: 'large' | 'default' | 'small'; /** 默认时间 */ value?: string | Date; /** 初始默认时间 */ @@ -15,7 +16,7 @@ export interface TimePickerProps { /** 展示的时间格式 : "HH:mm:ss"、"HH:mm"、"mm:ss" */ format?: string; /** 时间发生变化的回调 */ - onChange?: (Date: Date) => void; + onChange?: (date: Date, dateString: string) => void; /** 禁用全部操作 */ disabled?: boolean; /** 没有值的时候显示的内容 */ @@ -33,6 +34,13 @@ export interface TimePickerProps { style?: React.CSSProperties; } + +export interface TimePickerContext { + antLocale?: { + TimePicker?: any, + }; +} + export default class TimePicker extends React.Component { static defaultProps = { format: 'HH:mm:ss', @@ -56,8 +64,10 @@ export default class TimePicker extends React.Component { antLocale: React.PropTypes.object, }; + context: TimePickerContext; + getFormatter() { - return new DateTimeFormat(this.props.format, this.getLocale().format); + return new DateTimeFormat(this.props.format as string, this.getLocale().format); } /** @@ -95,7 +105,7 @@ export default class TimePicker extends React.Component { handleChange = (value) => { this.props.onChange( value ? new Date(value.getTime()) : null, - value ? this.getFormatter().format(value) : '', + value ? this.getFormatter().format(value) : '' ); } diff --git a/components/timeline/TimelineItem.tsx b/components/timeline/TimelineItem.tsx index a9a4595c60..1077a07be9 100644 --- a/components/timeline/TimelineItem.tsx +++ b/components/timeline/TimelineItem.tsx @@ -7,6 +7,7 @@ export interface TimeLineItemProps { /** 指定圆圈颜色 */ color?: string; dot?: React.ReactNode; + pending?: boolean; style?: React.CSSProperties; } diff --git a/components/tooltip/index.tsx b/components/tooltip/index.tsx index 164073bf0d..bc0a4b61cc 100644 --- a/components/tooltip/index.tsx +++ b/components/tooltip/index.tsx @@ -32,6 +32,7 @@ export interface TooltipProps { visible?: boolean; trigger?: 'hover' | 'focus' | 'click'; overlay?: React.ReactNode; + openClassName?: string; } export default class Tooltip extends React.Component { diff --git a/custom-typings.d.ts b/custom-typings.d.ts index 6bec462f9c..f99097f035 100644 --- a/custom-typings.d.ts +++ b/custom-typings.d.ts @@ -8,7 +8,7 @@ declare module 'react-addons-pure-render-mixin' { } declare module 'gregorian-calendar-format' { - export default function({}): string; + export default function(format: string, localeFormat: Object): string; } declare module 'gregorian-calendar' { @@ -127,7 +127,7 @@ declare module 'rc-cascader' { } declare module 'array-tree-filter' { - export default function(): any; + export default function(tree: any, filter: any): any; } declare module 'rc-checkbox' { @@ -143,16 +143,25 @@ declare module 'rc-dropdown' { } declare module 'rc-editor-mention' { - export default function(): any; + export const Nav: any; + export const toString: any; + export const toEditorState: any; + export const getMentions: any; + const exports: any; + export default exports; } declare module 'rc-progress' { - export default function(): any; + export const Circle: any; + const exports: any; + export default exports; } declare module 'rc-menu' { export const SubMenu: any; export const Item: any; + export const Divider: any; + export const ItemGroup: any; export default function(): any; } @@ -178,11 +187,19 @@ declare module 'rc-input-number' { } declare module 'rc-pagination' { - export default function(): any; + const exports: any; + export default exports; +} + +declare module 'rc-pagination/lib/locale/zh_CN' { + const exports: any; + export default exports; } declare module 'rc-notification' { - export default function(): any; + export function newInstance(config: Object): any; + const exports: any; + export default exports; } declare module 'rc-dialog' { @@ -228,7 +245,9 @@ declare module 'rc-upload' { } declare module 'rc-collapse' { - export default function(): any; + export const Panel: any; + const exports: any; + export default exports; } declare module 'rc-form/lib/createDOMForm' { diff --git a/package.json b/package.json index f379acf21b..cd47e47f75 100644 --- a/package.json +++ b/package.json @@ -141,6 +141,7 @@ "eslint-fix": "eslint --fix components test site scripts ./*.js --ext '.js,.jsx' && eslint-tinker ./components/*/demo/*.md", "test": "npm run lint && npm run dist", "jest": "jest", + "postinstall": "typings install", "pre-publish": "node ./scripts/prepub", "prepublish": "antd-tools run guard", "pub": "antd-tools run update-self && antd-tools run pub",