From 5351fac42a47dc90adf83f6f00b2f948dfacc438 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?kiner-tang=28=E6=96=87=E8=BE=89=29?= <1127031143@qq.com>
Date: Mon, 7 Aug 2023 18:06:44 +0800
Subject: [PATCH] feat: Badge.Ribbon support rootClassName (#44056)

* feat: Badge.Ribbon support rootClassName

* docs: update rootClassName description

* feat: optimize code

* feat: optimize code
---
 components/badge/Ribbon.tsx                               | 4 +++-
 .../{demo.test.ts.snap => demo.test.tsx.snap}             | 0
 components/badge/__tests__/demo.test.ts                   | 3 ---
 components/badge/__tests__/demo.test.tsx                  | 8 ++++++++
 4 files changed, 11 insertions(+), 4 deletions(-)
 rename components/badge/__tests__/__snapshots__/{demo.test.ts.snap => demo.test.tsx.snap} (100%)
 delete mode 100644 components/badge/__tests__/demo.test.ts
 create mode 100644 components/badge/__tests__/demo.test.tsx

diff --git a/components/badge/Ribbon.tsx b/components/badge/Ribbon.tsx
index 453c071d0c61..6fdf1aff02af 100644
--- a/components/badge/Ribbon.tsx
+++ b/components/badge/Ribbon.tsx
@@ -16,6 +16,7 @@ export interface RibbonProps {
   color?: LiteralUnion<PresetColorType>;
   children?: React.ReactNode;
   placement?: RibbonPlacement;
+  rootClassName?: string;
 }
 
 const Ribbon: React.FC<RibbonProps> = (props) => {
@@ -27,6 +28,7 @@ const Ribbon: React.FC<RibbonProps> = (props) => {
     children,
     text,
     placement = 'end',
+    rootClassName,
   } = props;
   const { getPrefixCls, direction } = React.useContext(ConfigContext);
   const prefixCls = getPrefixCls('ribbon', customizePrefixCls);
@@ -48,7 +50,7 @@ const Ribbon: React.FC<RibbonProps> = (props) => {
     cornerColorStyle.color = color;
   }
   return wrapSSR(
-    <div className={classNames(`${prefixCls}-wrapper`, hashId)}>
+    <div className={classNames(`${prefixCls}-wrapper`, rootClassName, hashId)}>
       {children}
       <div className={classNames(ribbonCls, hashId)} style={{ ...colorStyle, ...style }}>
         <span className={`${prefixCls}-text`}>{text}</span>
diff --git a/components/badge/__tests__/__snapshots__/demo.test.ts.snap b/components/badge/__tests__/__snapshots__/demo.test.tsx.snap
similarity index 100%
rename from components/badge/__tests__/__snapshots__/demo.test.ts.snap
rename to components/badge/__tests__/__snapshots__/demo.test.tsx.snap
diff --git a/components/badge/__tests__/demo.test.ts b/components/badge/__tests__/demo.test.ts
deleted file mode 100644
index e1bdd02d5eee..000000000000
--- a/components/badge/__tests__/demo.test.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-import demoTest from '../../../tests/shared/demoTest';
-
-demoTest('badge');
diff --git a/components/badge/__tests__/demo.test.tsx b/components/badge/__tests__/demo.test.tsx
new file mode 100644
index 000000000000..18e41f6256fb
--- /dev/null
+++ b/components/badge/__tests__/demo.test.tsx
@@ -0,0 +1,8 @@
+import * as React from 'react';
+import demoTest, { rootPropsTest } from '../../../tests/shared/demoTest';
+
+demoTest('badge');
+
+rootPropsTest('badge', (Badge, props) => <Badge.Ribbon {...props} />, {
+  name: 'Badge.Ribbon',
+});