Merge pull request #20 from binjie09/master

upgrade 0.3.10

CHANGELOG.en-US.md

@@ -15,6 +15,17 @@ timeline: true
 
 ---
 
+## 0.3.10
+
+`2018-09-21`
+
+- 🌟 `List`: List add `empty`.
+- 🌟 `Table`: Table add `empty`.
+- 🌟 `Icon`: Added new icons.
+- 💄 `Select`: Adjust the style.
+- 💄 `Cascader`: Adjust the style.
+- 💄 `Table`: Fixed a bug where the editable cell example could not edit the cell.
+
 ## 0.3.9
 
 `2018-09-07`

CHANGELOG.zh-CN.md

@@ -15,6 +15,17 @@ timeline: true
 
 ---
 
+## 0.3.10
+
+`2018-09-14`
+
+- 🌟 `List`: List添加`empty`属性。
+- 🌟 `Table`: Table添加`empty`属性。
+- 🌟 `Icon`: 增加新的图标。
+- 💄 `Select`: 修复Select使用方向键选择时样式缺失的bug。
+- 💄 `Cascader`: 级联选择器 修复样式问题。
+- 💄 `Table`: 修复可编辑单元格示例无法编辑单元格的bug。
+
 ## 0.3.9
 
 `2018-09-07`

components/cascader/style/index.less

@@ -56,10 +56,14 @@
       width: 100%;
     }
 
+    .ant-input-has-label .ant-input-content {
+      padding-top: 0;
+    }
+
     &-clear {
       display: none;
       position: absolute;
-      right: @control-padding-horizontal;
+      right: 0;
       z-index: 2;
       background: @component-background;
       top: 50%;
@@ -76,7 +80,7 @@
       position: absolute;
       z-index: 1;
       top: 50%;
-      right: @control-padding-horizontal;
+      right: 0;
       margin-top: -8px;
       width: 20px;
       height: 20px;
@@ -94,7 +98,7 @@
 
   &-picker-small &-picker-clear,
   &-picker-small &-picker-arrow {
-    right: @control-padding-horizontal-sm;
+    right: 0;
   }
 
   &-menus {

components/icon/icons.tsx

@@ -1,6 +1,7 @@
 const icons = {
   default: [
-    'classname', 'state_over', 'task_schedule', 'unallocated_question', 'unfinished_question', 'all_reports', 'burnout_map',
+    'devops_chart', 'agile_chart', 'test_chart', 'bar_chart', 'unlock', 'classname',
+    'state_over', 'task_schedule', 'unallocated_question', 'unfinished_question', 'all_reports', 'burnout_map',
     'iterative_workbench', 'outstanding_tasks', 'report_overview', 'test_execute',
     'test_planning', 'git', 'project_list', 'domain_list', 'IP_out', 'message_notification',
     'all_read', 'inmail_template', 'mail_set', 'export_EOT', 'export_html',

components/list/__tests__/__snapshots__/demo.test.js.snap

@@ -395,40 +395,29 @@ exports[`renders ./components/list/demo/loadmore.md correctly 1`] = `
 >
   <div>
     <div
-      class="ant-spin-nested-loading"
+      class="ant-spin ant-spin-spinning"
     >
       <div
-        class="ant-spin ant-spin-spinning"
+        class="ant-progress ant-progress-loading ant-progress-status-normal ant-progress-show-info ant-progress-default ant-spin-dot"
       >
         <div
-          class="ant-progress ant-progress-loading ant-progress-status-normal ant-progress-show-info ant-progress-default ant-spin-dot"
+          class="ant-progress-inner"
+          style="width:30px;height:30px"
         >
-          <div
-            class="ant-progress-inner"
-            style="width:30px;height:30px"
+          <svg
+            viewBox="0 0 50 50"
           >
-            <svg
-              viewBox="0 0 50 50"
-            >
-              <circle
-                cx="25"
-                cy="25"
-                fill="none"
-                r="20"
-                stroke="#3367d6"
-                stroke-width="4"
-              />
-            </svg>
-          </div>
+            <circle
+              cx="25"
+              cy="25"
+              fill="none"
+              r="20"
+              stroke="#3367d6"
+              stroke-width="4"
+            />
+          </svg>
         </div>
       </div>
-      <div
-        class="ant-spin-container ant-spin-blur"
-      >
-        <div
-          style="min-height:53px"
-        />
-      </div>
     </div>
     <div
       style="text-align:center;margin-top:12px;height:32px;line-height:32px"

components/list/index.en-US.md

@@ -19,6 +19,7 @@ A list can be used to display content related to a single subject. The content c
 | -------- | ----------- | ---- | ------- |
 | bordered | Toggles rendering of the border around the list | boolean | false |
 | footer | List footer renderer | string\|ReactNode | - |
+| empty | display while dataSource has't data | string\|ReactNode | - |
 | grid | The grid type of list. You can set grid to something like {gutter: 16, column: 4} | object | - |
 | header | List header renderer | string\|ReactNode | - |
 | itemLayout | The layout of list, default is `horizontal`, If a vertical list is desired, set the itemLayout property to `vertical` | string | - |

components/list/index.tsx

@@ -49,6 +49,7 @@ export interface ListProps {
   split?: boolean;
   header?: React.ReactNode;
   footer?: React.ReactNode;
+  empty?: React.ReactNode;
   locale?: Object;
 }
 
@@ -128,6 +129,7 @@ export default class List extends React.Component<ListProps> {
       renderItem,
       header,
       footer,
+      empty,
       loading,
       ...rest,
     } = this.props;
@@ -181,7 +183,7 @@ export default class List extends React.Component<ListProps> {
       childrenContent = grid ? (
         <Row gutter={grid.gutter}>{childrenList}</Row>
       ) : childrenList;
-    } else if (!children && !isLoading) {
+    } else if (!children && !isLoading && !empty) {
       childrenContent = (
         <LocaleReceiver
           componentName="Table"
@@ -190,6 +192,8 @@ export default class List extends React.Component<ListProps> {
           {this.renderEmpty}
         </LocaleReceiver>
       );
+    } else {
+      childrenContent = empty;
     }
 
     const content = (

components/list/index.zh-CN.md

@@ -20,6 +20,7 @@ cols: 1
 | --- | --- | --- | --- |
 | bordered | 是否展示边框 | boolean | false |
 | footer | 列表底部 | string\|ReactNode | - |
+| empty | 当数据源为空时显示的内容 | string\|ReactNode | - |
 | grid | 列表栅格配置 | object | - |
 | header | 列表头部 | string\|ReactNode | - |
 | itemLayout | 设置 `List.Item` 布局, 设置成 `vertical` 则竖直样式显示, 默认横排 | string | - |

components/select/style/index.less

@@ -658,6 +658,10 @@
         background-color: @item-focus-bg;
       }
 
+      &-active {
+        background-color: @item-focus-bg;
+      }
+
       &-divider {
         height: 1px;
         margin: 1px 0;

components/style/core/iconfont.less

@@ -24,6 +24,24 @@
   }
 }
 
+// 9.19
+
+.@{iconfont-css-prefix}-devops_chart:before {
+  content: "\e9b3";
+}
+.@{iconfont-css-prefix}-agile_chart:before {
+  content: "\e9b5";
+}
+.@{iconfont-css-prefix}-test_chart:before {
+  content: "\e9b6";
+}
+.@{iconfont-css-prefix}-bar_chart:before {
+  content: "\e9b7";
+}
+.@{iconfont-css-prefix}-unlock:before {
+  content: "\e9b8";
+}
+
 // 9.7
 
 .@{iconfont-css-prefix}-classname:before {

components/table/Table.tsx

@@ -62,6 +62,7 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
 
   static propTypes = {
     dataSource: PropTypes.array,
+    empty: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
     columns: PropTypes.array,
     prefixCls: PropTypes.string,
     useFixedHeader: PropTypes.bool,
@@ -83,6 +84,7 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
 
   static defaultProps = {
     dataSource: [],
+    empty: null,
     prefixCls: 'ant-table',
     useFixedHeader: false,
     rowSelection: null,
@@ -1008,7 +1010,7 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
 
   renderTable = (contextLocale: TableLocale, loading: SpinProps): React.ReactNode => {
     const locale = { ...contextLocale, ...this.props.locale };
-    const { filterBarMultiple, prefixCls, filterBarPlaceholder, showHeader, filterBar, dataSource, filters, ...restProps } = this.props;
+    const { filterBarMultiple, prefixCls, filterBarPlaceholder, showHeader, filterBar, dataSource, filters, empty, ...restProps } = this.props;
     const data = this.getCurrentPageData();
     const expandIconAsCell = this.props.expandedRowRender && this.props.expandIconAsCell !== false;
 
@@ -1046,7 +1048,7 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
         className={classString}
         expandIconColumnIndex={expandIconColumnIndex}
         expandIconAsCell={expandIconAsCell}
-        emptyText={!loading.spinning && locale.emptyText}
+        emptyText={!loading.spinning && (empty || locale.emptyText)}
       />
     );
     if (filterBar) {

components/table/__tests__/__snapshots__/demo.test.js.snap

@@ -4007,7 +4007,7 @@ exports[`renders ./components/table/demo/edit-cell.md correctly 1`] = `
                         >
                           Edward King 0
                           <i
-                            class="icon icon-edit editable-cell-icon"
+                            class="icon icon-mode_edit editable-cell-icon"
                           />
                         </div>
                       </div>
@@ -4054,7 +4054,7 @@ exports[`renders ./components/table/demo/edit-cell.md correctly 1`] = `
                         >
                           Edward King 1
                           <i
-                            class="icon icon-edit editable-cell-icon"
+                            class="icon icon-mode_edit editable-cell-icon"
                           />
                         </div>
                       </div>

components/table/demo/edit-cell.md

@@ -59,7 +59,7 @@ class EditableCell extends React.Component {
               <div className="editable-cell-text-wrapper">
                 {value || ' '}
                 <Icon
-                  type="edit"
+                  type="mode_edit"
                   className="editable-cell-icon"
                   onClick={this.edit}
                 />

components/table/index.en-US.md

@@ -62,6 +62,7 @@ const columns = [{
 | expandedRowRender | Expanded container render for each row | Function(record):ReactNode | - |
 | expandRowByClick | Whether to expand row by clicking anywhere in the whole row | boolean | `false` |
 | footer | Table footer renderer | Function(currentPageData) |  |
+| empty | Display while dataSource has't data | ReactNode | - |
 | indentSize | Indent size in pixels of tree data | number | 15 |
 | loading | Loading status of table | boolean\|[object](https://ant.design/components/spin-cn/#API) ([more](https://github.com/ant-design/ant-design/issues/4544#issuecomment-271533135)) | `false` |
 | locale | i18n text including filter, sort, empty text, etc | object | filterConfirm: 'Ok' <br> filterReset: 'Reset' <br> emptyText: 'No Data' <br> [Default](https://github.com/ant-design/ant-design/issues/575#issuecomment-159169511) |

components/table/index.zh-CN.md

@@ -63,6 +63,7 @@ const columns = [{
 | expandedRowRender | 额外的展开行 | Function(record):ReactNode | - |
 | expandRowByClick | 通过点击行来展开子行 | boolean | `false` |
 | footer | 表格尾部 | Function(currentPageData) |  |
+| empty | 当数据源为空时显示的内容 | ReactNode | - |
 | indentSize | 展示树形数据时，每层缩进的宽度，以 px 为单位 | number | 15 |
 | loading | 页面是否加载中 | boolean\|[object](https://ant.design/components/spin-cn/#API) ([更多](https://github.com/ant-design/ant-design/issues/4544#issuecomment-271533135)) | false |
 | locale | 默认文案设置，目前包括排序、过滤、空数据文案 | object | filterConfirm: '确定' <br> filterReset: '重置' <br> emptyText: '暂无数据' <br> [默认值](https://github.com/ant-design/ant-design/issues/575#issuecomment-159169511) |

components/table/interface.tsx

@@ -11,6 +11,7 @@ export type ColumnFilterItem = { text: string; value: string, children?: ColumnF
 export interface ColumnProps<T> {
   title?: React.ReactNode;
   filterTitle?: React.ReactNode;
+  empty?: React.ReactNode;
   key?: React.Key;
   dataIndex?: string;
   render?: (text: any, record: T, index: number) => React.ReactNode;
@@ -112,6 +113,7 @@ export interface TableProps<T> {
   showHeader?: boolean;
   footer?: (currentPageData: Object[]) => React.ReactNode;
   title?: (currentPageData: Object[]) => React.ReactNode;
+  empty?: (currentPageData: Object[]) => React.ReactNode;
   scroll?: { x?: boolean | number | string, y?: boolean | number | string };
   childrenColumnName?: string;
   bodyStyle?: React.CSSProperties;

package.json

@@ -1,6 +1,6 @@
 {
   "name": "choerodon-ui",
-  "version": "0.3.9",
+  "version": "0.3.10",
   "title": "Choerodon UI",
   "description": "An enterprise-class UI design language and React-based implementation",
   "homepage": "",