Merge branch 'main' into dependabot/npm_and_yarn/cheerio-1.0.0

ant-design · Sep 14, 2024 · 80fe206 · 80fe206
2 parents 38b1f72 + 55078ee
commit 80fe206
Show file tree

Hide file tree

Showing 198 changed files with 8,333 additions and 2,880 deletions.
diff --git a/.dumi/components/SemanticPreview.tsx b/.dumi/components/SemanticPreview.tsx
@@ -1,70 +1,68 @@
-import React from 'react';
-import { Col, ConfigProvider, Flex, Row, Tag, theme, Typography } from 'antd';
+import { Col, ConfigProvider, Flex, Row, Tag, Typography, theme } from 'antd';
 import { createStyles, css } from 'antd-style';
 import classnames from 'classnames';
+import React from 'react';
 
 const MARK_BORDER_SIZE = 2;
 
-const useStyle = createStyles(
-  ({ token }, markPos: [number, number, number, number]) => ({
-    container: css`
-      position: relative;
-    `,
-    colWrap: css`
-      border-right: 1px solid ${token.colorBorderSecondary};
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      padding: ${token.paddingMD}px;
-      overflow: hidden;
-    `,
-    listWrap: css`
-      display: flex;
-      flex-direction: column;
-      list-style: none;
-      margin: 0;
-      padding: 0;
-      overflow: hidden;
-    `,
-    listItem: css`
-      cursor: pointer;
-      padding: ${token.paddingSM}px;
-      transition: background-color ${token.motionDurationFast} ease;
-      &:hover {
-        background-color: ${token.controlItemBgHover};
-      }
-      &:not(:first-of-type) {
-        border-top: 1px solid ${token.colorBorderSecondary};
-      }
-    `,
-    marker: css`
-      position: absolute;
-      border: ${MARK_BORDER_SIZE}px solid ${token.colorWarning};
-      box-sizing: border-box;
-      z-index: 999999;
-      box-shadow: 0 0 0 1px #fff;
-      pointer-events: none;
-      left: ${markPos[0] - MARK_BORDER_SIZE}px;
-      top: ${markPos[1] - MARK_BORDER_SIZE}px;
-      width: ${markPos[2] + MARK_BORDER_SIZE * 2}px;
-      height: ${markPos[3] + MARK_BORDER_SIZE * 2}px;
-    `,
-    markerActive: css`
-      opacity: 1;
-    `,
-    markerNotActive: css`
-      opacity: 0;
-    `,
-    markerMotion: css`
-      transition:
-        opacity ${token.motionDurationSlow} ease,
-        all ${token.motionDurationSlow} ease;
-    `,
-    markerNotMotion: css`
-      transition: opacity ${token.motionDurationSlow} ease;
-    `,
-  }),
-);
+const useStyle = createStyles(({ token }, markPos: [number, number, number, number]) => ({
+  container: css`
+    position: relative;
+  `,
+  colWrap: css`
+    border-right: 1px solid ${token.colorBorderSecondary};
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding: ${token.paddingMD}px;
+    overflow: hidden;
+  `,
+  listWrap: css`
+    display: flex;
+    flex-direction: column;
+    list-style: none;
+    margin: 0;
+    padding: 0;
+    overflow: hidden;
+  `,
+  listItem: css`
+    cursor: pointer;
+    padding: ${token.paddingSM}px;
+    transition: background-color ${token.motionDurationFast} ease;
+    &:hover {
+      background-color: ${token.controlItemBgHover};
+    }
+    &:not(:first-of-type) {
+      border-top: 1px solid ${token.colorBorderSecondary};
+    }
+  `,
+  marker: css`
+    position: absolute;
+    border: ${MARK_BORDER_SIZE}px solid ${token.colorWarning};
+    box-sizing: border-box;
+    z-index: 999999;
+    box-shadow: 0 0 0 1px #fff;
+    pointer-events: none;
+    inset-inline-start: ${markPos[0] - MARK_BORDER_SIZE}px;
+    top: ${markPos[1] - MARK_BORDER_SIZE}px;
+    width: ${markPos[2] + MARK_BORDER_SIZE * 2}px;
+    height: ${markPos[3] + MARK_BORDER_SIZE * 2}px;
+  `,
+  markerActive: css`
+    opacity: 1;
+  `,
+  markerNotActive: css`
+    opacity: 0;
+  `,
+  markerMotion: css`
+    transition:
+      opacity ${token.motionDurationSlow} ease,
+      all ${token.motionDurationSlow} ease;
+  `,
+  markerNotMotion: css`
+    transition: opacity ${token.motionDurationSlow} ease;
+  `,
+}));
 
 export interface SemanticPreviewProps {
   semantics: { name: string; desc: string; version?: string }[];
@@ -103,18 +101,14 @@ const SemanticPreview: React.FC<SemanticPreviewProps> = (props) => {
 
   const [positionMotion, setPositionMotion] = React.useState<boolean>(false);
   const [hoverSemantic, setHoverSemantic] = React.useState<string | null>(null);
-  const [markPos, setMarkPos] = React.useState<
-    [number, number, number, number]
-  >([0, 0, 0, 0]);
+  const [markPos, setMarkPos] = React.useState<[number, number, number, number]>([0, 0, 0, 0]);
 
   const { styles } = useStyle(markPos);
 
   React.useEffect(() => {
     if (hoverSemantic) {
       const targetClassName = getMarkClassName(hoverSemantic);
-      const targetElement = containerRef.current?.querySelector<HTMLElement>(
-        `.${targetClassName}`,
-      );
+      const targetElement = containerRef.current?.querySelector<HTMLElement>(`.${targetClassName}`);
       const containerRect = containerRef.current?.getBoundingClientRect();
       const targetRect = targetElement?.getBoundingClientRect();
       setMarkPos([
@@ -143,9 +137,7 @@ const SemanticPreview: React.FC<SemanticPreviewProps> = (props) => {
     <div className={classnames(styles.container)} ref={containerRef}>
       <Row style={{ minHeight: height }}>
         <Col span={16} className={classnames(styles.colWrap)}>
-          <ConfigProvider theme={{ token: { motion: false } }}>
-            {cloneNode}
-          </ConfigProvider>
+          <ConfigProvider theme={{ token: { motion: false } }}>{cloneNode}</ConfigProvider>
         </Col>
         <Col span={8}>
           <ul className={classnames(styles.listWrap)}>
@@ -161,13 +153,9 @@ const SemanticPreview: React.FC<SemanticPreviewProps> = (props) => {
                     <Typography.Title level={5} style={{ margin: 0 }}>
                       {semantic.name}
                     </Typography.Title>
-                    {semantic.version && (
-                      <Tag color="blue">{semantic.version}</Tag>
-                    )}
+                    {semantic.version && <Tag color="blue">{semantic.version}</Tag>}
                   </Flex>
-                  <Typography.Paragraph
-                    style={{ margin: 0, fontSize: token.fontSizeSM }}
-                  >
+                  <Typography.Paragraph style={{ margin: 0, fontSize: token.fontSizeSM }}>
                     {semantic.desc}
                   </Typography.Paragraph>
                 </Flex>

diff --git a/.dumi/global.css b/.dumi/global.css
@@ -0,0 +1,20 @@
+.demo-logo {
+  width: 120px;
+  min-width: 120px;
+  height: 32px;
+  background: rgba(255, 255, 255, 0.2);
+  border-radius: 6px;
+  margin-inline-end: 24px;
+}
+
+.demo-logo-vertical {
+  height: 32px;
+  margin: 16px;
+  background: rgba(255, 255, 255, 0.2);
+  border-radius: 6px;
+}
+
+html {
+  scrollbar-width: thin;
+  scrollbar-color: unset;
+}
diff --git a/.dumi/hooks/use.ts b/.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;
-  } else {
-    internal.status = 'pending';
-    internal.then(
-      (result) => {
-        internal.status = 'fulfilled';
-        internal.value = result;
-      },
-      (reason) => {
-        internal.status = 'rejected';
-        internal.reason = reason;
-      },
-    );
+  }
+  if (internal.status === 'pending') {
     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;
diff --git a/.dumi/hooks/useFetch/index.ts b/.dumi/hooks/useFetch/index.ts
@@ -1,4 +1,5 @@
 import fetch from 'cross-fetch';
+
 import use from '../use';
 import FetchCache from './cache';
 

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

diff --git a/.dumi/hooks/useMenu.tsx b/.dumi/hooks/useMenu.tsx
@@ -1,9 +1,9 @@
-import React, { useMemo } from 'react';
 import type { MenuProps } from 'antd';
-import { Tag, version } from 'antd';
+import { Space, Tag, version } from 'antd';
 import { createStyles } from 'antd-style';
 import classnames from 'classnames';
 import { useFullSidebarData, useSidebarData } from 'dumi';
+import React, { useMemo } from 'react';
 
 import Link from '../theme/common/Link';
 import useLocation from './useLocation';
@@ -22,7 +22,6 @@ const useStyle = createStyles(({ css, token }) => ({
     margin-inline-end: 0;
   `,
   subtitle: css`
-    margin-inline-start: ${token.marginXS}px;
     font-weight: normal;
     font-size: ${token.fontSizeSM}px;
     opacity: 0.8;
@@ -46,10 +45,10 @@ const MenuItemLabelWithTag: React.FC<MenuItemLabelProps> = (props) => {
   if (!before && !after) {
     return (
       <Link to={`${link}${search}`} className={classnames(className, { [styles.link]: tag })}>
-        <span>
-          {title}
+        <Space>
+          <span>{title}</span>
           {subtitle && <span className={styles.subtitle}>{subtitle}</span>}
-        </span>
+        </Space>
         {tag && (
           <Tag
             bordered={false}