Merge branch 'master' into Fix/typography

Author: jin19980928

.dumi/pages/index/components/Group.tsx

@@ -50,7 +50,6 @@ const Group: React.FC<React.PropsWithChildren<GroupProps>> = (props) => {
             fontWeight: 900,
             color: titleColor,
             // Special for the title
-            fontFamily: `AliPuHui, ${token.fontFamily}`,
             fontSize: isMobile ? token.fontSizeHeading2 : token.fontSizeHeading1,
           }}
         >

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

@@ -83,7 +83,6 @@ const useStyle = createStyles(({ token, css, cx }, siteConfig: SiteContextProps)
       padding-inline: ${token.paddingXL}px;
       text-shadow: ${Array.from({ length: 5 }, () => textShadow).join(', ')};
       h1 {
-        font-family: AliPuHui, ${token.fontFamily} !important;
         font-weight: 900 !important;
         font-size: ${token.fontSizeHeading2 * 2}px !important;
         line-height: ${token.lineHeightHeading2} !important;

.dumi/pages/index/components/Theme/MobileCarousel.tsx

@@ -94,8 +94,6 @@ const MobileCarousel: React.FC<MobileCarouselProps> = (props) => {
           style={{
             fontWeight: 900,
             color: mobileImageConfigList[currentSlider].titleColor,
-            // Special for the title
-            fontFamily: `AliPuHui, ${token.fontFamily}`,
             fontSize: token.fontSizeHeading2,
           }}
         >

.dumi/theme/common/ThemeSwitch/index.tsx

@@ -100,6 +100,11 @@ const ThemeSwitch: React.FC<ThemeSwitchProps> = () => {
       return;
     }
 
+    // 校验当前主题是否包含要切换的主题（避免 timeout in DOM update）
+    if (theme.includes(key as ThemeName)) {
+      return;
+    }
+
     // 亮色/暗色模式切换时应用动画效果
     if (key === 'dark' || key === 'light') {
       lastThemeKey.current = key;

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

@@ -9,36 +9,44 @@ export default () => {
     <Global
       styles={css`
         @font-face {
-          font-weight: normal;
-          font-family: AlibabaPuHuiTi;
-          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-family: "AlibabaSans";
+          font-style: normal;
+          font-weight: 300;
           font-display: swap;
+          src: url("//mdn.alipayobjects.com/huamei_iwk9zp/afts/file/A*1GSgSYDD_aIAAAAAQsAAAAgAegCCAQ/AlibabaSans-Light.woff2")
+            format("woff2");
         }
-
         @font-face {
-          font-weight: bold;
-          font-family: AlibabaPuHuiTi;
-          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+ */
+          font-family: "AlibabaSans";
+          font-style: normal;
+          font-weight: 400;
           font-display: swap;
+          src: url("//mdn.alipayobjects.com/huamei_iwk9zp/afts/file/A*2zEUQqnPNesAAAAAQtAAAAgAegCCAQ/AlibabaSans-Regular.woff2")
+            format("woff2");
+        }
+        @font-face {
+          font-family: "AlibabaSans";
+          font-style: normal;
+          font-weight: 500;
+          font-display: swap;
+          src: url("//mdn.alipayobjects.com/huamei_iwk9zp/afts/file/A*E_cxRbMlZqUAAAAAQuAAAAgAegCCAQ/AlibabaSans-Medium.woff2")
+            format("woff2");
+        }
+        @font-face {
+          font-family: "AlibabaSans";
+          font-style: normal;
+          font-weight: 600;
+          font-display: swap;
+          src: url("//mdn.alipayobjects.com/huamei_iwk9zp/afts/file/A*E_cxRbMlZqUAAAAAQuAAAAgAegCCAQ/AlibabaSans-Bold.woff2")
+            format("woff2");
         }
-
-        // 组件丰富，选用自如定制主题随心所欲设计语言与研发框架1234567890 QWERTYUIOPLKJHGFDSAZXCVBNM,.mnbvcxzasdfghjklpoiuytrewq
-        /* CDN 服务仅供平台体验和调试使用，平台不承诺服务的稳定性，企业客户需下载字体包自行发布使用并做好备份。 */
         @font-face {
-          font-weight: 900;
-          font-family: 'AliPuHui';
-          src:
-            url('//at.alicdn.com/wf/webfont/exMpJIukiCms/Gsw2PSKrftc1yNWMNlXgw.woff2')
-              format('woff2'),
-            url('//at.alicdn.com/wf/webfont/exMpJIukiCms/vtu73by4O2gEBcvBuLgeu.woff') format('woff');
+          font-family: "AlibabaSans";
+          font-style: normal;
+          font-weight: 700;
           font-display: swap;
+          src: url("//mdn.alipayobjects.com/huamei_iwk9zp/afts/file/A*E_cxRbMlZqUAAAAAQuAAAAgAegCCAQ/AlibabaSans-Heavy.woff2")
+            format("woff2");
         }
 
         html {

.dumi/theme/layouts/DocLayout/index.tsx

@@ -4,7 +4,7 @@ import dayjs from 'dayjs';
 import 'dayjs/locale/zh-cn';
 
 import React, { useEffect, useLayoutEffect, useRef } from 'react';
-import ConfigProvider from 'antd/es/config-provider';
+import { ConfigProvider, theme } from 'antd';
 import zhCN from 'antd/es/locale/zh_CN';
 import { Helmet, useOutlet, useSiteData } from 'dumi';
 
@@ -38,6 +38,7 @@ const DocLayout: React.FC = () => {
   const timerRef = useRef<ReturnType<typeof setTimeout>>(null!);
   const { direction } = React.use(SiteContext);
   const { loading } = useSiteData();
+  const { token } = theme.useToken();
 
   useLayoutEffect(() => {
     if (lang === 'cn') {
@@ -108,7 +109,15 @@ const DocLayout: React.FC = () => {
           content="https://gw.alipayobjects.com/zos/rmsportal/rlpTLlbMzTNYuZGGCVYM.png"
         />
       </Helmet>
-      <ConfigProvider direction={direction} locale={lang === 'cn' ? zhCN : undefined}>
+      <ConfigProvider
+        direction={direction}
+        locale={lang === 'cn' ? zhCN : undefined}
+        theme={{
+          token: {
+            fontFamily: `AlibabaSans, ${token.fontFamily}`,
+          },
+        }}
+      >
         <GlobalStyles />
         <Header />
         {content}

.dumi/theme/layouts/GlobalLayout.tsx

@@ -104,7 +104,7 @@ const GlobalLayout: React.FC = () => {
         if (key === 'theme') {
           nextSearchParams = createSearchParams({
             ...nextSearchParams,
-            theme: value.filter((t) => t !== 'light'),
+            theme: value,
           });
 
           document

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

@@ -6,7 +6,7 @@ import Link from '../../common/Link';
 import * as utils from '../../utils';
 
 const useStyle = createStyles(({ token, css }) => {
-  const { headerHeight, colorTextHeading, fontFamily, mobileMaxWidth } = token;
+  const { headerHeight, colorTextHeading, mobileMaxWidth } = token;
 
   return {
     logo: css`
@@ -16,7 +16,6 @@ const useStyle = createStyles(({ token, css }) => {
       color: ${colorTextHeading};
       font-weight: bold;
       font-size: 18px;
-      font-family: AlibabaPuHuiTi, ${fontFamily}, sans-serif;
       line-height: ${headerHeight}px;
       letter-spacing: -0.18px;
       white-space: nowrap;

components/button/index.en-US.md

@@ -20,7 +20,7 @@ In Ant Design we provide 5 types of button.
 
 - 🔵 Primary button: used for the main action, there can be at most one primary button in a section.
 - ⚪️ Default button: used for a series of actions without priority.
-- 🫥 Dashed button: commonly used for adding more actions.
+- 😶 Dashed button: commonly used for adding more actions.
 - 🔤 Text button: used for the most secondary action.
 - 🔗 Link button: used for external links.
 

components/button/index.zh-CN.md

@@ -21,7 +21,7 @@ group:
 
 - 🔵 主按钮：用于主行动点，一个操作区域只能有一个主按钮。
 - ⚪️ 默认按钮：用于没有主次之分的一组行动点。
-- 🫥 虚线按钮：常用于添加操作。
+- 😶 虚线按钮：常用于添加操作。
 - 🔤 文本按钮：用于最次级的行动点。
 - 🔗 链接按钮：一般用于链接，即导航至某位置。