style: update some code

components/_util/statusUtils.tsx

@@ -0,0 +1,23 @@
+import type { ValidateStatus } from '../form/FormItem';
+import classNames from './classNames';
+import { tuple } from './type';
+
+const InputStatuses = tuple('warning', 'error', '');
+export type InputStatus = typeof InputStatuses[number];
+
+export function getStatusClassNames(
+  prefixCls: string,
+  status?: ValidateStatus,
+  hasFeedback?: boolean,
+) {
+  return classNames({
+    [`${prefixCls}-status-success`]: status === 'success',
+    [`${prefixCls}-status-warning`]: status === 'warning',
+    [`${prefixCls}-status-error`]: status === 'error',
+    [`${prefixCls}-status-validating`]: status === 'validating',
+    [`${prefixCls}-has-feedback`]: hasFeedback,
+  });
+}
+
+export const getMergedStatus = (contextStatus?: ValidateStatus, customStatus?: InputStatus) =>
+  customStatus || contextStatus;

components/_util/throttleByAnimationFrame.ts

@@ -1,20 +1,26 @@
 import raf from './raf';
 
-export default function throttleByAnimationFrame(fn: (...args: any[]) => void) {
-  let requestId: number;
+export default function throttleByAnimationFrame<T extends unknown[]>(fn: (...args: T) => void) {
+  let requestId: number | null;
 
-  const later = (args: any[]) => () => {
+  const later = (args: T) => () => {
     requestId = null;
     fn(...args);
   };
 
-  const throttled = (...args: any[]) => {
+  const throttled: {
+    (...args: T): void;
+    cancel: () => void;
+  } = (...args: T) => {
     if (requestId == null) {
       requestId = raf(later(args));
     }
   };
 
-  (throttled as any).cancel = () => raf.cancel(requestId!);
+  throttled.cancel = () => {
+    raf.cancel(requestId!);
+    requestId = null;
+  };
 
   return throttled;
 }

components/_util/util.ts

@@ -56,7 +56,7 @@ function resolvePropValue(options, props, key, value) {
 
 export function getDataAndAriaProps(props) {
   return Object.keys(props).reduce((memo, key) => {
-    if (key.substr(0, 5) === 'data-' || key.substr(0, 5) === 'aria-') {
+    if (key.startsWith('data-') || key.startsWith('aria-')) {
       memo[key] = props[key];
     }
     return memo;

components/affix/utils.ts

@@ -1,5 +1,4 @@
 import addEventListener from '../vc-util/Dom/addEventListener';
-import type { ComponentPublicInstance } from 'vue';
 import supportsPassive from '../_util/supportsPassive';
 
 export type BindElement = HTMLElement | Window | null | undefined;
@@ -42,7 +41,7 @@ const TRIGGER_EVENTS = [
 
 interface ObserverEntity {
   target: HTMLElement | Window;
-  affixList: ComponentPublicInstance<any>[];
+  affixList: any[];
   eventHandlers: { [eventName: string]: any };
 }
 
@@ -53,10 +52,7 @@ export function getObserverEntities() {
   return observerEntities;
 }
 
-export function addObserveTarget(
-  target: HTMLElement | Window | null,
-  affix: ComponentPublicInstance<any>,
-): void {
+export function addObserveTarget<T>(target: HTMLElement | Window | null, affix: T): void {
   if (!target) return;
 
   let entity: ObserverEntity | undefined = observerEntities.find(item => item.target === target);
@@ -88,7 +84,7 @@ export function addObserveTarget(
   }
 }
 
-export function removeObserveTarget(affix: ComponentPublicInstance<any>): void {
+export function removeObserveTarget<T>(affix: T): void {
   const observerEntity = observerEntities.find(oriObserverEntity => {
     const hasAffix = oriObserverEntity.affixList.some(item => item === affix);
     if (hasAffix) {

components/alert/index.en-US.md

@@ -19,7 +19,7 @@ Alert component for feedback.
 | afterClose | Called when close animation is finished | () => void | - |  |
 | banner | Whether to show as banner | boolean | false |  |
 | closable | Whether Alert can be closed | boolean |  |  |
-| closeIcon | Custom close icon | slot | <CloseOutlined /> | 3.0 |
+| closeIcon | Custom close icon | slot | `<CloseOutlined />` | 3.0 |
 | closeText | Close text to show | string\|slot | - |  |
 | description | Additional content of Alert | string\|slot | - |  |
 | icon | Custom icon, effective when `showIcon` is `true` | vnode \| slot | - |  |

components/alert/index.zh-CN.md

@@ -20,7 +20,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/8emPa3fjl/Alert.svg
 | afterClose | 关闭动画结束后触发的回调函数 | () => void | - |  |
 | banner | 是否用作顶部公告 | boolean | false |  |
 | closable | 默认不显示关闭按钮 | boolean | 无 |  |
-| closeIcon | 自定义关闭 Icon | slot | <CloseOutlined /> | 3.0 |
+| closeIcon | 自定义关闭 Icon | slot | `<CloseOutlined />` | 3.0 |
 | closeText | 自定义关闭按钮 | string\|slot | 无 |  |
 | description | 警告提示的辅助性文字介绍 | string\|slot | 无 |  |
 | icon | 自定义图标，`showIcon` 为 `true` 时有效 | vnode\|slot | - |  |

components/vc-checkbox/Checkbox.tsx

@@ -114,7 +114,7 @@ export default defineComponent({
         onKeyup,
       } = attrs as HTMLAttributes;
       const globalProps = Object.keys({ ...others, ...attrs }).reduce((prev, key) => {
-        if (key.substr(0, 5) === 'aria-' || key.substr(0, 5) === 'data-' || key === 'role') {
+        if (key.startsWith('data-') || key.startsWith('aria-') || key === 'role') {
           prev[key] = others[key];
         }
         return prev;

components/vc-notification/Notice.tsx

@@ -101,7 +101,7 @@ export default defineComponent<NoticeProps>({
       const componentClass = `${prefixCls}-notice`;
       const dataOrAriaAttributeProps = Object.keys(attrs).reduce(
         (acc: Record<string, string>, key: string) => {
-          if (key.substr(0, 5) === 'data-' || key.substr(0, 5) === 'aria-' || key === 'role') {
+          if (key.startsWith('data-') || key.startsWith('aria-') || key === 'role') {
             acc[key] = (attrs as any)[key];
           }
           return acc;

components/vc-picker/utils/miscUtil.ts

@@ -21,11 +21,8 @@ export default function getDataOrAriaProps(props: any) {
 
   Object.keys(props).forEach(key => {
     if (
-      (key.substr(0, 5) === 'data-' ||
-        key.substr(0, 5) === 'aria-' ||
-        key === 'role' ||
-        key === 'name') &&
-      key.substr(0, 7) !== 'data-__'
+      (key.startsWith('data-') || key.startsWith('aria-') || key === 'role' || key === 'name') &&
+      !key.startsWith('data-__')
     ) {
       retProps[key] = props[key];
     }

components/vc-table/utils/legacyUtil.ts

@@ -52,7 +52,7 @@ export function getExpandableProps<RecordType>(
 export function getDataAndAriaProps(props: object) {
   /* eslint-disable no-param-reassign */
   return Object.keys(props).reduce((memo, key) => {
-    if (key.substr(0, 5) === 'data-' || key.substr(0, 5) === 'aria-') {
+    if (key.startsWith('data-') || key.startsWith('aria-')) {
       memo[key] = props[key];
     }
     return memo;