feat: add component Vue.use method (#197)

* feat: add Vue.use feat

* feat: Vue.use method

* docs: update docs

components/affix/index.jsx

@@ -55,7 +55,7 @@ const AffixProps = {
   prefixCls: PropTypes.string,
 }
 
-export default {
+const Affix = {
   name: 'AAffix',
   props: AffixProps,
   mixins: [BaseMixin],
@@ -264,3 +264,9 @@ export default {
   },
 }
 
+/* istanbul ignore next */
+Affix.install = function (Vue) {
+  Vue.component(Affix.name, Affix)
+}
+
+export default Affix

components/alert/index.jsx

@@ -30,7 +30,7 @@ export const AlertProps = {
   banner: PropTypes.bool,
 }
 
-export default {
+const Alert = {
   props: AlertProps,
   mixins: [BaseMixin],
   name: 'AAlert',
@@ -133,3 +133,10 @@ export default {
   },
 }
 
+/* istanbul ignore next */
+Alert.install = function (Vue) {
+  Vue.component(Alert.name, Alert)
+}
+
+export default Alert
+

components/anchor/index.jsx

@@ -5,4 +5,11 @@ export { AnchorProps } from './Anchor'
 export { AnchorLinkProps } from './AnchorLink'
 
 Anchor.Link = AnchorLink
+
+/* istanbul ignore next */
+Anchor.install = function (Vue) {
+  Vue.component(Anchor.name, Anchor)
+  Vue.component(Anchor.Link.name, Anchor.Link)
+}
+
 export default Anchor

components/auto-complete/index.jsx

@@ -31,7 +31,7 @@ const AutoCompleteProps = {
   // onSelect?: (value: SelectValue, option: Object) => any;
 }
 
-export default {
+const AutoComplete = {
   name: 'AAutoComplete',
   props: {
     ...AutoCompleteProps,
@@ -136,3 +136,12 @@ export default {
   },
 }
 
+/* istanbul ignore next */
+AutoComplete.install = function (Vue) {
+  Vue.component(AutoComplete.name, AutoComplete)
+  Vue.component(AutoComplete.Option.name, AutoComplete.Option)
+  Vue.component(AutoComplete.OptGroup.name, AutoComplete.OptGroup)
+}
+
+export default AutoComplete
+

components/avatar/index.js

@@ -1,3 +1,8 @@
 import Avatar from './Avatar'
 
+/* istanbul ignore next */
+Avatar.install = function (Vue) {
+  Vue.component(Avatar.name, Avatar)
+}
+
 export default Avatar

components/back-top/index.jsx

@@ -26,7 +26,7 @@ const BackTopProps = {
   prefixCls: PropTypes.string,
 }
 
-export default {
+const BackTop = {
   name: 'ABackTop',
   mixins: [BaseMixin],
   props: {
@@ -130,3 +130,9 @@ export default {
   },
 }
 
+/* istanbul ignore next */
+BackTop.install = function (Vue) {
+  Vue.component(BackTop.name, BackTop)
+}
+
+export default BackTop

components/badge/index.js

@@ -1,3 +1,9 @@
 import Badge from './Badge'
 
+/* istanbul ignore next */
+Badge.install = function (Vue) {
+  Vue.component(Badge.name, Badge)
+}
+
 export default Badge
+

components/breadcrumb/index.js

@@ -2,4 +2,12 @@ import Breadcrumb from './Breadcrumb'
 import BreadcrumbItem from './BreadcrumbItem'
 
 Breadcrumb.Item = BreadcrumbItem
+
+/* istanbul ignore next */
+Breadcrumb.install = function (Vue) {
+  Vue.component(Breadcrumb.name, Breadcrumb)
+  Vue.component(BreadcrumbItem.name, BreadcrumbItem)
+}
+
 export default Breadcrumb
+

components/button/button.jsx

@@ -134,6 +134,5 @@ export default {
       )
     }
   },
-
 }
 

components/button/index.js

@@ -2,5 +2,12 @@ import Button from './button'
 import ButtonGroup from './button-group'
 
 Button.Group = ButtonGroup
+
+/* istanbul ignore next */
+Button.install = function (Vue) {
+  Vue.component(Button.name, Button)
+  Vue.component(ButtonGroup.name, ButtonGroup)
+}
+
 export default Button
 

components/calendar/index.jsx

@@ -48,7 +48,7 @@ export const CalendarProps = () => ({
   validRange: PropTypes.custom(isMomentArray),
 })
 
-export default {
+const Calendar = {
   name: 'ACalendar',
   mixins: [BaseMixin],
   props: initDefaultProps(CalendarProps(), {
@@ -241,3 +241,10 @@ export default {
   },
 }
 
+/* istanbul ignore next */
+Calendar.install = function (Vue) {
+  Vue.component(Calendar.name, Calendar)
+}
+
+export default Calendar
+

components/card/index.js

@@ -3,4 +3,12 @@ import Meta from './Meta'
 import Grid from './Grid'
 Card.Meta = Meta
 Card.Grid = Grid
+
+/* istanbul ignore next */
+Card.install = function (Vue) {
+  Vue.component(Card.name, Card)
+  Vue.component(Meta.name, Meta)
+  Vue.component(Grid.name, Grid)
+}
+
 export default Card

components/carousel/index.jsx

@@ -67,7 +67,7 @@ export const CarouselProps = {
   slickGoTo: PropTypes.number,
 }
 
-export default {
+const Carousel = {
   name: 'ACarousel',
   props: initDefaultProps(CarouselProps, {
     dots: true,
@@ -157,3 +157,10 @@ export default {
     )
   },
 }
+
+/* istanbul ignore next */
+Carousel.install = function (Vue) {
+  Vue.component(Carousel.name, Carousel)
+}
+
+export default Carousel

components/cascader/index.jsx

@@ -24,12 +24,6 @@ const FieldNamesType = PropTypes.shape({
   children: PropTypes.string,
 }).loose
 
-const FilledFieldNamesType = PropTypes.shape({
-  value: PropTypes.string,
-  label: PropTypes.string,
-  children: PropTypes.string,
-}).loose
-
 const CascaderExpandTrigger = PropTypes.oneOf(['click', 'hover'])
 
 const ShowSearchType = PropTypes.shape({
@@ -105,7 +99,7 @@ function getFilledFieldNames (fieldNames = {}) {
 
 const defaultDisplayRender = ({ labels }) => labels.join(' / ')
 
-export default {
+const Cascader = {
   inheritAttrs: false,
   name: 'ACascader',
   mixins: [BaseMixin],
@@ -448,3 +442,10 @@ export default {
   },
 }
 
+/* istanbul ignore next */
+Cascader.install = function (Vue) {
+  Vue.component(Cascader.name, Cascader)
+}
+
+export default Cascader
+

components/checkbox/index.js

@@ -2,5 +2,12 @@ import Checkbox from './Checkbox'
 import CheckboxGroup from './Group'
 
 Checkbox.Group = CheckboxGroup
+
+/* istanbul ignore next */
+Checkbox.install = function (Vue) {
+  Vue.component(Checkbox.name, Checkbox)
+  Vue.component(CheckboxGroup.name, CheckboxGroup)
+}
+
 export default Checkbox
 

components/col/index.js

@@ -1,3 +1,7 @@
 import { Col } from '../grid'
+/* istanbul ignore next */
+Col.install = function (Vue) {
+  Vue.component(Col.name, Col)
+}
 
 export default Col

components/collapse/index.js

@@ -2,4 +2,12 @@ import Collapse from './Collapse'
 import CollapsePanel from './CollapsePanel'
 
 Collapse.Panel = CollapsePanel
+
+/* istanbul ignore next */
+Collapse.install = function (Vue) {
+  Vue.component(Collapse.name, Collapse)
+  Vue.component(CollapsePanel.name, CollapsePanel)
+}
+
 export default Collapse
+

components/date-picker/index.js

@@ -16,4 +16,12 @@ Object.assign(DatePicker, {
   WeekPicker: wrapPicker(WeekPicker, WeekPickerProps(), 'gggg-wo'),
 })
 
+/* istanbul ignore next */
+DatePicker.install = function (Vue) {
+  Vue.component(DatePicker.name, DatePicker)
+  Vue.component(DatePicker.RangePicker.name, DatePicker.RangePicker)
+  Vue.component(DatePicker.MonthPicker.name, DatePicker.MonthPicker)
+  Vue.component(DatePicker.WeekPicker.name, DatePicker.WeekPicker)
+}
+
 export default DatePicker

components/divider/index.jsx

@@ -1,6 +1,6 @@
 
 import PropTypes from '../_util/vue-types'
-export default {
+const Divider = {
   name: 'ADivider',
   props: {
     prefixCls: PropTypes.string.def('ant'),
@@ -30,3 +30,10 @@ export default {
   },
 }
 
+/* istanbul ignore next */
+Divider.install = function (Vue) {
+  Vue.component(Divider.name, Divider)
+}
+
+export default Divider
+

components/drawer/index.jsx

@@ -3,7 +3,7 @@ import PropTypes from '../_util/vue-types'
 import BaseMixin from '../_util/BaseMixin'
 import { getComponentFromProp, getOptionProps } from '../_util/props-util'
 
-export default {
+const Drawer = {
   name: 'ADrawer',
   props: {
     closable: PropTypes.bool.def(true),
@@ -180,3 +180,10 @@ export default {
     )
   },
 }
+
+/* istanbul ignore next */
+Drawer.install = function (Vue) {
+  Vue.component(Drawer.name, Drawer)
+}
+
+export default Drawer

components/dropdown/index.js

@@ -5,4 +5,11 @@ export { DropdownProps } from './dropdown'
 export { DropdownButtonProps } from './dropdown-button'
 
 Dropdown.Button = DropdownButton
+
+/* istanbul ignore next */
+Dropdown.install = function (Vue) {
+  Vue.component(Dropdown.name, Dropdown)
+  Vue.component(DropdownButton.name, DropdownButton)
+}
+
 export default Dropdown

components/form/index.jsx

@@ -7,4 +7,10 @@ Vue.use(antRefDirective)
 export { FormProps, FormCreateOption, ValidationRule } from './Form'
 export { FormItemProps } from './FormItem'
 
+/* istanbul ignore next */
+Form.install = function (Vue) {
+  Vue.component(Form.name, Form)
+  Vue.component(Form.Item.name, Form.Item)
+}
+
 export default Form

components/icon/index.js

@@ -1,3 +1,8 @@
 import Icon from './icon'
-export default Icon
 
+/* istanbul ignore next */
+Icon.install = function (Vue) {
+  Vue.component(Icon.name, Icon)
+}
+
+export default Icon

components/index.js

@@ -127,6 +127,8 @@ const components = [
   Anchor,
   Anchor.Link,
   AutoComplete,
+  AutoComplete.Option,
+  AutoComplete.OptGroup,
   Alert,
   Avatar,
   BackTop,
@@ -203,6 +205,7 @@ const components = [
   TreeSelect.TreeNode,
   Tabs,
   Tabs.TabPane,
+  Tabs.TabContent,
   Tag,
   Tag.CheckableTag,
   TimePicker,
@@ -228,6 +231,11 @@ const install = function (Vue) {
   Vue.prototype.$confirm = Modal.confirm
 }
 
+/* istanbul ignore if */
+if (typeof window !== 'undefined' && window.Vue) {
+  install(window.Vue)
+}
+
 export {
   version,
   install,

components/input-number/index.jsx

@@ -28,7 +28,7 @@ export const InputNumberProps = {
   autoFocus: PropTypes.bool,
 }
 
-export default {
+const InputNumber = {
   name: 'AInputNumber',
   model: {
     prop: 'value',
@@ -64,3 +64,10 @@ export default {
     return <VcInputNumber {...vcInputNumberprops} />
   },
 }
+
+/* istanbul ignore next */
+InputNumber.install = function (Vue) {
+  Vue.component(InputNumber.name, InputNumber)
+}
+
+export default InputNumber

components/input/index.js

@@ -10,4 +10,13 @@ Vue.use(antInputDirective)
 Input.Group = Group
 Input.Search = Search
 Input.TextArea = TextArea
+
+/* istanbul ignore next */
+Input.install = function (Vue) {
+  Vue.component(Input.name, Input)
+  Vue.component(Input.Group.name, Input.Group)
+  Vue.component(Input.Search.name, Input.Search)
+  Vue.component(Input.TextArea.name, Input.TextArea)
+}
+
 export default Input

components/layout/index.js

@@ -2,4 +2,13 @@ import Layout from './layout'
 import Sider from './Sider'
 
 Layout.Sider = Sider
+
+/* istanbul ignore next */
+Layout.install = function (Vue) {
+  Vue.component(Layout.name, Layout)
+  Vue.component(Layout.Header.name, Layout.Header)
+  Vue.component(Layout.Footer.name, Layout.Footer)
+  Vue.component(Layout.Sider.name, Layout.Sider)
+  Vue.component(Layout.Content.name, Layout.Content)
+}
 export default Layout

components/list/index.jsx

@@ -1,7 +1,6 @@
 import PropTypes from '../_util/vue-types'
 import classNames from 'classnames'
 import omit from 'omit.js'
-import { SpinProps } from '../spin'
 import LocaleReceiver from '../locale-provider/LocaleReceiver'
 import defaultLocale from '../locale-provider/default'
 
@@ -51,10 +50,9 @@ export const ListProps = () => ({
   locale: PropTypes.object,
 })
 
-export default {
+const List = {
   Item,
   name: 'AList',
-
   props: initDefaultProps(ListProps(), {
     dataSource: [],
     prefixCls: 'ant-list',
@@ -247,3 +245,12 @@ export default {
     )
   },
 }
+
+/* istanbul ignore next */
+List.install = function (Vue) {
+  Vue.component(List.name, List)
+  Vue.component(List.Item.name, List.Item)
+  Vue.component(List.Item.Meta.name, List.Item.Meta)
+}
+
+export default List

components/locale-provider/index.jsx

@@ -26,7 +26,7 @@ function setMomentLocale (locale) {
   }
 }
 
-export default {
+const LocaleProvider = {
   name: 'ALocaleProvider',
   props: {
     locale: PropTypes.object.def({}),
@@ -70,3 +70,10 @@ export default {
   },
 }
 
+/* istanbul ignore next */
+LocaleProvider.install = function (Vue) {
+  Vue.component(LocaleProvider.name, LocaleProvider)
+}
+
+export default LocaleProvider
+

components/menu/index.jsx

@@ -30,7 +30,7 @@ export const menuProps = {
   focusable: PropTypes.bool.def(false),
 }
 
-export default {
+const Menu = {
   name: 'AMenu',
   props: menuProps,
   Divider: { ...Divider, name: 'AMenuDivider' },
@@ -250,3 +250,13 @@ export default {
   },
 }
 
+/* istanbul ignore next */
+Menu.install = function (Vue) {
+  Vue.component(Menu.name, Menu)
+  Vue.component(Menu.Item.name, Menu.Item)
+  Vue.component(Menu.SubMenu.name, Menu.SubMenu)
+  Vue.component(Menu.Divider.name, Menu.Divider)
+  Vue.component(Menu.ItemGroup.name, Menu.ItemGroup)
+}
+export default Menu
+

components/modal/index.js

@@ -60,4 +60,9 @@ Modal.warning = warning
 Modal.warn = warn
 Modal.confirm = confirm
 
+/* istanbul ignore next */
+Modal.install = function (Vue) {
+  Vue.component(Modal.name, Modal)
+}
+
 export default Modal

components/pagination/index.js

@@ -1,4 +1,10 @@
 import Pagination from './Pagination'
 
 export { PaginationProps, PaginationConfig } from './Pagination'
+
+/* istanbul ignore next */
+Pagination.install = function (Vue) {
+  Vue.component(Pagination.name, Pagination)
+}
+
 export default Pagination

components/popconfirm/index.jsx

@@ -13,7 +13,7 @@ import defaultLocale from '../locale-provider/default'
 
 const tooltipProps = abstractTooltipProps()
 const btnProps = buttonTypes()
-export default {
+const Popconfirm = {
   name: 'APopconfirm',
   props: {
     ...tooltipProps,
@@ -128,3 +128,9 @@ export default {
   },
 }
 
+/* istanbul ignore next */
+Popconfirm.install = function (Vue) {
+  Vue.component(Popconfirm.name, Popconfirm)
+}
+
+export default Popconfirm

components/popover/index.jsx

@@ -5,7 +5,7 @@ import PropTypes from '../_util/vue-types'
 import { getOptionProps, getComponentFromProp } from '../_util/props-util'
 
 const props = abstractTooltipProps()
-export default {
+const Popover = {
   name: 'APopover',
   props: {
     ...props,
@@ -58,3 +58,9 @@ export default {
   },
 }
 
+/* istanbul ignore next */
+Popover.install = function (Vue) {
+  Vue.component(Popover.name, Popover)
+}
+
+export default Popover

components/progress/index.jsx

@@ -2,4 +2,9 @@ import Progress from './progress'
 
 export { ProgressProps } from './progress'
 
+/* istanbul ignore next */
+Progress.install = function (Vue) {
+  Vue.component(Progress.name, Progress)
+}
+
 export default Progress

components/radio/index.js

@@ -4,6 +4,14 @@ import Button from './RadioButton'
 
 Radio.Group = Group
 Radio.Button = Button
+
+/* istanbul ignore next */
+Radio.install = function (Vue) {
+  Vue.component(Radio.name, Radio)
+  Vue.component(Radio.Group.name, Radio.Group)
+  Vue.component(Radio.Button.name, Radio.Button)
+}
+
 export { Button, Group }
 export default Radio
 

components/rate/index.jsx

@@ -16,7 +16,7 @@ export const RateProps = {
   autoFocus: PropTypes.bool,
 }
 
-export default {
+const Rate = {
   name: 'ARate',
   model: {
     prop: 'value',
@@ -59,3 +59,8 @@ export default {
   },
 }
 
+/* istanbul ignore next */
+Rate.install = function (Vue) {
+  Vue.component(Rate.name, Rate)
+}
+export default Rate

components/row/index.js

@@ -1,2 +1,8 @@
 import { Row } from '../grid'
+
+/* istanbul ignore next */
+Row.install = function (Vue) {
+  Vue.component(Row.name, Row)
+}
+
 export default Row

components/select/index.jsx

@@ -89,7 +89,7 @@ export {
   SelectProps,
 }
 const SECRET_COMBOBOX_MODE_DO_NOT_USE = 'SECRET_COMBOBOX_MODE_DO_NOT_USE'
-export default {
+const Select = {
   SECRET_COMBOBOX_MODE_DO_NOT_USE,
   Option: { ...Option, name: 'ASelectOption' },
   OptGroup: { ...OptGroup, name: 'ASelectOptGroup' },
@@ -196,3 +196,12 @@ export default {
   },
 }
 
+/* istanbul ignore next */
+Select.install = function (Vue) {
+  Vue.component(Select.name, Select)
+  Vue.component(Select.Option.name, Select.Option)
+  Vue.component(Select.OptGroup.name, Select.OptGroup)
+}
+
+export default Select
+

components/slider/index.jsx

@@ -44,7 +44,7 @@ export const SliderProps = () => ({
   id: PropTypes.string,
 })
 
-export default {
+const Slider = {
   name: 'ASlider',
   model: {
     prop: 'value',
@@ -141,3 +141,10 @@ export default {
     return <VcSlider {...vcSliderProps} />
   },
 }
+
+/* istanbul ignore next */
+Slider.install = function (Vue) {
+  Vue.component(Slider.name, Slider)
+}
+
+export default Slider

components/spin/index.js

@@ -3,4 +3,10 @@ import Spin, { setDefaultIndicator } from './Spin'
 export { SpinProps } from './Spin'
 
 Spin.setDefaultIndicator = setDefaultIndicator
+
+/* istanbul ignore next */
+Spin.install = function (Vue) {
+  Vue.component(Spin.name, Spin)
+}
+
 export default Spin

components/steps/index.jsx

@@ -19,7 +19,7 @@ const getStepsProps = (defaultProps = {}) => {
   return initDefaultProps(props, defaultProps)
 }
 
-export default {
+const Steps = {
   name: 'ASteps',
   props: getStepsProps({
     prefixCls: 'ant-steps',
@@ -44,3 +44,11 @@ export default {
   },
 }
 
+/* istanbul ignore next */
+Steps.install = function (Vue) {
+  Vue.component(Steps.name, Steps)
+  Vue.component(Steps.Step.name, Steps.Step)
+}
+
+export default Steps
+

components/switch/index.jsx

@@ -4,7 +4,7 @@ import { getOptionProps, getComponentFromProp } from '../_util/props-util'
 import VcSwitch from '../vc-switch'
 import Wave from '../_util/wave'
 
-export default {
+const Switch = {
   name: 'ASwitch',
   model: {
     prop: 'checked',
@@ -60,3 +60,9 @@ export default {
   },
 }
 
+/* istanbul ignore next */
+Switch.install = function (Vue) {
+  Vue.component(Switch.name, Switch)
+}
+
+export default Switch

components/table/index.jsx

@@ -99,5 +99,11 @@ const Table = {
     )
   },
 }
+/* istanbul ignore next */
+Table.install = function (Vue) {
+  Vue.component(Table.name, Table)
+  Vue.component(Table.Column.name, Table.Column)
+  Vue.component(Table.ColumnGroup.name, Table.ColumnGroup)
+}
 
 export default Table

components/tabs/index.js

@@ -3,5 +3,13 @@ import TabPane from '../vc-tabs/src/TabPane'
 import TabContent from '../vc-tabs/src/TabContent'
 Tabs.TabPane = { ...TabPane, name: 'ATabPane', __ANT_TAB_PANE: true }
 Tabs.TabContent = { ...TabContent, name: 'ATabContent' }
+
+/* istanbul ignore next */
+Tabs.install = function (Vue) {
+  Vue.component(Tabs.name, Tabs)
+  Vue.component(Tabs.TabPane.name, Tabs.TabPane)
+  Vue.component(Tabs.TabContent.name, Tabs.TabContent)
+}
+
 export default Tabs
 export { TabPane, TabContent }

components/tag/index.js

@@ -2,5 +2,12 @@ import Tag from './Tag'
 import CheckableTag from './CheckableTag'
 
 Tag.CheckableTag = CheckableTag
+
+/* istanbul ignore next */
+Tag.install = function (Vue) {
+  Vue.component(Tag.name, Tag)
+  Vue.component(Tag.CheckableTag.name, Tag.CheckableTag)
+}
+
 export default Tag
 

components/time-picker/index.jsx

@@ -59,7 +59,7 @@ export const TimePickerProps = () => ({
   addon: PropTypes.any,
 })
 
-export default {
+const TimePicker = {
   name: 'ATimePicker',
   mixins: [BaseMixin],
   props: initDefaultProps(TimePickerProps(), {
@@ -179,3 +179,10 @@ export default {
   },
 }
 
+/* istanbul ignore next */
+TimePicker.install = function (Vue) {
+  Vue.component(TimePicker.name, TimePicker)
+}
+
+export default TimePicker
+

components/timeline/index.jsx

@@ -6,4 +6,10 @@ import TimelineItem from './TimelineItem'
 
 Timeline.Item = TimelineItem
 
+/* istanbul ignore next */
+Timeline.install = function (Vue) {
+  Vue.component(Timeline.name, Timeline)
+  Vue.component(TimelineItem.name, TimelineItem)
+}
+
 export default Timeline

components/tooltip/index.js

@@ -1,3 +1,9 @@
 import ToolTip from './Tooltip'
+
+/* istanbul ignore next */
+ToolTip.install = function (Vue) {
+  Vue.component(ToolTip.name, ToolTip)
+}
+
 export default ToolTip
 

components/transfer/index.jsx

@@ -49,7 +49,7 @@ export const TransferLocale = {
   itemsUnit: PropTypes.string,
 }
 
-export default {
+const Transfer = {
   name: 'ATransfer',
   mixins: [BaseMixin],
   props: initDefaultProps(TransferProps, {
@@ -95,46 +95,6 @@ export default {
         })
       }
     },
-    // '$props': {
-    //   handler: function (nextProps) {
-    //     // if (nextProps.targetKeys !== currentProps.targetKeys ||
-    //     //   nextProps.dataSource !== currentProps.dataSource) {
-    //     //   // clear cached splited dataSource
-    //     //   this.separatedDataSource = null
-
-    //     //   if (!nextProps.selectedKeys) {
-    //     //     // clear key nolonger existed
-    //     //     // clear checkedKeys according to targetKeys
-    //     //     const { dataSource, targetKeys = [] } = nextProps
-
-    //     //     const newSourceSelectedKeys = []
-    //     //     const newTargetSelectedKeys = []
-    //     //     dataSource.forEach(({ key }) => {
-    //     //       if (sourceSelectedKeys.includes(key) && !targetKeys.includes(key)) {
-    //     //         newSourceSelectedKeys.push(key)
-    //     //       }
-    //     //       if (targetSelectedKeys.includes(key) && targetKeys.includes(key)) {
-    //     //         newTargetSelectedKeys.push(key)
-    //     //       }
-    //     //     })
-    //     //     this.setState({
-    //     //       sourceSelectedKeys: newSourceSelectedKeys,
-    //     //       targetSelectedKeys: newTargetSelectedKeys,
-    //     //     })
-    //     //   }
-    //     // }
-
-    //     // if (nextProps.selectedKeys) {
-    //     //   const targetKeys = nextProps.targetKeys || []
-    //     //   this.setState({
-    //     //     sourceSelectedKeys: nextProps.selectedKeys.filter(key => !targetKeys.includes(key)),
-    //     //     targetSelectedKeys: nextProps.selectedKeys.filter(key => targetKeys.includes(key)),
-    //     //   })
-    //     // }
-    //     // this.currentProps = { ...this.$props }
-    //   },
-    //   deep: true,
-    // },
   },
   methods: {
     updateState () {
@@ -434,3 +394,10 @@ export default {
     )
   },
 }
+
+/* istanbul ignore next */
+Transfer.install = function (Vue) {
+  Vue.component(Transfer.name, Transfer)
+}
+
+export default Transfer

components/tree-select/index.jsx

@@ -8,7 +8,7 @@ import { initDefaultProps, getOptionProps, getComponentFromProp, filterEmpty } f
 
 export { TreeData, TreeSelectProps } from './interface'
 
-export default {
+const TreeSelect = {
   TreeNode: { ...TreeNode, name: 'ATreeSelectNode' },
   SHOW_ALL,
   SHOW_PARENT,
@@ -113,3 +113,11 @@ export default {
     )
   },
 }
+
+/* istanbul ignore next */
+TreeSelect.install = function (Vue) {
+  Vue.component(TreeSelect.name, TreeSelect)
+  Vue.component(TreeSelect.TreeNode.name, TreeSelect.TreeNode)
+}
+
+export default TreeSelect

components/tree/index.jsx

@@ -92,7 +92,7 @@ export const TreeProps = () => ({
   openAnimation: PropTypes.any,
 })
 
-export default {
+const Tree = {
   name: 'ATree',
   TreeNode: { ...TreeNode, name: 'ATreeNode' },
   props: initDefaultProps(TreeProps(), {
@@ -173,3 +173,11 @@ export default {
     )
   },
 }
+
+/* istanbul ignore next */
+Tree.install = function (Vue) {
+  Vue.component(Tree.name, Tree)
+  Vue.component(Tree.TreeNode.name, Tree.TreeNode)
+}
+
+export default Tree

components/upload/index.jsx

@@ -4,4 +4,11 @@ import Dragger from './Dragger'
 export { UploadProps, UploadListProps, UploadChangeParam } from './interface'
 
 Upload.Dragger = Dragger
+
+/* istanbul ignore next */
+Upload.install = function (Vue) {
+  Vue.component(Upload.name, Upload)
+  Vue.component(Dragger.name, Dragger)
+}
+
 export default Upload

site/components.js

@@ -57,98 +57,6 @@ import {
   Drawer,
 } from 'antd'
 
-Vue.component(Affix.name, Affix) // a-affix
-Vue.component(Anchor.name, Anchor)
-Vue.component(Anchor.Link.name, Anchor.Link)
-Vue.component(AutoComplete.name, AutoComplete)
-Vue.component(Alert.name, Alert)
-Vue.component(Avatar.name, Avatar)
-Vue.component(BackTop.name, BackTop)
-Vue.component(Badge.name, Badge)
-Vue.component(Breadcrumb.name, Breadcrumb)
-Vue.component(Breadcrumb.Item.name, Breadcrumb.Item)
-Vue.component(Button.name, Button)
-Vue.component(Button.Group.name, Button.Group)
-
-Vue.component(Calendar.name, Calendar)
-Vue.component(Card.name, Card)
-Vue.component(Card.Meta.name, Card.Meta)
-Vue.component(Card.Grid.name, Card.Grid)
-Vue.component(Collapse.name, Collapse)
-Vue.component(Collapse.Panel.name, Collapse.Panel)
-Vue.component(Carousel.name, Carousel)
-Vue.component(Cascader.name, Cascader)
-Vue.component(Checkbox.name, Checkbox)
-Vue.component(Checkbox.Group.name, Checkbox.Group)
-Vue.component(Col.name, Col)
-Vue.component(DatePicker.name, DatePicker)
-Vue.component(DatePicker.MonthPicker.name, DatePicker.MonthPicker)
-Vue.component(DatePicker.RangePicker.name, DatePicker.RangePicker)
-Vue.component(DatePicker.WeekPicker.name, DatePicker.WeekPicker)
-Vue.component(Divider.name, Divider)
-Vue.component(Dropdown.name, Dropdown)
-Vue.component(Dropdown.Button.name, Dropdown.Button)
-Vue.component(Form.name, Form)
-Vue.component(Form.Item.name, Form.Item)
-Vue.component(Icon.name, Icon)
-Vue.component(Input.name, Input)
-Vue.component(Input.Group.name, Input.Group)
-Vue.component(Input.Search.name, Input.Search)
-Vue.component(Input.TextArea.name, Input.TextArea)
-Vue.component(InputNumber.name, InputNumber)
-Vue.component(Layout.name, Layout)
-Vue.component(Layout.Header.name, Layout.Header)
-Vue.component(Layout.Footer.name, Layout.Footer)
-Vue.component(Layout.Sider.name, Layout.Sider)
-Vue.component(Layout.Content.name, Layout.Content)
-Vue.component(List.name, List)
-Vue.component(List.Item.name, List.Item)
-Vue.component(List.Item.Meta.name, List.Item.Meta)
-Vue.component(LocaleProvider.name, LocaleProvider)
-Vue.component(Menu.name, Menu)
-Vue.component(Menu.Item.name, Menu.Item)
-Vue.component(Menu.SubMenu.name, Menu.SubMenu)
-Vue.component(Menu.Divider.name, Menu.Divider)
-Vue.component(Menu.ItemGroup.name, Menu.ItemGroup)
-Vue.component(Modal.name, Modal)
-Vue.component(Pagination.name, Pagination)
-Vue.component(Popconfirm.name, Popconfirm)
-Vue.component(Popover.name, Popover)
-Vue.component(Progress.name, Progress)
-Vue.component(Radio.name, Radio)
-Vue.component(Radio.Group.name, Radio.Group)
-Vue.component(Radio.Button.name, Radio.Button)
-Vue.component(Rate.name, Rate)
-Vue.component(Row.name, Row)
-Vue.component(Select.name, Select)
-Vue.component(Select.Option.name, Select.Option)
-Vue.component(Select.OptGroup.name, Select.OptGroup)
-Vue.component(Slider.name, Slider)
-Vue.component(Spin.name, Spin)
-Vue.component(Steps.name, Steps)
-Vue.component(Steps.Step.name, Steps.Step)
-Vue.component(Switch.name, Switch)
-Vue.component(Table.name, Table)
-Vue.component(Table.Column.name, Table.Column)
-Vue.component(Table.ColumnGroup.name, Table.ColumnGroup)
-Vue.component(Transfer.name, Transfer)
-Vue.component(Tree.name, Tree)
-Vue.component(Tree.TreeNode.name, Tree.TreeNode)
-Vue.component(TreeSelect.name, TreeSelect)
-Vue.component(TreeSelect.TreeNode.name, TreeSelect.TreeNode)
-Vue.component(Tabs.name, Tabs)
-Vue.component(Tabs.TabPane.name, Tabs.TabPane)
-Vue.component(Tag.name, Tag)
-Vue.component(Tag.CheckableTag.name, Tag.CheckableTag)
-Vue.component(TimePicker.name, TimePicker)
-Vue.component(Timeline.name, Timeline)
-Vue.component(Timeline.Item.name, Timeline.Item)
-Vue.component(Tooltip.name, Tooltip)
-// Vue.component(Mention.name, Mention)
-Vue.component(Upload.name, Upload)
-Vue.component(Upload.Dragger.name, Upload.Dragger)
-Vue.component(Drawer.name, Drawer)
-
 Vue.prototype.$message = message
 Vue.prototype.$notification = notification
 Vue.prototype.$info = Modal.info
@@ -156,3 +64,153 @@ Vue.prototype.$success = Modal.success
 Vue.prototype.$error = Modal.error
 Vue.prototype.$warning = Modal.warning
 Vue.prototype.$confirm = Modal.confirm
+
+/* v1.1.3+ registration methods */
+Vue.use(Affix)
+Vue.use(Anchor)
+Vue.use(AutoComplete)
+Vue.use(Alert)
+Vue.use(Avatar)
+Vue.use(BackTop)
+Vue.use(Badge)
+Vue.use(Breadcrumb)
+Vue.use(Button)
+Vue.use(Calendar)
+Vue.use(Card)
+Vue.use(Collapse)
+Vue.use(Carousel)
+Vue.use(Cascader)
+Vue.use(Checkbox)
+Vue.use(Col)
+Vue.use(DatePicker)
+Vue.use(Divider)
+Vue.use(Drawer)
+Vue.use(Dropdown)
+Vue.use(Form)
+Vue.use(Icon)
+Vue.use(Input)
+Vue.use(InputNumber)
+Vue.use(Layout)
+Vue.use(List)
+Vue.use(LocaleProvider)
+Vue.use(Menu)
+Vue.use(Modal)
+Vue.use(Pagination)
+Vue.use(Popconfirm)
+Vue.use(Popover)
+Vue.use(Progress)
+Vue.use(Radio)
+Vue.use(Rate)
+Vue.use(Row)
+Vue.use(Select)
+Vue.use(Slider)
+Vue.use(Spin)
+Vue.use(Steps)
+Vue.use(Switch)
+Vue.use(Table)
+Vue.use(Transfer)
+Vue.use(Tree)
+Vue.use(TreeSelect)
+Vue.use(Tabs)
+Vue.use(Tag)
+Vue.use(TimePicker)
+Vue.use(Timeline)
+Vue.use(Tooltip)
+Vue.use(Upload)
+
+/* v1.1.2 registration methods */
+// Vue.component(Affix.name, Affix) // a-affix
+// Vue.component(Anchor.name, Anchor)
+// Vue.component(Anchor.Link.name, Anchor.Link)
+// Vue.component(AutoComplete.name, AutoComplete)
+// Vue.component(AutoComplete.Option.name, AutoComplete.Option)
+// Vue.component(AutoComplete.OptGroup.name, AutoComplete.OptGroup)
+// Vue.component(Alert.name, Alert)
+// Vue.component(Avatar.name, Avatar)
+// Vue.component(BackTop.name, BackTop)
+// Vue.component(Badge.name, Badge)
+// Vue.component(Breadcrumb.name, Breadcrumb)
+// Vue.component(Breadcrumb.Item.name, Breadcrumb.Item)
+// Vue.component(Button.name, Button)
+// Vue.component(Button.Group.name, Button.Group)
+
+// Vue.component(Calendar.name, Calendar)
+// Vue.component(Card.name, Card)
+// Vue.component(Card.Meta.name, Card.Meta)
+// Vue.component(Card.Grid.name, Card.Grid)
+// Vue.component(Collapse.name, Collapse)
+// Vue.component(Collapse.Panel.name, Collapse.Panel)
+// Vue.component(Carousel.name, Carousel)
+// Vue.component(Cascader.name, Cascader)
+// Vue.component(Checkbox.name, Checkbox)
+// Vue.component(Checkbox.Group.name, Checkbox.Group)
+// Vue.component(Col.name, Col)
+// Vue.component(DatePicker.name, DatePicker)
+// Vue.component(DatePicker.MonthPicker.name, DatePicker.MonthPicker)
+// Vue.component(DatePicker.RangePicker.name, DatePicker.RangePicker)
+// Vue.component(DatePicker.WeekPicker.name, DatePicker.WeekPicker)
+// Vue.component(Divider.name, Divider)
+// Vue.component(Drawer.name, Drawer)
+// Vue.component(Dropdown.name, Dropdown)
+// Vue.component(Dropdown.Button.name, Dropdown.Button)
+// Vue.component(Form.name, Form)
+// Vue.component(Form.Item.name, Form.Item)
+// Vue.component(Icon.name, Icon)
+// Vue.component(Input.name, Input)
+// Vue.component(Input.Group.name, Input.Group)
+// Vue.component(Input.Search.name, Input.Search)
+// Vue.component(Input.TextArea.name, Input.TextArea)
+// Vue.component(InputNumber.name, InputNumber)
+// Vue.component(Layout.name, Layout)
+// Vue.component(Layout.Header.name, Layout.Header)
+// Vue.component(Layout.Footer.name, Layout.Footer)
+// Vue.component(Layout.Sider.name, Layout.Sider)
+// Vue.component(Layout.Content.name, Layout.Content)
+// Vue.component(List.name, List)
+// Vue.component(List.Item.name, List.Item)
+// Vue.component(List.Item.Meta.name, List.Item.Meta)
+// Vue.component(LocaleProvider.name, LocaleProvider)
+// Vue.component(Menu.name, Menu)
+// Vue.component(Menu.Item.name, Menu.Item)
+// Vue.component(Menu.SubMenu.name, Menu.SubMenu)
+// Vue.component(Menu.Divider.name, Menu.Divider)
+// Vue.component(Menu.ItemGroup.name, Menu.ItemGroup)
+// Vue.component(Modal.name, Modal)
+// Vue.component(Pagination.name, Pagination)
+// Vue.component(Popconfirm.name, Popconfirm)
+// Vue.component(Popover.name, Popover)
+// Vue.component(Progress.name, Progress)
+// Vue.component(Radio.name, Radio)
+// Vue.component(Radio.Group.name, Radio.Group)
+// Vue.component(Radio.Button.name, Radio.Button)
+// Vue.component(Rate.name, Rate)
+// Vue.component(Row.name, Row)
+// Vue.component(Select.name, Select)
+// Vue.component(Select.Option.name, Select.Option)
+// Vue.component(Select.OptGroup.name, Select.OptGroup)
+// Vue.component(Slider.name, Slider)
+// Vue.component(Spin.name, Spin)
+// Vue.component(Steps.name, Steps)
+// Vue.component(Steps.Step.name, Steps.Step)
+// Vue.component(Switch.name, Switch)
+// Vue.component(Table.name, Table)
+// Vue.component(Table.Column.name, Table.Column)
+// Vue.component(Table.ColumnGroup.name, Table.ColumnGroup)
+// Vue.component(Transfer.name, Transfer)
+// Vue.component(Tree.name, Tree)
+// Vue.component(Tree.TreeNode.name, Tree.TreeNode)
+// Vue.component(TreeSelect.name, TreeSelect)
+// Vue.component(TreeSelect.TreeNode.name, TreeSelect.TreeNode)
+// Vue.component(Tabs.name, Tabs)
+// Vue.component(Tabs.TabPane.name, Tabs.TabPane)
+// Vue.component(Tabs.TabContent.name, Tabs.TabContent)
+// Vue.component(Tag.name, Tag)
+// Vue.component(Tag.CheckableTag.name, Tag.CheckableTag)
+// Vue.component(TimePicker.name, TimePicker)
+// Vue.component(Timeline.name, Timeline)
+// Vue.component(Timeline.Item.name, Timeline.Item)
+// Vue.component(Tooltip.name, Tooltip)
+// // Vue.component(Mention.name, Mention)
+// Vue.component(Upload.name, Upload)
+// Vue.component(Upload.Dragger.name, Upload.Dragger)
+

site/components/layout.vue

@@ -98,13 +98,13 @@ export default {
       const lis = []
       currentSubMenu.forEach(({ cnTitle, usTitle, id }) => {
         const title = isCN ? cnTitle : usTitle
-        lis.push(<a-anchor-link href={`#${id}`} title={title} />)
+        lis.push(<a-anchor-link key={id} href={`#${id}`} title={title} />)
       })
       const showApi = this.$route.path.indexOf('/components/') !== -1
       return (
-        <a-anchor offsetTop={70} class='demo-anchor'>
+        <a-anchor offsetTop={100} class='demo-anchor'>
           {lis}
-          {showApi ? <a-anchor-link title='API' href='#API' /> : ''}
+          {showApi ? <a-anchor-link key='API' title='API' href='#API' /> : ''}
         </a-anchor>
       )
     },