diff --git a/.antd-tools.config.js b/.antd-tools.config.js index 5c139e9d30fc..36b9b759867e 100644 --- a/.antd-tools.config.js +++ b/.antd-tools.config.js @@ -1,23 +1,27 @@ const fs = require('fs'); const path = require('path'); +const restCssPath = path.join(process.cwd(), 'components', 'style', 'reset.css'); +const tokenStatisticPath = path.join(process.cwd(), 'components', 'version', 'token.json'); +const tokenMetaPath = path.join(process.cwd(), 'components', 'version', 'token-meta.json'); + function finalizeCompile() { if (fs.existsSync(path.join(__dirname, './es'))) { - // Build less entry file: dist/antd.less - fs.copyFileSync( - path.join(process.cwd(), 'components', 'style', 'reset.css'), - path.join(process.cwd(), 'es', 'style', 'reset.css'), - ); + fs.copyFileSync(restCssPath, path.join(process.cwd(), 'es', 'style', 'reset.css')); + fs.copyFileSync(tokenStatisticPath, path.join(process.cwd(), 'es', 'version', 'token.json')); + fs.copyFileSync(tokenMetaPath, path.join(process.cwd(), 'es', 'version', 'token-meta.json')); + } + + if (fs.existsSync(path.join(__dirname, './lib'))) { + fs.copyFileSync(restCssPath, path.join(process.cwd(), 'lib', 'style', 'reset.css')); + fs.copyFileSync(tokenStatisticPath, path.join(process.cwd(), 'lib', 'version', 'token.json')); + fs.copyFileSync(tokenMetaPath, path.join(process.cwd(), 'lib', 'version', 'token-meta.json')); } } function finalizeDist() { if (fs.existsSync(path.join(__dirname, './dist'))) { - // Build less entry file: dist/antd.less - fs.copyFileSync( - path.join(process.cwd(), 'components', 'style', 'reset.css'), - path.join(process.cwd(), 'dist', 'reset.css'), - ); + fs.copyFileSync(restCssPath, path.join(process.cwd(), 'dist', 'reset.css')); } } diff --git a/.dumi/hooks/useLocale.tsx b/.dumi/hooks/useLocale.tsx index 6ca4dd51c70b..328e204946e4 100644 --- a/.dumi/hooks/useLocale.tsx +++ b/.dumi/hooks/useLocale.tsx @@ -1,4 +1,3 @@ -import * as React from 'react'; import { useLocale as useDumiLocale } from 'dumi'; export interface LocaleMap { diff --git a/.dumi/hooks/useMenu.tsx b/.dumi/hooks/useMenu.tsx index 0c5bbc8928e0..dd58d4c30b0c 100644 --- a/.dumi/hooks/useMenu.tsx +++ b/.dumi/hooks/useMenu.tsx @@ -1,5 +1,6 @@ -import React, { ReactNode, useMemo } from 'react'; -import { MenuProps } from 'antd'; +import type { ReactNode } from 'react'; +import React, { useMemo } from 'react'; +import type { MenuProps } from 'antd'; import { Link, useFullSidebarData, useSidebarData } from 'dumi'; import useLocation from './useLocation'; @@ -10,7 +11,7 @@ export type UseMenuOptions = { const useMenu = (options: UseMenuOptions = {}): [MenuProps['items'], string] => { const fullData = useFullSidebarData(); - const { pathname } = useLocation(); + const { pathname, search } = useLocation(); const sidebarData = useSidebarData(); const { before, after } = options; @@ -43,7 +44,7 @@ const useMenu = (options: UseMenuOptions = {}): [MenuProps['items'], string] => return ( sidebarItems?.reduce>((result, group) => { - if (group.title) { + if (group?.title) { // 设计文档特殊处理二级分组 if (pathname.startsWith('/docs/spec')) { const childrenGroup = group.children.reduce< @@ -60,9 +61,9 @@ const useMenu = (options: UseMenuOptions = {}): [MenuProps['items'], string] => childItems.push( ...childrenGroup.default.map((item) => ({ label: ( - + {before} - {item.title} + {item?.title} {after} ), @@ -77,9 +78,9 @@ const useMenu = (options: UseMenuOptions = {}): [MenuProps['items'], string] => key: type, children: children?.map((item) => ({ label: ( - + {before} - {item.title} + {item?.title} {after} ), @@ -89,20 +90,20 @@ const useMenu = (options: UseMenuOptions = {}): [MenuProps['items'], string] => } }); result.push({ - label: group.title, - key: group.title, + label: group?.title, + key: group?.title, children: childItems, }); } else { result.push({ type: 'group', - label: group.title, - key: group.title, + label: group?.title, + key: group?.title, children: group.children?.map((item) => ({ label: ( - + {before} - {item.title} + {item?.title} {(item.frontmatter as any).subtitle} @@ -114,12 +115,18 @@ const useMenu = (options: UseMenuOptions = {}): [MenuProps['items'], string] => }); } } else { + const list = group.children || []; + // 如果有 date 字段，我们就对其进行排序 + if (list.every((info) => info?.frontmatter?.date)) { + list.sort((a, b) => (a.frontmatter.date > b.frontmatter.date ? -1 : 1)); + } + result.push( - ...group.children?.map((item) => ({ + ...list.map((item) => ({ label: ( - + {before} - {item.title} + {item?.title} {after} ), @@ -130,7 +137,7 @@ const useMenu = (options: UseMenuOptions = {}): [MenuProps['items'], string] => return result; }, []) ?? [] ); - }, [sidebarData, fullData, pathname]); + }, [sidebarData, fullData, pathname, search]); return [menuItems, pathname]; }; diff --git a/.dumi/pages/index-cn/index.tsx b/.dumi/pages/index-cn/index.tsx index 4a997ee84395..b119d46b2e95 100644 --- a/.dumi/pages/index-cn/index.tsx +++ b/.dumi/pages/index-cn/index.tsx @@ -1 +1,3 @@ -export { default } from '../index/index'; +import Homepage from '../index/index'; + +export default Homepage; diff --git a/.dumi/pages/index/components/Banner.tsx b/.dumi/pages/index/components/Banner.tsx index 672e50865c60..ddd842e3157a 100644 --- a/.dumi/pages/index/components/Banner.tsx +++ b/.dumi/pages/index/components/Banner.tsx @@ -1,10 +1,12 @@ import * as React from 'react'; import { Button, Space, Typography } from 'antd'; +import { Link, useLocation } from 'dumi'; +import { css } from '@emotion/react'; import useLocale from '../../../hooks/useLocale'; import useSiteToken from '../../../hooks/useSiteToken'; import { GroupMask } from './Group'; -import { Link, useLocation } from 'dumi'; import * as utils from '../../../theme/utils'; +import SiteContext from './SiteContext'; const locales = { cn: { @@ -20,60 +22,100 @@ const locales = { }, }; +const useStyle = () => { + const { token } = useSiteToken(); + const { isMobile } = React.useContext(SiteContext); + + return { + titleBase: css` + h1& { + font-family: AliPuHui, ${token.fontFamily}; + } + `, + title: isMobile + ? css` + h1& { + margin-bottom: ${token.margin}px; + font-weight: normal; + font-size: ${token.fontSizeHeading1 + 2}px; + line-height: ${token.lineHeightHeading2}; + } + ` + : css` + h1& { + margin-bottom: ${token.marginMD}px; + font-weight: 900; + font-size: 68px; + } + `, + }; +}; + export interface BannerProps { children?: React.ReactNode; } export default function Banner({ children }: BannerProps) { - const [locale, lang] = useLocale(locales); + const [locale] = useLocale(locales); const { pathname, search } = useLocation(); const { token } = useSiteToken(); + const styles = useStyle(); + const { isMobile } = React.useContext(SiteContext); const isZhCN = utils.isZhCN(pathname); return ( <> {/* Banner Placeholder Motion */} -
+ {isMobile ? ( + + ) : (
- -