Compare commits

...

4 Commits

Author SHA1 Message Date
陈帅
dfd962d350 docs: add 6.1.2 changeglog (#56332)
* docs:add 6.1.2 changeglog

* fix: 修复 Transfer 组件在禁用状态下的 className 问题

* Update CHANGELOG.zh-CN.md

Co-authored-by: afc163 <afc163@gmail.com>
Signed-off-by: 陈帅 <qixian.cs@outlook.com>

* Update CHANGELOG.en-US.md

Co-authored-by: afc163 <afc163@gmail.com>
Signed-off-by: 陈帅 <qixian.cs@outlook.com>

* Update CHANGELOG.zh-CN.md

Co-authored-by: afc163 <afc163@gmail.com>
Signed-off-by: 陈帅 <qixian.cs@outlook.com>

* Update CHANGELOG.zh-CN.md

Co-authored-by: afc163 <afc163@gmail.com>
Signed-off-by: 陈帅 <qixian.cs@outlook.com>

* 更新 6.1.2 更新日志,添加 Button 和 Breadcrumb 组件的修复说明

* 更新 6.1.2 更新日志,添加 Select 和 Tag 组件的修复说明

* Update CHANGELOG.en-US.md

Co-authored-by: afc163 <afc163@gmail.com>
Signed-off-by: 陈帅 <qixian.cs@outlook.com>

* Update CHANGELOG.zh-CN.md

Co-authored-by: afc163 <afc163@gmail.com>
Signed-off-by: 陈帅 <qixian.cs@outlook.com>

* Update CHANGELOG.en-US.md

Co-authored-by: afc163 <afc163@gmail.com>
Signed-off-by: 陈帅 <qixian.cs@outlook.com>

* 更新 6.1.2 更新日志,添加 Select 和 Tag 组件的修复说明

* 更新 6.1.2 更新日志,修正 Tag 组件背景对比度及 Segmented 组件属性描述

---------

Signed-off-by: 陈帅 <qixian.cs@outlook.com>
Co-authored-by: afc163 <afc163@gmail.com>
2025-12-24 13:36:56 +08:00
𝑾𝒖𝒙𝒉
742ecee166 chore(site): In order to better debug the online demo (#56072) 2025-12-24 10:19:26 +08:00
高艳兵
d680ea3d30 fix: fix cursor style when Select has showSearch and disabled props (#56340) 2025-12-24 10:14:19 +08:00
高艳兵
c0589e939d chore: adjust Tag default background contrast (#56326) 2025-12-24 10:11:56 +08:00
10 changed files with 152 additions and 39 deletions

View File

@@ -1,7 +1,8 @@
import React, { Suspense, useRef } from 'react';
import { LinkOutlined, ThunderboltOutlined } from '@ant-design/icons';
import { BugOutlined, ThunderboltOutlined } from '@ant-design/icons';
import stackblitzSdk from '@stackblitz/sdk';
import { Flex, Tooltip } from 'antd';
import type { MenuProps } from 'antd';
import { Button, Dropdown, Flex, Tooltip } from 'antd';
import { FormattedMessage, useSiteData } from 'dumi';
import LZString from 'lz-string';
@@ -28,8 +29,6 @@ function compress(string: string): string {
}
interface ActionsProps {
showOnlineUrl: boolean;
docsOnlineUrl?: string;
assetId: string;
title?: string;
pkgDependencyList: Record<PropertyKey, string>;
@@ -39,11 +38,10 @@ interface ActionsProps {
onCodeExpand: () => void;
entryCode: string;
styleCode: string;
debugOptions?: MenuProps['items'];
}
const Actions: React.FC<ActionsProps> = ({
showOnlineUrl,
docsOnlineUrl,
assetId,
title,
jsx,
@@ -53,6 +51,7 @@ const Actions: React.FC<ActionsProps> = ({
pkgDependencyList,
entryCode,
styleCode,
debugOptions,
}) => {
const [, lang] = useLocale();
const isZhCN = lang === 'cn';
@@ -213,21 +212,15 @@ createRoot(document.getElementById('container')).render(<Demo />);
});
return (
<Flex wrap gap="middle" className="code-box-actions">
{/* 在线文档按钮 */}
{showOnlineUrl && (
<Tooltip title={<FormattedMessage id="app.demo.online" />}>
<a
className="code-box-code-action"
aria-label="open in new tab"
target="_blank"
rel="noreferrer"
href={docsOnlineUrl || ''}
>
<LinkOutlined className="code-box-online" />
</a>
</Tooltip>
)}
<Flex wrap gap="middle" className="code-box-actions" align="center">
{
// 调试选项
debugOptions?.length ? (
<Dropdown menu={{ items: debugOptions }} arrow={{ pointAtCenter: true }}>
<Button icon={<BugOutlined />} color="purple" variant="filled" size="small" />
</Dropdown>
) : null
}
{/* CodeSandbox 按钮 */}
<form
className="code-box-code-action"

View File

@@ -1,10 +1,11 @@
import React, { useEffect, useMemo, useRef, useState } from 'react';
import { UpOutlined } from '@ant-design/icons';
import { Badge, Tooltip } from 'antd';
import type { MenuProps } from 'antd';
import { Badge, Tag, Tooltip } from 'antd';
import { createStyles, css } from 'antd-style';
import { clsx } from 'clsx';
import { FormattedMessage, useLiveDemo } from 'dumi';
import { FormattedMessage, useLiveDemo, useSiteData } from 'dumi';
import { major, minVersion } from 'semver';
import type { AntdPreviewerProps } from '.';
import useLocation from '../../../hooks/useLocation';
import BrowserFrame from '../../common/BrowserFrame';
@@ -12,6 +13,8 @@ import ClientOnly from '../../common/ClientOnly';
import CodePreview from '../../common/CodePreview';
import EditButton from '../../common/EditButton';
import SiteContext from '../../slots/SiteContext';
import DemoContext from '../../slots/DemoContext';
import { isOfficialHost } from '../../utils';
import Actions from './Actions';
const useStyle = createStyles(({ cssVar }) => {
@@ -61,6 +64,9 @@ const CodePreviewer: React.FC<AntdPreviewerProps> = (props) => {
clientOnly,
pkgDependencyList,
} = props;
const { showDebug } = React.use(DemoContext);
const { pkg } = useSiteData();
const location = useLocation();
const { styles } = useStyle();
@@ -79,17 +85,15 @@ const CodePreviewer: React.FC<AntdPreviewerProps> = (props) => {
const anchorRef = useRef<HTMLAnchorElement>(null);
const [codeExpand, setCodeExpand] = useState<boolean>(false);
const { isDark } = React.use(SiteContext);
const { hash, pathname, search } = location;
const docsOnlineUrl = `https://ant.design${pathname ?? ''}${search ?? ''}#${asset.id}`;
const [showOnlineUrl, setShowOnlineUrl] = useState<boolean>(false);
/**
* Record whether it is deployed on the official domain name.
* Note that window.location.hostname is not available on the server side due to hydration issues
*/
const [deployedOnOfficialHost, setDeployedOnOfficialHost] = useState<boolean>(true);
useEffect(() => {
const regexp = /preview-(\d+)-ant-design/; // matching PR preview addresses
setShowOnlineUrl(
process.env.NODE_ENV === 'development' || regexp.test(window.location.hostname),
);
setDeployedOnOfficialHost(isOfficialHost(window.location.hostname));
}, []);
useEffect(() => {
@@ -102,6 +106,33 @@ const CodePreviewer: React.FC<AntdPreviewerProps> = (props) => {
setCodeExpand(expand);
}, [expand]);
const generateDocUrl = (domain = 'https://ant.design') =>
`${domain}${pathname ?? ''}${search ?? ''}#${asset.id}`;
// Enable "Go Online Docs" only when deployed on non-official domains
const enableDocsOnlineUrl = process.env.NODE_ENV === 'development' || !deployedOnOfficialHost;
// Previous version demos are only available during the maintenance window
const [supportsPreviousVersionDemo, previousVersionDomain, previousVersion] = useMemo(() => {
const maintenanceDeadline = new Date('2026/12/31');
if (new Date() > maintenanceDeadline) {
return [false, undefined, -1] as const;
}
const currentMajor = major(pkg.version);
const previousMajor = Math.min(currentMajor - 1, 5);
let enabled = true;
// If the demo specifies a version, perform an additional check;
if (version) {
const minVer = minVersion(version);
enabled = minVer?.major ? minVer.major < currentMajor : true;
}
return [enabled, `https://${previousMajor}x.ant.design`, previousMajor];
}, [version, pkg.version]);
const mergedChildren = !iframe && clientOnly ? <ClientOnly>{children}</ClientOnly> : children;
const demoUrlWithTheme = useMemo(() => {
return `${demoUrl}${isDark ? '?theme=dark' : ''}`;
@@ -143,6 +174,47 @@ const CodePreviewer: React.FC<AntdPreviewerProps> = (props) => {
backgroundColor: background === 'grey' ? backgroundGrey : undefined,
};
const debugOptions: MenuProps['items'] = [
{
key: 'online',
label: (
<a
aria-label="Go to online documentation"
href={generateDocUrl()}
target="_blank"
rel="noreferrer"
>
<FormattedMessage id="app.demo.online" />
</a>
),
icon: (
<Tag variant="filled" color="blue">
ant.design
</Tag>
),
enabled: enableDocsOnlineUrl,
},
{
key: 'previousVersion',
label: (
<a
aria-label="Go to previous version documentation"
href={generateDocUrl(previousVersionDomain)}
target="_blank"
rel="noreferrer"
>
<FormattedMessage id="app.demo.previousVersion" values={{ version: previousVersion }} />
</a>
),
icon: (
<Tag variant="filled" color="purple">
v{previousVersion}
</Tag>
),
enabled: supportsPreviousVersionDemo,
},
].filter(({ enabled }) => showDebug && enabled);
const codeBox: React.ReactNode = (
<section className={codeBoxClass} id={asset.id}>
<section
@@ -174,8 +246,7 @@ const CodePreviewer: React.FC<AntdPreviewerProps> = (props) => {
/>
)}
<Actions
showOnlineUrl={showOnlineUrl}
docsOnlineUrl={docsOnlineUrl}
debugOptions={debugOptions}
entryCode={entryCode}
styleCode={style}
pkgDependencyList={pkgDependencyList}

View File

@@ -36,7 +36,8 @@
"app.demo.stackblitz": "Open in Stackblitz",
"app.demo.codeblock": "Open in Hitu (This feature is only available in the internal network environment)",
"app.demo.separate": "Open in a new window",
"app.demo.online": "Online Address",
"app.demo.online": "Official demo",
"app.demo.previousVersion": "Previous version",
"app.home.introduce": "A design system for enterprise-level products. Create an efficient and enjoyable work experience.",
"app.home.pr-welcome": "💡 It is an alpha version and still in progress. Contribution from community is welcome!",
"app.home.recommend": "Recommended",

View File

@@ -36,7 +36,8 @@
"app.demo.stackblitz": "在 Stackblitz 中打开",
"app.demo.codeblock": "在海兔中打开(此功能仅在内网环境可用)",
"app.demo.separate": "在新窗口打开",
"app.demo.online": "线上地址",
"app.demo.online": "官网示例",
"app.demo.previousVersion": "历史版本",
"app.home.introduce": "企业级产品设计体系,创造高效愉悦的工作体验",
"app.home.pr-welcome": "💡 当前为 alpha 版本,仍在开发中。欢迎社区一起共建,让 Ant Design 变得更好!",
"app.home.recommend": "精彩推荐",

View File

@@ -206,4 +206,14 @@ export function matchDeprecated(v: string): MatchDeprecatedResult {
};
}
/**
* Determine if a hostname is an official domain.
* antd creates a temporary preview site for each PR for convenient preview and testing.
* Usually on platforms like surge.sh or Cloudflare Pages.
*/
export function isOfficialHost(hostname: string) {
const officialHostnames = ['ant.design', 'antgroup.com'];
return officialHostnames.some((official) => hostname.includes(official));
}
export const getThemeConfig = () => themeConfig;

View File

@@ -14,6 +14,22 @@ tag: vVERSION
- Major version release is not included in this schedule for breaking changes and new features.
---
## 6.1.2
`2025-12-24`
- 🐞 Button fix missing wave effect and the issue where the component could not show Dropdown on hover immediately after clicking. [#56273](https://github.com/ant-design/ant-design/pull/56273) [@zombieJ](https://github.com/zombieJ)
- 💄 Breadcrumb fix style issue when using a custom `itemRender`. [#56253](https://github.com/ant-design/ant-design/pull/56253) [@guoyunhe](https://github.com/guoyunhe)
- Transfer
- 💄 Remove Transfer className for the selected state when the component is `disabled`. [#56316](https://github.com/ant-design/ant-design/pull/56316) [@zenggpzqbx](https://github.com/zenggpzqbx)
- 🐞 Transfer prioritize using the `disabled` property of the component. [#56280](https://github.com/ant-design/ant-design/pull/56280) [#56093](https://github.com/ant-design/ant-design/pull/56093) [@zenggpzqbx](https://github.com/zenggpzqbx)
- Select
- 🐞 Fix Select missing semantic DOM names. [#56322](https://github.com/ant-design/ant-design/pull/56322) [@seanparmelee](https://github.com/seanparmelee)
- 🐞 Fix Select wrong hover cursor style when in search mode. [#56130](https://github.com/ant-design/ant-design/pull/56130) [@fpsqdb](https://github.com/fpsqdb)
- 🐞 Fix Select cursor style when disabled with `showSearch` enabled. [#56340](https://github.com/ant-design/ant-design/pull/56340) [@QDyanbing](https://github.com/QDyanbing)
- 💄 Card fix style issue where an unexpected border radius is displayed when using `Card.Grid` without a header. [#56214](https://github.com/ant-design/ant-design/pull/56214) [@DDDDD12138](https://github.com/DDDDD12138)
- 💄 Tag deepen default background to improve borderless contrast. [#56326](https://github.com/ant-design/ant-design/pull/56326) [@QDyanbing](https://github.com/QDyanbing)
- ⌨ Segmented fix duplicate `role` and unnecessary `aria-` attributes on items. [#56278](https://github.com/ant-design/ant-design/pull/56278) [@aojunhao123](https://github.com/aojunhao123)
## 6.1.1

View File

@@ -15,6 +15,23 @@ tag: vVERSION
---
## 6.1.2
`2025-12-23`
- 🐞 修复 Wave 组件水波纹消失的问题,以及 Button 组件在配置 Dropdown 后,点击触发再次 `hover` 时无法立刻显示 Dropdown 的问题。[#56273](https://github.com/ant-design/ant-design/pull/56273) [@zombieJ](https://github.com/zombieJ)
- 💄 修复 Breadcrumb 组件自定义 `itemRender` 时的链接颜色异常的问题。[#56253](https://github.com/ant-design/ant-design/pull/56253) [@guoyunhe](https://github.com/guoyunhe)
- Transfer
- 💄 修复 Transfer 组件在禁用时不存在选择状态样式类的问题。[#56316](https://github.com/ant-design/ant-design/pull/56316) [@zenggpzqbx](https://github.com/zenggpzqbx)
- 🐞 优化 Transfer 组件逻辑,确保优先使用 `disabled` 属性。[#56280](https://github.com/ant-design/ant-design/pull/56280) [#56093](https://github.com/ant-design/ant-design/pull/56093) [@zenggpzqbx](https://github.com/zenggpzqbx)
- Select
- 🐞 修复 Select 组件缺少语义化 DOM 名称的问题。[#56322](https://github.com/ant-design/ant-design/pull/56322) [@seanparmelee](https://github.com/seanparmelee)
- 🐞 修复 Select 组件在搜索状态下鼠标手型样式不对的问题。[#56130](https://github.com/ant-design/ant-design/pull/56130) [@fpsqdb](https://github.com/fpsqdb)
- 🐞 修复 Select 在同时设置 `showSearch``disabled` 时鼠标样式不为禁用的问题。[#56340](https://github.com/ant-design/ant-design/pull/56340) [@QDyanbing](https://github.com/QDyanbing)
- 💄 修复 Card 组件在使用 Card.Grid 且未设置头部内容时,边框圆角显示异常的问题。[#56214](https://github.com/ant-design/ant-design/pull/56214) [@DDDDD12138](https://github.com/DDDDD12138)
- 💄 Tag 加深默认背景,提升无边框状态的对比度。[#56326](https://github.com/ant-design/ant-design/pull/56326) [@QDyanbing](https://github.com/QDyanbing)
- 🐞 修复 Segmented 组件中多余的 `role` 属性和 `aria` 属性。[#56278](https://github.com/ant-design/ant-design/pull/56278) [@aojunhao123](https://github.com/aojunhao123)
## 6.1.1
`2025-12-15`

View File

@@ -218,6 +218,10 @@ const genSelectInputStyle: GenerateStyle<SelectToken> = (token) => {
background: token.colorBgContainerDisabled,
color: token.colorTextDisabled,
cursor: 'not-allowed',
input: {
cursor: 'not-allowed',
},
},
// ==========================================================
@@ -281,7 +285,7 @@ const genSelectInputStyle: GenerateStyle<SelectToken> = (token) => {
// ======================== Show Search =======================
{
[`&-show-search:not(${componentCls}-customize-input)`]: {
[`&-show-search:not(${componentCls}-customize-input):not(${componentCls}-disabled)`]: {
cursor: 'text',
},
},

View File

@@ -225,7 +225,7 @@ export const prepareComponentToken: GetDefaultToken<'Tag'> = (token) => {
: '#fff';
return {
defaultBg: new FastColor(token.colorFillQuaternary)
defaultBg: new FastColor(token.colorFillTertiary)
.onBackground(token.colorBgContainer)
.toHexString(),
defaultColor: token.colorText,

View File

@@ -1,6 +1,6 @@
{
"name": "antd",
"version": "6.1.1",
"version": "6.1.2",
"description": "An enterprise-class UI design language and React components implementation",
"license": "MIT",
"funding": {