chore: type support vue@3.2.35

components/alert/index.tsx

@@ -168,7 +168,7 @@ const Alert = defineComponent({
           <div
             role="alert"
             {...attrs}
-            style={[attrs.style, motionStyle.value]}
+            style={[attrs.style as CSSProperties, motionStyle.value]}
             v-show={!closing.value}
             class={[attrs.class, alertCls]}
             data-show={!closing.value}

components/avatar/Avatar.tsx

@@ -203,7 +203,7 @@ const Avatar = defineComponent({
           {...attrs}
           ref={avatarNodeRef}
           class={classString}
-          style={[sizeStyle, responsiveSizeStyle(!!icon), attrs.style]}
+          style={[sizeStyle, responsiveSizeStyle(!!icon), attrs.style as CSSProperties]}
         >
           {childrenToRender}
         </span>

components/avatar/Group.tsx

@@ -71,14 +71,14 @@ const Group = defineComponent({
           </Popover>,
         );
         return (
-          <div {...attrs} class={cls} style={attrs.style}>
+          <div {...attrs} class={cls} style={attrs.style as CSSProperties}>
             {childrenShow}
           </div>
         );
       }
 
       return (
-        <div {...attrs} class={cls} style={attrs.style}>
+        <div {...attrs} class={cls} style={attrs.style as CSSProperties}>
           {childrenWithProps}
         </div>
       );

components/breadcrumb/BreadcrumbItem.tsx

@@ -1,4 +1,4 @@
-import type { ExtractPropTypes, PropType } from 'vue';
+import type { CSSProperties, ExtractPropTypes, PropType } from 'vue';
 import { defineComponent } from 'vue';
 import PropTypes from '../_util/vue-types';
 import { getPropsSlot } from '../_util/props-util';
@@ -66,7 +66,7 @@ export default defineComponent({
       link = renderBreadcrumbNode(link, prefixCls.value);
       if (children) {
         return (
-          <span class={cls} style={style}>
+          <span class={cls} style={style as CSSProperties}>
             {link}
             {separator && <span class={`${prefixCls.value}-separator`}>{separator}</span>}
           </span>

components/carousel/index.tsx

@@ -1,4 +1,4 @@
-import type { ExtractPropTypes, PropType } from 'vue';
+import type { CSSProperties, ExtractPropTypes, PropType } from 'vue';
 import { ref, computed, watchEffect, defineComponent } from 'vue';
 import PropTypes from '../_util/vue-types';
 import warning from '../_util/warning';
@@ -127,7 +127,7 @@ const Carousel = defineComponent({
         [`${cls}`]: !!cls,
       });
       return (
-        <div class={className} style={style}>
+        <div class={className} style={style as CSSProperties}>
           <SlickCarousel
             ref={slickRef}
             {...props}

components/checkbox/Checkbox.tsx

@@ -1,3 +1,4 @@
+import type { CSSProperties } from 'vue';
 import { watchEffect, onMounted, defineComponent, inject, onBeforeUnmount, ref } from 'vue';
 import classNames from '../_util/classNames';
 import VcCheckbox from '../vc-checkbox/Checkbox';
@@ -93,7 +94,7 @@ export default defineComponent({
       return (
         <label
           class={classString}
-          style={style}
+          style={style as CSSProperties}
           onMouseenter={onMouseenter as EventHandler}
           onMouseleave={onMouseleave as EventHandler}
         >

components/collapse/Collapse.tsx

@@ -8,7 +8,7 @@ import { cloneElement } from '../_util/vnode';
 import type { CollapsibleType } from './commonProps';
 import { collapseProps } from './commonProps';
 import { getDataAndAriaProps } from '../_util/util';
-import type { ExtractPropTypes } from 'vue';
+import type { CSSProperties, ExtractPropTypes } from 'vue';
 import { computed, defineComponent, ref, watch } from 'vue';
 import RightOutlined from '@ant-design/icons-vue/RightOutlined';
 import firstNotUndefined from '../_util/firstNotUndefined';
@@ -173,7 +173,7 @@ export default defineComponent({
         <div
           class={collapseClassName}
           {...getDataAndAriaProps(attrs)}
-          style={attrs.style}
+          style={attrs.style as CSSProperties}
           role={accordion ? 'tablist' : null}
         >
           {getItems()}

components/dropdown/dropdown-button.tsx

@@ -1,4 +1,4 @@
-import type { ExtractPropTypes } from 'vue';
+import type { ExtractPropTypes, HTMLAttributes } from 'vue';
 import { defineComponent } from 'vue';
 import Button from '../button';
 import classNames from '../_util/classNames';
@@ -54,7 +54,7 @@ export default defineComponent({
         onClick,
         'onUpdate:visible': _updateVisible,
         ...restProps
-      } = { ...props, ...attrs };
+      } = { ...props, ...attrs } as DropdownButtonProps & HTMLAttributes;
 
       const dropdownProps = {
         align,

components/input-number/index.tsx

@@ -94,7 +94,7 @@ const InputNumber = defineComponent({
         prefix = slots.prefix?.(),
         valueModifiers = {},
         ...others
-      } = { ...(attrs as HTMLAttributes), ...props };
+      } = { ...attrs, ...props } as InputNumberProps & HTMLAttributes;
 
       const preCls = prefixCls.value;
 

components/input/ClearableLabeledInput.tsx

@@ -2,7 +2,7 @@ import classNames from '../_util/classNames';
 import CloseCircleFilled from '@ant-design/icons-vue/CloseCircleFilled';
 import PropTypes from '../_util/vue-types';
 import { cloneElement } from '../_util/vnode';
-import type { PropType, VNode } from 'vue';
+import type { CSSProperties, PropType, VNode } from 'vue';
 import { ref, defineComponent } from 'vue';
 import { tuple } from '../_util/type';
 import type { Direction, SizeType } from '../config-provider';
@@ -121,7 +121,7 @@ export default defineComponent({
         <span
           ref={containerRef}
           class={affixWrapperCls}
-          style={attrs.style}
+          style={attrs.style as CSSProperties}
           onMouseup={onInputMouseUp}
           hidden={hidden}
         >
@@ -173,7 +173,7 @@ export default defineComponent({
       // Need another wrapper for changing display:table to display:inline-block
       // and put style prop in wrapper
       return (
-        <span class={mergedGroupClassName} style={attrs.style} hidden={hidden}>
+        <span class={mergedGroupClassName} style={attrs.style as CSSProperties} hidden={hidden}>
           <span class={mergedWrapperClassName}>
             {addonBeforeNode}
             {cloneElement(labeledElement, { style: null })}
@@ -209,7 +209,7 @@ export default defineComponent({
         },
       );
       return (
-        <span class={affixWrapperCls} style={attrs.style} hidden={hidden}>
+        <span class={affixWrapperCls} style={attrs.style as CSSProperties} hidden={hidden}>
           {cloneElement(element, {
             style: null,
             value,

components/input/ResizableTextArea.tsx

@@ -125,6 +125,9 @@ const ResizableTextArea = defineComponent({
       if (!textareaProps.autofocus) {
         delete textareaProps.autofocus;
       }
+      if (textareaProps.rows === 0) {
+        delete textareaProps.rows;
+      }
       return (
         <ResizeObserver onResize={handleResize} disabled={!(autoSize || autosize)}>
           {withDirectives((<textarea {...textareaProps} ref={textAreaRef} />) as VNode, [

components/input/TextArea.tsx

@@ -1,3 +1,4 @@
+import type { CSSProperties } from 'vue';
 import {
   computed,
   defineComponent,
@@ -281,7 +282,7 @@ export default defineComponent({
               `${prefixCls.value}-textarea-show-count`,
               customClass,
             )}
-            style={style}
+            style={style as CSSProperties}
             data-count={typeof dataCount !== 'object' ? dataCount : undefined}
           >
             {textareaNode}

components/layout/Sider.tsx

@@ -194,7 +194,7 @@ export default defineComponent({
             )
           : null;
       const divStyle = [
-        attrs.style,
+        attrs.style as CSSProperties,
         {
           flex: `0 0 ${siderWidth}`,
           maxWidth: siderWidth, // Fix width transition bug in IE11

components/menu/src/Menu.tsx

@@ -323,7 +323,7 @@ export default defineComponent({
       const storeValue = store.value;
       eventKeys.forEach(eventKey => {
         const { key, childrenEventKeys } = storeValue[eventKey];
-        keys.push(key, ...getChildrenKeys(childrenEventKeys));
+        keys.push(key, ...getChildrenKeys(unref(childrenEventKeys)));
       });
       return keys;
     };
@@ -345,7 +345,7 @@ export default defineComponent({
         newOpenKeys.push(key);
       } else if (mergedMode.value !== 'inline') {
         // We need find all related popup to close
-        const subPathKeys = getChildrenKeys(childrenEventKeys);
+        const subPathKeys = getChildrenKeys(unref(childrenEventKeys));
         newOpenKeys = uniq(newOpenKeys.filter(k => !subPathKeys.includes(k)));
       }
 

components/menu/src/hooks/useMenuContext.ts

@@ -1,5 +1,5 @@
 import type { Key } from '../../../_util/type';
-import type { ComputedRef, InjectionKey, PropType, Ref, UnwrapRef } from 'vue';
+import type { ComputedRef, InjectionKey, PropType, Ref } from 'vue';
 import { defineComponent, inject, provide, toRef } from 'vue';
 import type {
   BuiltinPlacements,
@@ -21,7 +21,7 @@ export interface StoreMenuInfo {
 export interface MenuContextProps {
   isRootMenu: Ref<boolean>;
 
-  store: Ref<Record<string, UnwrapRef<StoreMenuInfo>>>;
+  store: Ref<Record<string, StoreMenuInfo>>;
   registerMenuInfo: (key: string, info: StoreMenuInfo) => void;
   unRegisterMenuInfo: (key: string) => void;
   prefixCls: ComputedRef<string>;

components/rate/index.tsx

@@ -1,4 +1,4 @@
-import type { ExtractPropTypes, PropType, VNode } from 'vue';
+import type { CSSProperties, ExtractPropTypes, PropType, VNode } from 'vue';
 import { watch, defineComponent, ref, reactive, onMounted } from 'vue';
 import { initDefaultProps, getPropsSlot, findDOMNode } from '../_util/props-util';
 import { withInstall } from '../_util/type';
@@ -230,7 +230,7 @@ const Rate = defineComponent({
           {...attrs}
           id={id}
           class={rateClassName}
-          style={style}
+          style={style as CSSProperties}
           onMouseleave={disabled ? null : onMouseLeave}
           tabindex={disabled ? -1 : tabindex}
           onFocus={disabled ? null : onFocus}

components/table/Table.tsx

@@ -34,7 +34,7 @@ import scrollTo from '../_util/scrollTo';
 import defaultLocale from '../locale/en_US';
 import type { SizeType } from '../config-provider';
 import devWarning from '../vc-util/devWarning';
-import type { PropType } from 'vue';
+import type { CSSProperties, PropType } from 'vue';
 import { nextTick, reactive, ref, computed, defineComponent, toRef, watchEffect, watch } from 'vue';
 import type { DefaultRecordType } from '../vc-table/interface';
 import useBreakpoint from '../_util/hooks/useBreakpoint';
@@ -636,7 +636,7 @@ const InteralTable = defineComponent<
       );
       const tableProps = omit(props, ['columns']);
       return (
-        <div class={wrapperClassNames} style={attrs.style}>
+        <div class={wrapperClassNames} style={attrs.style as CSSProperties}>
           <Spin spinning={false} {...spinProps}>
             {topPaginationNode}
             <RcTable

components/tabs/src/TabNavList/AddButton.tsx

@@ -1,4 +1,4 @@
-import type { PropType } from 'vue';
+import type { CSSProperties, PropType } from 'vue';
 import { defineComponent, ref } from 'vue';
 import type { EditableConfig, TabsLocale } from '../interface';
 
@@ -32,7 +32,7 @@ export default defineComponent({
           ref={domRef}
           type="button"
           class={`${prefixCls}-nav-add`}
-          style={attrs.style}
+          style={attrs.style as CSSProperties}
           aria-label={locale?.addAriaLabel || 'Add tab'}
           onClick={event => {
             editable.onEdit('add', {

components/tabs/src/TabNavList/OperationNode.tsx

@@ -224,7 +224,10 @@ export default defineComponent({
       );
 
       return (
-        <div class={classNames(`${prefixCls}-nav-operations`, attrs.class)} style={attrs.style}>
+        <div
+          class={classNames(`${prefixCls}-nav-operations`, attrs.class)}
+          style={attrs.style as CSSProperties}
+        >
           {moreNode}
           <AddButton prefixCls={prefixCls} locale={locale} editable={editable} />
         </div>

components/tabs/src/TabNavList/TabNode.tsx

@@ -1,5 +1,5 @@
 import type { Tab, EditableConfig } from '../interface';
-import type { PropType } from 'vue';
+import type { CSSProperties, PropType } from 'vue';
 import { defineComponent, computed, ref } from 'vue';
 import type { FocusEventHandler } from '../../../_util/EventInterface';
 import KeyCode from '../../../_util/KeyCode';
@@ -88,7 +88,7 @@ export default defineComponent({
             [`${tabPrefix}-active`]: active,
             [`${tabPrefix}-disabled`]: disabled,
           })}
-          style={attrs.style}
+          style={attrs.style as CSSProperties}
           onClick={onInternalClick}
         >
           {/* Primary Tab Button */}

components/tabs/src/TabNavList/index.tsx

@@ -464,7 +464,7 @@ export default defineComponent({
         <div
           role="tablist"
           class={classNames(`${pre}-nav`, className)}
-          style={style}
+          style={style as CSSProperties}
           onKeydown={() => {
             // No need animation when use keyboard
             doLockAnimation();

components/tabs/src/TabPanelList/TabPane.tsx

@@ -63,7 +63,7 @@ export default defineComponent({
           tabindex={active ? 0 : -1}
           aria-labelledby={id && `${id}-tab-${tabKey}`}
           aria-hidden={!active}
-          style={[mergedStyle.value, attrs.style]}
+          style={[mergedStyle.value, attrs.style as CSSProperties]}
           class={[`${prefixCls}-tabpane`, active && `${prefixCls}-tabpane-active`, attrs.class]}
         >
           {(active || visited.value || forceRender) && slots.default?.()}

components/transfer/index.tsx

@@ -344,7 +344,7 @@ const Transfer = defineComponent({
       const rightTitle =
         (titles && titles[1]) ?? slots.rightTitle?.() ?? (locale.titles || ['', ''])[1];
       return (
-        <div class={cls} style={style} id={id}>
+        <div class={cls} style={style as CSSProperties} id={id}>
           <List
             key="leftList"
             prefixCls={`${prefixCls.value}-list`}

components/transfer/list.tsx

@@ -7,7 +7,7 @@ import Menu from '../menu';
 import Dropdown from '../dropdown';
 import Search from './search';
 import ListBody from './ListBody';
-import type { VNode, VNodeTypes, ExtractPropTypes, PropType } from 'vue';
+import type { VNode, VNodeTypes, ExtractPropTypes, PropType, CSSProperties } from 'vue';
 import { watchEffect, computed, defineComponent, ref } from 'vue';
 import type { RadioChangeEvent } from '../radio/interface';
 import type { TransferDirection, TransferItem } from './index';
@@ -388,7 +388,7 @@ export default defineComponent({
       );
 
       return (
-        <div class={listCls} style={attrs.style}>
+        <div class={listCls} style={attrs.style as CSSProperties}>
           <div class={`${prefixCls}-header`}>
             {showSelectAll ? (
               <>

components/upload/Upload.tsx

@@ -383,7 +383,7 @@ export default defineComponent({
               onDrop={onFileDrop}
               onDragover={onFileDrop}
               onDragleave={onFileDrop}
-              style={attrs.style}
+              style={attrs.style as CSSProperties}
             >
               <VcUpload
                 {...rcUploadProps}

components/upload/UploadList/ListItem.tsx

@@ -266,7 +266,7 @@ export default defineComponent({
         );
 
       return (
-        <div class={listContainerNameClass} style={style} ref={ref}>
+        <div class={listContainerNameClass} style={style as CSSProperties} ref={ref}>
           {itemRender
             ? itemRender({
                 originNode: item,

components/vc-dialog/Content.tsx

@@ -137,7 +137,7 @@ export default defineComponent({
               v-show={visible}
               key="dialog-element"
               role="document"
-              style={[contentStyleRef.value, attrs.style]}
+              style={[contentStyleRef.value, attrs.style as CSSProperties]}
               class={[prefixCls, attrs.class]}
               onMousedown={onMousedown}
               onMouseup={onMouseup}

components/vc-mentions/src/Mentions.tsx

@@ -1,4 +1,4 @@
-import type { ExtractPropTypes } from 'vue';
+import type { CSSProperties, ExtractPropTypes } from 'vue';
 import {
   toRef,
   watchEffect,
@@ -278,7 +278,7 @@ export default defineComponent({
         onPressenter: onPressEnter,
       };
       return (
-        <div class={classNames(prefixCls, className)} style={style}>
+        <div class={classNames(prefixCls, className)} style={style as CSSProperties}>
           {withDirectives(<textarea ref={textarea} {...textareaProps} />, [[antInputDirective]])}
           {measuring && (
             <div ref={measure} class={`${prefixCls}-measure`}>

components/vc-notification/Notice.tsx

@@ -1,6 +1,6 @@
 import type { Key } from '../_util/type';
 import { Teleport, computed, defineComponent, onMounted, watch, onUnmounted } from 'vue';
-import type { HTMLAttributes } from 'vue';
+import type { HTMLAttributes, CSSProperties } from 'vue';
 import type { MouseEventHandler } from '../_util/EventInterface';
 import classNames from '../_util/classNames';
 
@@ -113,7 +113,7 @@ export default defineComponent<NoticeProps>({
           class={classNames(componentClass, className, {
             [`${componentClass}-closable`]: closable,
           })}
-          style={style}
+          style={style as CSSProperties}
           onMouseenter={clearCloseTimer}
           onMouseleave={startCloseTimer}
           onClick={onClick}

components/vc-notification/Notification.tsx

@@ -179,7 +179,7 @@ const Notification = defineComponent<NotificationProps>({
         <div
           class={className}
           style={
-            attrs.style || {
+            (attrs.style as CSSProperties) || {
               top: '65px',
               left: '50%',
             }

components/vc-pagination/Pager.tsx

@@ -1,5 +1,6 @@
 import PropTypes from '../_util/vue-types';
 import classNames from '../_util/classNames';
+import type { CSSProperties } from 'vue';
 import { defineComponent } from 'vue';
 
 export default defineComponent({
@@ -52,7 +53,7 @@ export default defineComponent({
           title={showTitle ? String(page) : null}
           tabindex="0"
           class={cls}
-          style={style}
+          style={style as CSSProperties}
         >
           {itemRender({
             page,

components/vc-picker/Picker.tsx

@@ -593,7 +593,7 @@ function Picker<DateType>() {
                 [`${prefixCls}-focused`]: focused.value,
                 [`${prefixCls}-rtl`]: direction === 'rtl',
               })}
-              style={attrs.style}
+              style={attrs.style as CSSProperties}
               onMousedown={onMousedown}
               onMouseup={onInternalMouseup}
               onMouseenter={onMouseenter}

components/vc-picker/PickerPanel.tsx

@@ -33,6 +33,7 @@ import getExtraFooter from './utils/getExtraFooter';
 import getRanges from './utils/getRanges';
 import { getLowerBoundTime, setDateTime, setTime } from './utils/timeUtil';
 import type { VueNode } from '../_util/type';
+import type { CSSProperties } from 'vue';
 import { computed, createVNode, defineComponent, ref, toRef, watch, watchEffect } from 'vue';
 import useMergedState from '../_util/hooks/useMergedState';
 import { warning } from '../vc-util/warning';
@@ -596,7 +597,7 @@ function PickerPanel<DateType>() {
           <div
             tabindex={tabindex}
             class={classNames(classString.value, attrs.class)}
-            style={attrs.style}
+            style={attrs.style as CSSProperties}
             onKeydown={onInternalKeydown}
             onBlur={onInternalBlur}
             onMousedown={onMousedown}

components/vc-slider/src/Handle.tsx

@@ -1,4 +1,4 @@
-import type { PropType } from 'vue';
+import type { CSSProperties, PropType } from 'vue';
 import { computed, defineComponent, ref, onMounted, onBeforeUnmount } from 'vue';
 import classNames from '../../_util/classNames';
 import PropTypes from '../../_util/vue-types';
@@ -108,7 +108,7 @@ export default defineComponent({
         'aria-valuenow': value,
         'aria-disabled': !!disabled,
       };
-      const elStyle = [attrs.style, positionStyle.value];
+      const elStyle = [attrs.style as CSSProperties, positionStyle.value];
       let mergedTabIndex = tabindex || 0;
       if (disabled || tabindex === null) {
         mergedTabIndex = null;

components/vc-table/Table.tsx

@@ -837,7 +837,7 @@ export default defineComponent<TableProps<DefaultRecordType>>({
               flattenColumns.value[columnCount.value - 1].fixed === 'right',
             [attrs.class as string]: attrs.class,
           })}
-          style={attrs.style}
+          style={attrs.style as CSSProperties}
           id={id}
           ref={fullTableRef}
         >

components/vc-tree/TreeNode.tsx

@@ -1,6 +1,7 @@
 import { useInjectKeysState, useInjectTreeContext } from './contextTypes';
 import Indent from './Indent';
 import { convertNodePropsToEventData, getTreeNodeProps } from './utils/treeUtil';
+import type { CSSProperties } from 'vue';
 import {
   computed,
   defineComponent,
@@ -556,7 +557,7 @@ export default defineComponent({
             'drag-over-gap-bottom': !disabled && dragOverGapBottom.value,
             'filter-node': filterTreeNode && filterTreeNode(eventData.value),
           })}
-          style={attrs.style}
+          style={attrs.style as CSSProperties}
           // Draggable config
           draggable={draggableWithoutDisabled}
           aria-grabbed={dragging}

components/vc-trigger/Popup/PopupInner.tsx

@@ -152,7 +152,7 @@ export default defineComponent({
             statusValue === 'motion' || statusValue === 'stable' || !visible.value ? null : 0,
           pointerEvents: statusValue === 'stable' ? null : 'none',
         },
-        attrs.style,
+        attrs.style as CSSProperties,
       ];
 
       let childNode: any = flattenChildren(slots.default?.({ visible: props.visible }));

package.json

@@ -254,7 +254,7 @@
     "vue-router": "^4.0.0",
     "vue-server-renderer": "^2.6.11",
     "vue-style-loader": "^4.1.2",
-    "vue-tsc": "^0.30.2",
+    "vue-tsc": "^0.34.15",
     "vuex": "^4.0.0-beta.2",
     "webpack": "^5.0.0",
     "webpack-bundle-analyzer": "^4.4.2",