Merge branch 'master' of https://github.com/vueComponent/ant-design

components/date-picker/index.en-US.md

@@ -41,7 +41,7 @@ The following APIs are shared by DatePicker, MonthPicker, RangePicker, WeekPicke
 ### Common Events
 | Events Name | Description | Arguments |
 | --- | --- | --- |
-| openChange | a callback function, can be executed whether the popup calendar is popped up or closed | function(status) | 
+| openChange | a callback function, can be executed whether the popup calendar is popped up or closed | function(status) |
 
 ### Common Methods
 
@@ -58,17 +58,17 @@ The following APIs are shared by DatePicker, MonthPicker, RangePicker, WeekPicke
 | disabledTime | to specify the time that cannot be selected | function(date) | - |
 | format | to set the date format, refer to [moment.js](http://momentjs.com/) | string | "YYYY-MM-DD" |
 | renderExtraFooter | render extra footer in panel by setting a scoped slot | slot="renderExtraFooter" | - |
-| showTime | to provide an additional time selection | object\|boolean | [TimePicker Options](/components/time-picker/#API) |
+| showTime | to provide an additional time selection | object\|boolean | [TimePicker Options](#/us/components/time-picker/API) |
 | showTime.defaultValue | to set default time of selected date | [moment](http://momentjs.com/) | moment() |
 | showToday | whether to show "Today" button | boolean | true |
 | value | to set date | [moment](http://momentjs.com/) | - |
 
 ### DatePicker Events
 | Events Name | Description | Arguments |
 | --- | --- | --- |
-| calendarChange | a callback function, can be executed when the start time or the end time of the range is changing | function(dates: [moment, moment], dateStrings: [string, string]) | 
-| change | a callback function, can be executed when the selected time is changing | function(date: moment, dateString: string) | 
-| ok | callback when click ok button | function() | 
+| calendarChange | a callback function, can be executed when the start time or the end time of the range is changing | function(dates: [moment, moment], dateStrings: [string, string]) |
+| change | a callback function, can be executed when the selected time is changing | function(date: moment, dateString: string) |
+| ok | callback when click ok button | function() |
 
 ### MonthPicker
 
@@ -83,7 +83,7 @@ The following APIs are shared by DatePicker, MonthPicker, RangePicker, WeekPicke
 ### MonthPicker Events
 | Events Name | Description | Arguments |
 | --- | --- | --- |
-| change | a callback function, can be executed when the selected time is changing | function(date: moment, dateString: string) | 
+| change | a callback function, can be executed when the selected time is changing | function(date: moment, dateString: string) |
 
 ### WeekPicker
 
@@ -107,13 +107,13 @@ The following APIs are shared by DatePicker, MonthPicker, RangePicker, WeekPicke
 | format | to set the date format | string | "YYYY-MM-DD HH:mm:ss" |
 | ranges | preseted ranges for quick selection | { \[range: string\]: [moment](http://momentjs.com/)\[] } \| () => { \[range: string\]: [moment](http://momentjs.com/)\[] } | - |
 | renderExtraFooter | render extra footer in panel by setting a scoped slot| slot="renderExtraFooter" | - |
-| showTime | to provide an additional time selection | object\|boolean | [TimePicker Options](/components/time-picker/#API) |
+| showTime | to provide an additional time selection | object\|boolean | [TimePicker Options](#/us/components/time-picker/API) |
 | showTime.defaultValue | to set default time of selected date, [demo](https://ant.design/components/date-picker/#components-date-picker-demo-disabled-date) | [moment](http://momentjs.com/)\[] | [moment(), moment()] |
 | value | to set date | \[[moment](http://momentjs.com/), [moment](http://momentjs.com/)] | - |
 
 ### RangePicker Events
 | Events Name | Description | Arguments |
 | --- | --- | --- |
-| change | a callback function, can be executed when the selected time is changing | function(dates: [moment, moment], dateStrings: [string, string]) | 
+| change | a callback function, can be executed when the selected time is changing | function(dates: [moment, moment], dateStrings: [string, string]) |
 | ok | callback when click ok button | function() |
 

components/date-picker/index.zh-CN.md

@@ -42,7 +42,7 @@
 
 | 事件名称 | 说明 | 回调参数 |
 | --- | --- | --- |
-| openChange | 弹出日历和关闭日历的回调 | function(status) | 
+| openChange | 弹出日历和关闭日历的回调 | function(status) |
 
 ### 共同的方法
 
@@ -59,7 +59,7 @@
 | disabledTime | 不可选择的时间 | function(date) | 无 |
 | format | 展示的日期格式，配置参考 [moment.js](http://momentjs.com/) | string | "YYYY-MM-DD" |
 | renderExtraFooter | 在面板中添加额外的页脚 | slot="renderExtraFooter" | - |
-| showTime | 增加时间选择功能 | Object\|boolean | [TimePicker Options](/components/time-picker/#API) |
+| showTime | 增加时间选择功能 | Object\|boolean | [TimePicker Options](#/cn/components/time-picker/API) |
 | showTime.defaultValue | 设置用户选择日期时默认的时分秒 | [moment](http://momentjs.com/) | moment() |
 | showToday | 是否展示“今天”按钮 | boolean | true |
 | value | 日期 | [moment](http://momentjs.com/) | 无 |
@@ -68,8 +68,8 @@
 
 | 事件名称 | 说明 | 回调参数 |
 | --- | --- | --- |
-| change | 时间发生变化的回调 | function(date: moment, dateString: string) | 
-| ok | 点击确定按钮的回调 | function() | 
+| change | 时间发生变化的回调 | function(date: moment, dateString: string) |
+| ok | 点击确定按钮的回调 | function() |
 
 ### MonthPicker
 
@@ -110,8 +110,8 @@
 | format | 展示的日期格式 | string | "YYYY-MM-DD HH:mm:ss" |
 | ranges       | 预设时间范围快捷选择 | { \[range: string\]: [moment](http://momentjs.com/)\[] } \| () => { \[range: string\]: [moment](http://momentjs.com/)\[] } | 无 |
 | renderExtraFooter | 在面板中添加额外的页脚 | slot="renderExtraFooter" | - |
-| showTime | 增加时间选择功能 | Object\|boolean | [TimePicker Options](/components/time-picker/#API) |
-| showTime.defaultValue | 设置用户选择日期时默认的时分秒，[例子](https://ant.design/components/date-picker/#components-date-picker-demo-disabled-date) | [moment](http://momentjs.com/)\[] | [moment(), moment()] |
+| showTime | 增加时间选择功能 | Object\|boolean | [TimePicker Options](#/cn/components/time-picker/API) |
+| showTime.defaultValue | 设置用户选择日期时默认的时分秒 | [moment](http://momentjs.com/)\[] | [moment(), moment()] |
 | value | 日期 | [moment](http://momentjs.com/)\[] | 无 |
 
 ### RangePicker事件

components/icon/demo/index.vue

@@ -40,6 +40,10 @@ const md = {
       `,
 }
 export default {
+  category: 'Components',
+  type: 'General',
+  title: 'Icon',
+  subtitle: '图标',
   render () {
     return (
       <div>

components/index.js

@@ -1,4 +1,3 @@
-import './style.js'
 import Button from './button'
 const ButtonGroup = Button.Group
 export { Button, ButtonGroup }

components/locale-provider/demo/index.vue

@@ -3,6 +3,20 @@ import Basic from './basic'
 import All from './all'
 import CN from '../index.zh-CN.md'
 import US from '../index.en-US.md'
+const md = {
+  cn: `## API
+
+| 参数 | 说明 | 类型 | 默认值 |
+| --- | --- | --- | --- |
+| locale | 语言包配置，语言包可到 \`antd/lib/locale-provider/\` 目录下寻找 | object | - |
+`,
+  us: `## API
+
+| Property | Description | Type | Default |
+| -------- | ----------- | ---- | ------- |
+| locale | language package setting, you can find the packages in this path: \`antd/lib/locale-provider/\` | object | - |
+`,
+}
 export default {
   category: 'Components',
   subtitle: '国际化',
@@ -18,6 +32,7 @@ export default {
         </api>
         <Basic />
         <All />
+        <md cn={md.cn} us={md.us}/>
       </div>
     )
   },

components/locale-provider/index.en-US.md

@@ -49,10 +49,4 @@ If you can't find your language, you are welcome to create a locale package base
 
 This component aims for localization of the built-in text, if you want to support other documents, we recommend using [vue-i18n](https://github.com/kazupon/vue-i18n).
 
-## API
-
-| Property | Description | Type | Default |
-| -------- | ----------- | ---- | ------- |
-| locale | language package setting, you can find the packages in this path: `antd/lib/locale-provider/` | object | - |
-
 ## Examples

components/locale-provider/index.zh-CN.md

@@ -48,10 +48,4 @@ const { LocaleProvider, locales } = window.antd;
 
 本模块仅用于组件的内建文案，若有业务文案的国际化需求，建议使用 [vue-i18n](https://github.com/kazupon/vue-i18n)
 
-## API
-
-| 参数 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| locale | 语言包配置，语言包可到 `antd/lib/locale-provider/` 目录下寻找 | object | - |
-
 ## 代码演示

components/menu/index.en-US.md

@@ -36,7 +36,7 @@
 | --- | --- | --- |
 | click | callback executed when a menu item is clicked | function({ item, key, keyPath }) |
 | deselect | callback executed when a menu item is deselected, only supported for multiple mode | function({ item, key, selectedKeys }) |
-| openChange | called when open/close sub menu | function(openKeys: string\[]) | 
+| openChange | called when open/close sub menu | function(openKeys: string\[]) |
 | select | callback executed when a menu item is selected | function({ item, key, selectedKeys }) |
 
 
@@ -54,7 +54,7 @@
 | children | sub menus or sub menu items | Array<MenuItem\|SubMenu> |  |
 | disabled | whether sub menu is disabled or not | boolean | false |
 | key | unique id of the sub menu | string |  |
-| title | title of the sub menu | string\|ReactNode |  |
+| title | title of the sub menu | string\|slot |  |
 
 ### Menu.SubMenu Events
 | Events Name | Description | Arguments |
@@ -66,7 +66,7 @@
 | Param | Description | Type | Default value |
 | ----- | ----------- | ---- | ------------- |
 | children | sub menu items | MenuItem\[] |  |
-| title | title of the group | string\|ReactNode |  |
+| title | title of the group | string\|slot |  |
 
 ### Menu.Divider
 

components/menu/index.zh-CN.md

@@ -61,7 +61,7 @@
 
 | 参数 | 说明 | 类型 | 默认值 |
 | --- | --- | --- | --- |
-| title | 分组标题 | string\|\|function|\slot |  |
+| title | 分组标题 | string\|\|function\|slot |  |
 
 ### Menu.Divider
 

components/popconfirm/index.zh-CN.md

@@ -27,7 +27,7 @@ title: Popconfirm
 | cancel | 点击取消时触发 | (e) |
 | confirm | 点击确认时触发 | (e) |
 
-更多属性请参考 [Tooltip](/components/tooltip/#API)。
+更多属性请参考 [Tooltip](#/cn/components/tooltip/API)。
 
 ## 注意
 

components/popover/index.zh-CN.md

@@ -20,7 +20,7 @@ title: Popover
 | content | 卡片内容 | string\|function\|slot | 无 |
 | title | 卡片标题 | string\|function\|slot | 无 |
 
-更多属性请参考 [Tooltip](/components/tooltip/#API)。
+更多属性请参考 [Tooltip](#/cn/components/tooltip/API)。
 
 ## 注意
 

components/select/demo/coordinate.md

@@ -2,13 +2,13 @@
 <cn>
 #### 联动
 省市联动是典型的例子。
-推荐使用 [Cascader](/components/cascader/) 组件。
+推荐使用 [Cascader](#/cn/components/cascader/) 组件。
 </cn>
 
 <us>
 #### coordinate
 Coordinating the selection of provinces and cities is a common use case and demonstrates how selection can be coordinated.
-Using the [Cascader](/components/cascader) component is strongly recommended instead as it is more flexible and capable.
+Using the [Cascader](#/us/components/cascader) component is strongly recommended instead as it is more flexible and capable.
 </us>
 
 ```html

components/tabs/index.zh-CN.md

@@ -16,7 +16,7 @@ Ant Design 依次提供了三级选项卡，分别用于不同的场景。
 
 - 卡片式的页签，提供可关闭的样式，常用于容器顶部。
 - 标准线条式页签，用于容器内部的主功能切换，这是最常用的 Tabs。
-- [RadioButton](/components/radio/#components-radio-demo-radiobutton) 可作为更次级的页签来使用。
+- [RadioButton](#/cn/components/radio/components-radio-demo-radiobutton) 可作为更次级的页签来使用。
 
 ## API
 

components/vc-menu/MenuItemGroup.jsx

@@ -34,7 +34,7 @@ const MenuItemGroup = {
           {getComponentFromProp(this, 'title')}
         </div>
         <ul class={listClassName}>
-          {this.$slots.default.map(this.renderInnerMenuItem)}
+          {this.$slots.default && this.$slots.default.map(this.renderInnerMenuItem)}
         </ul>
       </li>
     )

examples/components/demo.vue

@@ -5,30 +5,72 @@ import zhCN from 'antd/locale-provider/zh_CN'
 import enUS from 'antd/locale-provider/default'
 export default {
   render () {
-    const { name, demo } = this.$route.params // eslint-disable-line
+    const { name } = this.$route.params
     let { lang } = this.$route.params
-    const Demo = AllDemo[name]
+    const titleMap = {}
+    const menuConfig = {
+      General: [],
+      Layout: [],
+      Navigation: [],
+      'Data Entry': [],
+      'Data Display': [],
+      Feedback: [],
+      Other: [],
+    }
+    for (const [title, d] of Object.entries(AllDemo)) {
+      const type = d.type || 'Other'
+      const key = `${title.replace(/(\B[A-Z])/g, '-$1').toLowerCase()}`
+      titleMap[key] = title
+      menuConfig[type] = menuConfig[type] || []
+      menuConfig[type].push(d)
+    }
+    const Demo = AllDemo[titleMap[name]]
+    const MenuGroup = []
+    for (const [type, menus] of Object.entries(menuConfig)) {
+      const MenuItems = []
+      menus.forEach(({ title, subtitle }) => {
+        const linkValue = lang === 'cn'
+          ? [<span>{title}</span>, <span class='chinese'>{subtitle}</span>]
+          : [<span>{title}</span>]
+        const key = `${title.replace(/(\B[A-Z])/g, '-$1').toLowerCase()}`
+        MenuItems.push(<a-menu-item key={key}>
+          <router-link to={{ path: `/${lang}/components/${key}` }}>{linkValue}</router-link>
+        </a-menu-item>)
+      })
+      MenuGroup.push(<a-menu-item-group title={type}>{MenuItems}</a-menu-item-group>)
+    }
     let locale = zhCN
     if (lang !== 'cn') {
       lang = 'us'
       locale = enUS
     }
     return (
-      <a-locale-provider locale={locale}>
-        <div class='site'>
-          <Header />
+      <div class='page-wrapper'>
+        <Header num={Object.keys(AllDemo).length}/>
+        <a-locale-provider locale={locale}>
           <div class='main-wrapper'>
-            <a-menu class='nav' selectedKeys={[name]}>
-              {Object.keys(AllDemo).map(d => <a-menu-item key={d}>
-                <router-link to={{ path: `/${lang}/components/${d}` }}>{d}</router-link>
-              </a-menu-item>)}
-            </a-menu>
-            <div class='content main-container'>
-              {Demo ? <Demo /> : '正在紧急开发中...'}
-            </div>
+            <a-row>
+              <a-col xxl={4} xl={5} lg={5} md={6} sm={24} xs={24}>
+                <a-menu
+                  class='aside-container menu-site'
+                  selectedKeys={[name]}
+                  defaultOpenKeys={['Components']}
+                  inlineIndent={40}
+                  mode='inline'>
+                  <a-sub-menu title='Components' key='Components'>
+                    {MenuGroup}
+                  </a-sub-menu>
+                </a-menu>
+              </a-col>
+              <a-col xxl={20} xl={19} lg={19} md={18} sm={0} xs={0}>
+                <div class='content main-container'>
+                  {Demo ? <Demo key={lang}/> : '正在紧急开发中...'}
+                </div>
+              </a-col>
+            </a-row>
           </div>
-        </div>
-      </a-locale-provider>
+        </a-locale-provider>
+      </div>
     )
   },
 }