chore: auto merge branchs (#34767)

chore: next merge feature
2024-11-27 20:49:53 +08:00 · 2022-03-29 07:43:35 +00:00 · 2022-03-29 07:43:35 +00:00 · b579933ec6
commit b579933ec6
parent bc143ca65c c84a7aa7ec
13 changed files with 604 additions and 26 deletions
--- a/components/auto-complete/tests/snapshots/demo-extend.test.ts.snap
+++ b/components/auto-complete/tests/snapshots/demo-extend.test.ts.snap
@ -754,7 +754,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md extend context co
            class="ant-input-group ant-input-group-compact"
          >
            <div
-              class="ant-select ant-tree-select ant-select-in-form-item ant-select-single ant-select-show-arrow"
+              class="ant-select ant-tree-select ant-select-single ant-select-show-arrow"
              style="width:30%"
            >
              <div
@ -870,7 +870,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md extend context co
              </span>
            </div>
            <div
-              class="ant-select ant-select-in-form-item ant-select-auto-complete ant-select-single ant-select-show-search"
+              class="ant-select ant-select-auto-complete ant-select-single ant-select-show-search"
            >
              <div
                class="ant-select-selector"
@ -1035,7 +1035,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md extend context co
            class="ant-input-group ant-input-group-compact"
          >
            <div
-              class="ant-select ant-tree-select ant-select-in-form-item ant-select-single ant-select-show-arrow"
+              class="ant-select ant-tree-select ant-select-single ant-select-show-arrow"
              style="width:30%"
            >
              <div
@ -1151,7 +1151,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md extend context co
              </span>
            </div>
            <div
-              class="ant-select ant-select-in-form-item ant-select-auto-complete ant-select-single ant-select-customize-input ant-select-show-search"
+              class="ant-select ant-select-auto-complete ant-select-single ant-select-customize-input ant-select-show-search"
            >
              <div
                class="ant-select-selector"
@ -1249,7 +1249,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md extend context co
            class="ant-input-group ant-input-group-compact"
          >
            <div
-              class="ant-select ant-tree-select ant-select-in-form-item ant-select-single ant-select-show-arrow"
+              class="ant-select ant-tree-select ant-select-single ant-select-show-arrow"
              style="width:30%"
            >
              <div
@ -1365,7 +1365,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md extend context co
              </span>
            </div>
            <div
-              class="ant-select ant-select-in-form-item ant-select-auto-complete ant-select-single ant-select-customize-input ant-select-show-search"
+              class="ant-select ant-select-auto-complete ant-select-single ant-select-customize-input ant-select-show-search"
            >
              <div
                class="ant-select-selector"
@ -1472,7 +1472,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md extend context co
            class="ant-input-group ant-input-group-compact"
          >
            <div
-              class="ant-select ant-tree-select ant-select-in-form-item ant-select-single ant-select-show-arrow"
+              class="ant-select ant-tree-select ant-select-single ant-select-show-arrow"
              style="width:20%"
            >
              <div
@ -1588,7 +1588,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md extend context co
              </span>
            </div>
            <div
-              class="ant-select ant-select-in-form-item ant-select-auto-complete ant-select-single ant-select-customize-input ant-select-show-search"
+              class="ant-select ant-select-auto-complete ant-select-single ant-select-customize-input ant-select-show-search"
            >
              <div
                class="ant-select-selector"
--- a/components/auto-complete/tests/snapshots/demo.test.js.snap
+++ b/components/auto-complete/tests/snapshots/demo.test.js.snap
@ -332,7 +332,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
            class="ant-input-group ant-input-group-compact"
          >
            <div
-              class="ant-select ant-tree-select ant-select-in-form-item ant-select-single ant-select-show-arrow"
+              class="ant-select ant-tree-select ant-select-single ant-select-show-arrow"
              style="width:30%"
            >
              <div
@ -388,7 +388,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
              </span>
            </div>
            <div
-              class="ant-select ant-select-in-form-item ant-select-auto-complete ant-select-single ant-select-show-search"
+              class="ant-select ant-select-auto-complete ant-select-single ant-select-show-search"
            >
              <div
                class="ant-select-selector"
@ -525,7 +525,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
            class="ant-input-group ant-input-group-compact"
          >
            <div
-              class="ant-select ant-tree-select ant-select-in-form-item ant-select-single ant-select-show-arrow"
+              class="ant-select ant-tree-select ant-select-single ant-select-show-arrow"
              style="width:30%"
            >
              <div
@ -581,7 +581,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
              </span>
            </div>
            <div
-              class="ant-select ant-select-in-form-item ant-select-auto-complete ant-select-single ant-select-customize-input ant-select-show-search"
+              class="ant-select ant-select-auto-complete ant-select-single ant-select-customize-input ant-select-show-search"
            >
              <div
                class="ant-select-selector"
@ -665,7 +665,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
            class="ant-input-group ant-input-group-compact"
          >
            <div
-              class="ant-select ant-tree-select ant-select-in-form-item ant-select-single ant-select-show-arrow"
+              class="ant-select ant-tree-select ant-select-single ant-select-show-arrow"
              style="width:30%"
            >
              <div
@ -721,7 +721,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
              </span>
            </div>
            <div
-              class="ant-select ant-select-in-form-item ant-select-auto-complete ant-select-single ant-select-customize-input ant-select-show-search"
+              class="ant-select ant-select-auto-complete ant-select-single ant-select-customize-input ant-select-show-search"
            >
              <div
                class="ant-select-selector"
@ -814,7 +814,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
            class="ant-input-group ant-input-group-compact"
          >
            <div
-              class="ant-select ant-tree-select ant-select-in-form-item ant-select-single ant-select-show-arrow"
+              class="ant-select ant-tree-select ant-select-single ant-select-show-arrow"
              style="width:20%"
            >
              <div
@ -870,7 +870,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
              </span>
            </div>
            <div
-              class="ant-select ant-select-in-form-item ant-select-auto-complete ant-select-single ant-select-customize-input ant-select-show-search"
+              class="ant-select ant-select-auto-complete ant-select-single ant-select-customize-input ant-select-show-search"
            >
              <div
                class="ant-select-selector"
--- a/components/cascader/tests/snapshots/index.test.js.snap
+++ b/components/cascader/tests/snapshots/index.test.js.snap
@ -864,6 +864,314 @@ exports[`Cascader can be selected in RTL direction 3`] = `
 </div>
 `;

+exports[`Cascader legacy props should support showCheckedStrategy child 1`] = `
+<div
+  class="ant-select ant-cascader ant-select-multiple ant-select-allow-clear ant-select-open"
+>
+  <div
+    class="ant-select-selector"
+  >
+    <div
+      class="ant-select-selection-overflow"
+    >
+      <div
+        class="ant-select-selection-overflow-item ant-select-selection-overflow-item-suffix"
+        style="opacity: 1;"
+      >
+        <div
+          class="ant-select-selection-search"
+          style="width: 0px;"
+        >
+          <input
+            aria-autocomplete="list"
+            aria-controls="rc_select_TEST_OR_SSR_list"
+            aria-expanded="true"
+            aria-haspopup="listbox"
+            aria-owns="rc_select_TEST_OR_SSR_list"
+            autocomplete="off"
+            class="ant-select-selection-search-input"
+            id="rc_select_TEST_OR_SSR"
+            readonly=""
+            role="combobox"
+            style="opacity: 0;"
+            type="search"
+            unselectable="on"
+            value=""
+          />
+          <span
+            aria-hidden="true"
+            class="ant-select-selection-search-mirror"
+          >
+             
+          </span>
+        </div>
+      </div>
+    </div>
+    <span
+      class="ant-select-selection-placeholder"
+    />
+  </div>
+  <div>
+    <div
+      class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
+      style="opacity: 0; pointer-events: none; min-width: auto;"
+    >
+      <div>
+        <div
+          class="ant-cascader-menus"
+        >
+          <ul
+            class="ant-cascader-menu"
+            role="menu"
+          >
+            <li
+              aria-checked="false"
+              class="ant-cascader-menu-item ant-cascader-menu-item-expand"
+              data-path-key="zhejiang"
+              role="menuitemcheckbox"
+              title="Zhejiang"
+            >
+              <span
+                class="ant-cascader-checkbox"
+              >
+                <span
+                  class="ant-cascader-checkbox-inner"
+                />
+              </span>
+              <div
+                class="ant-cascader-menu-item-content"
+              >
+                Zhejiang
+              </div>
+              <div
+                class="ant-cascader-menu-item-expand-icon"
+              >
+                <span
+                  aria-label="right"
+                  class="anticon anticon-right"
+                  role="img"
+                >
+                  <svg
+                    aria-hidden="true"
+                    data-icon="right"
+                    fill="currentColor"
+                    focusable="false"
+                    height="1em"
+                    viewBox="64 64 896 896"
+                    width="1em"
+                  >
+                    <path
+                      d="M765.7 486.8L314.9 134.7A7.97 7.97 0 00302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 000-50.4z"
+                    />
+                  </svg>
+                </span>
+              </div>
+            </li>
+            <li
+              aria-checked="false"
+              class="ant-cascader-menu-item ant-cascader-menu-item-expand"
+              data-path-key="jiangsu"
+              role="menuitemcheckbox"
+              title="Jiangsu"
+            >
+              <span
+                class="ant-cascader-checkbox"
+              >
+                <span
+                  class="ant-cascader-checkbox-inner"
+                />
+              </span>
+              <div
+                class="ant-cascader-menu-item-content"
+              >
+                Jiangsu
+              </div>
+              <div
+                class="ant-cascader-menu-item-expand-icon"
+              >
+                <span
+                  aria-label="right"
+                  class="anticon anticon-right"
+                  role="img"
+                >
+                  <svg
+                    aria-hidden="true"
+                    data-icon="right"
+                    fill="currentColor"
+                    focusable="false"
+                    height="1em"
+                    viewBox="64 64 896 896"
+                    width="1em"
+                  >
+                    <path
+                      d="M765.7 486.8L314.9 134.7A7.97 7.97 0 00302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 000-50.4z"
+                    />
+                  </svg>
+                </span>
+              </div>
+            </li>
+          </ul>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`Cascader legacy props should support showCheckedStrategy parent 1`] = `
+<div
+  class="ant-select ant-cascader ant-select-multiple ant-select-allow-clear ant-select-open"
+>
+  <div
+    class="ant-select-selector"
+  >
+    <div
+      class="ant-select-selection-overflow"
+    >
+      <div
+        class="ant-select-selection-overflow-item ant-select-selection-overflow-item-suffix"
+        style="opacity: 1;"
+      >
+        <div
+          class="ant-select-selection-search"
+          style="width: 0px;"
+        >
+          <input
+            aria-autocomplete="list"
+            aria-controls="rc_select_TEST_OR_SSR_list"
+            aria-expanded="true"
+            aria-haspopup="listbox"
+            aria-owns="rc_select_TEST_OR_SSR_list"
+            autocomplete="off"
+            class="ant-select-selection-search-input"
+            id="rc_select_TEST_OR_SSR"
+            readonly=""
+            role="combobox"
+            style="opacity: 0;"
+            type="search"
+            unselectable="on"
+            value=""
+          />
+          <span
+            aria-hidden="true"
+            class="ant-select-selection-search-mirror"
+          >
+             
+          </span>
+        </div>
+      </div>
+    </div>
+    <span
+      class="ant-select-selection-placeholder"
+    />
+  </div>
+  <div>
+    <div
+      class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
+      style="opacity: 0; pointer-events: none; min-width: auto;"
+    >
+      <div>
+        <div
+          class="ant-cascader-menus"
+        >
+          <ul
+            class="ant-cascader-menu"
+            role="menu"
+          >
+            <li
+              aria-checked="false"
+              class="ant-cascader-menu-item ant-cascader-menu-item-expand"
+              data-path-key="zhejiang"
+              role="menuitemcheckbox"
+              title="Zhejiang"
+            >
+              <span
+                class="ant-cascader-checkbox"
+              >
+                <span
+                  class="ant-cascader-checkbox-inner"
+                />
+              </span>
+              <div
+                class="ant-cascader-menu-item-content"
+              >
+                Zhejiang
+              </div>
+              <div
+                class="ant-cascader-menu-item-expand-icon"
+              >
+                <span
+                  aria-label="right"
+                  class="anticon anticon-right"
+                  role="img"
+                >
+                  <svg
+                    aria-hidden="true"
+                    data-icon="right"
+                    fill="currentColor"
+                    focusable="false"
+                    height="1em"
+                    viewBox="64 64 896 896"
+                    width="1em"
+                  >
+                    <path
+                      d="M765.7 486.8L314.9 134.7A7.97 7.97 0 00302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 000-50.4z"
+                    />
+                  </svg>
+                </span>
+              </div>
+            </li>
+            <li
+              aria-checked="false"
+              class="ant-cascader-menu-item ant-cascader-menu-item-expand"
+              data-path-key="jiangsu"
+              role="menuitemcheckbox"
+              title="Jiangsu"
+            >
+              <span
+                class="ant-cascader-checkbox"
+              >
+                <span
+                  class="ant-cascader-checkbox-inner"
+                />
+              </span>
+              <div
+                class="ant-cascader-menu-item-content"
+              >
+                Jiangsu
+              </div>
+              <div
+                class="ant-cascader-menu-item-expand-icon"
+              >
+                <span
+                  aria-label="right"
+                  class="anticon anticon-right"
+                  role="img"
+                >
+                  <svg
+                    aria-hidden="true"
+                    data-icon="right"
+                    fill="currentColor"
+                    focusable="false"
+                    height="1em"
+                    viewBox="64 64 896 896"
+                    width="1em"
+                  >
+                    <path
+                      d="M765.7 486.8L314.9 134.7A7.97 7.97 0 00302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 000-50.4z"
+                    />
+                  </svg>
+                </span>
+              </div>
+            </li>
+          </ul>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
 exports[`Cascader popup correctly with defaultValue 1`] = `
 <div
  class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
--- a/components/cascader/tests/index.test.js
+++ b/components/cascader/tests/index.test.js
@ -8,6 +8,8 @@ import focusTest from '../../../tests/shared/focusTest';
 import mountTest from '../../../tests/shared/mountTest';
 import rtlTest from '../../../tests/shared/rtlTest';

+const { SHOW_CHILD, SHOW_PARENT } = Cascader;
+
 function toggleOpen(wrapper) {
  wrapper.find('.ant-select-selector').simulate('mousedown');
 }
@ -525,5 +527,134 @@ describe('Cascader', () => {

      errorSpy.mockRestore();
    });
+
+    it('should support showCheckedStrategy child', () => {
+      const multipleOptions = [
+        {
+          value: 'zhejiang',
+          label: 'Zhejiang',
+          children: [
+            {
+              value: 'hangzhou',
+              label: 'Hangzhou',
+              children: [
+                {
+                  value: 'xihu',
+                  label: 'West Lake',
+                },
+                {
+                  value: 'donghu',
+                  label: 'East Lake',
+                },
+              ],
+            },
+          ],
+        },
+        {
+          value: 'jiangsu',
+          label: 'Jiangsu',
+          children: [
+            {
+              value: 'nanjing',
+              label: 'Nanjing',
+              children: [
+                {
+                  value: 'zhonghuamen',
+                  label: 'Zhong Hua Men',
+                },
+              ],
+            },
+          ],
+        },
+      ];
+
+      let selectedValue;
+      const onChange = function onChange(value) {
+        selectedValue = value;
+      };
+
+      const wrapper = mount(
+        <Cascader
+          options={multipleOptions}
+          onChange={onChange}
+          multiple
+          showCheckedStrategy={SHOW_CHILD}
+        />,
+      );
+      toggleOpen(wrapper);
+      expect(wrapper.render()).toMatchSnapshot();
+
+      clickOption(wrapper, 0, 0);
+      clickOption(wrapper, 1, 0);
+      clickOption(wrapper, 2, 0);
+      clickOption(wrapper, 2, 1);
+      expect(selectedValue[0].join(',')).toBe('zhejiang,hangzhou,xihu');
+      expect(selectedValue[1].join(',')).toBe('zhejiang,hangzhou,donghu');
+      expect(selectedValue.join(',')).toBe('zhejiang,hangzhou,xihu,zhejiang,hangzhou,donghu');
+    });
+
+    it('should support showCheckedStrategy parent', () => {
+      const multipleOptions = [
+        {
+          value: 'zhejiang',
+          label: 'Zhejiang',
+          children: [
+            {
+              value: 'hangzhou',
+              label: 'Hangzhou',
+              children: [
+                {
+                  value: 'xihu',
+                  label: 'West Lake',
+                },
+                {
+                  value: 'donghu',
+                  label: 'East Lake',
+                },
+              ],
+            },
+          ],
+        },
+        {
+          value: 'jiangsu',
+          label: 'Jiangsu',
+          children: [
+            {
+              value: 'nanjing',
+              label: 'Nanjing',
+              children: [
+                {
+                  value: 'zhonghuamen',
+                  label: 'Zhong Hua Men',
+                },
+              ],
+            },
+          ],
+        },
+      ];
+
+      let selectedValue;
+      const onChange = function onChange(value) {
+        selectedValue = value;
+      };
+
+      const wrapper = mount(
+        <Cascader
+          options={multipleOptions}
+          onChange={onChange}
+          multiple
+          showCheckedStrategy={SHOW_PARENT}
+        />,
+      );
+      toggleOpen(wrapper);
+      expect(wrapper.render()).toMatchSnapshot();
+      clickOption(wrapper, 0, 0);
+      clickOption(wrapper, 1, 0);
+      clickOption(wrapper, 2, 0);
+      clickOption(wrapper, 2, 1);
+
+      expect(selectedValue.length).toBe(1);
+      expect(selectedValue.join(',')).toBe('zhejiang');
+    });
  });
 });
--- a/components/cascader/demo/showCheckedStrategy.md
+++ b/components/cascader/demo/showCheckedStrategy.md
@ -0,0 +1,90 @@
+---
+order: 5.1
+version: 4.20.0
+title:
+  zh-CN: 自定义回填方式
+  en-US: ShowCheckedStrategy
+---
+
+## zh-CN
+
+通过设置 `ShowCheckedStrategy` 选择回填方式。
+
+## en-US
+
+The way show selected item in box using `ShowCheckedStrategy`.
+
+```jsx
+import { Cascader } from 'antd';
+
+const { SHOW_CHILD } = Cascader;
+
+const options = [
+  {
+    label: 'Light',
+    value: 'light',
+    children: new Array(20)
+      .fill(null)
+      .map((_, index) => ({ label: `Number ${index}`, value: index })),
+  },
+  {
+    label: 'Bamboo',
+    value: 'bamboo',
+    children: [
+      {
+        label: 'Little',
+        value: 'little',
+        children: [
+          {
+            label: 'Toy Fish',
+            value: 'fish',
+          },
+          {
+            label: 'Toy Cards',
+            value: 'cards',
+          },
+          {
+            label: 'Toy Bird',
+            value: 'bird',
+          },
+        ],
+      },
+    ],
+  },
+];
+
+const App = () => {
+  const onChange = value => {
+    console.log(value);
+  };
+  return (
+    <>
+      <Cascader
+        style={{ width: '100%' }}
+        options={options}
+        onChange={onChange}
+        multiple
+        maxTagCount="responsive"
+        showCheckedStrategy={SHOW_CHILD}
+        defaultValue={[
+          ['bamboo', 'little', 'fish'],
+          ['bamboo', 'little', 'cards'],
+          ['bamboo', 'little', 'bird'],
+        ]}
+      />
+      <br />
+      <br />
+      <Cascader
+        style={{ width: '100%' }}
+        options={options}
+        onChange={onChange}
+        multiple
+        maxTagCount="responsive"
+        defaultValue={['bamboo']}
+      />
+    </>
+  );
+};
+
+ReactDOM.render(<App />, mountNode);
+```
--- a/components/cascader/index.en-US.md
+++ b/components/cascader/index.en-US.md
@ -55,6 +55,7 @@ Cascade selection box.
 | onDropdownVisibleChange | Callback when popup shown or hidden | (value) => void | - | 4.17.0 |
 | multiple | Support multiple or not | boolean | - | 4.17.0 |
 | removeIcon | The custom remove icon | ReactNode | - |  |
+| showCheckedStrategy | The way show selected item in box. ** `SHOW_CHILD`: ** just show child treeNode. **`Cascader.SHOW_PARENT`:** just show parent treeNode (when all child treeNode under the parent treeNode are checked) | `Cascader.SHOW_PARENT` \| `Cascader.SHOW_CHILD` | `Cascader.SHOW_PARENT` | 4.20.0 |
 | searchValue | Set search value，Need work with `showSearch` | string | - | 4.17.0 |
 | onSearch | The callback function triggered when input changed | (search: string) => void | - | 4.17.0 |
 | dropdownMenuColumnStyle | The style of the drop-down menu column | CSSProperties | - |  |
--- a/components/cascader/index.tsx
+++ b/components/cascader/index.tsx
@ -36,6 +36,8 @@ export type FieldNamesType = FieldNames;

 export type FilledFieldNamesType = Required<FieldNamesType>;

+const { SHOW_CHILD, SHOW_PARENT } = RcCascader;
+
 function highlightKeyword(str: string, lowerKeyword: string, prefixCls: string | undefined) {
  const cells = str
    .toLowerCase()
@ -300,12 +302,16 @@ const Cascader = React.forwardRef((props: CascaderProps<any>, ref: React.Ref<Cas
  );

  return wrapCascaderSSR(wrapSelectSSR(renderNode));
-}) as (<OptionType extends BaseOptionType | DefaultOptionType = DefaultOptionType>(
+}) as unknown as (<OptionType extends BaseOptionType | DefaultOptionType = DefaultOptionType>(
  props: React.PropsWithChildren<CascaderProps<OptionType>> & { ref?: React.Ref<CascaderRef> },
 ) => React.ReactElement) & {
  displayName: string;
+  SHOW_PARENT: typeof SHOW_PARENT;
+  SHOW_CHILD: typeof SHOW_CHILD;
 };

 Cascader.displayName = 'Cascader';
+Cascader.SHOW_PARENT = SHOW_PARENT;
+Cascader.SHOW_CHILD = SHOW_CHILD;

 export default Cascader;
--- a/components/cascader/index.zh-CN.md
+++ b/components/cascader/index.zh-CN.md
@ -55,6 +55,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/UdS8y8xyZ/Cascader.svg
 | onChange | 选择完成后的回调 | (value, selectedOptions) => void | - |  |
 | onDropdownVisibleChange | 显示/隐藏浮层的回调 | (value) => void | - | 4.17.0 |
 | multiple | 支持多选节点 | boolean | - | 4.17.0 |
+| showCheckedStrategy | 定义选中项回填的方式。`Cascader.SHOW_CHILD`: 只显示选中的子节点。`Cascader.SHOW_PARENT`: 只显示父节点（当父节点下所有子节点都选中时）。 | `Cascader.SHOW_PARENT` \| `Cascader.SHOW_CHILD` | `Cascader.SHOW_PARENT` | 4.20.0 |
 | removeIcon | 自定义的多选框清除图标 | ReactNode | - |  |
 | searchValue | 设置搜索的值，需要与 `showSearch` 配合使用 | string | - | 4.17.0 |
 | onSearch | 监听搜索，返回输入的值 | (search: string) => void | - | 4.17.0 |
--- a/components/dropdown/style/index.less
+++ b/components/dropdown/style/index.less
@ -221,7 +221,8 @@
        background-color: @dropdown-selected-bg;
      }

-      &:hover {
+      &:hover,
+      &&-active {
        background-color: @item-hover-bg;
      }

--- a/components/input/Group.tsx
+++ b/components/input/Group.tsx
@ -1,8 +1,9 @@
 import * as React from 'react';
-import { useContext } from 'react';
+import { useContext, useMemo } from 'react';
 import classNames from 'classnames';
 import { ConfigContext } from '../config-provider';
 import useStyle from './style';
+import { FormItemInputContext } from '../form/context';

 export interface GroupProps {
  className?: string;
@ -35,6 +36,15 @@ const Group: React.FC<GroupProps> = props => {
    className,
  );

+  const formItemContext = useContext(FormItemInputContext);
+  const groupFormItemContext = useMemo(
+    () => ({
+      ...formItemContext,
+      isFormItemInput: false,
+    }),
+    [formItemContext],
+  );
+
  return wrapSSR(
    <span
      className={cls}
@ -44,7 +54,9 @@ const Group: React.FC<GroupProps> = props => {
      onFocus={props.onFocus}
      onBlur={props.onBlur}
    >
-      {props.children}
+      <FormItemInputContext.Provider value={groupFormItemContext}>
+        {props.children}
+      </FormItemInputContext.Provider>
    </span>,
  );
 };
--- a/components/menu/tests/index.test.js
+++ b/components/menu/tests/index.test.js
@ -871,4 +871,16 @@ describe('Menu', () => {
    expect(wrapper.find('li.ant-menu-item-divider').length).toBe(2);
    expect(wrapper.find('li.ant-menu-item-divider-dashed').length).toBe(1);
  });
+
+  it('should support ref', async () => {
+    const ref = React.createRef();
+    const wrapper = mount(
+      <Menu ref={ref}>
+        <SubMenu key="sub1" title="Navigation One">
+          <Menu.Item key="1">Option 1</Menu.Item>
+        </SubMenu>
+      </Menu>,
+    );
+    expect(ref.current?.menu?.list).toBe(wrapper.find('ul').first().getDOMNode());
+  });
 });
--- a/components/menu/index.tsx
+++ b/components/menu/index.tsx
@ -1,8 +1,9 @@
 import * as React from 'react';
-import RcMenu, { ItemGroup, MenuProps as RcMenuProps } from 'rc-menu';
+import RcMenu, { ItemGroup, MenuProps as RcMenuProps, MenuRef } from 'rc-menu';
 import classNames from 'classnames';
 import omit from 'rc-util/lib/omit';
 import EllipsisOutlined from '@ant-design/icons/EllipsisOutlined';
+import { forwardRef } from 'react';
 import SubMenu, { SubMenuProps } from './SubMenu';
 import Item, { MenuItemProps } from './MenuItem';
 import { ConfigContext } from '../config-provider';
@ -40,7 +41,7 @@ type InternalMenuProps = MenuProps &
    collapsedWidth?: string | number;
  };

-function InternalMenu(props: InternalMenuProps) {
+const InternalMenu = forwardRef<MenuRef, InternalMenuProps>((props, ref) => {
  const { getPrefixCls, getPopupContainer, direction } = React.useContext(ConfigContext);

  const rootPrefixCls = getPrefixCls();
@ -129,12 +130,13 @@ function InternalMenu(props: InternalMenuProps) {
        expandIcon={cloneElement(expandIcon, {
          className: `${prefixCls}-submenu-expand-icon`,
        })}
+        ref={ref}
      >
        {mergedChildren}
      </RcMenu>
    </MenuContext.Provider>
  );
-}
+});

 // We should keep this as ref-able
 class Menu extends React.Component<MenuProps, {}> {
@ -146,10 +148,24 @@ class Menu extends React.Component<MenuProps, {}> {

  static ItemGroup = ItemGroup;

+  menu: MenuRef | null;
+
+  focus = (options?: FocusOptions) => {
+    this.menu?.focus(options);
+  };
+
  render() {
    return (
      <SiderContext.Consumer>
-        {(context: SiderContextProps) => <InternalMenu {...this.props} {...context} />}
+        {(context: SiderContextProps) => (
+          <InternalMenu
+            ref={node => {
+              this.menu = node;
+            }}
+            {...this.props}
+            {...context}
+          />
+        )}
      </SiderContext.Consumer>
    );
  }
--- a/package.json
+++ b/package.json
@ -128,7 +128,7 @@
    "rc-collapse": "~3.1.0",
    "rc-dialog": "~8.7.0",
    "rc-drawer": "~4.4.2",
-    "rc-dropdown": "~3.3.2",
+    "rc-dropdown": "~3.4.0",
    "rc-field-form": "~1.24.0",
    "rc-image": "~5.3.0",
    "rc-input": "~0.0.1-alpha.5",
@ -147,7 +147,7 @@
    "rc-steps": "~4.1.0",
    "rc-switch": "~3.2.0",
    "rc-table": "~7.24.0",
-    "rc-tabs": "~11.11.0",
+    "rc-tabs": "~11.12.0",
    "rc-textarea": "~0.3.0",
    "rc-tooltip": "~5.1.1",
    "rc-tree": "~5.5.0",