Merge remote-tracking branch 'origin/main' into feat-v3.3

components/config-provider/index.tsx

@@ -69,6 +69,7 @@ watchEffect(() => {
 
 type GlobalConfigProviderProps = {
   prefixCls?: MaybeRef<ConfigProviderProps['prefixCls']>;
+  getPopupContainer?: ConfigProviderProps['getPopupContainer'];
 };
 
 let stopWatchEffect: WatchStopHandle;

components/grid/Row.tsx

@@ -23,7 +23,7 @@ export const rowProps = () => ({
   justify: String as PropType<typeof RowJustify[number]>,
   prefixCls: String,
   gutter: {
-    type: [Number, Array] as PropType<Gutter | [Gutter, Gutter]>,
+    type: [Number, Array, Object] as PropType<Gutter | [Gutter, Gutter]>,
     default: 0 as Gutter | [Gutter, Gutter],
   },
   wrap: { type: Boolean, default: undefined },

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

@@ -596,8 +596,7 @@ exports[`renders ./components/select/demo/suffix.vue correctly 1`] = `
       <!---->
       <div class="ant-select-selector"><span class="ant-select-selection-search"><input type="search" id="rc_select_TEST_OR_SSR" autocomplete="off" class="ant-select-selection-search-input" role="combobox" aria-haspopup="listbox" aria-owns="rc_select_TEST_OR_SSR_list" aria-autocomplete="list" aria-controls="rc_select_TEST_OR_SSR_list" aria-activedescendant="rc_select_TEST_OR_SSR_list_0" readonly="" unselectable="on" style="opacity: 0;"></span><span class="ant-select-selection-item" title="Lucy">Lucy</span>
         <!---->
-      </div><span class="ant-select-arrow" style="user-select: none;" unselectable="on" aria-hidden="true"><span role="img" aria-label="smile" class="anticon anticon-smile"><svg focusable="false" class="" data-icon="smile" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M288 421a48 48 0 1096 0 48 48 0 10-96 0zm352 0a48 48 0 1096 0 48 48 0 10-96 0zM512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm263 711c-34.2 34.2-74 61-118.3 79.8C611 874.2 562.3 884 512 884c-50.3 0-99-9.8-144.8-29.2A370.4 370.4 0 01248.9 775c-34.2-34.2-61-74-79.8-118.3C149.8 611 140 562.3 140 512s9.8-99 29.2-144.8A370.4 370.4 0 01249 248.9c34.2-34.2 74-61 118.3-79.8C413 149.8 461.7 140 512 140c50.3 0 99 9.8 144.8 29.2A370.4 370.4 0 01775.1 249c34.2 34.2 61 74 79.8 118.3C874.2 413 884 461.7 884 512s-9.8 99-29.2 144.8A368.89 368.89 0 01775 775zM664 533h-48.1c-4.2 0-7.8 3.2-8.1 7.4C604 589.9 562.5 629 512 629s-92.1-39.1-95.8-88.6c-.3-4.2-3.9-7.4-8.1-7.4H360a8 8 0 00-8 8.4c4.4 84.3 74.5 151.6 160 151.6s155.6-67.3 160-151.6a8 8 0 00-8-8.4z"></path></svg></span>
+      </div><span class="ant-select-arrow" style="user-select: none;" unselectable="on" aria-hidden="true"><span role="img" aria-label="smile" class="anticon anticon-smile ant-select-suffix"><svg focusable="false" class="" data-icon="smile" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M288 421a48 48 0 1096 0 48 48 0 10-96 0zm352 0a48 48 0 1096 0 48 48 0 10-96 0zM512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm263 711c-34.2 34.2-74 61-118.3 79.8C611 874.2 562.3 884 512 884c-50.3 0-99-9.8-144.8-29.2A370.4 370.4 0 01248.9 775c-34.2-34.2-61-74-79.8-118.3C149.8 611 140 562.3 140 512s9.8-99 29.2-144.8A370.4 370.4 0 01249 248.9c34.2-34.2 74-61 118.3-79.8C413 149.8 461.7 140 512 140c50.3 0 99 9.8 144.8 29.2A370.4 370.4 0 01775.1 249c34.2 34.2 61 74 79.8 118.3C874.2 413 884 461.7 884 512s-9.8 99-29.2 144.8A368.89 368.89 0 01775 775zM664 533h-48.1c-4.2 0-7.8 3.2-8.1 7.4C604 589.9 562.5 629 512 629s-92.1-39.1-95.8-88.6c-.3-4.2-3.9-7.4-8.1-7.4H360a8 8 0 00-8 8.4c4.4 84.3 74.5 151.6 160 151.6s155.6-67.3 160-151.6a8 8 0 00-8-8.4z"></path></svg></span></span>
-      <!----></span>
       <!---->
     </div>
   </div>
@@ -608,8 +607,7 @@ exports[`renders ./components/select/demo/suffix.vue correctly 1`] = `
       <!---->
       <div class="ant-select-selector"><span class="ant-select-selection-search"><input type="search" id="rc_select_TEST_OR_SSR" disabled="" autocomplete="off" class="ant-select-selection-search-input" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-owns="rc_select_TEST_OR_SSR_list" aria-autocomplete="list" aria-controls="rc_select_TEST_OR_SSR_list" aria-activedescendant="rc_select_TEST_OR_SSR_list_0" readonly="" unselectable="on" style="opacity: 0;"></span><span class="ant-select-selection-item" title="Lucy">Lucy</span>
         <!---->
-      </div><span class="ant-select-arrow" style="user-select: none;" unselectable="on" aria-hidden="true"><span role="img" aria-label="meh" class="anticon anticon-meh"><svg focusable="false" class="" data-icon="meh" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M288 421a48 48 0 1096 0 48 48 0 10-96 0zm352 0a48 48 0 1096 0 48 48 0 10-96 0zM512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm263 711c-34.2 34.2-74 61-118.3 79.8C611 874.2 562.3 884 512 884c-50.3 0-99-9.8-144.8-29.2A370.4 370.4 0 01248.9 775c-34.2-34.2-61-74-79.8-118.3C149.8 611 140 562.3 140 512s9.8-99 29.2-144.8A370.4 370.4 0 01249 248.9c34.2-34.2 74-61 118.3-79.8C413 149.8 461.7 140 512 140c50.3 0 99 9.8 144.8 29.2A370.4 370.4 0 01775.1 249c34.2 34.2 61 74 79.8 118.3C874.2 413 884 461.7 884 512s-9.8 99-29.2 144.8A368.89 368.89 0 01775 775zM664 565H360c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h304c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"></path></svg></span>
+      </div><span class="ant-select-arrow" style="user-select: none;" unselectable="on" aria-hidden="true"><span role="img" aria-label="meh" class="anticon anticon-meh ant-select-suffix"><svg focusable="false" class="" data-icon="meh" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896"><path d="M288 421a48 48 0 1096 0 48 48 0 10-96 0zm352 0a48 48 0 1096 0 48 48 0 10-96 0zM512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm263 711c-34.2 34.2-74 61-118.3 79.8C611 874.2 562.3 884 512 884c-50.3 0-99-9.8-144.8-29.2A370.4 370.4 0 01248.9 775c-34.2-34.2-61-74-79.8-118.3C149.8 611 140 562.3 140 512s9.8-99 29.2-144.8A370.4 370.4 0 01249 248.9c34.2-34.2 74-61 118.3-79.8C413 149.8 461.7 140 512 140c50.3 0 99 9.8 144.8 29.2A370.4 370.4 0 01775.1 249c34.2 34.2 61 74 79.8 118.3C874.2 413 884 461.7 884 512s-9.8 99-29.2 144.8A368.89 368.89 0 01775 775zM664 565H360c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h304c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"></path></svg></span></span>
-      <!----></span>
       <!---->
     </div>
   </div>

components/select/demo/suffix.vue

@@ -24,10 +24,10 @@ Basic Usage
       :options="options1"
       @change="handleChange"
     >
-      <template #suffixIcon><smile-outlined /></template>
+      <template #suffixIcon><smile-outlined class="ant-select-suffix" /></template>
     </a-select>
     <a-select v-model:value="value2" style="width: 120px" disabled :options="options2">
-      <template #suffixIcon><meh-outlined /></template>
+      <template #suffixIcon><meh-outlined class="ant-select-suffix" /></template>
     </a-select>
   </a-space>
 </template>

components/table/style/resize.less

@@ -24,6 +24,7 @@
 }
 
 .@{table-prefix-cls}-resize-handle.dragging {
+  overflow: hidden;
   .@{table-prefix-cls}-resize-handle-line {
     opacity: 1;
   }

components/tree/DirectoryTree.tsx

@@ -239,7 +239,7 @@ export default defineComponent({
         );
       } else {
         // Single click
-        newSelectedKeys = keys;
+        newSelectedKeys = [key];
         lastSelectedKey.value = key;
         cachedSelectedKeys.value = newSelectedKeys;
         newEvent.selectedNodes = convertDirectoryKeysToNodes(

components/typography/Base.tsx

@@ -30,6 +30,7 @@ import useConfigInject from '../_util/hooks/useConfigInject';
 import type { EventHandler } from '../_util/EventInterface';
 import omit from '../_util/omit';
 import type { AutoSizeType } from '../input/inputProps';
+import useMergedState from '../_util/hooks/useMergedState';
 
 export type BaseType = 'secondary' | 'success' | 'warning' | 'danger';
 
@@ -130,7 +131,6 @@ const Base = defineComponent({
     const { prefixCls, direction } = useConfigInject('typography', props);
 
     const state = reactive({
-      edit: false,
       copied: false,
       ellipsisText: '',
       ellipsisContent: null,
@@ -256,29 +256,39 @@ const Base = defineComponent({
         }, 3000);
       });
     }
+
     const editable = computed(() => {
       const editable = props.editable;
-      if (!editable) return { editing: state.edit };
+      if (!editable) return { editing: false };
 
       return {
-        editing: state.edit,
         ...(typeof editable === 'object' ? editable : null),
       };
     });
 
+    const [editing, setEditing] = useMergedState(false, {
+      value: computed(() => {
+        return editable.value.editing;
+      }),
+    });
+
     function triggerEdit(edit: boolean) {
       const { onStart } = editable.value;
       if (edit && onStart) {
         onStart();
       }
 
-      state.edit = edit;
+      setEditing(edit);
-      nextTick(() => {
+    }
-        if (!edit) {
+    watch(
+      editing,
+      val => {
+        if (!val) {
           editIcon.value?.focus();
         }
-      });
+      },
-    }
+      { flush: 'post' },
+    );
 
     // ============== Ellipsis ==============
     function resizeOnNextFrame() {
@@ -468,7 +478,7 @@ const Base = defineComponent({
     }
 
     return () => {
-      const { editing, triggerType = ['icon'] } = editable.value;
+      const { triggerType = ['icon'] } = editable.value;
       const children =
         props.ellipsis || props.editable
           ? props.content !== undefined
@@ -478,7 +488,7 @@ const Base = defineComponent({
           ? slots.default()
           : props.content;
 
-      if (editing) {
+      if (editing.value) {
         return renderEditInput();
       }
       return (

components/upload/Upload.tsx

@@ -343,11 +343,13 @@ export default defineComponent({
     };
     return () => {
       const { listType, disabled, type } = props;
+      const { class: className, style: styleName, ...transAttrs } = attrs;
       const rcUploadProps = {
         onBatchStart,
         onError,
         onProgress,
         onSuccess,
+        ...transAttrs,
         ...(props as RcUploadProps),
         id: props.id ?? formItemContext.id.value,
         prefixCls: prefixCls.value,

components/upload/index.zh-CN.md

@@ -25,7 +25,6 @@ cover: https://gw.alipayobjects.com/zos/alicdn/QaeBt_ZMg/Upload.svg
 | beforeUpload | 上传文件之前的钩子，参数为上传的文件，若返回 `false` 则停止上传。支持返回一个 Promise 对象，Promise 对象 reject 时则停止上传，resolve 时开始上传（ resolve 传入 `File` 或 `Blob` 对象则上传 resolve 传入对象）。 | (file, fileList) => `boolean` \| `Promise` | 无 |  |
 | customRequest | 通过覆盖默认的上传行为，可以自定义自己的上传实现 | Function | 无 |  |  |
 | data | 上传所需参数或返回上传参数的方法 | object\|(file) => object | 无 |  |  |
-| directory | 支持上传文件夹（[caniuse](https://caniuse.com/#feat=input-file-directory)） | boolean | false |  |  |
 | directory | 支持上传文件夹（[caniuse](https://caniuse.com/#feat=input-file-directory)） | boolean | false | 3.0 |  |
 | disabled | 是否禁用 | boolean | false |  |  |
 | downloadIcon | 自定义下载 icon | v-slot:iconRender="{file: UploadFile}" | - | 3.0 |  |

components/vc-image/src/Preview.tsx

@@ -295,6 +295,14 @@ const Preview = defineComponent({
         },
         { flush: 'post', immediate: true },
       );
+      watch([lastWheelZoomDirection], () => {
+        const { wheelDirection } = lastWheelZoomDirection.value;
+        if (wheelDirection > 0) {
+          onZoomOut();
+        } else if (wheelDirection < 0) {
+          onZoomIn();
+        }
+      });
     });
     onUnmounted(() => {
       removeListeners();