docs: format code (#48309)

* docs: fix code

* feat: lint

* feat: prettier

* feat: test

* feat: review

* feat: format html

* feat: format html

.dumi/rehypeAntd.ts

@@ -1,5 +1,6 @@
 import assert from 'assert';
-import { unistUtilVisit, type HastRoot, type UnifiedTransformer } from 'dumi';
+import type { HastRoot, UnifiedTransformer } from 'dumi';
+import { unistUtilVisit } from 'dumi';
 
 /**
  * plugin for modify hast tree when docs compiling

.dumi/theme/builtins/ColorChunk/index.tsx

@@ -1,5 +1,6 @@
 import * as React from 'react';
-import { TinyColor, type ColorInput } from '@ctrl/tinycolor';
+import type { ColorInput } from '@ctrl/tinycolor';
+import { TinyColor } from '@ctrl/tinycolor';
 import { createStyles } from 'antd-style';
 
 interface ColorChunkProps {

.dumi/theme/builtins/ComponentMeta/index.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { EditOutlined, GithubOutlined } from '@ant-design/icons';
-import { Descriptions, theme, Tooltip, Typography, type GetProp } from 'antd';
+import type { GetProp } from 'antd';
+import { Descriptions, theme, Tooltip, Typography } from 'antd';
 import { createStyles, css } from 'antd-style';
 import kebabCase from 'lodash/kebabCase';
 import CopyToClipboard from 'react-copy-to-clipboard';

.dumi/theme/builtins/Container/index.tsx

@@ -2,7 +2,7 @@
  * copied: https://github.com/arvinxx/dumi-theme-antd-style/tree/master/src/builtins/Container
  */
 import * as React from 'react';
-import { type FC, type ReactNode } from 'react';
+import type { FC, ReactNode } from 'react';
 import { Alert } from 'antd';
 
 import useStyles from './style';

.dumi/theme/common/CodePreview.tsx

@@ -1,4 +1,5 @@
-import React, { useEffect, useMemo, type ComponentProps } from 'react';
+import type { ComponentProps } from 'react';
+import React, { useEffect, useMemo } from 'react';
 import { Button, Tabs, Typography } from 'antd';
 import { createStyles } from 'antd-style';
 import toReactElement from 'jsonml-to-react-element';
@@ -120,7 +121,7 @@ const CodePreview: React.FC<CodePreviewProps> = ({
       style: Prism.highlight(styleCode, Prism.languages.css, 'css'),
     };
     // 去掉空的代码类型
-    Object.keys(codes).forEach((key: keyof typeof codes) => {
+    (Object.keys(codes) as (keyof typeof codes)[]).forEach((key) => {
       if (!codes[key]) {
         delete codes[key];
       }

.dumi/tsconfig.json

@@ -3,5 +3,5 @@
   "compilerOptions": {
     "resolveJsonModule": true
   },
-  "include": ["**/*"]
+  "include": ["**/*", "../typings/index.d.ts"]
 }

.eslintrc.js

@@ -44,6 +44,7 @@ module.exports = {
         'no-unused-expressions': 'off',
         '@typescript-eslint/no-unused-expressions': 2,
         '@typescript-eslint/consistent-type-imports': [2, { disallowTypeAnnotations: false }],
+        'import/consistent-type-specifier-style': 2,
       },
     },
     {

.prettierignore

@@ -31,3 +31,4 @@ components/*/*.jsx
 .eslintignore
 .history
 **/*.yml
+*.html

components/__tests__/setup.test.tsx

@@ -1,4 +1,5 @@
 import * as React from 'react';
+
 import { render } from '../../tests/utils';
 
 describe('SetUp.Test', () => {

components/_util/ActionButton.tsx

@@ -1,5 +1,6 @@
-import useState from 'rc-util/lib/hooks/useState';
 import * as React from 'react';
+import useState from 'rc-util/lib/hooks/useState';
+
 import Button from '../button';
 import type { ButtonProps, LegacyButtonType } from '../button/button';
 import { convertLegacyProps } from '../button/buttonHelpers';

components/_util/__tests__/responsiveObserve.test.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+
 import { render } from '../../../tests/utils';
 import useResponsiveObserver from '../responsiveObserver';
 

components/_util/__tests__/transButton.test.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
-import TransButton from '../transButton';
+
 import { render } from '../../../tests/utils';
+import TransButton from '../transButton';
 
 describe('transButton component', () => {
   it('disabled should update style', () => {

components/_util/__tests__/useSyncState.test.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
+
+import { fireEvent, render } from '../../../tests/utils';
 import useSyncState from '../hooks/useSyncState';
-import { render, fireEvent } from '../../../tests/utils';
 
 describe('Table', () => {
   it('useSyncState', () => {

components/_util/__tests__/util.test.tsx

@@ -1,6 +1,7 @@
 /* eslint-disable class-methods-use-this */
-import KeyCode from 'rc-util/lib/KeyCode';
 import React from 'react';
+import KeyCode from 'rc-util/lib/KeyCode';
+
 import { fireEvent, render, waitFakeTimer } from '../../../tests/utils';
 import { isStyleSupport } from '../styleChecker';
 import throttleByAnimationFrame from '../throttleByAnimationFrame';

components/_util/__tests__/warning.test.tsx

@@ -1,5 +1,6 @@
-import { render } from '@testing-library/react';
 import React from 'react';
+import { render } from '@testing-library/react';
+
 import { devUseWarning as useWarning } from '../warning';
 
 describe('Test warning', () => {

components/_util/__tests__/wave.test.tsx

@@ -1,10 +1,11 @@
 import React from 'react';
 import classNames from 'classnames';
+
 import mountTest from '../../../tests/shared/mountTest';
 import { act, fireEvent, getByText, render, waitFakeTimer } from '../../../tests/utils';
+import Checkbox from '../../checkbox';
 import Wave from '../wave';
 import { TARGET_CLS } from '../wave/interface';
-import Checkbox from '../../checkbox';
 
 (global as any).isVisible = true;
 

components/_util/colors.ts

@@ -14,7 +14,7 @@ export const PresetStatusColorTypes = [
 
 export type PresetColorType = PresetColorKey | InverseColor;
 
-export type PresetStatusColorType = typeof PresetStatusColorTypes[number];
+export type PresetStatusColorType = (typeof PresetStatusColorTypes)[number];
 
 /**
  * determine if the color keyword belongs to the `Ant Design` {@link PresetColors}.

components/_util/hooks/useProxyImperativeHandle.ts

@@ -1,7 +1,8 @@
 // Proxy the dom ref with `{ nativeElement, otherFn }` type
 // ref: https://github.com/ant-design/ant-design/discussions/45242
 
-import { useImperativeHandle, type Ref } from 'react';
+import { useImperativeHandle } from 'react';
+import type { Ref } from 'react';
 
 function fillProxy(
   element: HTMLElement & { _antProxy?: Record<string, any> },

components/_util/motion.ts

@@ -27,7 +27,7 @@ const initCollapseMotion = (rootCls: string = 'ant'): CSSMotionProps => ({
 
 const SelectPlacements = ['bottomLeft', 'bottomRight', 'topLeft', 'topRight'] as const;
 
-export type SelectCommonPlacement = typeof SelectPlacements[number];
+export type SelectCommonPlacement = (typeof SelectPlacements)[number];
 
 const getTransitionName = (rootPrefixCls: string, motion: string, transitionName?: string) => {
   if (transitionName !== undefined) {

components/_util/scrollTo.ts

@@ -1,4 +1,5 @@
 import raf from 'rc-util/lib/raf';
+
 import { easeInOutCubic } from './easings';
 import getScroll, { isWindow } from './getScroll';
 

components/_util/statusUtils.ts

@@ -1,9 +1,10 @@
 import classNames from 'classnames';
+
 import type { ValidateStatus } from '../form/FormItem';
 
 const InputStatuses = ['warning', 'error', ''] as const;
 
-export type InputStatus = typeof InputStatuses[number];
+export type InputStatus = (typeof InputStatuses)[number];
 
 export function getStatusClassNames(
   prefixCls: string,

components/_util/transButton.tsx

@@ -3,8 +3,8 @@
  *
  * This helps accessibility reader to tread as a interactive button to operation.
  */
-import KeyCode from 'rc-util/lib/KeyCode';
 import * as React from 'react';
+import KeyCode from 'rc-util/lib/KeyCode';
 
 interface TransButtonProps extends React.HTMLAttributes<HTMLDivElement> {
   onClick?: (e?: React.MouseEvent<HTMLDivElement>) => void;

components/_util/wave/WaveEffect.tsx

@@ -4,7 +4,8 @@ import CSSMotion from 'rc-motion';
 import raf from 'rc-util/lib/raf';
 import { render, unmount } from 'rc-util/lib/React/render';
 
-import { TARGET_CLS, type ShowWaveEffect } from './interface';
+import { TARGET_CLS } from './interface';
+import type { ShowWaveEffect } from './interface';
 import { getTargetWaveColor } from './util';
 
 function validateNum(value: number) {

components/_util/wave/useWave.ts

@@ -4,7 +4,8 @@ import raf from 'rc-util/lib/raf';
 
 import { ConfigContext } from '../../config-provider';
 import useToken from '../../theme/useToken';
-import { TARGET_CLS, type ShowWave } from './interface';
+import { TARGET_CLS } from './interface';
+import type { ShowWave } from './interface';
 import showWaveEffect from './WaveEffect';
 
 const useWave = (

components/alert/Alert.tsx

@@ -9,11 +9,11 @@ import classNames from 'classnames';
 import CSSMotion from 'rc-motion';
 import pickAttrs from 'rc-util/lib/pickAttrs';
 
+import type { ClosableType } from '../_util/hooks/useClosable';
 import { replaceElement } from '../_util/reactNode';
 import { devUseWarning } from '../_util/warning';
 import { ConfigContext } from '../config-provider';
 import useStyle from './style';
-import type { ClosableType } from '../_util/hooks/useClosable';
 
 export interface AlertProps {
   /** Type of Alert styles, options:`success`, `info`, `warning`, `error` */

components/alert/ErrorBoundary.tsx

@@ -1,4 +1,5 @@
 import * as React from 'react';
+
 import Alert from './Alert';
 
 interface ErrorBoundaryProps {

components/alert/__tests__/index.test.tsx

@@ -1,6 +1,7 @@
+import React from 'react';
 import userEvent from '@testing-library/user-event';
 import { resetWarned } from 'rc-util/lib/warning';
-import React from 'react';
+
 import Alert from '..';
 import accessibilityTest from '../../../tests/shared/accessibilityTest';
 import rtlTest from '../../../tests/shared/rtlTest';

components/alert/demo/closable.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
-import { Alert, Space } from 'antd';
 import { CloseSquareFilled } from '@ant-design/icons';
+import { Alert, Space } from 'antd';
 
 const onClose = (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
   console.log(e, 'I was closed.');

components/alert/demo/component-token.tsx

@@ -1,5 +1,5 @@
-import { SmileOutlined } from '@ant-design/icons';
 import React from 'react';
+import { SmileOutlined } from '@ant-design/icons';
 import { Alert, ConfigProvider } from 'antd';
 
 const icon = <SmileOutlined />;

components/alert/demo/loop-banner.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
-import Marquee from 'react-fast-marquee';
 import { Alert } from 'antd';
+import Marquee from 'react-fast-marquee';
 
 const App: React.FC = () => (
   <Alert

components/alert/demo/smooth-closed.tsx

@@ -1,5 +1,5 @@
 import React, { useState } from 'react';
-import { Alert, Switch, Space } from 'antd';
+import { Alert, Space, Switch } from 'antd';
 
 const App: React.FC = () => {
   const [visible, setVisible] = useState(true);

components/alert/index.ts

@@ -1,4 +1,5 @@
 import type React from 'react';
+
 import type { AlertProps } from './Alert';
 import InternalAlert from './Alert';
 import ErrorBoundary from './ErrorBoundary';

components/anchor/__tests__/Anchor.test.tsx

@@ -1,5 +1,5 @@
-import { resetWarned } from 'rc-util/lib/warning';
 import React, { useState } from 'react';
+import { resetWarned } from 'rc-util/lib/warning';
 import scrollIntoView from 'scroll-into-view-if-needed';
 
 import Anchor from '..';

components/anchor/__tests__/cached-context.test.tsx

@@ -1,4 +1,5 @@
 import React, { memo, useContext } from 'react';
+
 import { fireEvent, pureRender } from '../../../tests/utils';
 import Anchor from '../Anchor';
 import AnchorContext from '../context';

components/anchor/__tests__/demo.test.tsx

@@ -1,4 +1,5 @@
 import * as React from 'react';
+
 import demoTest, { rootPropsTest } from '../../../tests/shared/demoTest';
 
 demoTest('anchor', {

components/anchor/context.ts

@@ -1,4 +1,5 @@
 import * as React from 'react';
+
 import type { AntAnchor } from './Anchor';
 
 const AnchorContext = React.createContext<AntAnchor | undefined>(undefined);

components/anchor/demo/basic.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Anchor, Row, Col } from 'antd';
+import { Anchor, Col, Row } from 'antd';
 
 const App: React.FC = () => (
   <Row>

components/anchor/demo/targetOffset.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from 'react';
-import { Anchor, Row, Col } from 'antd';
+import { Anchor, Col, Row } from 'antd';
 
 const App: React.FC = () => {
   const topRef = React.useRef<HTMLDivElement>(null);

components/auto-complete/__tests__/demo.test.tsx

@@ -1,4 +1,5 @@
 import * as React from 'react';
+
 import demoTest, { rootPropsTest } from '../../../tests/shared/demoTest';
 
 demoTest('auto-complete', {

components/auto-complete/__tests__/focus.test.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import { act } from 'react-dom/test-utils';
+
 import AutoComplete from '..';
 import { render } from '../../../tests/utils';
 

components/auto-complete/__tests__/index.test.tsx

@@ -1,10 +1,11 @@
-import userEvent from '@testing-library/user-event';
 import React from 'react';
+import userEvent from '@testing-library/user-event';
+
 import AutoComplete from '..';
+import { resetWarned } from '../../_util/warning';
 import mountTest from '../../../tests/shared/mountTest';
 import rtlTest from '../../../tests/shared/rtlTest';
 import { render, screen } from '../../../tests/utils';
-import { resetWarned } from '../../_util/warning';
 import Input from '../../input';
 
 describe('AutoComplete', () => {

components/auto-complete/demo/render-panel.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { AutoComplete, Switch, Space } from 'antd';
+import { AutoComplete, Space, Switch } from 'antd';
 
 const { _InternalPanelDoNotUseOrYouWillBeFired: InternalAutoComplete } = AutoComplete;
 

components/avatar/AvatarContext.ts

@@ -1,4 +1,5 @@
 import * as React from 'react';
+
 import type { ScreenSizeMap } from '../_util/responsiveObserver';
 
 export type AvatarSize = 'large' | 'small' | 'default' | number | ScreenSizeMap;

components/avatar/__tests__/Avatar.test.tsx

@@ -1,10 +1,11 @@
 import React, { useState } from 'react';
+
 import Avatar from '..';
 import mountTest from '../../../tests/shared/mountTest';
 import rtlTest from '../../../tests/shared/rtlTest';
 import { fireEvent, render } from '../../../tests/utils';
-import useBreakpoint from '../../grid/hooks/useBreakpoint';
 import ConfigProvider from '../../config-provider';
+import useBreakpoint from '../../grid/hooks/useBreakpoint';
 
 jest.mock('../../grid/hooks/useBreakpoint');
 

components/avatar/__tests__/demo.test.tsx

@@ -1,4 +1,5 @@
 import * as React from 'react';
+
 import demoTest, { rootPropsTest } from '../../../tests/shared/demoTest';
 
 demoTest('avatar');

components/avatar/demo/badge.tsx

@@ -1,5 +1,5 @@
-import { UserOutlined } from '@ant-design/icons';
 import React from 'react';
+import { UserOutlined } from '@ant-design/icons';
 import { Avatar, Badge, Space } from 'antd';
 
 const App: React.FC = () => (

components/avatar/demo/basic.tsx

@@ -1,5 +1,5 @@
-import { UserOutlined } from '@ant-design/icons';
 import React from 'react';
+import { UserOutlined } from '@ant-design/icons';
 import { Avatar, Space } from 'antd';
 
 const App: React.FC = () => (

components/avatar/demo/component-token.tsx

@@ -1,5 +1,5 @@
-import { AntDesignOutlined, UserOutlined } from '@ant-design/icons';
 import React from 'react';
+import { AntDesignOutlined, UserOutlined } from '@ant-design/icons';
 import { Avatar, Badge, ConfigProvider, Space, Tooltip } from 'antd';
 
 const App: React.FC = () => (

components/avatar/demo/group.tsx

@@ -1,5 +1,5 @@
-import { AntDesignOutlined, UserOutlined } from '@ant-design/icons';
 import React from 'react';
+import { AntDesignOutlined, UserOutlined } from '@ant-design/icons';
 import { Avatar, Divider, Tooltip } from 'antd';
 
 const App: React.FC = () => (

components/avatar/demo/type.tsx

@@ -1,5 +1,5 @@
-import { UserOutlined } from '@ant-design/icons';
 import React from 'react';
+import { UserOutlined } from '@ant-design/icons';
 import { Avatar, Space } from 'antd';
 
 const url = 'https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg';

components/avatar/group.tsx

@@ -1,14 +1,15 @@
+import * as React from 'react';
 import classNames from 'classnames';
 import toArray from 'rc-util/lib/Children/toArray';
-import * as React from 'react';
-import { ConfigContext } from '../config-provider';
-import Popover from '../popover';
+
 import { cloneElement } from '../_util/reactNode';
+import { ConfigContext } from '../config-provider';
+import useCSSVarCls from '../config-provider/hooks/useCSSVarCls';
+import Popover from '../popover';
 import Avatar from './avatar';
 import AvatarContext from './AvatarContext';
 import type { AvatarContextType, AvatarSize } from './AvatarContext';
 import useStyle from './style';
-import useCSSVarCls from '../config-provider/hooks/useCSSVarCls';
 
 interface ContextProps {
   children?: React.ReactNode;

components/avatar/index.ts

@@ -1,4 +1,5 @@
 import type { ForwardRefExoticComponent, RefAttributes } from 'react';
+
 import type { AvatarProps } from './avatar';
 import InternalAvatar from './avatar';
 import Group from './group';

components/avatar/style/index.ts

@@ -1,4 +1,5 @@
-import { type CSSObject, unit } from '@ant-design/cssinjs';
+import { unit } from '@ant-design/cssinjs';
+import type { CSSObject } from '@ant-design/cssinjs';
 
 import { resetComponent } from '../../style';
 import type { FullToken, GenerateStyle, GetDefaultToken } from '../../theme/internal';

components/back-top/__tests__/index.test.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+
 import BackTop from '..';
 import mountTest from '../../../tests/shared/mountTest';
 import rtlTest from '../../../tests/shared/rtlTest';

components/back-top/style/index.ts

@@ -1,4 +1,5 @@
-import { type CSSObject, unit } from '@ant-design/cssinjs';
+import { unit } from '@ant-design/cssinjs';
+import type { CSSObject } from '@ant-design/cssinjs';
 
 import { resetComponent } from '../../style';
 import type { FullToken, GenerateStyle, GetDefaultToken } from '../../theme/internal';

components/badge/ScrollNumber.tsx

@@ -1,5 +1,6 @@
-import classNames from 'classnames';
 import * as React from 'react';
+import classNames from 'classnames';
+
 import { cloneElement } from '../_util/reactNode';
 import { ConfigContext } from '../config-provider';
 import SingleNumber from './SingleNumber';

components/badge/SingleNumber.tsx

@@ -1,5 +1,5 @@
-import classNames from 'classnames';
 import * as React from 'react';
+import classNames from 'classnames';
 
 export interface UnitNumberProps {
   prefixCls: string;

components/badge/__tests__/demo.test.tsx

@@ -1,4 +1,5 @@
 import * as React from 'react';
+
 import demoTest, { rootPropsTest } from '../../../tests/shared/demoTest';
 
 demoTest('badge');

components/badge/__tests__/index.test.tsx

@@ -1,6 +1,7 @@
-import { fireEvent, render } from '@testing-library/react';
 import React from 'react';
+import { fireEvent, render } from '@testing-library/react';
 import { act } from 'react-dom/test-utils';
+
 import mountTest from '../../../tests/shared/mountTest';
 import rtlTest from '../../../tests/shared/rtlTest';
 import Tooltip from '../../tooltip';

components/badge/__tests__/ribbon.test.tsx

@@ -1,5 +1,6 @@
-import { render } from '@testing-library/react';
 import React from 'react';
+import { render } from '@testing-library/react';
+
 import mountTest from '../../../tests/shared/mountTest';
 import rtlTest from '../../../tests/shared/rtlTest';
 import Badge from '../index';

components/badge/demo/change.tsx

@@ -1,6 +1,6 @@
 import React, { useState } from 'react';
 import { MinusOutlined, PlusOutlined, QuestionOutlined } from '@ant-design/icons';
-import { Avatar, Badge, Button, Switch, Space } from 'antd';
+import { Avatar, Badge, Button, Space, Switch } from 'antd';
 
 const ButtonGroup = Button.Group;
 

components/badge/demo/component-token.tsx

@@ -1,5 +1,5 @@
-import { NotificationOutlined } from '@ant-design/icons';
 import React from 'react';
+import { NotificationOutlined } from '@ant-design/icons';
 import { Avatar, Badge, ConfigProvider, Space } from 'antd';
 
 /** Test usage. Do not use in your production. */

components/badge/demo/no-wrapper.tsx

@@ -8,7 +8,7 @@ const App: React.FC = () => {
   return (
     <Space>
       <Switch checked={show} onChange={() => setShow(!show)} />
-      <Badge count={show ? 11 : 0} showZero color='#faad14' />
+      <Badge count={show ? 11 : 0} showZero color="#faad14" />
       <Badge count={show ? 25 : 0} />
       <Badge count={show ? <ClockCircleOutlined style={{ color: '#f5222d' }} /> : 0} />
       <Badge

components/badge/style/ribbon.ts

@@ -1,6 +1,7 @@
 import { unit } from '@ant-design/cssinjs';
 
-import { type BadgeToken, prepareComponentToken, prepareToken } from '.';
+import { prepareComponentToken, prepareToken } from '.';
+import type { BadgeToken } from '.';
 import { resetComponent } from '../../style';
 import type { GenerateStyle } from '../../theme/internal';
 import { genPresetColor, genStyleHooks } from '../../theme/internal';

components/breadcrumb/BreadcrumbItem.tsx

@@ -1,12 +1,13 @@
-import DownOutlined from '@ant-design/icons/DownOutlined';
 import * as React from 'react';
+import DownOutlined from '@ant-design/icons/DownOutlined';
+
+import { devUseWarning } from '../_util/warning';
 import { ConfigContext } from '../config-provider';
 import type { DropdownProps } from '../dropdown/dropdown';
 import Dropdown from '../dropdown/dropdown';
 import type { ItemType } from './Breadcrumb';
 import BreadcrumbSeparator from './BreadcrumbSeparator';
 import { renderItem } from './useItemRender';
-import { devUseWarning } from '../_util/warning';
 
 export interface SeparatorType {
   separator?: React.ReactNode;

components/breadcrumb/BreadcrumbSeparator.tsx

@@ -1,4 +1,5 @@
 import * as React from 'react';
+
 import { ConfigContext } from '../config-provider';
 
 type CompoundedComponent = React.FC<{ children?: React.ReactNode }> & {

components/breadcrumb/__tests__/Breadcrumb.test.tsx

@@ -1,9 +1,10 @@
 import React from 'react';
+
+import { resetWarned } from '../../_util/warning';
 import accessibilityTest from '../../../tests/shared/accessibilityTest';
 import mountTest from '../../../tests/shared/mountTest';
 import rtlTest from '../../../tests/shared/rtlTest';
 import { render } from '../../../tests/utils';
-import { resetWarned } from '../../_util/warning';
 import type { ItemType } from '../Breadcrumb';
 import Breadcrumb from '../index';
 

components/breadcrumb/__tests__/itemRender.test.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+
 import { render } from '../../../tests/utils';
 import Breadcrumb from '../index';
 

components/breadcrumb/__tests__/router.test.tsx

@@ -1,6 +1,7 @@
 import React, { useMemo } from 'react';
 import type { RouterProps } from 'react-router-dom';
 import { Link, MemoryRouter, Route, Routes, useLocation, useNavigate } from 'react-router-dom';
+
 import { fireEvent, render } from '../../../tests/utils';
 import Breadcrumb from '../index';
 
@@ -51,11 +52,11 @@ describe('react router', () => {
         </Breadcrumb.Item>,
       ].concat(extraBreadcrumbItems);
       const componentProps = useMemo<RouterProps>(
-        () => ({ component: Apps } as unknown as RouterProps),
+        () => ({ component: Apps }) as unknown as RouterProps,
         [],
       );
       const renderProps = useMemo<RouterProps>(
-        () => ({ render: () => <span>Home Page</span> } as unknown as RouterProps),
+        () => ({ render: () => <span>Home Page</span> }) as unknown as RouterProps,
         [],
       );
       return (

components/breadcrumb/demo/component-token.tsx

@@ -1,5 +1,5 @@
-import { HomeOutlined, UserOutlined } from '@ant-design/icons';
 import React from 'react';
+import { HomeOutlined, UserOutlined } from '@ant-design/icons';
 import { Breadcrumb, ConfigProvider } from 'antd';
 
 const menuItems = [

components/breadcrumb/demo/withIcon.tsx

@@ -1,5 +1,5 @@
-import { HomeOutlined, UserOutlined } from '@ant-design/icons';
 import React from 'react';
+import { HomeOutlined, UserOutlined } from '@ant-design/icons';
 import { Breadcrumb } from 'antd';
 
 const App: React.FC = () => (

components/breadcrumb/style/index.ts

@@ -1,4 +1,5 @@
-import { type CSSObject, unit } from '@ant-design/cssinjs';
+import { unit } from '@ant-design/cssinjs';
+import type { CSSObject } from '@ant-design/cssinjs';
 
 import { genFocusStyle, resetComponent } from '../../style';
 import type { FullToken, GenerateStyle, GetDefaultToken } from '../../theme/internal';

components/breadcrumb/useItemRender.tsx

@@ -1,6 +1,7 @@
+import * as React from 'react';
 import classNames from 'classnames';
 import pickAttrs from 'rc-util/lib/pickAttrs';
-import * as React from 'react';
+
 import type { BreadcrumbProps, InternalRouteType, ItemType } from './Breadcrumb';
 
 type AddParameters<TFunction extends (...args: any) => any, TParameters extends [...args: any]> = (

components/breadcrumb/useItems.ts

@@ -1,4 +1,5 @@
 import { useMemo } from 'react';
+
 import type { BreadcrumbItemType, BreadcrumbSeparatorType, ItemType } from './Breadcrumb';
 
 type MergedType = BreadcrumbItemType & {

components/button/LoadingIcon.tsx

@@ -1,7 +1,8 @@
+import React, { forwardRef } from 'react';
 import LoadingOutlined from '@ant-design/icons/LoadingOutlined';
 import classNames from 'classnames';
 import CSSMotion from 'rc-motion';
-import React, { forwardRef } from 'react';
+
 import IconWrapper from './IconWrapper';
 
 type InnerLoadingIconProps = {

components/button/__tests__/delay-timer.test.tsx

@@ -1,5 +1,6 @@
 import React, { useState } from 'react';
 import { act } from 'react-dom/test-utils';
+
 import { fireEvent, render } from '../../../tests/utils';
 import Button from '../button';
 

components/button/__tests__/wave.test.tsx

@@ -1,5 +1,6 @@
-import userEvent from '@testing-library/user-event';
 import React from 'react';
+import userEvent from '@testing-library/user-event';
+
 import Button from '..';
 import { act, fireEvent, render } from '../../../tests/utils';
 

components/button/buttonHelpers.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+
 import { cloneElement, isFragment } from '../_util/reactNode';
 import type { BaseButtonProps, LegacyButtonType } from './button';
 
@@ -75,10 +76,10 @@ export function spaceChildren(children: React.ReactNode, needInserted: boolean)
 }
 
 const ButtonTypes = ['default', 'primary', 'dashed', 'link', 'text'] as const;
-export type ButtonType = typeof ButtonTypes[number];
+export type ButtonType = (typeof ButtonTypes)[number];
 
 const ButtonShapes = ['default', 'circle', 'round'] as const;
-export type ButtonShape = typeof ButtonShapes[number];
+export type ButtonShape = (typeof ButtonShapes)[number];
 
 const ButtonHTMLTypes = ['submit', 'button', 'reset'] as const;
-export type ButtonHTMLType = typeof ButtonHTMLTypes[number];
+export type ButtonHTMLType = (typeof ButtonHTMLTypes)[number];

components/button/demo/debug-block.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { DownloadOutlined } from '@ant-design/icons';
-import { Form, Button } from 'antd';
+import { Button, Form } from 'antd';
 
 const App: React.FC = () => (
   <Form>

components/button/demo/debug-icon.tsx

@@ -1,14 +1,7 @@
 import React from 'react';
 import { SearchOutlined } from '@ant-design/icons';
-import {
-  Button,
-  ConfigProvider,
-  Divider,
-  Flex,
-  Radio,
-  Tooltip,
-  type ConfigProviderProps,
-} from 'antd';
+import { Button, ConfigProvider, Divider, Flex, Radio, Tooltip } from 'antd';
+import type { ConfigProviderProps } from 'antd';
 
 type SizeType = ConfigProviderProps['componentSize'];
 

components/button/demo/linear-gradient.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
-import { Button, ConfigProvider, Space } from 'antd';
 import { TinyColor } from '@ctrl/tinycolor';
+import { Button, ConfigProvider, Space } from 'antd';
 
 const colors1 = ['#6253E1', '#04BEFE'];
 const colors2 = ['#fc6076', '#ff9a44', '#ef9d43', '#e75516'];

components/button/style/compactCmp.ts

@@ -1,11 +1,12 @@
 // Style as inline component
-import type { ButtonToken } from './token';
-import { prepareComponentToken, prepareToken } from './token';
+import { unit } from '@ant-design/cssinjs';
+
 import { genCompactItemStyle } from '../../style/compact-item';
 import { genCompactItemVerticalStyle } from '../../style/compact-item-vertical';
 import type { GenerateStyle } from '../../theme/internal';
 import { genSubStyleComponent } from '../../theme/internal';
-import { unit } from '@ant-design/cssinjs';
+import type { ButtonToken } from './token';
+import { prepareComponentToken, prepareToken } from './token';
 
 const genButtonCompactStyle: GenerateStyle<ButtonToken> = (token) => {
   const { componentCls, calc } = token;

components/button/style/group.ts

@@ -1,5 +1,5 @@
-import type { ButtonToken } from './token';
 import type { GenerateStyle } from '../../theme/internal';
+import type { ButtonToken } from './token';
 
 const genButtonBorderStyle = (buttonTypeCls: string, borderColor: string) => ({
   // Border

components/button/style/token.ts

@@ -1,4 +1,5 @@
 import type { CSSProperties } from 'react';
+
 import type { FullToken, GetDefaultToken } from '../../theme/internal';
 import { getLineHeight, mergeToken } from '../../theme/internal';
 import type { GenStyleFn } from '../../theme/util/genComponentStyleHook';

components/calendar/Header.tsx

@@ -1,7 +1,8 @@
-import type { GenerateConfig } from 'rc-picker/lib/generate';
-import type { Locale } from 'rc-picker/lib/interface';
 import * as React from 'react';
 import { useContext, useMemo } from 'react';
+import type { GenerateConfig } from 'rc-picker/lib/generate';
+import type { Locale } from 'rc-picker/lib/interface';
+
 import { FormItemInputContext } from '../form/context';
 import { Button, Group } from '../radio';
 import Select from '../select';

components/calendar/__tests__/demo.test.ts

@@ -1,4 +1,5 @@
 import dayjs from 'dayjs';
+
 import demoTest from '../../../tests/shared/demoTest';
 
 demoTest('calendar', {

components/calendar/__tests__/index.test.tsx

@@ -4,7 +4,7 @@ import 'dayjs/locale/zh-cn';
 
 import React from 'react';
 import MockDate from 'mockdate';
-import { type PickerPanelProps } from 'rc-picker';
+import type { PickerPanelProps } from 'rc-picker';
 import dayjsGenerateConfig from 'rc-picker/lib/generate/dayjs';
 import type { Locale } from 'rc-picker/lib/interface';
 import { resetWarned } from 'rc-util/lib/warning';
@@ -16,7 +16,8 @@ import { fireEvent, render } from '../../../tests/utils';
 import Group from '../../radio/group';
 import Button from '../../radio/radioButton';
 import Select from '../../select';
-import Header, { type CalendarHeaderProps } from '../Header';
+import Header from '../Header';
+import type { CalendarHeaderProps } from '../Header';
 
 const ref: {
   calendarProps?: PickerPanelProps;

components/calendar/demo/basic.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
-import type { Dayjs } from 'dayjs';
 import { Calendar } from 'antd';
 import type { CalendarProps } from 'antd';
+import type { Dayjs } from 'dayjs';
 
 const App: React.FC = () => {
   const onPanelChange = (value: Dayjs, mode: CalendarProps<Dayjs>['mode']) => {

components/calendar/demo/card.tsx

@@ -1,7 +1,7 @@
-import type { Dayjs } from 'dayjs';
 import React from 'react';
 import { Calendar, theme } from 'antd';
 import type { CalendarProps } from 'antd';
+import type { Dayjs } from 'dayjs';
 
 const onPanelChange = (value: Dayjs, mode: CalendarProps<Dayjs>['mode']) => {
   console.log(value.format('YYYY-MM-DD'), mode);

components/calendar/demo/component-token.tsx

@@ -1,7 +1,7 @@
-import type { Dayjs } from 'dayjs';
 import React from 'react';
 import { Calendar, ConfigProvider } from 'antd';
 import type { CalendarProps } from 'antd';
+import type { Dayjs } from 'dayjs';
 
 /** Test usage. Do not use in your production. */
 export default () => {

components/calendar/demo/customize-header.tsx

@@ -1,10 +1,12 @@
 import React from 'react';
 import dayjs from 'dayjs';
+
 import 'dayjs/locale/zh-cn';
+
+import { Calendar, Col, Radio, Row, Select, theme, Typography } from 'antd';
+import type { CalendarProps } from 'antd';
 import type { Dayjs } from 'dayjs';
 import dayLocaleData from 'dayjs/plugin/localeData';
-import { Calendar, Col, Radio, Row, Select, Typography, theme } from 'antd';
-import type { CalendarProps } from 'antd';
 
 dayjs.extend(dayLocaleData);
 

components/calendar/demo/lunar.tsx

@@ -1,11 +1,11 @@
-import dayjs from 'dayjs';
-import type { Dayjs } from 'dayjs';
 import React from 'react';
-import { Lunar, HolidayUtil } from 'lunar-typescript';
-import { createStyles } from 'antd-style';
-import classNames from 'classnames';
 import { Calendar, Col, Radio, Row, Select } from 'antd';
 import type { CalendarProps } from 'antd';
+import { createStyles } from 'antd-style';
+import classNames from 'classnames';
+import dayjs from 'dayjs';
+import type { Dayjs } from 'dayjs';
+import { HolidayUtil, Lunar } from 'lunar-typescript';
 
 const useStyle = createStyles(({ token, css, cx }) => {
   const lunar = css`

components/calendar/demo/notice-calendar.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
-import type { Dayjs } from 'dayjs';
 import type { BadgeProps, CalendarProps } from 'antd';
 import { Badge, Calendar } from 'antd';
+import type { Dayjs } from 'dayjs';
 
 const getListData = (value: Dayjs) => {
   let listData;

components/calendar/demo/select.tsx

@@ -1,7 +1,7 @@
 import React, { useState } from 'react';
+import { Alert, Calendar } from 'antd';
 import type { Dayjs } from 'dayjs';
 import dayjs from 'dayjs';
-import { Alert, Calendar } from 'antd';
 
 const App: React.FC = () => {
   const [value, setValue] = useState(() => dayjs('2017-01-25'));

components/calendar/index.ts

@@ -1,5 +1,6 @@
 import type { Dayjs } from 'dayjs';
 import dayjsGenerateConfig from 'rc-picker/lib/generate/dayjs';
+
 import type { CalendarProps } from './generateCalendar';
 import generateCalendar from './generateCalendar';
 

components/card/Grid.tsx

@@ -1,5 +1,6 @@
-import classNames from 'classnames';
 import * as React from 'react';
+import classNames from 'classnames';
+
 import { ConfigContext } from '../config-provider';
 import type { ConfigConsumerProps } from '../config-provider';
 

components/card/Meta.tsx

@@ -1,5 +1,6 @@
-import classNames from 'classnames';
 import * as React from 'react';
+import classNames from 'classnames';
+
 import type { ConfigConsumerProps } from '../config-provider';
 import { ConfigContext } from '../config-provider';
 

components/card/__tests__/index.test.tsx

@@ -1,6 +1,8 @@
 import '@testing-library/jest-dom';
-import userEvent from '@testing-library/user-event';
+
 import React from 'react';
+import userEvent from '@testing-library/user-event';
+
 import mountTest from '../../../tests/shared/mountTest';
 import rtlTest from '../../../tests/shared/rtlTest';
 import { render, screen } from '../../../tests/utils';

components/card/__tests__/type.test.tsx

@@ -1,4 +1,5 @@
 import * as React from 'react';
+
 import Card from '../index';
 
 describe('Card.typescript', () => {

components/card/demo/component-token.tsx

@@ -1,5 +1,5 @@
-import { EditOutlined, EllipsisOutlined, SettingOutlined } from '@ant-design/icons';
 import React from 'react';
+import { EditOutlined, EllipsisOutlined, SettingOutlined } from '@ant-design/icons';
 import { Card, ConfigProvider } from 'antd';
 
 export default () => (