Merge branch 'master' into feature-merge-master

wanghui2021 · Nov 30, 2023 · 8816dc0 · 8816dc0
2 parents f5e0408 + acf056c
commit 8816dc0
Show file tree

Hide file tree

Showing 25 changed files with 211 additions and 283 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
diff --git a/.dumi/pages/index/components/BannerRecommends.tsx b/.dumi/pages/index/components/BannerRecommends.tsx
@@ -1,30 +1,39 @@
 import * as React from 'react';
-import { createStyles, css, useTheme } from 'antd-style';
-import classNames from 'classnames';
 import type { FC } from 'react';
 import { useContext } from 'react';
-import { Typography, Skeleton, Carousel, Badge } from 'antd';
-import type { Extra, Icon } from './util';
+import { Badge, Carousel, Skeleton, Typography } from 'antd';
+import { createStyles, useTheme } from 'antd-style';
+import classNames from 'classnames';
+
+import useLocale from '../../../hooks/useLocale';
 import SiteContext from '../../../theme/slots/SiteContext';
+import type { Extra, Icon } from './util';
 import { getCarouselStyle, useSiteData } from './util';
-import useLocale from '../../../hooks/useLocale';
 
-const useStyle = createStyles(({ token }) => {
+const useStyle = createStyles(({ token, css, cx }) => {
   const { carousel } = getCarouselStyle();
 
+  const itemBase = css`
+    display: flex;
+    flex: 1 1 0;
+    flex-direction: column;
+    align-items: stretch;
+    text-decoration: none;
+    background: ${token.colorBgContainer};
+    border: ${token.lineWidth}px solid ${token.colorBorderSecondary};
+    border-radius: ${token.borderRadiusLG}px;
+    transition: all ${token.motionDurationSlow};
+    padding-block: ${token.paddingMD}px;
+    padding-inline: ${token.paddingLG}px;
+    box-sizing: border-box;
+  `;
+
   return {
-    itemBase: css`
-      display: flex;
-      flex: 1 1 0;
-      flex-direction: column;
-      align-items: stretch;
-      text-decoration: none;
-      background: ${token.colorBgContainer};
-      border: ${token.lineWidth}px solid ${token.colorBorderSecondary};
-      border-radius: ${token.borderRadiusLG}px;
-      transition: all ${token.motionDurationSlow};
-      padding-block: ${token.paddingMD}px;
-      padding-inline: ${token.paddingLG}px;
+    itemBase,
+    ribbon: css`
+      & > .${cx(itemBase)} {
+        height: 100%;
+      }
     `,
     cardItem: css`
       &:hover {
@@ -58,7 +67,7 @@ interface RecommendItemProps {
   icons: Icon[];
   className?: string;
 }
-const RecommendItem = ({ extra, index, icons, className }: RecommendItemProps) => {
+const RecommendItem: React.FC<RecommendItemProps> = ({ extra, index, icons, className }) => {
   const token = useTheme();
   const { styles } = useStyle();
 
@@ -88,7 +97,7 @@ const RecommendItem = ({ extra, index, icons, className }: RecommendItemProps) =
 
   if (index === 0) {
     return (
-      <Badge.Ribbon text="HOT" color="red">
+      <Badge.Ribbon text="HOT" color="red" rootClassName={styles.ribbon}>
         {card}
       </Badge.Ribbon>
     );
@@ -120,7 +129,7 @@ export const BannerRecommendsFallback: FC = () => {
   );
 };
 
-export default function BannerRecommends() {
+const BannerRecommends: React.FC = () => {
   const { styles } = useStyle();
   const [, lang] = useLocale();
   const { isMobile } = React.useContext(SiteContext);
@@ -159,4 +168,6 @@ export default function BannerRecommends() {
       )}
     </div>
   );
-}
+};
+
+export default BannerRecommends;
diff --git a/.dumi/theme/slots/Header/index.tsx b/.dumi/theme/slots/Header/index.tsx
@@ -367,7 +367,14 @@ const Header: React.FC = () => {
         </Popover>
       )}
       {isZhCN && bannerVisible && (
-        <ConfigProvider theme={{ token: { colorInfoBg: '#ceebf9', colorTextBase: '#000' } }}>
+        <ConfigProvider
+          theme={{
+            token: {
+              colorInfoBg: 'linear-gradient(90deg, #84fab0, #8fd3f4)',
+              colorTextBase: '#000',
+            },
+          }}
+        >
           <Alert
             className={styles.banner}
             message={

diff --git a/.github/workflows/pr-contributor-welcome.yml b/.github/workflows/pr-contributor-welcome.yml
@@ -0,0 +1,28 @@
+# 当 PR 被合并时，留言欢迎加入共建群
+name: PullRequest Contributor Welcome
+
+on:
+  pull_request:
+    types:
+      - closed
+    paths:
+      - 'components/**'
+
+jobs:
+  comment:
+    if: github.event.pull_request.merged == true && github.repository == 'ant-design/ant-design'
+    runs-on: ubuntu-latest
+    steps:
+      - name: Comment on PR
+        uses: actions-cool/maintain-one-comment@v3
+        with:
+          token: ${{ secrets.GITHUB_TOKEN }}
+          body: |
+            🎉 Thank you for your contribution! If you have not yet joined our DingTalk community group, please feel free to join us (when joining, please provide the link to this PR).
+
+            🎉 感谢您的贡献！如果您还没有加入钉钉社区群，请扫描下方二维码加入我们（加群时请提供此 PR 链接）。
+
+            <img src="https://github.com/ant-design/ant-design/assets/5378891/e24c6080-bf38-4523-b1cd-f6c43ad7375f" height="200" />
+
+            <!-- WELCOME_CONTRIBUTION -->
+          body-include: '<!-- WELCOME_CONTRIBUTION -->'
diff --git a/.github/workflows/trigger-argos-with-whitelist-users.yml b/.github/workflows/trigger-argos-with-whitelist-users.yml
diff --git a/README-zh_CN.md b/README-zh_CN.md
@@ -12,7 +12,7 @@
 
 [![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]
 
-[![][bundlephobia-image]][bundlephobia-url] [![][bundlesize-js-image]][unpkg-js-url] [![FOSSA Status][fossa-image]][fossa-url] [![Covered by Argos Visual Testing][argos-ci-image]][argos-ci-url]
+[![][bundlephobia-image]][bundlephobia-url] [![][bundlesize-js-image]][unpkg-js-url] [![FOSSA Status][fossa-image]][fossa-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]
 
@@ -40,8 +40,6 @@
 [renovate-dashboard-url]: https://github.com/ant-design/ant-design/issues/32498
 [dumi-image]: https://img.shields.io/badge/docs%20by-dumi-blue?style=flat-square
 [dumi-url]: https://github.com/umijs/dumi
-[argos-ci-image]: https://argos-ci.com/badge.svg
-[argos-ci-url]: https://app.argos-ci.com/ant-design/ant-design/reference
 
 </div>
 

diff --git a/README.md b/README.md
@@ -12,7 +12,7 @@ An enterprise-class UI design language and React UI library.
 
 [![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]
 
-[![][bundlephobia-image]][bundlephobia-url] [![][bundlesize-js-image]][unpkg-js-url] [![FOSSA Status][fossa-image]][fossa-url] [![Covered by Argos Visual Testing][argos-ci-image]][argos-ci-url]
+[![][bundlephobia-image]][bundlephobia-url] [![][bundlesize-js-image]][unpkg-js-url] [![FOSSA Status][fossa-image]][fossa-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]
 
@@ -40,8 +40,6 @@ An enterprise-class UI design language and React UI library.
 [renovate-dashboard-url]: https://github.com/ant-design/ant-design/issues/32498
 [dumi-image]: https://img.shields.io/badge/docs%20by-dumi-blue?style=flat-square
 [dumi-url]: https://github.com/umijs/dumi
-[argos-ci-image]: https://argos-ci.com/badge.svg
-[argos-ci-url]: https://app.argos-ci.com/ant-design/ant-design/reference
 
 </div>
 

diff --git a/argos-white-listed-users b/argos-white-listed-users
diff --git a/components/alert/style/index.ts b/components/alert/style/index.ts
@@ -36,7 +36,7 @@ const genAlertTypeStyle = (
   token: AlertToken,
   alertCls: string,
 ): CSSObject => ({
-  backgroundColor: bgColor,
+  background: bgColor,
   border: `${unit(token.lineWidth)} ${token.lineType} ${borderColor}`,
   [`${alertCls}-icon`]: {
     color: iconColor,

diff --git a/components/float-button/BackTop.tsx b/components/float-button/BackTop.tsx
@@ -10,7 +10,13 @@ import type { ConfigConsumerProps } from '../config-provider';
 import { ConfigContext } from '../config-provider';
 import FloatButtonGroupContext from './context';
 import FloatButton, { floatButtonPrefixCls } from './FloatButton';
-import type { BackTopProps, FloatButtonProps, FloatButtonRef, FloatButtonShape } from './interface';
+import type {
+  BackTopProps,
+  FloatButtonElement,
+  FloatButtonProps,
+  FloatButtonRef,
+  FloatButtonShape,
+} from './interface';
 
 const BackTop = React.forwardRef<FloatButtonRef, BackTopProps>((props, ref) => {
   const {
@@ -57,7 +63,7 @@ const BackTop = React.forwardRef<FloatButtonRef, BackTopProps>((props, ref) => {
     };
   }, [target]);
 
-  const scrollToTop: React.MouseEventHandler<HTMLDivElement> = (e) => {
+  const scrollToTop: React.MouseEventHandler<FloatButtonElement> = (e) => {
     scrollTo(0, { getContainer: target || getDefaultTarget, duration });
     onClick?.(e);
   };

diff --git a/components/float-button/FloatButton.tsx b/components/float-button/FloatButton.tsx
@@ -1,4 +1,4 @@
-import React, { forwardRef, useContext, useMemo } from 'react';
+import React, { useContext, useMemo } from 'react';
 import classNames from 'classnames';
 import omit from 'rc-util/lib/omit';
 
@@ -13,16 +13,16 @@ import type {
   CompoundedComponent,
   FloatButtonBadgeProps,
   FloatButtonContentProps,
+  FloatButtonElement,
   FloatButtonProps,
-  FloatButtonRef,
   FloatButtonShape,
 } from './interface';
 import useStyle from './style';
 import useCSSVarCls from '../config-provider/hooks/useCSSVarCls';
 
 export const floatButtonPrefixCls = 'float-btn';
 
-const FloatButton = forwardRef<FloatButtonRef['nativeElement'], FloatButtonProps>((props, ref) => {
+const FloatButton = React.forwardRef<FloatButtonElement, FloatButtonProps>((props, ref) => {
   const {
     prefixCls: customizePrefixCls,
     className,

diff --git a/components/float-button/__tests__/index.test.tsx b/components/float-button/__tests__/index.test.tsx
@@ -1,4 +1,5 @@
 import React from 'react';
+
 import FloatButton from '..';
 import mountTest from '../../../tests/shared/mountTest';
 import rtlTest from '../../../tests/shared/rtlTest';
@@ -38,11 +39,20 @@ describe('FloatButton', () => {
     rerender(<FloatButton shape={squareShape} />);
     expect(container.querySelector(`.ant-float-btn-${squareShape}`)).toBeTruthy();
   });
-  it('support onClick', () => {
+  it('support onClick & onMouseEnter & onMouseLeave', () => {
     const onClick = jest.fn();
-    const { container } = render(<FloatButton onClick={onClick} />);
-    fireEvent.click(container.querySelector('.ant-float-btn')!);
+    const onMouseEnter = jest.fn();
+    const onMouseLeave = jest.fn();
+    const { container } = render(
+      <FloatButton onClick={onClick} onMouseEnter={onMouseEnter} onMouseLeave={onMouseLeave} />,
+    );
+    const element = container.querySelector('.ant-float-btn')!;
+    fireEvent.click(element);
     expect(onClick).toHaveBeenCalled();
+    fireEvent.mouseEnter(element);
+    expect(onMouseEnter).toHaveBeenCalled();
+    fireEvent.mouseLeave(element);
+    expect(onMouseLeave).toHaveBeenCalled();
   });
   it('should console Error', () => {
     const errSpy = jest.spyOn(console, 'error').mockImplementation(() => {});

diff --git a/components/float-button/demo/basic.tsx b/components/float-button/demo/basic.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { FloatButton } from 'antd';
 
-const App: React.FC = () => <FloatButton onClick={() => console.log('click')} />;
+const App: React.FC = () => <FloatButton onClick={() => console.log('onClick')} />;
 
 export default App;