refactor: add boime lint and fix lint errrors (#49536)

* chore: add boime lint

* fix lint

* use files ignore

* revert change

* ignore clarity.js

* fix some errors

* fix some errors

* fix some errors

* fix some errors

* add yml file

* Update clarity.js

Signed-off-by: afc163 <afc163@gmail.com>

* add npm run lint:biome

* add npm run lint:biome

* fix test case

* fix ts errors

* fix ts errors

* fix lint and add .lintstagedrc

* shorten prop name

* chore: update package.json

* update biome.json

* chore: remove stylelint

* chore: useOptionalChain

* fix lint

* biome format

* prettier all code

* prettier all code

* fix site test

---------

Signed-off-by: afc163 <afc163@gmail.com>

.dumi/hooks/use.ts

@@ -9,22 +9,22 @@ function use<T>(promise: PromiseLike<T>): T {
   }
   if (internal.status === 'rejected') {
     throw internal.reason;
-  } else if (internal.status === 'pending') {
+  }
-    throw internal;
+  if (internal.status === 'pending') {
-  } else {
-    internal.status = 'pending';
-    internal.then(
-      (result) => {
-        internal.status = 'fulfilled';
-        internal.value = result;
-      },
-      (reason) => {
-        internal.status = 'rejected';
-        internal.reason = reason;
-      },
-    );
     throw internal;
   }
+  internal.status = 'pending';
+  internal.then(
+    (result) => {
+      internal.status = 'fulfilled';
+      internal.value = result;
+    },
+    (reason) => {
+      internal.status = 'rejected';
+      internal.reason = reason;
+    },
+  );
+  throw internal;
 }
 
 export default use;

.dumi/hooks/useFetch/index.ts

@@ -1,4 +1,5 @@
 import fetch from 'cross-fetch';
+
 import use from '../use';
 import FetchCache from './cache';
 

.dumi/hooks/useLocation.ts

@@ -1,5 +1,6 @@
-import { useLocation as useDumiLocation } from 'dumi';
 import * as React from 'react';
+import { useLocation as useDumiLocation } from 'dumi';
+
 import useLocale from './useLocale';
 
 function clearPath(path: string) {

.dumi/pages/404/index.tsx

@@ -1,9 +1,10 @@
-import { HomeOutlined } from '@ant-design/icons';
-import { useLocation } from 'dumi';
 import React, { useEffect } from 'react';
+import { HomeOutlined } from '@ant-design/icons';
 import { Button, Result } from 'antd';
-import * as utils from '../../theme/utils';
+import { useLocation } from 'dumi';
+
 import Link from '../../theme/common/Link';
+import * as utils from '../../theme/utils';
 
 export interface NotFoundProps {
   router: {

.dumi/pages/index/components/DesignFramework.tsx

@@ -5,9 +5,9 @@ import { useLocation } from 'dumi';
 
 import useDark from '../../../hooks/useDark';
 import useLocale from '../../../hooks/useLocale';
+import Link from '../../../theme/common/Link';
 import SiteContext from '../../../theme/slots/SiteContext';
 import * as utils from '../../../theme/utils';
-import Link from '../../../theme/common/Link';
 
 const SECONDARY_LIST = [
   {

.dumi/pages/index/components/PreviewBanner/index.tsx

@@ -4,9 +4,9 @@ import { createStyles } from 'antd-style';
 import { useLocation } from 'dumi';
 
 import useLocale from '../../../../hooks/useLocale';
+import Link from '../../../../theme/common/Link';
 import SiteContext from '../../../../theme/slots/SiteContext';
 import * as utils from '../../../../theme/utils';
-import Link from '../../../../theme/common/Link';
 import GroupMaskLayer from '../GroupMaskLayer';
 
 const ComponentsBlock = React.lazy(() => import('./ComponentsBlock'));

.dumi/pages/index/index.tsx

@@ -5,8 +5,8 @@ import { createStyles, css } from 'antd-style';
 import useDark from '../../hooks/useDark';
 import useLocale from '../../hooks/useLocale';
 import BannerRecommends from './components/BannerRecommends';
-import PreviewBanner from './components/PreviewBanner';
 import Group from './components/Group';
+import PreviewBanner from './components/PreviewBanner';
 
 const ComponentsList = React.lazy(() => import('./components/ComponentsList'));
 const DesignFramework = React.lazy(() => import('./components/DesignFramework'));

.dumi/rehypeAntd.ts

@@ -74,7 +74,7 @@ function rehypeAntd(): UnifiedTransformer<HastRoot> {
           const code = (node.children[0] as any).value as string;
           const configRegx = /^const sandpackConfig = ([\S\s]*?});/;
           const [configString] = code.match(configRegx) || [];
-          // eslint-disable-next-line no-eval
+          /* biome-ignore lint/security/noGlobalEval: used in documentation */ /* eslint-disable-next-line no-eval */
           const config = configString && eval(`(${configString.replace(configRegx, '$1')})`);
           Object.keys(config || {}).forEach((key) => {
             if (typeof config[key] === 'object') {

.dumi/theme/builtins/IconSearch/IconSearch.tsx

@@ -81,7 +81,7 @@ const IconSearch: React.FC = () => {
         if (searchKey) {
           const matchKey = searchKey
             // eslint-disable-next-line prefer-regex-literals
-            .replace(new RegExp(`^<([a-zA-Z]*)\\s/>$`, 'gi'), (_, name) => name)
+            .replace(/^<([a-z]*)\s\/>$/gi, (_, name) => name)
             .replace(/(Filled|Outlined|TwoTone)$/, '')
             .toLowerCase();
           iconList = iconList.filter((iconName) => iconName.toLowerCase().includes(matchKey));

.dumi/theme/builtins/IconSearch/themeIcons.tsx

@@ -12,6 +12,7 @@ export const FilledIcon: CustomIconComponent = (props) => {
     '0c0-53-43-96-96-96z';
   return (
     <svg {...props} viewBox="0 0 1024 1024">
+      <title>Filled Icon</title>
       <path d={path} />
     </svg>
   );
@@ -26,6 +27,7 @@ export const OutlinedIcon: CustomIconComponent = (props) => {
     ' 12 12v680c0 6.6-5.4 12-12 12z';
   return (
     <svg {...props} viewBox="0 0 1024 1024">
+      <title>Outlined Icon</title>
       <path d={path} />
     </svg>
   );
@@ -39,6 +41,7 @@ export const TwoToneIcon: CustomIconComponent = (props) => {
     '68 368 0 203.41-164.622 368-368 368z';
   return (
     <svg {...props} viewBox="0 0 1024 1024">
+      <title>TwoTone Icon</title>
       <path d={path} />
     </svg>
   );

.dumi/theme/builtins/ImagePreview/index.tsx

@@ -117,6 +117,7 @@ const ImagePreview: React.FC<React.PropsWithChildren<ImagePreviewProps>> = (prop
             <div className="preview-image-title">{coverMeta.alt}</div>
             <div
               className="preview-image-description"
+              // biome-ignore lint/security/noDangerouslySetInnerHtml: it's for markdown
               dangerouslySetInnerHTML={{ __html: coverMeta.description ?? '' }}
             />
           </div>

.dumi/theme/builtins/InlinePopover/index.tsx

@@ -1,6 +1,7 @@
-import { PictureOutlined } from '@ant-design/icons';
 import React from 'react';
+import { PictureOutlined } from '@ant-design/icons';
 import { Image, Tooltip, Typography } from 'antd';
+
 import useLocale from '../../../hooks/useLocale';
 
 const locales = {

.dumi/theme/builtins/InstallDependencies/index.tsx

@@ -3,10 +3,10 @@ import { ConfigProvider, Tabs } from 'antd';
 import SourceCode from 'dumi/theme-default/builtins/SourceCode';
 import type { Tab } from 'rc-tabs/lib/interface';
 
+import BunLogo from './bun';
 import NpmLogo from './npm';
 import PnpmLogo from './pnpm';
 import YarnLogo from './yarn';
-import BunLogo from './bun';
 
 interface InstallProps {
   npm?: string;

.dumi/theme/builtins/InstallDependencies/npm.tsx

@@ -31,6 +31,7 @@ const NpmIcon: React.FC<IconProps> = (props) => {
         viewBox="0 0 16 16"
         width="1em"
       >
+        <title>npm icon</title>
         <path d="M0 0v16h16v-16h-16zM13 13h-2v-8h-3v8h-5v-10h10v10z" />
       </svg>
     </span>

.dumi/theme/builtins/InstallDependencies/pnpm.tsx

@@ -33,6 +33,7 @@ const PnpmIcon: React.FC<IconProps> = (props) => {
         viewBox="0 0 24 24"
         width="1em"
       >
+        <title>pnpm icon</title>
         <path d="M0 0v7.5h7.5V0zm8.25 0v7.5h7.498V0zm8.25 0v7.5H24V0zM8.25 8.25v7.5h7.498v-7.5zm8.25 0v7.5H24v-7.5zM0 16.5V24h7.5v-7.5zm8.25 0V24h7.498v-7.5zm8.25 0V24H24v-7.5z" />
       </svg>
     </span>

.dumi/theme/builtins/InstallDependencies/yarn.tsx

@@ -32,6 +32,7 @@ const YarnIcon: React.FC<IconProps> = (props) => {
         viewBox="0 0 496 512"
         width="1em"
       >
+        <title>yarn icon</title>
         <path d="M393.9 345.2c-39 9.3-48.4 32.1-104 47.4 0 0-2.7 4-10.4 5.8-13.4 3.3-63.9 6-68.5 6.1-12.4.1-19.9-3.2-22-8.2-6.4-15.3 9.2-22 9.2-22-8.1-5-9-9.9-9.8-8.1-2.4 5.8-3.6 20.1-10.1 26.5-8.8 8.9-25.5 5.9-35.3.8-10.8-5.7.8-19.2.8-19.2s-5.8 3.4-10.5-3.6c-6-9.3-17.1-37.3 11.5-62-1.3-10.1-4.6-53.7 40.6-85.6 0 0-20.6-22.8-12.9-43.3 5-13.4 7-13.3 8.6-13.9 5.7-2.2 11.3-4.6 15.4-9.1 20.6-22.2 46.8-18 46.8-18s12.4-37.8 23.9-30.4c3.5 2.3 16.3 30.6 16.3 30.6s13.6-7.9 15.1-5c8.2 16 9.2 46.5 5.6 65.1-6.1 30.6-21.4 47.1-27.6 57.5-1.4 2.4 16.5 10 27.8 41.3 10.4 28.6 1.1 52.7 2.8 55.3.8 1.4 13.7.8 36.4-13.2 12.8-7.9 28.1-16.9 45.4-17 16.7-.5 17.6 19.2 4.9 22.2zM496 256c0 136.9-111.1 248-248 248S0 392.9 0 256 111.1 8 248 8s248 111.1 248 248zm-79.3 75.2c-1.7-13.6-13.2-23-28-22.8-22 .3-40.5 11.7-52.8 19.2-4.8 3-8.9 5.2-12.4 6.8 3.1-44.5-22.5-73.1-28.7-79.4 7.8-11.3 18.4-27.8 23.4-53.2 4.3-21.7 3-55.5-6.9-74.5-1.6-3.1-7.4-11.2-21-7.4-9.7-20-13-22.1-15.6-23.8-1.1-.7-23.6-16.4-41.4 28-12.2.9-31.3 5.3-47.5 22.8-2 2.2-5.9 3.8-10.1 5.4h.1c-8.4 3-12.3 9.9-16.9 22.3-6.5 17.4.2 34.6 6.8 45.7-17.8 15.9-37 39.8-35.7 82.5-34 36-11.8 73-5.6 79.6-1.6 11.1 3.7 19.4 12 23.8 12.6 6.7 30.3 9.6 43.9 2.8 4.9 5.2 13.8 10.1 30 10.1 6.8 0 58-2.9 72.6-6.5 6.8-1.6 11.5-4.5 14.6-7.1 9.8-3.1 36.8-12.3 62.2-28.7 18-11.7 24.2-14.2 37.6-17.4 12.9-3.2 21-15.1 19.4-28.2z" />
       </svg>
     </span>

.dumi/theme/builtins/Previewer/CodePreviewer.tsx

@@ -401,6 +401,7 @@ createRoot(document.getElementById('container')).render(<Demo />);
           {description && (
             <div
               className="code-box-description"
+              // biome-ignore lint/security/noDangerouslySetInnerHtml: it's for markdown
               dangerouslySetInnerHTML={{ __html: description }}
             />
           )}

.dumi/theme/builtins/Previewer/DesignPreviewer.tsx

@@ -80,6 +80,7 @@ const DesignPreviewer: FC<AntdPreviewerProps> = ({ children, title, description,
         {title}
       </a>
       {description && (
+        // biome-ignore lint/security/noDangerouslySetInnerHtml: description is from markdown
         <div className={styles.description} dangerouslySetInnerHTML={{ __html: description }} />
       )}
       <div className={styles.copy}>
@@ -89,10 +90,10 @@ const DesignPreviewer: FC<AntdPreviewerProps> = ({ children, title, description,
             <span style={{ marginInlineStart: 8 }}>已复制，使用 Kitchen 插件即可粘贴</span>
           </div>
         ) : (
-          <div onClick={handleCopy} className={styles.copyTip}>
+          <button type="button" onClick={handleCopy} className={styles.copyTip}>
             <SketchOutlined />
             <span style={{ marginInlineStart: 8 }}>复制 Sketch JSON</span>
-          </div>
+          </button>
         )}
       </div>
       <div className={styles.demo} ref={demoRef}>

.dumi/theme/builtins/ResourceCards/index.tsx

@@ -1,7 +1,8 @@
 import React from 'react';
 import { ExclamationCircleOutlined } from '@ant-design/icons';
-import { Col, Row, Tooltip, Card, Typography } from 'antd';
+import { Card, Col, Row, Tooltip, Typography } from 'antd';
 import { createStyles } from 'antd-style';
+
 import useLocale from '../../../hooks/useLocale';
 
 const { Paragraph } = Typography;
@@ -22,19 +23,19 @@ const useStyle = createStyles(({ token, css }) => ({
         transform: scale(1.3);
         `,
   badge: css`
-      position: absolute;
+    position: absolute;
-      top: 8px;
+    top: 8px;
-      right: 8px;
+    right: 8px;
-      padding: ${token.paddingXXS}px ${token.paddingXS}px;
+    padding: ${token.paddingXXS}px ${token.paddingXS}px;
-      color: #fff;
+    color: #fff;
-      font-size: ${token.fontSizeSM}px;
+    font-size: ${token.fontSizeSM}px;
-      line-height: 1;
+    line-height: 1;
-      background: rgba(0, 0, 0, 0.65);
+    background: rgba(0, 0, 0, 0.65);
-      border-radius: ${token.borderRadiusLG}px;
+    border-radius: ${token.borderRadiusLG}px;
-      box-shadow: 0 0 2px rgba(255, 255, 255, 0.2);
+    box-shadow: 0 0 2px rgba(255, 255, 255, 0.2);
-      display: inline-flex;
+    display: inline-flex;
-      column-gap: ${token.paddingXXS}px;
+    column-gap: ${token.paddingXXS}px;
-    `,
+  `,
 }));
 
 export type Resource = {

.dumi/theme/common/CodePenIcon.tsx

@@ -3,6 +3,7 @@ import Icon from '@ant-design/icons';
 
 const SVGIcon: React.FC = () => (
   <svg viewBox="0 0 15 15" fill="currentColor">
+    <title>codepen icon</title>
     <path d="M14.777304,4.75062256 L7.77734505,0.0839936563 C7.60939924,-0.0279665065 7.39060662,-0.0279665065 7.22266081,0.0839936563 L0.222701813,4.75062256 C0.0836082937,4.84334851 5.66973453e-05,4.99945222 4.6875e-05,5.16662013 L4.6875e-05,9.83324903 C4.6875e-05,10.0004355 0.0836088906,10.1565596 0.222701812,10.2492466 L7.22266081,14.9158755 C7.30662908,14.9718752 7.403316,14.999875 7.50000292,14.999875 C7.59668984,14.999875 7.69337678,14.9718752 7.77734505,14.9158755 L14.777304,10.2492466 C14.9163976,10.1565206 14.9999492,10.0004169 14.999959,9.83324903 L14.999959,5.16662013 C14.9999492,4.99945222 14.9163976,4.84334851 14.777304,4.75062256 Z M7.50000292,9.23237755 L4.90139316,7.4999502 L7.50000292,5.76755409 L10.0986127,7.4999502 L7.50000292,9.23237755 Z M8,4.89905919 L8,1.43423573 L13.598561,5.16665138 L10.9999824,6.89904747 L8,4.89905919 Z M7.00000586,4.89905919 L4.00002344,6.89904747 L1.40141366,5.16665138 L7.00000586,1.43423573 L7.00000586,4.89905919 Z M3.09865372,7.4999502 L1.00004102,8.89903575 L1.00004102,6.10089589 L3.09865372,7.4999502 Z M4.00002344,8.10085292 L7.00000586,10.1008412 L7.00000586,13.5656334 L1.40141366,9.83328028 L4.00002344,8.10085292 Z M8,10.1008412 L10.9999824,8.10085292 L13.5985922,9.83328028 L8,13.5656647 L8,10.1008412 L8,10.1008412 Z M11.9013521,7.4999502 L13.9999648,6.10089589 L13.9999648,8.899067 L11.9013521,7.4999502 Z" />
   </svg>
 );

.dumi/theme/common/CodePreview.tsx

@@ -79,6 +79,7 @@ function toReactComponent(jsonML: any[]) {
         const attr = JsonML.getAttributes(node);
         return (
           <pre key={index} className={`language-${attr.lang}`}>
+            {/* biome-ignore lint/security/noDangerouslySetInnerHtml: it's for markdown */}
             <code dangerouslySetInnerHTML={{ __html: attr.highlighted }} />
           </pre>
         );

.dumi/theme/common/CodeSandboxIcon.tsx

@@ -3,6 +3,7 @@ import Icon from '@ant-design/icons';
 
 const SVGIcon: React.FC = () => (
   <svg viewBox="0 0 1024 1024" fill="currentColor">
+    <title>CodeSandbox Icon</title>
     <path d="M755 140.3l0.5-0.3h0.3L512 0 268.3 140h-0.3l0.8 0.4L68.6 256v512L512 1024l443.4-256V256L755 140.3z m-30 506.4v171.2L548 920.1V534.7L883.4 341v215.7l-158.4 90z m-584.4-90.6V340.8L476 534.4v385.7L300 818.5V646.7l-159.4-90.6zM511.7 280l171.1-98.3 166.3 96-336.9 194.5-337-194.6 165.7-95.7L511.7 280z" />
   </svg>
 );

.dumi/theme/common/Color/ColorBlock.tsx

@@ -1,6 +1,6 @@
 import React, { useMemo } from 'react';
-import CopyToClipboard from 'react-copy-to-clipboard';
 import { message } from 'antd';
+import CopyToClipboard from 'react-copy-to-clipboard';
 
 interface ColorBlockProps {
   color: string;

.dumi/theme/common/Color/ColorPaletteToolDark.tsx

@@ -1,8 +1,9 @@
-import { FormattedMessage } from 'dumi';
 import React, { useMemo, useState } from 'react';
 import { Col, ColorPicker, Row } from 'antd';
-import ColorPatterns from './ColorPatterns';
+import { FormattedMessage } from 'dumi';
+
 import useLocale from '../../../hooks/useLocale';
+import ColorPatterns from './ColorPatterns';
 
 const primaryMinSaturation = 70; // 主色推荐最小饱和度
 const primaryMinBrightness = 70; // 主色推荐最小亮度

.dumi/theme/common/Color/ColorPalettes.tsx

@@ -1,5 +1,6 @@
-import classNames from 'classnames';
 import React from 'react';
+import classNames from 'classnames';
+
 import Palette from './Palette';
 
 const colors = [

.dumi/theme/common/Color/ColorPatterns.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { generate } from '@ant-design/colors';
 import uniq from 'lodash/uniq';
+
 import ColorBlock from './ColorBlock';
 
 interface ColorPatternsProps {

.dumi/theme/common/Color/ColorStyle.tsx

@@ -21,7 +21,7 @@ const gray: { [key: number]: string } = {
 const ColorStyle: React.FC = () => {
   const token = useTheme();
 
-  const makePalette = (color: string, index: number = 1): string => {
+  const makePalette = (color: string, index = 1): string => {
     if (index <= 10) {
       return `
 .palette-${color}-${index} {
@@ -33,7 +33,7 @@ ${makePalette(color, index + 1)}
     return '';
   };
 
-  const makeGrayPalette = (index: number = 1): string => {
+  const makeGrayPalette = (index = 1): string => {
     if (index <= 13) {
       return `
 .palette-gray-${index} {

.dumi/theme/common/ComponentChangelog/index.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+
 import type { ComponentChangelogProps } from './ComponentChangelog';
 import ComponentChangelog from './ComponentChangelog';
 

.dumi/theme/common/DirectionIcon.tsx

@@ -15,6 +15,7 @@ const DirectionSvg: React.FC<DirectionIconProps> = ({ direction }) => (
     fill="currentColor"
     style={{ transform: `scaleX(${direction === 'ltr' ? '1' : '-1'})` }}
   >
+    <title>Direction Icon</title>
     <path d="m14.6961816 11.6470802.0841184.0726198 2 2c.2662727.2662727.2904793.682876.0726198.9764816l-.0726198.0841184-2 2c-.2929.2929-.7677.2929-1.0606 0-.2662727-.2662727-.2904793-.682876-.0726198-.9764816l.0726198-.0841184.7196-.7197h-10.6893c-.41421 0-.75-.3358-.75-.75 0-.3796833.28215688-.6934889.64823019-.7431531l.10176981-.0068469h10.6893l-.7196-.7197c-.2929-.2929-.2929-.7677 0-1.0606.2662727-.2662727.682876-.2904793.9764816-.0726198zm-8.1961616-8.6470802c.30667 0 .58246.18671.69635.47146l3.00003 7.50004c.1538.3845-.0333.821-.41784.9749-.38459.1538-.82107-.0333-.9749-.4179l-.81142-2.0285h-2.98445l-.81142 2.0285c-.15383.3846-.59031.5717-.9749.4179-.38458-.1539-.57165-.5904-.41781-.9749l3-7.50004c.1139-.28475.38968-.47146.69636-.47146zm8.1961616 1.14705264.0841184.07261736 2 2c.2662727.26626364.2904793.68293223.0726198.97654222l-.0726198.08411778-2 2c-.2929.29289-.7677.29289-1.0606 0-.2662727-.26626364-.2904793-.68293223-.0726198-.97654222l.0726198-.08411778.7196-.7196675h-3.6893c-.4142 0-.75-.3357925-.75-.7500025 0-.3796925.2821653-.69348832.6482323-.74315087l.1017677-.00684663h3.6893l-.7196-.7196725c-.2929-.29289-.2929-.76777 0-1.06066.2662727-.26626364.682876-.29046942.9764816-.07261736zm-8.1961616 1.62238736-.89223 2.23056h1.78445z" />
   </svg>
 );

.dumi/theme/common/ExternalLinkIcon.tsx

@@ -3,6 +3,7 @@ import Icon from '@ant-design/icons';
 
 const SVGIcon: React.FC<{ color?: string }> = ({ color = 'currentColor' }) => (
   <svg viewBox="0 0 1024 1024" width="1em" height="1em" fill={color}>
+    <title>External Link Icon</title>
     <path d="M853.333 469.333A42.667 42.667 0 0 0 810.667 512v256A42.667 42.667 0 0 1 768 810.667H256A42.667 42.667 0 0 1 213.333 768V256A42.667 42.667 0 0 1 256 213.333h256A42.667 42.667 0 0 0 512 128H256a128 128 0 0 0-128 128v512a128 128 0 0 0 128 128h512a128 128 0 0 0 128-128V512a42.667 42.667 0 0 0-42.667-42.667z" />
     <path d="M682.667 213.333h67.413L481.707 481.28a42.667 42.667 0 0 0 0 60.587 42.667 42.667 0 0 0 60.586 0L810.667 273.92v67.413A42.667 42.667 0 0 0 853.333 384 42.667 42.667 0 0 0 896 341.333V170.667A42.667 42.667 0 0 0 853.333 128H682.667a42.667 42.667 0 0 0 0 85.333z" />
   </svg>

.dumi/theme/common/Link.tsx

@@ -1,6 +1,6 @@
 import type { MouseEvent, MouseEventHandler } from 'react';
 import React, { forwardRef, useLayoutEffect, useTransition } from 'react';
-import { useLocation, useNavigate, Link as DumiLink } from 'dumi';
+import { Link as DumiLink, useLocation, useNavigate } from 'dumi';
 import nprogress from 'nprogress';
 
 export interface LinkProps {

.dumi/theme/common/RiddleIcon.tsx

@@ -3,6 +3,7 @@ import Icon from '@ant-design/icons';
 
 const SVGIcon: React.FC = () => (
   <svg viewBox="0 0 14 14" fill="currentColor">
+    <title>Riddle logo</title>
     <path d="M13.8875145,13.1234844 C13.8687399,13.0691875 13.8499977,13.0329687 13.8312555,12.9786562 L11.3687445,8.83296875 C12.9187468,8.05754687 13.9640694,6.49009375 13.9640694,4.68728125 C13.9624994,2.09095312 11.7968694,0 9.10938728,0 L3.86404855,0 C3.04217572,0 2.37028902,0.648703125 2.37028902,1.44223437 L2.37028902,1.82090625 L0.746871676,1.82090625 C0.33593526,1.82090625 0,2.14526562 0,2.54203125 L0,13.4478437 C0,13.7540937 0.242191908,13.9879375 0.559368786,13.9879375 C0.615627746,13.9879375 0.67187052,13.9698281 0.72812948,13.9517187 L13.440615,13.9517187 C13.7578081,13.9517187 14,13.7178906 14,13.4116406 C14,13.321125 13.9624994,13.2125 13.8875145,13.1234844 Z M3.49061272,8.0394375 L3.49061272,2.9206875 L8.71719306,2.9206875 C9.74375723,2.9206875 10.5843723,3.73232812 10.5843723,4.7235 C10.5843723,5.71465625 9.76249942,6.5081875 8.71719306,6.5081875 L6.53280462,6.5081875 L6.53280462,6.52629688 C6.45781965,6.52629688 6.3828185,6.5625 6.3093711,6.59870313 C6.04843699,6.74354688 5.95469364,7.08598438 6.10467977,7.33792188 L8.3078104,11.0325469 L3.4906289,11.0325469 L3.4906289,8.0394375 L3.49061272,8.0394375 Z M1.1203237,12.8881406 L1.1203237,2.9206875 L2.3703052,2.9206875 L2.3703052,11.5545313 C2.3703052,11.8607813 2.61249711,12.0946094 2.92969017,12.0946094 L2.94843237,12.0946094 C2.98593295,12.1127188 3.04219191,12.1127188 3.09843468,12.1127188 L9.16563006,12.1127188 C9.48280694,12.1127188 9.72499884,11.878875 9.72499884,11.572625 L9.72499884,11.5364219 C9.76249942,11.3915938 9.74375723,11.2482813 9.66875607,11.1215469 L7.5593526,7.58835938 L8.6984185,7.58835938 C10.3406104,7.58835938 11.6843514,6.29095313 11.6843514,4.703875 C11.6843514,3.1168125 10.3406104,1.81939063 8.6984185,1.81939063 L3.4906289,1.81939063 L3.4906289,1.44073437 C3.4906289,1.24310937 3.65937341,1.08017187 3.86406474,1.08017187 L9.09061272,1.08017187 C11.143741,1.08017187 12.8234173,2.7019375 12.8234173,4.68578125 C12.8234173,6.21853125 11.8343538,7.5340625 10.4343538,8.05603125 C10.378111,8.07414063 10.3406104,8.09223438 10.2843514,8.11034375 C10.0234173,8.25517188 9.92967399,8.597625 10.0796763,8.8495625 L12.5062405,12.8881563 L1.12030751,12.8881563 L1.1203237,12.8881406 Z" />
   </svg>
 );

.dumi/theme/common/ThemeSwitch/ThemeIcon.tsx

@@ -5,6 +5,7 @@ const ThemeIcon: React.FC<{ className?: string }> = (props) => {
   const SVGIcon = React.useCallback(
     () => (
       <svg width={20} height={20} viewBox="0 0 24 24" fill="currentColor" {...props}>
+        <title>Theme icon</title>
         <g fillRule="evenodd">
           <g fillRule="nonzero">
             <path d="M7.02 3.635l12.518 12.518a1.863 1.863 0 010 2.635l-1.317 1.318a1.863 1.863 0 01-2.635 0L3.068 7.588A2.795 2.795 0 117.02 3.635zm2.09 14.428a.932.932 0 110 1.864.932.932 0 010-1.864zm-.043-9.747L7.75 9.635l9.154 9.153 1.318-1.317-9.154-9.155zM3.52 12.473c.514 0 .931.417.931.931v.932h.932a.932.932 0 110 1.864h-.932v.931a.932.932 0 01-1.863 0l-.001-.931h-.93a.932.932 0 010-1.864h.93v-.932c0-.514.418-.931.933-.931zm15.374-3.727a1.398 1.398 0 110 2.795 1.398 1.398 0 010-2.795zM4.385 4.953a.932.932 0 000 1.317l2.046 2.047L7.75 7 5.703 4.953a.932.932 0 00-1.318 0zM14.701.36a.932.932 0 01.931.932v.931h.932a.932.932 0 010 1.864h-.933l.001.932a.932.932 0 11-1.863 0l-.001-.932h-.93a.932.932 0 110-1.864h.93v-.931a.932.932 0 01.933-.932z" />

.dumi/theme/common/styles/Reset.tsx

@@ -1,5 +1,5 @@
-import { css, Global } from '@emotion/react';
 import React from 'react';
+import { css, Global } from '@emotion/react';
 import { useTheme } from 'antd-style';
 
 export default () => {
@@ -11,7 +11,8 @@ export default () => {
         @font-face {
           font-weight: normal;
           font-family: AlibabaPuHuiTi;
-          src: url('//at.alicdn.com/t/webfont_6e11e43nfj.woff2') format('woff2'),
+          src:
+            url('//at.alicdn.com/t/webfont_6e11e43nfj.woff2') format('woff2'),
             url('//at.alicdn.com/t/webfont_6e11e43nfj.woff') format('woff'),
             /* chrome、firefox */ url('//at.alicdn.com/t/webfont_6e11e43nfj.ttf') format('truetype'); /* chrome、firefox、opera、Safari, Android, iOS 4.2+ */
           font-display: swap;
@@ -20,7 +21,8 @@ export default () => {
         @font-face {
           font-weight: bold;
           font-family: AlibabaPuHuiTi;
-          src: url('//at.alicdn.com/t/webfont_exesdog9toj.woff2') format('woff2'),
+          src:
+            url('//at.alicdn.com/t/webfont_exesdog9toj.woff2') format('woff2'),
             url('//at.alicdn.com/t/webfont_exesdog9toj.woff') format('woff'),
             /* chrome、firefox */ url('//at.alicdn.com/t/webfont_exesdog9toj.ttf')
               format('truetype'); /* chrome、firefox、opera、Safari, Android, iOS 4.2+ */
@@ -32,7 +34,8 @@ export default () => {
         @font-face {
           font-weight: 900;
           font-family: 'AliPuHui';
-          src: url('//at.alicdn.com/wf/webfont/exMpJIukiCms/Gsw2PSKrftc1yNWMNlXgw.woff2')
+          src:
+            url('//at.alicdn.com/wf/webfont/exMpJIukiCms/Gsw2PSKrftc1yNWMNlXgw.woff2')
               format('woff2'),
             url('//at.alicdn.com/wf/webfont/exMpJIukiCms/vtu73by4O2gEBcvBuLgeu.woff') format('woff');
           font-display: swap;

.dumi/theme/layouts/GlobalLayout.tsx

@@ -153,6 +153,7 @@ const GlobalLayout: React.FC = () => {
       plain: true,
       types: 'style',
     });
+    // biome-ignore lint/security/noDangerouslySetInnerHtml: only used in .dumi
     return <style data-type="antd-cssinjs" dangerouslySetInnerHTML={{ __html: styleText }} />;
   });
 
@@ -166,6 +167,7 @@ const GlobalLayout: React.FC = () => {
         data-type="antd-css-var"
         data-rc-order="prepend"
         data-rc-priority="-9999"
+        // biome-ignore lint/security/noDangerouslySetInnerHtml: only used in .dumi
         dangerouslySetInnerHTML={{ __html: styleText }}
       />
     );
@@ -175,6 +177,7 @@ const GlobalLayout: React.FC = () => {
     <style
       data-sandpack="true"
       id="sandpack"
+      // biome-ignore lint/security/noDangerouslySetInnerHtml: only used in .dumi
       dangerouslySetInnerHTML={{ __html: getSandpackCssText() }}
     />
   ));

.dumi/theme/layouts/ResourceLayout/index.tsx

@@ -10,7 +10,7 @@ import EditButton from '../../common/EditButton';
 import Footer from '../../slots/Footer';
 import AffixTabs from './AffixTabs';
 
-export type ResourceLayoutProps = PropsWithChildren<{}>;
+export type ResourceLayoutProps = PropsWithChildren<NonNullable<any>>;
 
 const resourcePadding = 40;
 const articleMaxWidth = 1208;

.dumi/theme/slots/Content/JuejinLogo.tsx

@@ -17,6 +17,7 @@ const JuejinLogo: React.FC<Props> = (props) => {
       viewBox="0 0 36 28"
       fill="none"
     >
+      <title>Juejin logo</title>
       <path
         fillRule="evenodd"
         clipRule="evenodd"

.dumi/theme/slots/Content/index.tsx

@@ -1,5 +1,5 @@
 import React, { useContext, useLayoutEffect, useMemo, useState } from 'react';
-import { Space, Col, Flex, Typography } from 'antd';
+import { Col, Flex, Space, Typography } from 'antd';
 import { createStyles } from 'antd-style';
 import classNames from 'classnames';
 import { FormattedMessage, useRouteMeta } from 'dumi';

.dumi/theme/slots/Header/Logo.tsx

@@ -2,8 +2,8 @@ import * as React from 'react';
 import { createStyles } from 'antd-style';
 import { useLocation } from 'dumi';
 
-import * as utils from '../../utils';
 import Link from '../../common/Link';
+import * as utils from '../../utils';
 
 const useStyle = createStyles(({ token, css }) => {
   const { headerHeight, colorTextHeading, fontFamily, mobileMaxWidth } = token;

.dumi/theme/slots/Header/SwitchBtn.tsx

@@ -11,7 +11,7 @@ export interface LangBtnProps {
   value: 1 | 2;
   pure?: boolean;
   onClick?: React.MouseEventHandler;
-  ['aria-label']?: string;
+  'aria-label'?: string;
 }
 
 const BASE_SIZE = '1.2em';
@@ -95,7 +95,13 @@ const LangBtn: React.FC<LangBtnProps> = (props) => {
   } = useStyle();
 
   const node = (
-    <button onClick={onClick} className={btn} key="lang-button" aria-label={props['aria-label']}>
+    <button
+      type="button"
+      onClick={onClick}
+      className={btn}
+      key="lang-button"
+      aria-label={props['aria-label']}
+    >
       <div className="btn-inner">
         {pure && (value === 1 ? label1 : label2)}
         {!pure && (

.dumi/theme/slots/SiteContext.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import type { DirectionType } from 'antd/es/config-provider';
+
 import type { ThemeName } from '../common/ThemeSwitch';
 
 export interface SiteContextProps {

.dumirc.ts

@@ -11,7 +11,7 @@ export default defineConfig({
   manifest: {},
   conventionRoutes: {
     // to avoid generate routes for .dumi/pages/index/components/xx
-    exclude: [new RegExp('index/components/')],
+    exclude: [/index\/components\//],
   },
   ssr: process.env.NODE_ENV === 'production' ? {} : false,
   hash: true,

.lintstagedrc.json

@@ -0,0 +1,4 @@
+{
+  "*.{ts,tsx,js,jsx,json,css}": ["biome check --write"],
+  "*.{md,yml}": ["prettier --ignore-unknown --write"]
+}

.prettierignore

@@ -5,13 +5,13 @@ CODEOWNERS
 Dockerfile.ui-test
 .dumi/tmp
 .dumi/tmp-production
+!dumi
 AUTHORS.txt
 lib/
 es/
 dist/
 _site/
 server
-.dumi/tmp
 coverage/
 CNAME
 LICENSE

.stylelintrc.js

@@ -1,42 +0,0 @@
-module.exports = {
-  extends: [
-    'stylelint-config-standard',
-    'stylelint-prettier/recommended',
-    'stylelint-config-rational-order',
-  ],
-  // 使用 stylelint 来 lint css in js? https://github.com/emotion-js/emotion/discussions/2694
-  rules: {
-    'function-name-case': ['lower'],
-    'function-no-unknown': [
-      true,
-      {
-        ignoreFunctions: [
-          'fade',
-          'fadeout',
-          'tint',
-          'darken',
-          'ceil',
-          'fadein',
-          'floor',
-          'unit',
-          'shade',
-          'lighten',
-          'percentage',
-          '-',
-        ],
-      },
-    ],
-    'import-notation': null,
-    'no-descending-specificity': null,
-    'no-invalid-position-at-import-rule': null,
-    'declaration-empty-line-before': null,
-    'keyframes-name-pattern': null,
-    'custom-property-pattern': null,
-    'number-max-precision': 8,
-    'alpha-value-notation': 'number',
-    'color-function-notation': 'legacy',
-    'selector-class-pattern': null,
-    'selector-id-pattern': null,
-    'selector-not-notation': null,
-  },
-};

README.md

@@ -6,20 +6,11 @@
 
 An enterprise-class UI design language and React UI library.
 
-[![CI status][github-action-image]][github-action-url]
+[![CI status][github-action-image]][github-action-url] [![codecov][codecov-image]][codecov-url] [![NPM version][npm-image]][npm-url] [![NPM downloads][download-image]][download-url]
-[![codecov][codecov-image]][codecov-url]
-[![NPM version][npm-image]][npm-url]
-[![NPM downloads][download-image]][download-url]
 
-[![][bundlephobia-image]][bundlephobia-url]
+[![][bundlephobia-image]][bundlephobia-url] [![][bundlesize-js-image]][unpkg-js-url] [![FOSSA Status][fossa-image]][fossa-url]
-[![][bundlesize-js-image]][unpkg-js-url]
-[![FOSSA Status][fossa-image]][fossa-url]
 
-[![Follow Twitter][twitter-image]][twitter-url]
+[![Follow Twitter][twitter-image]][twitter-url] [![Renovate status][renovate-image]][renovate-dashboard-url] [![][issues-helper-image]][issues-helper-url] [![dumi][dumi-image]][dumi-url] [![Issues need help][help-wanted-image]][help-wanted-url]
-[![Renovate status][renovate-image]][renovate-dashboard-url]
-[![][issues-helper-image]][issues-helper-url]
-[![dumi][dumi-image]][dumi-url]
-[![Issues need help][help-wanted-image]][help-wanted-url]
 
 [Changelog](./CHANGELOG.en-US.md) · [Report Bug][github-issues-url] · [Request Feature][github-issues-url] · English · [中文](./README-zh_CN.md)
 
@@ -50,6 +41,7 @@ An enterprise-class UI design language and React UI library.
 [dumi-image]: https://img.shields.io/badge/docs%20by-dumi-blue?style=flat-square
 [dumi-url]: https://github.com/umijs/dumi
 [github-issues-url]: https://new-issue.ant.design
+
 </div>
 
 [![](https://user-images.githubusercontent.com/507615/209472919-6f7e8561-be8c-4b0b-9976-eb3c692aa20a.png)](https://ant.design)

biome.json

@@ -1,8 +1,19 @@
 {
-  "$schema": "https://biomejs.dev/schemas/1.0.0/schema.json",
+  "files": {
+    "ignore": [
+      ".dumi/tmp*",
+      ".dumi/scripts/clarity.js",
+      "dist/*",
+      "es/**/*",
+      "lib/**/*",
+      "_site/**/*",
+      "node_modules",
+      "server",
+      "scripts/previewEditor/**/*"
+    ]
+  },
   "formatter": {
     "enabled": true,
-    "ignore": ["./dist/*", "./es/**/*", "./lib/**/*", "_site/**/*"],
     "indentStyle": "space",
     "lineWidth": 100,
     "indentWidth": 2
@@ -11,5 +22,80 @@
     "formatter": {
       "quoteStyle": "single"
     }
-  }
+  },
+  "organizeImports": {
+    "enabled": false
+  },
+  "linter": {
+    "rules": {
+      "style": {
+        "useImportType": "off",
+        "useNumberNamespace": "off",
+        "useNodejsImportProtocol": "off",
+        "noNonNullAssertion": "off",
+        "noUnusedTemplateLiteral": "off"
+      },
+      "complexity": {
+        "noUselessTypeConstraint": "off",
+        "noForEach": "off"
+      },
+      "correctness": {
+        "useExhaustiveDependencies": "off"
+      },
+      "suspicious": {
+        "noGlobalIsNan": "off",
+        "noGlobalIsFinite": "off",
+        "noExplicitAny": "off",
+        "noArrayIndexKey": "off",
+        "noConfusingVoidType": "off",
+        "noThenProperty": "off"
+      },
+      "performance": {
+        "noDelete": "off",
+        "noAccumulatingSpread": "off"
+      },
+      "a11y": {
+        "useKeyWithClickEvents": "off"
+      }
+    }
+  },
+  "overrides": [
+    {
+      "include": ["**/*.test.ts", "**/*.test.tsx", "tests/**/*", "scripts/**/*", ".dumi/**/*"],
+      "linter": {
+        "rules": {
+          "style": {
+            "noParameterAssign": "off"
+          },
+          "suspicious": {
+            "noThenProperty": "off",
+            "noImplicitAnyLet": "off"
+          },
+          "complexity": {
+            "noUselessFragments": "off"
+          },
+          "a11y": {
+            "useValidAnchor": "off",
+            "useAnchorContent": "off",
+            "useKeyWithClickEvents": "off"
+          }
+        }
+      }
+    },
+    {
+      "include": ["components/*/demo/*"],
+      "linter": {
+        "rules": {
+          "correctness": {
+            "noVoidTypeReturn": "off"
+          },
+          "a11y": {
+            "useValidAnchor": "off",
+            "useAnchorContent": "off",
+            "useKeyWithClickEvents": "off"
+          }
+        }
+      }
+    }
+  ]
 }

components/_util/ActionButton.tsx

@@ -8,7 +8,7 @@ import { convertLegacyProps } from '../button/buttonHelpers';
 export interface ActionButtonProps {
   type?: LegacyButtonType;
   actionFn?: (...args: any[]) => any | PromiseLike<any>;
-  close?: Function;
+  close?: (...args: any[]) => void;
   autoFocus?: boolean;
   prefixCls: string;
   buttonProps?: ButtonProps;
@@ -22,8 +22,8 @@ export interface ActionButtonProps {
   isSilent?: () => boolean;
 }
 
-function isThenable<T extends any>(thing?: PromiseLike<T>): boolean {
+function isThenable<T>(thing?: PromiseLike<T>): boolean {
-  return !!(thing && thing.then);
+  return !!thing?.then;
 }
 
 const ActionButton: React.FC<ActionButtonProps> = (props) => {

components/_util/ContextIsolator.tsx

@@ -4,23 +4,21 @@ import { NoFormStyle } from '../form/context';
 import { NoCompactStyle } from '../space/Compact';
 
 const ContextIsolator: React.FC<
-  Readonly<
+  Readonly<React.PropsWithChildren<Partial<Record<'space' | 'form', boolean>>>>
-    React.PropsWithChildren<Partial<Record<'isolateSpaceContext' | 'isolateFormContext', boolean>>>
-  >
 > = (props) => {
-  const { isolateSpaceContext, isolateFormContext, children } = props;
+  const { space, form, children } = props;
   if (children === undefined || children === null) {
     return null;
   }
   let result: React.ReactNode = children;
-  if (isolateFormContext) {
+  if (form) {
     result = (
       <NoFormStyle override status>
         {result}
       </NoFormStyle>
     );
   }
-  if (isolateSpaceContext) {
+  if (space) {
     result = <NoCompactStyle>{result}</NoCompactStyle>;
   }
   return result;

components/_util/easings.ts

@@ -1,10 +1,11 @@
-// eslint-disable-next-line import/prefer-default-export
+/* eslint-disable */
 export function easeInOutCubic(t: number, b: number, c: number, d: number) {
   const cc = c - b;
+  // biome-ignore lint: it is a common easing function
   t /= d / 2;
   if (t < 1) {
     return (cc / 2) * t * t * t + b;
   }
-  // eslint-disable-next-line no-return-assign
+  // biome-ignore lint: it is a common easing function
   return (cc / 2) * ((t -= 2) * t * t + 2) + b;
 }

components/_util/getScroll.ts

@@ -19,7 +19,7 @@ const getScroll = (target: HTMLElement | Window | Document | null): number => {
     //    `{ documentElement: { scrollLeft: 200, scrollTop: 400 } }`,
     //    the program may falls into this branch.
     // Check the corresponding tests for details. Don't sure what is the real scenario this happens.
-    // eslint-disable-next-line dot-notation
+    /* biome-ignore lint/complexity/useLiteralKeys: target is a never type */ /* eslint-disable-next-line dot-notation */
     result = target['scrollTop'];
   }
 

components/_util/hooks/usePatchElement.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 
 export default function usePatchElement(): [
   React.ReactElement[],
-  (element: React.ReactElement) => Function,
+  (element: React.ReactElement) => () => void,
 ] {
   const [elements, setElements] = React.useState<React.ReactElement[]>([]);
 

components/_util/motion.ts

@@ -11,7 +11,7 @@ const getCurrentHeight: MotionEventHandler = (node) => ({ height: node ? node.of
 const skipOpacityTransition: MotionEndEventHandler = (_, event: MotionEvent) =>
   event?.deadline === true || (event as TransitionEvent).propertyName === 'height';
 
-const initCollapseMotion = (rootCls: string = 'ant'): CSSMotionProps => ({
+const initCollapseMotion = (rootCls = 'ant'): CSSMotionProps => ({
   motionName: `${rootCls}-motion-collapse`,
   onAppearStart: getCollapsedHeight,
   onEnterStart: getCollapsedHeight,

components/_util/reactNode.ts

@@ -6,7 +6,7 @@ export function isFragment(child: any): boolean {
   return child && React.isValidElement(child) && child.type === React.Fragment;
 }
 
-type RenderProps = AnyObject | ((originProps: AnyObject) => AnyObject | void);
+type RenderProps = AnyObject | ((originProps: AnyObject) => AnyObject | undefined);
 
 export const replaceElement = <P>(
   element: React.ReactNode,

components/_util/responsiveObserver.ts

@@ -67,7 +67,7 @@ export default function useResponsiveObserver() {
 
   // To avoid repeat create instance, we add `useMemo` here.
   return React.useMemo(() => {
-    const subscribers = new Map<Number, SubscribeFunc>();
+    const subscribers = new Map<number, SubscribeFunc>();
     let subUid = -1;
     let screens = {};
 

components/_util/wave/style.ts

@@ -1,6 +1,7 @@
 import { genComponentStyleHook } from '../../theme/internal';
 import type { FullToken, GenerateStyle } from '../../theme/internal';
 
+// biome-ignore lint/suspicious/noEmptyInterface: ComponentToken need to be empty by default
 export interface ComponentToken {}
 
 export interface WaveToken extends FullToken<'Wave'> {}

components/_util/wave/util.ts

@@ -1,6 +1,7 @@
 export function isNotGrey(color: string) {
   // eslint-disable-next-line no-useless-escape
   const match = (color || '').match(/rgba?\((\d*), (\d*), (\d*)(, [\d.]*)?\)/);
+  // biome-ignore lint/complexity/useOptionalChain: this is way is more simple
   if (match && match[1] && match[2] && match[3]) {
     return !(match[1] === match[2] && match[2] === match[3]);
   }

components/alert/Alert.tsx

@@ -7,8 +7,8 @@ import ExclamationCircleFilled from '@ant-design/icons/ExclamationCircleFilled';
 import InfoCircleFilled from '@ant-design/icons/InfoCircleFilled';
 import classNames from 'classnames';
 import CSSMotion from 'rc-motion';
-import { composeRef } from 'rc-util/lib/ref';
 import pickAttrs from 'rc-util/lib/pickAttrs';
+import { composeRef } from 'rc-util/lib/ref';
 
 import type { ClosableType } from '../_util/hooks/useClosable';
 import { replaceElement } from '../_util/reactNode';

components/alert/ErrorBoundary.tsx

@@ -31,7 +31,7 @@ class ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundarySta
   render() {
     const { message, description, id, children } = this.props;
     const { error, info } = this.state;
-    const componentStack = info && info.componentStack ? info.componentStack : null;
+    const componentStack = info?.componentStack || null;
     const errorMessage = typeof message === 'undefined' ? (error || '').toString() : message;
     const errorDescription = typeof description === 'undefined' ? componentStack : description;
     if (error) {

components/alert/style/index.ts

@@ -85,7 +85,7 @@ export const genBaseStyle: GenerateStyle<AlertToken> = (token: AlertToken): CSSO
         lineHeight: 0,
       },
 
-      [`&-description`]: {
+      '&-description': {
         display: 'none',
         fontSize,
         lineHeight,
@@ -204,7 +204,7 @@ export const genActionStyle: GenerateStyle<AlertToken> = (token: AlertToken): CS
 
   return {
     [componentCls]: {
-      [`&-action`]: {
+      '&-action': {
         marginInlineStart: marginXS,
       },
 

components/anchor/Anchor.tsx

@@ -35,8 +35,7 @@ function getOffsetTop(element: HTMLElement, container: AnchorContainer): number
 
   if (rect.width || rect.height) {
     if (container === window) {
-      container = element.ownerDocument!.documentElement!;
+      return rect.top - element.ownerDocument!.documentElement!.clientTop;
-      return rect.top - container.clientTop;
     }
     return rect.top - (container as HTMLElement).getBoundingClientRect().top;
   }

components/app/__tests__/index.test.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect } from 'react';
 import { SmileOutlined } from '@ant-design/icons';
-import type { NotificationConfig } from 'antd/es/notification/interface';
 import ConfigProvider from 'antd/es/config-provider';
+import type { NotificationConfig } from 'antd/es/notification/interface';
 
 import App from '..';
 import mountTest from '../../../tests/shared/mountTest';

components/app/style/index.ts

@@ -1,7 +1,8 @@
 import type { FullToken, GenerateStyle, GetDefaultToken } from '../../theme/internal';
 import { genStyleHooks } from '../../theme/internal';
 
-export type ComponentToken = {};
+// biome-ignore lint/suspicious/noEmptyInterface: ComponentToken need to be empty by default
+export interface ComponentToken {}
 
 interface AppToken extends FullToken<'App'> {}
 

components/auto-complete/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -757,6 +757,9 @@ exports[`renders components/auto-complete/demo/form-debug.tsx extend context cor
                           width="64"
                           xmlns="http://www.w3.org/2000/svg"
                         >
+                          <title>
+                            Simple Empty
+                          </title>
                           <g
                             fill="none"
                             fill-rule="evenodd"
@@ -905,6 +908,9 @@ exports[`renders components/auto-complete/demo/form-debug.tsx extend context cor
                             width="64"
                             xmlns="http://www.w3.org/2000/svg"
                           >
+                            <title>
+                              Simple Empty
+                            </title>
                             <g
                               fill="none"
                               fill-rule="evenodd"
@@ -1191,6 +1197,9 @@ exports[`renders components/auto-complete/demo/form-debug.tsx extend context cor
                             width="64"
                             xmlns="http://www.w3.org/2000/svg"
                           >
+                            <title>
+                              Simple Empty
+                            </title>
                             <g
                               fill="none"
                               fill-rule="evenodd"
@@ -1407,6 +1416,9 @@ exports[`renders components/auto-complete/demo/form-debug.tsx extend context cor
                             width="64"
                             xmlns="http://www.w3.org/2000/svg"
                           >
+                            <title>
+                              Simple Empty
+                            </title>
                             <g
                               fill="none"
                               fill-rule="evenodd"
@@ -1636,6 +1648,9 @@ exports[`renders components/auto-complete/demo/form-debug.tsx extend context cor
                             width="64"
                             xmlns="http://www.w3.org/2000/svg"
                           >
+                            <title>
+                              Simple Empty
+                            </title>
                             <g
                               fill="none"
                               fill-rule="evenodd"

components/auto-complete/index.tsx

@@ -45,8 +45,8 @@ export interface AutoCompleteProps<
   popupMatchSelectWidth?: boolean | number;
 }
 
-function isSelectOptionOrSelectOptGroup(child: any): Boolean {
+function isSelectOptionOrSelectOptGroup(child: any): boolean {
-  return child && child.type && (child.type.isSelectOption || child.type.isSelectOptGroup);
+  return child?.type && (child.type.isSelectOption || child.type.isSelectOptGroup);
 }
 
 const AutoComplete: React.ForwardRefRenderFunction<RefSelectProps, AutoCompleteProps> = (

components/avatar/style/index.ts

@@ -112,7 +112,7 @@ const genBaseStyle: GenerateStyle<AvatarToken> = (token) => {
       background: avatarBg,
       border: `${unit(lineWidth)} ${lineType} transparent`,
 
-      [`&-image`]: {
+      '&-image': {
         background: 'transparent',
       },
 
@@ -122,11 +122,11 @@ const genBaseStyle: GenerateStyle<AvatarToken> = (token) => {
 
       ...avatarSizeStyle(containerSize, textFontSize, borderRadius),
 
-      [`&-lg`]: {
+      '&-lg': {
         ...avatarSizeStyle(containerSizeLG, textFontSizeLG, borderRadiusLG),
       },
 
-      [`&-sm`]: {
+      '&-sm': {
         ...avatarSizeStyle(containerSizeSM, textFontSizeSM, borderRadiusSM),
       },
 
@@ -151,7 +151,7 @@ const genGroupStyle: GenerateStyle<AvatarToken> = (token) => {
         borderColor: groupBorderColor,
       },
 
-      [`> *:not(:first-child)`]: {
+      '> *:not(:first-child)': {
         marginInlineStart: groupOverlapping,
       },
     },

components/back-top/index.tsx

@@ -40,7 +40,7 @@ const BackTop: React.FC<BackTopProps> = (props) => {
   const ref = React.useRef<HTMLDivElement>(null);
 
   const getDefaultTarget = (): HTMLElement | Document | Window =>
-    ref.current && ref.current.ownerDocument ? ref.current.ownerDocument : window;
+    ref.current?.ownerDocument || window;
 
   const handleScroll = throttleByAnimationFrame(
     (e: React.UIEvent<HTMLElement, UIEvent> | { target: any }) => {

components/badge/ScrollNumber.tsx

@@ -70,7 +70,7 @@ const ScrollNumber = React.forwardRef<HTMLElement, ScrollNumberProps>((props, re
   // allow specify the border
   // mock border-color by box-shadow for compatible with old usage:
   // <Badge count={4} style={{ backgroundColor: '#fff', color: '#999', borderColor: '#d9d9d9' }} />
-  if (style && style.borderColor) {
+  if (style?.borderColor) {
     newProps.style = {
       ...style,
       boxShadow: `0 0 0 1px ${style.borderColor} inset`,

components/breadcrumb/style/index.ts

@@ -83,7 +83,7 @@ const genBreadcrumbStyle: GenerateStyle<BreadcrumbToken, CSSObject> = (token) =>
         ...genFocusStyle(token),
       },
 
-      [`li:last-child`]: {
+      'li:last-child': {
         color: token.lastItemColor,
       },
 

components/button/__tests__/index.test.tsx

@@ -401,9 +401,11 @@ describe('Button', () => {
           promiseCache.resolve = resolve;
         });
         throw promiseCache.promise;
-      } else if (freeze) {
+      }
+      if (freeze) {
         throw promiseCache.promise;
-      } else if (promiseCache.promise) {
+      }
+      if (promiseCache.promise) {
         promiseCache.resolve?.();
         promiseCache.promise = undefined;
       }

components/button/button-group.tsx

@@ -33,7 +33,6 @@ const ButtonGroup: React.FC<ButtonGroupProps> = (props) => {
     case 'small':
       sizeCls = 'sm';
       break;
-    case 'middle':
     default:
     // Do nothing
   }

components/button/buttonHelpers.tsx

@@ -53,7 +53,7 @@ function splitCNCharsBySpace(child: React.ReactElement | string | number, needIn
 }
 
 export function spaceChildren(children: React.ReactNode, needInserted: boolean) {
-  let isPrevChildPure: boolean = false;
+  let isPrevChildPure = false;
   const childList: React.ReactNode[] = [];
 
   React.Children.forEach(children, (child) => {

components/button/style/group.ts

@@ -54,9 +54,7 @@ const genGroupStyle: GenerateStyle<ButtonToken> = (token) => {
           position: 'relative',
           zIndex: 1,
 
-          [`&:hover,
+          '&:hover, &:focus, &:active': {
-          &:focus,
-          &:active`]: {
             zIndex: 2,
           },
 

components/button/style/index.ts

@@ -386,7 +386,7 @@ const genTypeButtonStyle: GenerateStyle<ButtonToken> = (token) => {
 };
 
 // =============================== Size ===============================
-const genButtonStyle = (token: ButtonToken, prefixCls: string = ''): CSSInterpolation => {
+const genButtonStyle = (token: ButtonToken, prefixCls = ''): CSSInterpolation => {
   const {
     componentCls,
     controlHeight,

components/calendar/demo/lunar.tsx

@@ -85,7 +85,7 @@ const useStyle = createStyles(({ token, css, cx }) => {
     weekend: css`
       color: ${token.colorError};
       &.gray {
-        opacity: .4
+        opacity: 0.4;
       }
     `,
   };

components/calendar/demo/notice-calendar.tsx

@@ -4,7 +4,7 @@ import { Badge, Calendar } from 'antd';
 import type { Dayjs } from 'dayjs';
 
 const getListData = (value: Dayjs) => {
-  let listData;
+  let listData: { type: string; content: string }[] = []; // Specify the type of listData
   switch (value.date()) {
     case 8:
       listData = [

components/calendar/generateCalendar.tsx

@@ -182,7 +182,7 @@ function generateCalendar<DateType extends AnyObject>(generateConfig: GenerateCo
       };
       result.lang = {
         ...result.lang,
-        ...(locale || {}).lang,
+        ...locale?.lang,
       };
       return result;
     };
@@ -207,7 +207,7 @@ function generateCalendar<DateType extends AnyObject>(generateConfig: GenerateCo
               {String(generateConfig.getDate(date)).padStart(2, '0')}
             </div>
             <div className={`${calendarPrefixCls}-date-content`}>
-              {cellRender ? cellRender(date, info) : dateCellRender && dateCellRender(date)}
+              {cellRender ? cellRender(date, info) : dateCellRender?.(date)}
             </div>
           </div>
         );
@@ -237,7 +237,7 @@ function generateCalendar<DateType extends AnyObject>(generateConfig: GenerateCo
               {months[generateConfig.getMonth(date)]}
             </div>
             <div className={`${calendarPrefixCls}-date-content`}>
-              {cellRender ? cellRender(date, info) : monthCellRender && monthCellRender(date)}
+              {cellRender ? cellRender(date, info) : monthCellRender?.(date)}
             </div>
           </div>
         );

components/card/Card.tsx

@@ -148,7 +148,7 @@ const Card = React.forwardRef<HTMLDivElement, CardProps>((props, ref) => {
   const isContainGrid = React.useMemo<boolean>(() => {
     let containGrid = false;
     React.Children.forEach(children as React.ReactElement, (element: JSX.Element) => {
-      if (element && element.type && element.type === Grid) {
+      if (element?.type === Grid) {
         containGrid = true;
       }
     });
@@ -229,14 +229,13 @@ const Card = React.forwardRef<HTMLDivElement, CardProps>((props, ref) => {
   );
 
   const actionClasses = classNames(`${prefixCls}-actions`, moduleClass('actions'));
-  const actionDom =
+  const actionDom = actions?.length ? (
-    actions && actions.length ? (
+    <ActionNode
-      <ActionNode
+      actionClasses={actionClasses}
-        actionClasses={actionClasses}
+      actionStyle={moduleStyle('actions')}
-        actionStyle={moduleStyle('actions')}
+      actions={actions}
-        actions={actions}
+    />
-      />
+  ) : null;
-    ) : null;
 
   const divProps = omit(others, ['onTabChange']);
 
@@ -248,7 +247,7 @@ const Card = React.forwardRef<HTMLDivElement, CardProps>((props, ref) => {
       [`${prefixCls}-bordered`]: bordered,
       [`${prefixCls}-hoverable`]: hoverable,
       [`${prefixCls}-contain-grid`]: isContainGrid,
-      [`${prefixCls}-contain-tabs`]: tabList && tabList.length,
+      [`${prefixCls}-contain-tabs`]: tabList?.length,
       [`${prefixCls}-${mergedSize}`]: mergedSize,
       [`${prefixCls}-type-${type}`]: !!type,
       [`${prefixCls}-rtl`]: direction === 'rtl',

components/carousel/style/index.ts

@@ -152,7 +152,7 @@ const genCarouselStyle: GenerateStyle<CarouselToken> = (token) => {
 
 const genArrowsStyle: GenerateStyle<CarouselToken> = (token) => {
   const { componentCls, motionDurationSlow, arrowSize, arrowOffset } = token;
-  const arrowLength = token.calc(arrowSize).div(1.414).equal();
+  const arrowLength = token.calc(arrowSize).div(Math.SQRT2).equal();
 
   return [
     {

components/cascader/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1922,6 +1922,9 @@ exports[`renders components/cascader/demo/panel.tsx extend context correctly 1`]
           width="64"
           xmlns="http://www.w3.org/2000/svg"
         >
+          <title>
+            Simple Empty
+          </title>
           <g
             fill="none"
             fill-rule="evenodd"
@@ -3471,6 +3474,9 @@ exports[`renders components/cascader/demo/status.tsx extend context correctly 1`
                         width="64"
                         xmlns="http://www.w3.org/2000/svg"
                       >
+                        <title>
+                          Simple Empty
+                        </title>
                         <g
                           fill="none"
                           fill-rule="evenodd"
@@ -3621,6 +3627,9 @@ exports[`renders components/cascader/demo/status.tsx extend context correctly 1`
                         width="64"
                         xmlns="http://www.w3.org/2000/svg"
                       >
+                        <title>
+                          Simple Empty
+                        </title>
                         <g
                           fill="none"
                           fill-rule="evenodd"

components/cascader/__tests__/__snapshots__/demo.test.tsx.snap

@@ -903,6 +903,9 @@ exports[`renders components/cascader/demo/panel.tsx correctly 1`] = `
           width="64"
           xmlns="http://www.w3.org/2000/svg"
         >
+          <title>
+            Simple Empty
+          </title>
           <g
             fill="none"
             fill-rule="evenodd"

components/cascader/__tests__/__snapshots__/index.test.tsx.snap

@@ -1703,6 +1703,9 @@ exports[`Cascader should render not found content 1`] = `
                   width="64"
                   xmlns="http://www.w3.org/2000/svg"
                 >
+                  <title>
+                    Simple Empty
+                  </title>
                   <g
                     fill="none"
                     fill-rule="evenodd"
@@ -1778,6 +1781,9 @@ exports[`Cascader should show not found content when options.length is 0 1`] = `
                   width="64"
                   xmlns="http://www.w3.org/2000/svg"
                 >
+                  <title>
+                    Simple Empty
+                  </title>
                   <g
                     fill="none"
                     fill-rule="evenodd"

components/cascader/style/columns.ts

@@ -91,7 +91,7 @@ const getColumnsStyle: GenerateStyle<CascaderToken> = (token: CascaderToken): CS
             },
 
             [`&-active:not(${cascaderMenuItemCls}-disabled)`]: {
-              [`&, &:hover`]: {
+              '&, &:hover': {
                 fontWeight: token.optionSelectedFontWeight,
                 backgroundColor: token.optionSelectedBg,
               },

components/checkbox/style/index.ts

@@ -4,6 +4,7 @@ import { genFocusOutline, resetComponent } from '../../style';
 import type { FullToken, GenerateStyle } from '../../theme/internal';
 import { genStyleHooks, mergeToken } from '../../theme/internal';
 
+// biome-ignore lint/suspicious/noEmptyInterface: ComponentToken need to be empty by default
 export interface ComponentToken {}
 
 interface CheckboxToken extends FullToken<'Checkbox'> {

components/collapse/style/index.ts

@@ -77,13 +77,13 @@ export const genBaseStyle: GenerateStyle<CollapseToken> = (token) => {
       border: borderBase,
       borderRadius: collapsePanelBorderRadius,
 
-      [`&-rtl`]: {
+      '&-rtl': {
         direction: 'rtl',
       },
 
       [`& > ${componentCls}-item`]: {
         borderBottom: borderBase,
-        [`&:last-child`]: {
+        '&:last-child': {
           [`
             &,
             & > ${componentCls}-header`]: {
@@ -155,12 +155,12 @@ export const genBaseStyle: GenerateStyle<CollapseToken> = (token) => {
           padding: contentPadding,
         },
 
-        [`&-hidden`]: {
+        '&-hidden': {
           display: 'none',
         },
       },
 
-      [`&-small`]: {
+      '&-small': {
         [`> ${componentCls}-item`]: {
           [`> ${componentCls}-header`]: {
             padding: collapseHeaderPaddingSM,
@@ -177,7 +177,7 @@ export const genBaseStyle: GenerateStyle<CollapseToken> = (token) => {
         },
       },
 
-      [`&-large`]: {
+      '&-large': {
         [`> ${componentCls}-item`]: {
           fontSize: fontSizeLG,
           lineHeight: lineHeightLG,

components/color-picker/ColorPicker.tsx

@@ -199,7 +199,7 @@ const ColorPicker: CompoundedComponent = (props) => {
         }
       }}
       content={
-        <ContextIsolator isolateFormContext>
+        <ContextIsolator form>
           <ColorPickerPanel
             {...colorBaseProps}
             onChange={handleChange}

components/color-picker/color.ts

@@ -19,7 +19,7 @@ export class ColorFactory implements Color {
   /** Original Color object */
   private metaColor: RcColor;
 
-  public cleared: boolean = false;
+  public cleared = false;
 
   constructor(color: ColorGenInput<Color>) {
     this.metaColor = new RcColor(color as ColorGenInput);

components/color-picker/components/ColorInput.tsx

@@ -42,7 +42,7 @@ const ColorInput: FC<ColorInputProps> = (props) => {
         return <ColorHsbInput {...inputProps} />;
       case ColorFormat.rgb:
         return <ColorRgbInput {...inputProps} />;
-      case ColorFormat.hex:
+      // case ColorFormat.hex:
       default:
         return <ColorHexInput {...inputProps} />;
     }

components/color-picker/components/ColorTrigger.tsx

@@ -41,7 +41,7 @@ const ColorTrigger = forwardRef<HTMLDivElement, ColorTriggerProps>((props, ref)
         return color.toRgbString();
       case 'hsb':
         return color.toHsbString();
-      case 'hex':
+      // case 'hex':
       default:
         return alpha < 100 ? `${hexString.slice(0, 7)},${alpha}%` : hexString;
     }

components/color-picker/style/index.ts

@@ -8,6 +8,7 @@ import genInputStyle from './input';
 import genPickerStyle from './picker';
 import genPresetsStyle from './presets';
 
+// biome-ignore lint/suspicious/noEmptyInterface: ComponentToken need to be empty by default
 export interface ComponentToken {}
 
 export interface ColorPickerToken extends FullToken<'ColorPicker'> {

components/config-provider/__tests__/__snapshots__/components.test.tsx.snap

@@ -14999,6 +14999,9 @@ exports[`ConfigProvider components Empty configProvider 1`] = `
       width="184"
       xmlns="http://www.w3.org/2000/svg"
     >
+      <title>
+        empty image
+      </title>
       <g
         fill="none"
         fill-rule="evenodd"
@@ -15074,6 +15077,9 @@ exports[`ConfigProvider components Empty configProvider componentDisabled 1`] =
       width="184"
       xmlns="http://www.w3.org/2000/svg"
     >
+      <title>
+        empty image
+      </title>
       <g
         fill="none"
         fill-rule="evenodd"
@@ -15149,6 +15155,9 @@ exports[`ConfigProvider components Empty configProvider componentSize large 1`]
       width="184"
       xmlns="http://www.w3.org/2000/svg"
     >
+      <title>
+        empty image
+      </title>
       <g
         fill="none"
         fill-rule="evenodd"
@@ -15224,6 +15233,9 @@ exports[`ConfigProvider components Empty configProvider componentSize middle 1`]
       width="184"
       xmlns="http://www.w3.org/2000/svg"
     >
+      <title>
+        empty image
+      </title>
       <g
         fill="none"
         fill-rule="evenodd"
@@ -15299,6 +15311,9 @@ exports[`ConfigProvider components Empty configProvider componentSize small 1`]
       width="184"
       xmlns="http://www.w3.org/2000/svg"
     >
+      <title>
+        empty image
+      </title>
       <g
         fill="none"
         fill-rule="evenodd"
@@ -15374,6 +15389,9 @@ exports[`ConfigProvider components Empty normal 1`] = `
       width="184"
       xmlns="http://www.w3.org/2000/svg"
     >
+      <title>
+        empty image
+      </title>
       <g
         fill="none"
         fill-rule="evenodd"
@@ -15449,6 +15467,9 @@ exports[`ConfigProvider components Empty prefixCls 1`] = `
       width="184"
       xmlns="http://www.w3.org/2000/svg"
     >
+      <title>
+        empty image
+      </title>
       <g
         fill="none"
         fill-rule="evenodd"
@@ -21791,6 +21812,8 @@ exports[`ConfigProvider components Popover prefixCls 1`] = `
 
 exports[`ConfigProvider components Progress configProvider 1`] = `
 <div
+  aria-valuemax="100"
+  aria-valuemin="0"
   aria-valuenow="0"
   class="config-progress config-progress-status-normal config-progress-line config-progress-line-align-end config-progress-line-position-outer config-progress-show-info config-progress-default"
   role="progressbar"
@@ -21819,6 +21842,8 @@ exports[`ConfigProvider components Progress configProvider 1`] = `
 
 exports[`ConfigProvider components Progress configProvider componentDisabled 1`] = `
 <div
+  aria-valuemax="100"
+  aria-valuemin="0"
   aria-valuenow="0"
   class="config-progress config-progress-status-normal config-progress-line config-progress-line-align-end config-progress-line-position-outer config-progress-show-info config-progress-default"
   role="progressbar"
@@ -21847,6 +21872,8 @@ exports[`ConfigProvider components Progress configProvider componentDisabled 1`]
 
 exports[`ConfigProvider components Progress configProvider componentSize large 1`] = `
 <div
+  aria-valuemax="100"
+  aria-valuemin="0"
   aria-valuenow="0"
   class="config-progress config-progress-status-normal config-progress-line config-progress-line-align-end config-progress-line-position-outer config-progress-show-info config-progress-default"
   role="progressbar"
@@ -21875,6 +21902,8 @@ exports[`ConfigProvider components Progress configProvider componentSize large 1
 
 exports[`ConfigProvider components Progress configProvider componentSize middle 1`] = `
 <div
+  aria-valuemax="100"
+  aria-valuemin="0"
   aria-valuenow="0"
   class="config-progress config-progress-status-normal config-progress-line config-progress-line-align-end config-progress-line-position-outer config-progress-show-info config-progress-default"
   role="progressbar"
@@ -21903,6 +21932,8 @@ exports[`ConfigProvider components Progress configProvider componentSize middle
 
 exports[`ConfigProvider components Progress configProvider componentSize small 1`] = `
 <div
+  aria-valuemax="100"
+  aria-valuemin="0"
   aria-valuenow="0"
   class="config-progress config-progress-status-normal config-progress-line config-progress-line-align-end config-progress-line-position-outer config-progress-show-info config-progress-default"
   role="progressbar"
@@ -21931,6 +21962,8 @@ exports[`ConfigProvider components Progress configProvider componentSize small 1
 
 exports[`ConfigProvider components Progress normal 1`] = `
 <div
+  aria-valuemax="100"
+  aria-valuemin="0"
   aria-valuenow="0"
   class="ant-progress ant-progress-status-normal ant-progress-line ant-progress-line-align-end ant-progress-line-position-outer ant-progress-show-info ant-progress-default"
   role="progressbar"
@@ -21959,6 +21992,8 @@ exports[`ConfigProvider components Progress normal 1`] = `
 
 exports[`ConfigProvider components Progress prefixCls 1`] = `
 <div
+  aria-valuemax="100"
+  aria-valuemin="0"
   aria-valuenow="0"
   class="prefix-Progress prefix-Progress-status-normal prefix-Progress-line prefix-Progress-line-align-end prefix-Progress-line-position-outer prefix-Progress-show-info prefix-Progress-default"
   role="progressbar"
@@ -26835,6 +26870,9 @@ exports[`ConfigProvider components Table configProvider 1`] = `
                           width="64"
                           xmlns="http://www.w3.org/2000/svg"
                         >
+                          <title>
+                            Simple Empty
+                          </title>
                           <g
                             fill="none"
                             fill-rule="evenodd"
@@ -27141,6 +27179,9 @@ exports[`ConfigProvider components Table configProvider componentDisabled 1`] =
                           width="64"
                           xmlns="http://www.w3.org/2000/svg"
                         >
+                          <title>
+                            Simple Empty
+                          </title>
                           <g
                             fill="none"
                             fill-rule="evenodd"
@@ -27445,6 +27486,9 @@ exports[`ConfigProvider components Table configProvider componentSize large 1`]
                           width="64"
                           xmlns="http://www.w3.org/2000/svg"
                         >
+                          <title>
+                            Simple Empty
+                          </title>
                           <g
                             fill="none"
                             fill-rule="evenodd"
@@ -27749,6 +27793,9 @@ exports[`ConfigProvider components Table configProvider componentSize middle 1`]
                           width="64"
                           xmlns="http://www.w3.org/2000/svg"
                         >
+                          <title>
+                            Simple Empty
+                          </title>
                           <g
                             fill="none"
                             fill-rule="evenodd"
@@ -28053,6 +28100,9 @@ exports[`ConfigProvider components Table configProvider componentSize small 1`]
                           width="64"
                           xmlns="http://www.w3.org/2000/svg"
                         >
+                          <title>
+                            Simple Empty
+                          </title>
                           <g
                             fill="none"
                             fill-rule="evenodd"
@@ -28357,6 +28407,9 @@ exports[`ConfigProvider components Table normal 1`] = `
                           width="64"
                           xmlns="http://www.w3.org/2000/svg"
                         >
+                          <title>
+                            Simple Empty
+                          </title>
                           <g
                             fill="none"
                             fill-rule="evenodd"
@@ -28661,6 +28714,9 @@ exports[`ConfigProvider components Table prefixCls 1`] = `
                           width="64"
                           xmlns="http://www.w3.org/2000/svg"
                         >
+                          <title>
+                            Simple Empty
+                          </title>
                           <g
                             fill="none"
                             fill-rule="evenodd"
@@ -39284,6 +39340,9 @@ exports[`ConfigProvider components Transfer configProvider 1`] = `
               width="64"
               xmlns="http://www.w3.org/2000/svg"
             >
+              <title>
+                Simple Empty
+              </title>
               <g
                 fill="none"
                 fill-rule="evenodd"
@@ -39451,6 +39510,9 @@ exports[`ConfigProvider components Transfer configProvider 1`] = `
               width="64"
               xmlns="http://www.w3.org/2000/svg"
             >
+              <title>
+                Simple Empty
+              </title>
               <g
                 fill="none"
                 fill-rule="evenodd"
@@ -39563,6 +39625,9 @@ exports[`ConfigProvider components Transfer configProvider componentDisabled 1`]
               width="64"
               xmlns="http://www.w3.org/2000/svg"
             >
+              <title>
+                Simple Empty
+              </title>
               <g
                 fill="none"
                 fill-rule="evenodd"
@@ -39730,6 +39795,9 @@ exports[`ConfigProvider components Transfer configProvider componentDisabled 1`]
               width="64"
               xmlns="http://www.w3.org/2000/svg"
             >
+              <title>
+                Simple Empty
+              </title>
               <g
                 fill="none"
                 fill-rule="evenodd"
@@ -39842,6 +39910,9 @@ exports[`ConfigProvider components Transfer configProvider componentSize large 1
               width="64"
               xmlns="http://www.w3.org/2000/svg"
             >
+              <title>
+                Simple Empty
+              </title>
               <g
                 fill="none"
                 fill-rule="evenodd"
@@ -40009,6 +40080,9 @@ exports[`ConfigProvider components Transfer configProvider componentSize large 1
               width="64"
               xmlns="http://www.w3.org/2000/svg"
             >
+              <title>
+                Simple Empty
+              </title>
               <g
                 fill="none"
                 fill-rule="evenodd"
@@ -40121,6 +40195,9 @@ exports[`ConfigProvider components Transfer configProvider componentSize middle
               width="64"
               xmlns="http://www.w3.org/2000/svg"
             >
+              <title>
+                Simple Empty
+              </title>
               <g
                 fill="none"
                 fill-rule="evenodd"
@@ -40288,6 +40365,9 @@ exports[`ConfigProvider components Transfer configProvider componentSize middle
               width="64"
               xmlns="http://www.w3.org/2000/svg"
             >
+              <title>
+                Simple Empty
+              </title>
               <g
                 fill="none"
                 fill-rule="evenodd"
@@ -40400,6 +40480,9 @@ exports[`ConfigProvider components Transfer configProvider componentSize small 1
               width="64"
               xmlns="http://www.w3.org/2000/svg"
             >
+              <title>
+                Simple Empty
+              </title>
               <g
                 fill="none"
                 fill-rule="evenodd"
@@ -40567,6 +40650,9 @@ exports[`ConfigProvider components Transfer configProvider componentSize small 1
               width="64"
               xmlns="http://www.w3.org/2000/svg"
             >
+              <title>
+                Simple Empty
+              </title>
               <g
                 fill="none"
                 fill-rule="evenodd"
@@ -40679,6 +40765,9 @@ exports[`ConfigProvider components Transfer normal 1`] = `
               width="64"
               xmlns="http://www.w3.org/2000/svg"
             >
+              <title>
+                Simple Empty
+              </title>
               <g
                 fill="none"
                 fill-rule="evenodd"
@@ -40846,6 +40935,9 @@ exports[`ConfigProvider components Transfer normal 1`] = `
               width="64"
               xmlns="http://www.w3.org/2000/svg"
             >
+              <title>
+                Simple Empty
+              </title>
               <g
                 fill="none"
                 fill-rule="evenodd"
@@ -40958,6 +41050,9 @@ exports[`ConfigProvider components Transfer prefixCls 1`] = `
               width="64"
               xmlns="http://www.w3.org/2000/svg"
             >
+              <title>
+                Simple Empty
+              </title>
               <g
                 fill="none"
                 fill-rule="evenodd"
@@ -41125,6 +41220,9 @@ exports[`ConfigProvider components Transfer prefixCls 1`] = `
               width="64"
               xmlns="http://www.w3.org/2000/svg"
             >
+              <title>
+                Simple Empty
+              </title>
               <g
                 fill="none"
                 fill-rule="evenodd"

components/config-provider/__tests__/theme.test.tsx

@@ -11,7 +11,7 @@ import { useToken } from '../../theme/internal';
 
 const { defaultAlgorithm, darkAlgorithm, compactAlgorithm } = theme;
 
-// eslint-disable-next-line no-var
+/* biome-ignore lint/style/noVar: has to be a global variable */ /* eslint-disable-next-line no-var */
 var mockCanUseDom = true;
 
 jest.mock('rc-util/lib/Dom/canUseDom', () => () => mockCanUseDom);

components/config-provider/demo/wave.tsx

@@ -23,13 +23,7 @@ const createHolder = (node: HTMLElement) => {
   return div;
 };
 
-const createDot = (
+const createDot = (holder: HTMLElement, color: string, left: number, top: number, size = 0) => {
-  holder: HTMLElement,
-  color: string,
-  left: number,
-  top: number,
-  size: number = 0,
-) => {
   const dot = document.createElement('div');
   dot.style.position = 'absolute';
   dot.style.left = `${left}px`;

components/date-picker/generatePicker/generateRangePicker.tsx

@@ -107,7 +107,7 @@ export default function generateRangePicker<DateType extends AnyObject>(
     const [zIndex] = useZIndex('DatePicker', props.popupStyle?.zIndex as number);
 
     return wrapCSSVar(
-      <ContextIsolator isolateSpaceContext>
+      <ContextIsolator space>
         <RCRangePicker<DateType>
           separator={
             <span aria-label="to" className={`${prefixCls}-separator`}>

components/date-picker/generatePicker/generateSinglePicker.tsx

@@ -146,7 +146,7 @@ export default function generatePicker<DateType extends AnyObject>(
       const [zIndex] = useZIndex('DatePicker', props.popupStyle?.zIndex as number);
 
       return wrapCSSVar(
-        <ContextIsolator isolateSpaceContext>
+        <ContextIsolator space>
           <RCPicker<DateType>
             ref={innerRef}
             placeholder={getPlaceholder(locale, mergedPicker, placeholder)}

components/date-picker/style/panel.ts

@@ -330,13 +330,11 @@ export const genPanelStyle = (token: SharedPickerToken): CSSObject => {
         },
       },
 
-      [`&-prev-icon,
+      '&-prev-icon, &-super-prev-icon': {
-        &-super-prev-icon`]: {
         transform: 'rotate(-45deg)',
       },
 
-      [`&-next-icon,
+      '&-next-icon, &-super-next-icon': {
-        &-super-next-icon`]: {
         transform: 'rotate(135deg)',
       },
 
@@ -459,16 +457,13 @@ export const genPanelStyle = (token: SharedPickerToken): CSSObject => {
             },
           },
 
-          [`&:hover td`]: {
+          '&:hover td': {
             '&:before': {
               background: cellHoverBg,
             },
           },
 
-          [`&-range-start td,
+          '&-range-start td, &-range-end td, &-selected td, &-hover td': {
-            &-range-end td,
-            &-selected td,
-            &-hover td`]: {
             // Rise priority to override hover style
             [`&${pickerCellCls}`]: {
               '&:before': {
@@ -485,14 +480,14 @@ export const genPanelStyle = (token: SharedPickerToken): CSSObject => {
             },
           },
 
-          [`&-range-hover td:before`]: {
+          '&-range-hover td:before': {
             background: controlItemBgActive,
           },
         },
       },
 
       // >>> ShowWeek
-      [`&-week-panel, &-date-panel-show-week`]: {
+      '&-week-panel, &-date-panel-show-week': {
         [`${componentCls}-body`]: {
           padding: `${unit(paddingXS)} ${unit(paddingSM)}`,
         },

components/descriptions/style/index.ts

@@ -113,7 +113,7 @@ const genDescriptionStyles: GenerateStyle<DescriptionsToken> = (token) => {
     [componentCls]: {
       ...resetComponent(token),
       ...genBorderedStyle(token),
-      [`&-rtl`]: {
+      '&-rtl': {
         direction: 'rtl',
       },
       [`${componentCls}-header`]: {

components/divider/index.tsx

@@ -91,6 +91,7 @@ const Divider: React.FC<DividerProps> = (props) => {
       className={classString}
       style={{ ...divider?.style, ...style }}
       {...restProps}
+      // biome-ignore lint/a11y/useAriaPropsForRole: divider do not need aria-value
       role="separator"
     >
       {children && type !== 'vertical' && (

components/drawer/index.tsx

@@ -160,7 +160,7 @@ const Drawer: React.FC<DrawerProps> & {
   const { classNames: contextClassNames = {}, styles: contextStyles = {} } = drawer || {};
 
   return wrapCSSVar(
-    <ContextIsolator isolateFormContext isolateSpaceContext>
+    <ContextIsolator form space>
       <zIndexContext.Provider value={contextZIndex}>
         <RcDrawer
           prefixCls={prefixCls}

components/dropdown/dropdown.tsx

@@ -189,10 +189,7 @@ const Dropdown: CompoundedComponent = (props) => {
   });
 
   const triggerActions = disabled ? [] : trigger;
-  let alignPoint: boolean;
+  const alignPoint = !!triggerActions?.includes('contextMenu');
-  if (triggerActions && triggerActions.includes('contextMenu')) {
-    alignPoint = true;
-  }
 
   // =========================== Open ============================
   const [mergedOpen, setOpen] = useMergedState(false, {
@@ -283,7 +280,7 @@ const Dropdown: CompoundedComponent = (props) => {
   // ============================ Render ============================
   let renderNode = (
     <RcDropdown
-      alignPoint={alignPoint!}
+      alignPoint={alignPoint}
       {...omit(props, ['rootClassName'])}
       mouseEnterDelay={mouseEnterDelay}
       mouseLeaveDelay={mouseLeaveDelay}