merge master into Feature (#25262)

* feat: add successColor for Progress (#24655) * feat: add successColor for Progress * feat: update * fix: update test * remove snap * feat: add test case * refactor success * feat: adjust styyle * feat: add DevWarning * feat: Support rowSelection.dirty (#24718) * feat: Support rowSelection.dirty * rename to reserveKeys * preserveKeys will keep record also * to preserveSelectedRowKeys * feat: add ghost prop for collapse (#24734) * feat: add ghost prop for collapse * doc: version of collapse's ghost prop * refactor: make ghost collapse's less code to a nested style * chore: remove redundant codes in ghost collapse's less & doc * doc: add a background wrapper for ghost collapse demo * doc: dark-theme wrapper bg-color for ghost collapse demo * test: update snapshot of ghost collapse * doc: use softer bg-color on ghost collapse demo * doc: remove disabled panel in ghost collapse demo * feat: form instance support getFieldInstance (#24711) * support getFieldInstance * update doc * fix lint * move func * move into hooks * update ref logic * fix lint * rm only * fix docs * feat: dropdown support arrow (#23869) * feat: dropdown support arrow prop close #22758 * test: update snapshot * fix: fix dropdown cls names * test: update snapshot * test: update snapshot * doc: update demo * test: update demo snapshot * demo * fix: snapshot * chore: change the style of ghost collapse & demo modified (#24762) * refactor: reduce content padding in ghost collapse * doc: remove the wrapper outside ghost collapse Designer want the demo differs from other demos * refactor: remove redundant .less code in collapse * feat: cascader dropdown-render prop (#24812) * feat: cascader dropdown-render prop * fix: update Cascader dropdownRender type annotation * fix: set rc-cascader semver from ^ to ~ * docs: fix coding style in cascader/custom-dropdown * feat: 🆕 support Drawer closeIcon (#24842) * feat: 🆕 support Drawer closeIcon close #19283 close #19153 * add test case * update docs * feat: 🆕 Cascader expandIcon (#24865) * feat: cascader expandIcon * fix: snap * refactor: reduce CSS size (#24846) * refactor: reduce button css size * refactor: remove redundant button .less code * feat: add Table onChange an action param (#24697) * Working on tests * created TableAction type * changed TableActions to tuple * removed chinese documentation line * refactor TableActions * fix documentation * Moved action into extra param * minor doc change * feat: add closeIcon customize tag close (#24885) * feat: add closeIcon customize tag close * docs fix * update snap * fix: css name * update snapshot * snapshot * feat: add radio `optionType` api to set radio option type (#24809) * feat: radio component * docs: update md * fix: snap * test components * fix: use optionType * fix name * add warning * fix * feat: expand rate character (#24903) * feat: expand rate character * fix: demo * fix: snap * Update components/rate/index.zh-CN.md Co-authored-by: 偏右 <[email protected]> * fix Co-authored-by: 偏右 <[email protected]> * Refactor demo code box actions (#24887) * refactor: refine the styling of actions part of demo code-box * fix: lint style * refactor: move Result children to end (#24945) * feat: remove content max-width on dot-step (#24907) * feat: add Skeleton-Image (#24805) * feat: add Skeleton-Image * feat: add docs * fix: adjust skeleton * feat: adjust Image Component * feat: rebase * feat: adjust style * fix: lint * feat: remove size * feat: delete md * feat: fix style * ✨ feat: Mentions support autoSize (#24961) close #17746 * chore: replace textarea with rc-textarea (#24966) * feat: update [email protected] support onChange called when pageSize change (#24964) * feat: update [email protected] and add test case to relative component * fix: lint * delete * feat: add test case for pagination * adjust test case * feat: Implement centered prop in Tabs (#24958) * Implement centered in Tabs along with its tests and docs * Fix build error * Add Chinese translations and remove test case Co-authored-by: Ashkan Pourghasem <[email protected]> * feat: Add modal style parameter (#24773) * add some paramters in default.less * Update components/style/themes/default.less Co-authored-by: Amumu <[email protected]> * change parameter in compact.less Co-authored-by: Crystal Gao <[email protected]> Co-authored-by: Amumu <[email protected]> * feat: export Tabs addIcon (#25006) * feat: export Tabs addIcon * update snapshot * feat: showNow on timepicker and datetimepicker (#25032) * feat: update [email protected] and fix icons of month and quarter picker in DatePicker Component (#25035) * feat: update [email protected] * delete * add * feat: expand rate support props (#24993) * docs: 📝 Add Form.Item hidden in doc (#25108) close #25101 * fix: ⌨️ Improve Pagination accessibility issue (#25119) * ⌨️ Improve Pagination a11y by fixing a W3C error react-component/pagination#280 * update snapshot * 🆙 rc-pagination to 2.4.1 * feat: support triggerSubMenuAction for <Menu /> (#25127) * feat(menu): add triggerSubMenuAction for Menu * feat(menu): test cases * chore: Adjust picker logic (#25135) * chore: update rc-picker 1.10.0 (#25174) * feat: table row check strictly (#24931) * feat: add checkStrictly on Table.rowSelection * fix: LGTM warnings * test: table rowSelection.checkStrictly * test: add cov [wip] * refactor: tree.rowSelection.checkStrictly [wip] * test: table.rowSelection.checkStrictly basic case * feat: support rowKey on checkStrictly table * feat: Table checkStrictly support getCheckboxProps * docs: Table checkStrictly * chore: typo * chore: remove useless comment * chore: update snapshot * chore: update snapshot * fix: fire selectAll on selection dropdown menu & changeRows incorrect in selectAll callback * docs: typo * chore * chore * fix: expand buttons of leaf rows in tree data are not hidden * feat: Table warning about rowKey index parameter * perf: only generate keyEntities when not checkStrictly * refactor: remove useless parseCheckedKeys * refactor: get derived selected & half selected keys from selectedRowKeys * chore: remove env condition stmt * chore: revert index usage & code formatting * chore: rerun ci * docs: table tree-data checkstrictly * test: update snapshots * refactor: use useMergedState hook * chore: rerun ci * chore: rerun ci 2 * chore: revert selection select all behavior * refactor: refactor code based on feature * chore: revert table code format * chore: revert table code format * fix: useMemo deps * fix: useMemo deps * fix: useMemo deps * feat: support preserve (#25186) * docs: add responsibly order for Col (#25139) * feat: add type * feat: add responsibly order cols * feat: add docs * feat: add test case * fix test Co-authored-by: 二货机器人 <[email protected]> Co-authored-by: 偏右 <[email protected]> Co-authored-by: zoomdong <[email protected]> Co-authored-by: 07akioni <[email protected]> Co-authored-by: wendellhu <[email protected]> Co-authored-by: xrkffgg <[email protected]> Co-authored-by: Neto Braghetto <[email protected]> Co-authored-by: Kermit Xuan <[email protected]> Co-authored-by: Ashkan Pourghasem <[email protected]> Co-authored-by: Ashkan Pourghasem <[email protected]> Co-authored-by: hicrystal <[email protected]> Co-authored-by: Crystal Gao <[email protected]> Co-authored-by: Amumu <[email protected]> Co-authored-by: Li Ming <[email protected]>
ant-design · Jun 28, 2020 · 523b74e · 523b74e
1 parent 1ca1bb0
commit 523b74e
Show file tree

Hide file tree

Showing 154 changed files with 4,857 additions and 1,912 deletions.
diff --git a/components/cascader/__tests__/__snapshots__/demo.test.js.snap b/components/cascader/__tests__/__snapshots__/demo.test.js.snap
@@ -80,6 +80,46 @@ exports[`renders ./components/cascader/demo/change-on-select.md correctly 1`] =
 </span>
 `;
 
+exports[`renders ./components/cascader/demo/custom-dropdown.md correctly 1`] = `
+<span
+  class="ant-cascader-picker"
+  tabindex="0"
+>
+  <span
+    class="ant-cascader-picker-label"
+  />
+  <input
+    autocomplete="off"
+    class="ant-input ant-cascader-input "
+    placeholder="Please select"
+    readonly=""
+    tabindex="-1"
+    type="text"
+    value=""
+  />
+  <span
+    aria-label="down"
+    class="anticon anticon-down ant-cascader-picker-arrow"
+    role="img"
+  >
+    <svg
+      aria-hidden="true"
+      class=""
+      data-icon="down"
+      fill="currentColor"
+      focusable="false"
+      height="1em"
+      viewBox="64 64 896 896"
+      width="1em"
+    >
+      <path
+        d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
+      />
+    </svg>
+  </span>
+</span>
+`;
+
 exports[`renders ./components/cascader/demo/custom-render.md correctly 1`] = `
 <span
   class="ant-cascader-picker"
@@ -551,7 +591,7 @@ exports[`renders ./components/cascader/demo/size.md correctly 1`] = `
 `;
 
 exports[`renders ./components/cascader/demo/suffix.md correctly 1`] = `
-<div>
+Array [
   <span
     class="ant-cascader-picker"
     tabindex="0"
@@ -588,10 +628,11 @@ exports[`renders ./components/cascader/demo/suffix.md correctly 1`] = `
         />
       </svg>
     </span>
-  </span>
+  </span>,
+  <br />,
+  <br />,
   <span
     class="ant-cascader-picker"
-    style="margin-top:1rem"
     tabindex="0"
   >
     <span
@@ -611,6 +652,84 @@ exports[`renders ./components/cascader/demo/suffix.md correctly 1`] = `
     >
       ab
     </span>
-  </span>
-</div>
+  </span>,
+  <br />,
+  <br />,
+  <span
+    class="ant-cascader-picker"
+    tabindex="0"
+  >
+    <span
+      class="ant-cascader-picker-label"
+    />
+    <input
+      autocomplete="off"
+      class="ant-input ant-cascader-input "
+      placeholder="Please select"
+      readonly=""
+      tabindex="-1"
+      type="text"
+      value=""
+    />
+    <span
+      aria-label="down"
+      class="anticon anticon-down ant-cascader-picker-arrow"
+      role="img"
+    >
+      <svg
+        aria-hidden="true"
+        class=""
+        data-icon="down"
+        fill="currentColor"
+        focusable="false"
+        height="1em"
+        viewBox="64 64 896 896"
+        width="1em"
+      >
+        <path
+          d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
+        />
+      </svg>
+    </span>
+  </span>,
+  <br />,
+  <br />,
+  <span
+    class="ant-cascader-picker"
+    tabindex="0"
+  >
+    <span
+      class="ant-cascader-picker-label"
+    />
+    <input
+      autocomplete="off"
+      class="ant-input ant-cascader-input "
+      placeholder="Please select"
+      readonly=""
+      tabindex="-1"
+      type="text"
+      value=""
+    />
+    <span
+      aria-label="down"
+      class="anticon anticon-down ant-cascader-picker-arrow"
+      role="img"
+    >
+      <svg
+        aria-hidden="true"
+        class=""
+        data-icon="down"
+        fill="currentColor"
+        focusable="false"
+        height="1em"
+        viewBox="64 64 896 896"
+        width="1em"
+      >
+        <path
+          d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
+        />
+      </svg>
+    </span>
+  </span>,
+]
 `;
diff --git a/components/cascader/demo/custom-dropdown.md b/components/cascader/demo/custom-dropdown.md
@@ -0,0 +1,72 @@
+---
+order: 12
+title:
+  zh-CN: 扩展菜单
+  en-US: Custom dropdown
+---
+
+## zh-CN
+
+使用 `dropdownRender` 对下拉菜单进行自由扩展。
+
+## en-US
+
+Customize the dropdown menu via `dropdownRender`.
+
+```jsx
+import { Cascader, Divider } from 'antd';
+
+const options = [
+  {
+    value: 'zhejiang',
+    label: 'Zhejiang',
+    children: [
+      {
+        value: 'hangzhou',
+        label: 'Hangzhou',
+        children: [
+          {
+            value: 'xihu',
+            label: 'West Lake',
+          },
+        ],
+      },
+    ],
+  },
+  {
+    value: 'jiangsu',
+    label: 'Jiangsu',
+    children: [
+      {
+        value: 'nanjing',
+        label: 'Nanjing',
+        children: [
+          {
+            value: 'zhonghuamen',
+            label: 'Zhong Hua Men',
+          },
+        ],
+      },
+    ],
+  },
+];
+
+function dropdownRender(menus) {
+  return (
+    <div>
+      {menus}
+      <Divider style={{ margin: 0 }} />
+      <div style={{ padding: 8 }}>The footer is not very short.</div>
+    </div>
+  );
+}
+
+ReactDOM.render(
+  <Cascader
+    options={options}
+    dropdownRender={dropdownRender}
+    placeholder="Please select"
+  />,
+  mountNode,
+);
+```
diff --git a/components/cascader/demo/suffix.md b/components/cascader/demo/suffix.md
@@ -2,17 +2,17 @@
 order: 11
 debug: true
 title:
-  zh-CN: 后缀图标
-  en-US: Suffix
+  zh-CN: 自定义图标
+  en-US: Custom Icons
 ---
 
 ## zh-CN
 
-省市区级联。
+通过 `suffixIcon` 自定义选择框后缀图标，通过 `expandIcon` 自定义次级菜单展开图标。
 
 ## en-US
 
-Cascade selection box for selecting province/city/district.
+Use `suffixIcon` to customize the selection box suffix icon, and use `expandIcon` to customize the current item expand icon.
 
 ```jsx
 import { Cascader } from 'antd';
@@ -58,21 +58,28 @@ function onChange(value) {
 }
 
 ReactDOM.render(
-  <div>
+  <>
     <Cascader
       suffixIcon={<SmileOutlined />}
       options={options}
       onChange={onChange}
       placeholder="Please select"
     />
+    <br />
+    <br />
+    <Cascader suffixIcon="ab" options={options} onChange={onChange} placeholder="Please select" />
+    <br />
+    <br />
     <Cascader
-      suffixIcon="ab"
-      style={{ marginTop: '1rem' }}
+      expandIcon={<SmileOutlined />}
       options={options}
       onChange={onChange}
       placeholder="Please select"
     />
-  </div>,
+    <br />
+    <br />
+    <Cascader expandIcon="ab" options={options} onChange={onChange} placeholder="Please select" />
+  </>,
   mountNode,
 );
 ```
diff --git a/components/cascader/index.en-US.md b/components/cascader/index.en-US.md
@@ -30,6 +30,7 @@ Cascade selection box.
 | disabled | whether disabled select | boolean | false |  |
 | displayRender | render function of displaying selected options | `(label, selectedOptions) => ReactNode` | `label => label.join(' / ')` |  |
 | expandTrigger | expand current item when click or hover, one of 'click' 'hover' | string | `click` |  |
+| expandIcon | customize the current item expand icon | ReactNode | - | 4.4.0 |
 | fieldNames | custom field name for label and value and children | object | `{ label: 'label', value: 'value', children: 'children' }` |  |
 | getPopupContainer | Parent Node which the selector should be rendered to. Default to `body`. When position issues happen, try to modify it into scrollable content and position it relative.[example](https://codepen.io/afc163/pen/zEjNOy?editors=0010) | Function(triggerNode) | () => document.body |  |
 | loadData | To load option lazily, and it cannot work with `showSearch` | `(selectedOptions) => void` | - |  |
@@ -44,6 +45,7 @@ Cascade selection box.
 | style | additional style | CSSProperties | - |  |
 | suffixIcon | The custom suffix icon | ReactNode | - |  |
 | value | selected value | string\[] \| number\[] | - |  |
+| dropdownRender | Customize dropdown content | `(menus: ReactNode) => ReactNode` | - | 4.4.0 |
 | onChange | callback when finishing cascader select | `(value, selectedOptions) => void` | - |  |
 | onPopupVisibleChange | callback when popup shown or hidden | `(value) => void` | - |  |
 

diff --git a/components/cascader/index.tsx b/components/cascader/index.tsx
@@ -97,6 +97,7 @@ export interface CascaderProps {
   loadData?: (selectedOptions?: CascaderOptionType[]) => void;
   /** 次级菜单的展开方式，可选 'click' 和 'hover' */
   expandTrigger?: CascaderExpandTrigger;
+  expandIcon?: React.ReactNode;
   /** 当此项为 true 时，点选每级菜单选项值都会发生变化 */
   changeOnSelect?: boolean;
   /** 浮层可见变化时回调 */
@@ -108,6 +109,7 @@ export interface CascaderProps {
   /** use this after [email protected] */
   fieldNames?: FieldNamesType;
   suffixIcon?: React.ReactNode;
+  dropdownRender?: (menus: React.ReactNode) => React.ReactNode
 }
 
 export interface CascaderState {
@@ -458,11 +460,14 @@ class Cascader extends React.Component<CascaderProps, CascaderState> {
           allowClear,
           showSearch = false,
           suffixIcon,
+          expandIcon,
           notFoundContent,
           popupClassName,
           bordered,
+          dropdownRender,
           ...otherProps
         } = props;
+
         const mergedSize = customizeSize || size;
 
         const { value, inputFocused } = state;
@@ -592,9 +597,11 @@ class Cascader extends React.Component<CascaderProps, CascaderState> {
           </span>
         );
 
-        let expandIcon = <RightOutlined />;
-        if (isRtlLayout) {
-          expandIcon = <LeftOutlined />;
+        let expandIconNode;
+        if (expandIcon) {
+          expandIconNode = expandIcon;
+        } else {
+          expandIconNode = isRtlLayout ? <LeftOutlined /> : <RightOutlined />;
         }
 
         const loadingIcon = (
@@ -621,10 +628,11 @@ class Cascader extends React.Component<CascaderProps, CascaderState> {
             onPopupVisibleChange={this.handlePopupVisibleChange}
             onChange={this.handleChange}
             dropdownMenuColumnStyle={dropdownMenuColumnStyle}
-            expandIcon={expandIcon}
+            expandIcon={expandIconNode}
             loadingIcon={loadingIcon}
             popupClassName={rcCascaderPopupClassName}
             popupPlacement={this.getPopupPlacement(direction)}
+            dropdownRender={dropdownRender}
           >
             {input}
           </RcCascader>

diff --git a/components/cascader/index.zh-CN.md b/components/cascader/index.zh-CN.md
@@ -31,6 +31,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/UdS8y8xyZ/Cascader.svg
 | disabled | 禁用 | boolean | false |  |
 | displayRender | 选择后展示的渲染函数 | `(label, selectedOptions) => ReactNode` | `label => label.join(' / ')` |  |
 | expandTrigger | 次级菜单的展开方式，可选 'click' 和 'hover' | string | `click` |  |
+| expandIcon | 自定义次级菜单展开图标 | ReactNode | - | 4.4.0 |
 | fieldNames | 自定义 options 中 label name children 的字段 | object | `{ label: 'label', value: 'value', children: 'children' }` |  |
 | getPopupContainer | 菜单渲染父节点。默认渲染到 body 上，如果你遇到菜单滚动定位问题，试试修改为滚动的区域，并相对其定位。[示例](https://codepen.io/afc163/pen/zEjNOy?editors=0010) | Function(triggerNode) | () => document.body |  |
 | loadData | 用于动态加载选项，无法与 `showSearch` 一起使用 | `(selectedOptions) => void` | - |  |
@@ -45,6 +46,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/UdS8y8xyZ/Cascader.svg
 | style | 自定义样式 | CSSProperties | - |  |
 | suffixIcon | 自定义的选择框后缀图标 | ReactNode | - |  |
 | value | 指定选中项 | string\[] \| number\[] | - |  |
+| dropdownRender | 自定义下拉框内容 | `(menus: ReactNode) => ReactNode` | - | 4.4.0 |
 | onChange | 选择完成后的回调 | `(value, selectedOptions) => void` | - |  |
 | onPopupVisibleChange | 显示/隐藏浮层的回调 | `(value) => void` | - |  |