chore: auto merge branches (ant-design#37390)

chore: master merge feature
gregberge · Sep 4, 2022 · 7846d69 · 7846d69
2 parents abbc85c + 90ff9cf
commit 7846d69
Show file tree

Hide file tree

Showing 169 changed files with 3,310 additions and 2,206 deletions.
diff --git a/components/_util/reactNode.ts b/components/_util/reactNode.ts
@@ -2,6 +2,10 @@ import * as React from 'react';
 
 export const { isValidElement } = React;
 
+export function isFragment(child: React.ReactElement): boolean {
+  return child && child.type === React.Fragment;
+}
+
 type AnyObject = Record<any, any>;
 
 type RenderProps = undefined | AnyObject | ((originProps: AnyObject) => AnyObject | undefined);

diff --git a/components/auto-complete/__tests__/index.test.tsx b/components/auto-complete/__tests__/index.test.tsx
@@ -98,4 +98,18 @@ describe('AutoComplete', () => {
     );
     expect(screen.getByRole('combobox')).toHaveClass('custom');
   });
+
+  it('should show warning when use dropdownClassName', () => {
+    const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
+    render(
+      <AutoComplete dropdownClassName="myCustomClassName">
+        <AutoComplete.Option value="111">111</AutoComplete.Option>
+        <AutoComplete.Option value="222">222</AutoComplete.Option>
+      </AutoComplete>,
+    );
+    expect(errorSpy).toHaveBeenCalledWith(
+      'Warning: [antd: AutoComplete] `dropdownClassName` is deprecated which will be removed in next major version. Please use `popupClassName` instead.',
+    );
+    errorSpy.mockRestore();
+  });
 });
diff --git a/components/auto-complete/demo/certain-category.md b/components/auto-complete/demo/certain-category.md
@@ -66,7 +66,7 @@ const options = [
 
 const App: React.FC = () => (
   <AutoComplete
-    dropdownClassName="certain-category-search-dropdown"
+    popupClassName="certain-category-search-dropdown"
     dropdownMatchSelectWidth={500}
     style={{ width: 250 }}
     options={options}

diff --git a/components/auto-complete/index.en-US.md b/components/auto-complete/index.en-US.md
@@ -31,7 +31,7 @@ The differences with Select are:
 | defaultOpen | Initial open state of dropdown | boolean | - |  |
 | defaultValue | Initial selected option | string | - |  |
 | disabled | Whether disabled select | boolean | false |  |
-| dropdownClassName | The className of dropdown menu | string | - |  |
+| popupClassName | The className of dropdown menu | string | - | 4.23.0 |
 | dropdownMatchSelectWidth | Determine whether the dropdown menu and the select input are the same width. Default set `min-width` same as input. Will ignore when value less than select width. `false` will disable virtual scroll | boolean \| number | true |  |
 | filterOption | If true, filter options by input, if function, filter options against it. The function will receive two arguments, `inputValue` and `option`, if the function returns true, the option will be included in the filtered set; Otherwise, it will be excluded | boolean \| function(inputValue, option) | true |  |
 | notFoundContent | Specify content to show when no result matches | string | `Not Found` |  |

diff --git a/components/auto-complete/index.tsx b/components/auto-complete/index.tsx
@@ -41,6 +41,12 @@ export interface AutoCompleteProps<
   > {
   dataSource?: DataSourceItemType[];
   status?: InputStatus;
+  /**
+   * @deprecated `dropdownClassName` is deprecated which will be removed in next major version.
+   *   Please use `popupClassName` instead.
+   */
+  dropdownClassName?: string;
+  popupClassName?: string;
 }
 
 function isSelectOptionOrSelectOptGroup(child: any): Boolean {
@@ -51,7 +57,14 @@ const AutoComplete: React.ForwardRefRenderFunction<RefSelectProps, AutoCompleteP
   props,
   ref,
 ) => {
-  const { prefixCls: customizePrefixCls, className, children, dataSource } = props;
+  const {
+    prefixCls: customizePrefixCls,
+    className,
+    popupClassName,
+    dropdownClassName,
+    children,
+    dataSource,
+  } = props;
   const childNodes: React.ReactElement[] = toArray(children);
 
   // ============================= Input =============================
@@ -112,6 +125,12 @@ const AutoComplete: React.ForwardRefRenderFunction<RefSelectProps, AutoCompleteP
     '`dataSource` is deprecated, please use `options` instead.',
   );
 
+  warning(
+    !dropdownClassName,
+    'AutoComplete',
+    '`dropdownClassName` is deprecated which will be removed in next major version. Please use `popupClassName` instead.',
+  );
+
   warning(
     !customizeInput || !('size' in props),
     'AutoComplete',
@@ -128,6 +147,7 @@ const AutoComplete: React.ForwardRefRenderFunction<RefSelectProps, AutoCompleteP
             ref={ref}
             {...omit(props, ['dataSource'])}
             prefixCls={prefixCls}
+            dropdownClassName={popupClassName || dropdownClassName}
             className={classNames(`${prefixCls}-auto-complete`, className)}
             mode={Select.SECRET_COMBOBOX_MODE_DO_NOT_USE as any}
             {...{

diff --git a/components/auto-complete/index.zh-CN.md b/components/auto-complete/index.zh-CN.md
@@ -32,7 +32,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/qtJm4yt45/AutoComplete.svg
 | defaultOpen | 是否默认展开下拉菜单 | boolean | - |  |
 | defaultValue | 指定默认选中的条目 | string | - |  |
 | disabled | 是否禁用 | boolean | false |  |
-| dropdownClassName | 下拉菜单的 className 属性 | string | - |  |
+| popupClassName | 下拉菜单的 className 属性 | string | - | 4.23.0 |
 | dropdownMatchSelectWidth | 下拉菜单和选择器同宽。默认将设置 `min-width`，当值小于选择框宽度时会被忽略。false 时会关闭虚拟滚动 | boolean \| number | true |  |
 | filterOption | 是否根据输入项进行筛选。当其为一个函数时，会接收 `inputValue` `option` 两个参数，当 `option` 符合筛选条件时，应返回 true，反之则返回 false | boolean \| function(inputValue, option) | true |  |
 | getPopupContainer | 菜单渲染父节点。默认渲染到 body 上，如果你遇到菜单滚动定位问题，试试修改为滚动的区域，并相对其定位。[示例](https://codesandbox.io/s/4j168r7jw0) | function(triggerNode) | () => document.body |  |

diff --git a/components/card/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/card/__tests__/__snapshots__/demo-extend.test.ts.snap
@@ -851,13 +851,6 @@ Array [
               role="tabpanel"
               tabindex="0"
             />
-            <div
-              aria-hidden="true"
-              class="ant-tabs-tabpane"
-              role="tabpanel"
-              style="display:none"
-              tabindex="-1"
-            />
           </div>
         </div>
       </div>
@@ -1007,26 +1000,12 @@ Array [
           <div
             class="ant-tabs-content ant-tabs-content-top"
           >
-            <div
-              aria-hidden="true"
-              class="ant-tabs-tabpane"
-              role="tabpanel"
-              style="display:none"
-              tabindex="-1"
-            />
             <div
               aria-hidden="false"
               class="ant-tabs-tabpane ant-tabs-tabpane-active"
               role="tabpanel"
               tabindex="0"
             />
-            <div
-              aria-hidden="true"
-              class="ant-tabs-tabpane"
-              role="tabpanel"
-              style="display:none"
-              tabindex="-1"
-            />
           </div>
         </div>
       </div>

diff --git a/components/card/__tests__/__snapshots__/demo.test.js.snap b/components/card/__tests__/__snapshots__/demo.test.js.snap
@@ -832,13 +832,6 @@ Array [
               role="tabpanel"
               tabindex="0"
             />
-            <div
-              aria-hidden="true"
-              class="ant-tabs-tabpane"
-              role="tabpanel"
-              style="display:none"
-              tabindex="-1"
-            />
           </div>
         </div>
       </div>
@@ -969,26 +962,12 @@ Array [
           <div
             class="ant-tabs-content ant-tabs-content-top"
           >
-            <div
-              aria-hidden="true"
-              class="ant-tabs-tabpane"
-              role="tabpanel"
-              style="display:none"
-              tabindex="-1"
-            />
             <div
               aria-hidden="false"
               class="ant-tabs-tabpane ant-tabs-tabpane-active"
               role="tabpanel"
               tabindex="0"
             />
-            <div
-              aria-hidden="true"
-              class="ant-tabs-tabpane"
-              role="tabpanel"
-              style="display:none"
-              tabindex="-1"
-            />
           </div>
         </div>
       </div>

diff --git a/components/cascader/__tests__/index.test.tsx b/components/cascader/__tests__/index.test.tsx
@@ -541,7 +541,7 @@ describe('Cascader', () => {
     it('popupClassName', () => {
       const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
       const { container } = render(
-        <Cascader open popupPlacement="bottomLeft" popupClassName="mock-cls" />,
+        <Cascader open popupPlacement="bottomLeft" dropdownClassName="mock-cls" />,
       );
 
       expect(container.querySelector('.mock-cls')).toBeTruthy();
@@ -550,7 +550,7 @@ describe('Cascader', () => {
       expect((global as any).triggerProps.popupPlacement).toEqual('bottomLeft');
 
       expect(errorSpy).toHaveBeenCalledWith(
-        'Warning: [antd: Cascader] `popupClassName` is deprecated. Please use `dropdownClassName` instead.',
+        'Warning: [antd: Cascader] `dropdownClassName` is deprecated which will be removed in next major version. Please use `popupClassName` instead.',
       );
 
       errorSpy.mockRestore();

diff --git a/components/cascader/index.en-US.md b/components/cascader/index.en-US.md
@@ -30,7 +30,7 @@ Cascade selection box.
 | defaultValue | Initial selected value | string\[] \| number\[] | \[] |  |
 | disabled | Whether disabled select | boolean | false |  |
 | displayRender | The render function of displaying selected options | (label, selectedOptions) => ReactNode | label => label.join(`/`) | `multiple`: 4.18.0 |
-| dropdownClassName | The additional className of popup overlay | string | - | 4.17.0 |
+| popupClassName | The additional className of popup overlay | string | - | 4.23.0 |
 | dropdownRender | Customize dropdown content | (menus: ReactNode) => ReactNode | - | 4.4.0 |
 | expandIcon | Customize the current item expand icon | ReactNode | - | 4.4.0 |
 | expandTrigger | expand current item when click or hover, one of `click` `hover` | string | `click` |  |

diff --git a/components/cascader/index.tsx b/components/cascader/index.tsx
@@ -108,6 +108,11 @@ export type CascaderProps<DataNodeType> = UnionCascaderProps & {
   suffixIcon?: React.ReactNode;
   options?: DataNodeType[];
   status?: InputStatus;
+  /**
+   * @deprecated `dropdownClassName` is deprecated which will be removed in next major
+   *   version.Please use `popupClassName` instead.
+   */
+  dropdownClassName?: string;
 };
 
 export interface CascaderRef {
@@ -164,9 +169,9 @@ const Cascader = React.forwardRef((props: CascaderProps<any>, ref: React.Ref<Cas
 
   // =================== Warning =====================
   warning(
-    popupClassName === undefined,
+    !dropdownClassName,
     'Cascader',
-    '`popupClassName` is deprecated. Please use `dropdownClassName` instead.',
+    '`dropdownClassName` is deprecated which will be removed in next major version. Please use `popupClassName` instead.',
   );
 
   warning(
@@ -185,7 +190,7 @@ const Cascader = React.forwardRef((props: CascaderProps<any>, ref: React.Ref<Cas
 
   // =================== Dropdown ====================
   const mergedDropdownClassName = classNames(
-    dropdownClassName || popupClassName,
+    popupClassName || dropdownClassName,
     `${cascaderPrefixCls}-dropdown`,
     {
       [`${cascaderPrefixCls}-dropdown-rtl`]: mergedDirection === 'rtl',

diff --git a/components/cascader/index.zh-CN.md b/components/cascader/index.zh-CN.md
@@ -31,7 +31,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/UdS8y8xyZ/Cascader.svg
 | defaultValue | 默认的选中项 | string\[] \| number\[] | \[] |  |
 | disabled | 禁用 | boolean | false |  |
 | displayRender | 选择后展示的渲染函数 | (label, selectedOptions) => ReactNode | label => label.join(`/`) | `multiple`: 4.18.0 |
-| dropdownClassName | 自定义浮层类名 | string | - | 4.17.0 |
+| popupClassName | 自定义浮层类名 | string | - | 4.23.0 |
 | dropdownRender | 自定义下拉框内容 | (menus: ReactNode) => ReactNode | - | 4.4.0 |
 | expandIcon | 自定义次级菜单展开图标 | ReactNode | - | 4.4.0 |
 | expandTrigger | 次级菜单的展开方式，可选 'click' 和 'hover' | string | `click` |  |

diff --git a/components/config-provider/__tests__/__snapshots__/components.test.tsx.snap b/components/config-provider/__tests__/__snapshots__/components.test.tsx.snap
@@ -15806,10 +15806,10 @@ exports[`ConfigProvider components Form configProvider 1`] = `
         >
           <div
             class="config-form-item-explain config-show-help-appear config-show-help-appear-start config-show-help config-form-item-explain-connected"
+            role="alert"
           >
             <div
               class="config-show-help-item-appear config-show-help-item-appear-start config-show-help-item config-form-item-explain-error"
-              role="alert"
               style="height: 0px; opacity: 0;"
             >
               Bamboo is Light
@@ -15854,10 +15854,10 @@ exports[`ConfigProvider components Form configProvider componentDisabled 1`] = `
         >
           <div
             class="config-form-item-explain config-show-help-appear config-show-help-appear-start config-show-help config-form-item-explain-connected"
+            role="alert"
           >
             <div
               class="config-show-help-item-appear config-show-help-item-appear-start config-show-help-item config-form-item-explain-error"
-              role="alert"
               style="height: 0px; opacity: 0;"
             >
               Bamboo is Light
@@ -15901,10 +15901,10 @@ exports[`ConfigProvider components Form configProvider componentSize large 1`] =
         >
           <div
             class="config-form-item-explain config-show-help-appear config-show-help-appear-start config-show-help config-form-item-explain-connected"
+            role="alert"
           >
             <div
               class="config-show-help-item-appear config-show-help-item-appear-start config-show-help-item config-form-item-explain-error"
-              role="alert"
               style="height: 0px; opacity: 0;"
             >
               Bamboo is Light
@@ -15948,10 +15948,10 @@ exports[`ConfigProvider components Form configProvider componentSize middle 1`]
         >
           <div
             class="config-form-item-explain config-show-help-appear config-show-help-appear-start config-show-help config-form-item-explain-connected"
+            role="alert"
           >
             <div
               class="config-show-help-item-appear config-show-help-item-appear-start config-show-help-item config-form-item-explain-error"
-              role="alert"
               style="height: 0px; opacity: 0;"
             >
               Bamboo is Light
@@ -15995,10 +15995,10 @@ exports[`ConfigProvider components Form configProvider virtual and dropdownMatch
         >
           <div
             class="ant-form-item-explain ant-show-help-appear ant-show-help-appear-start ant-show-help ant-form-item-explain-connected"
+            role="alert"
           >
             <div
               class="ant-show-help-item-appear ant-show-help-item-appear-start ant-show-help-item ant-form-item-explain-error"
-              role="alert"
               style="height: 0px; opacity: 0;"
             >
               Bamboo is Light
@@ -16042,10 +16042,10 @@ exports[`ConfigProvider components Form normal 1`] = `
         >
           <div
             class="ant-form-item-explain ant-show-help-appear ant-show-help-appear-start ant-show-help ant-form-item-explain-connected"
+            role="alert"
           >
             <div
               class="ant-show-help-item-appear ant-show-help-item-appear-start ant-show-help-item ant-form-item-explain-error"
-              role="alert"
               style="height: 0px; opacity: 0;"
             >
               Bamboo is Light
@@ -16089,10 +16089,10 @@ exports[`ConfigProvider components Form prefixCls 1`] = `
         >
           <div
             class="prefix-Form-item-explain ant-show-help-appear ant-show-help-appear-start ant-show-help prefix-Form-item-explain-connected"
+            role="alert"
           >
             <div
               class="ant-show-help-item-appear ant-show-help-item-appear-start ant-show-help-item prefix-Form-item-explain-error"
-              role="alert"
               style="height: 0px; opacity: 0;"
             >
               Bamboo is Light