From 74f8785aee7cb3a8c66dd6f8c009759b5e6d8785 Mon Sep 17 00:00:00 2001
From: dexter-cuijian <1109883925@qq.com>
Date: Thu, 5 Jun 2025 14:27:04 +0800
Subject: [PATCH 1/2] feat: sender add suffix

---
 components/sender/index.tsx      | 18 ++++++++++++++++++
 components/sender/style/index.ts |  5 +++++
 2 files changed, 23 insertions(+)

diff --git a/components/sender/index.tsx b/components/sender/index.tsx
index 816c10a42..23902a153 100644
--- a/components/sender/index.tsx
+++ b/components/sender/index.tsx
@@ -60,6 +60,7 @@ export interface SenderProps
   components?: SenderComponents;
   styles?: {
     prefix?: React.CSSProperties;
+    suffix?: React.CSSProperties;
     input?: React.CSSProperties;
     actions?: React.CSSProperties;
     footer?: React.CSSProperties;
@@ -67,6 +68,7 @@ export interface SenderProps
   rootClassName?: string;
   classNames?: {
     prefix?: string;
+    suffix?: string;
     input?: string;
     actions?: string;
     footer?: string;
@@ -76,6 +78,7 @@ export interface SenderProps
   actions?: React.ReactNode | ActionsRender;
   allowSpeech?: AllowSpeech;
   prefix?: React.ReactNode;
+  suffix?: React.ReactNode;
   footer?: React.ReactNode | FooterRender;
   header?: React.ReactNode;
   autoSize?: boolean | { minRows?: number; maxRows?: number };
@@ -124,6 +127,7 @@ const ForwardSender = React.forwardRef<SenderRef, SenderProps>((props, ref) => {
     disabled,
     allowSpeech,
     prefix,
+    suffix,
     footer,
     header,
     onPaste,
@@ -351,6 +355,20 @@ const ForwardSender = React.forwardRef<SenderRef, SenderProps>((props, ref) => {
             variant="borderless"
             readOnly={readOnly}
           />
+
+          {/* Suffix */}
+          {suffix && (
+            <div
+              className={classnames(
+                `${prefixCls}-suffix`,
+                contextConfig.classNames.suffix,
+                classNames.suffix,
+              )}
+              style={{ ...contextConfig.styles.suffix, ...styles.suffix }}
+            >
+              {suffix}
+            </div>
+          )}
           {/* Action List */}
           {actionNode && (
             <div
diff --git a/components/sender/style/index.ts b/components/sender/style/index.ts
index d39ed3abf..290d6ebfb 100644
--- a/components/sender/style/index.ts
+++ b/components/sender/style/index.ts
@@ -92,6 +92,11 @@ const genSenderStyle: GenerateStyle<SenderToken> = (token) => {
         flex: 'none',
       },
 
+      // ============================ Suffix =============================
+      [`${componentCls}-suffix`]: {
+        flex: 'none',
+      },
+
       // ============================= Input =============================
       [`${componentCls}-input`]: {
         padding: 0,

From ad5c19e938eaf28b2fcb3ea2c1477e2cc8d381f5 Mon Sep 17 00:00:00 2001
From: dexter-cuijian <1109883925@qq.com>
Date: Fri, 6 Jun 2025 11:00:08 +0800
Subject: [PATCH 2/2] feat: add suffix docs

---
 components/sender/demo/_semantic.tsx | 6 +++++-
 components/sender/index.zh-CN.md     | 1 +
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/components/sender/demo/_semantic.tsx b/components/sender/demo/_semantic.tsx
index 45a5f1b18..81b3fba2b 100644
--- a/components/sender/demo/_semantic.tsx
+++ b/components/sender/demo/_semantic.tsx
@@ -1,4 +1,4 @@
-import { SmileOutlined } from '@ant-design/icons';
+import { SmileOutlined, SunOutlined } from '@ant-design/icons';
 import { Sender } from '@ant-design/x';
 import { Button, Divider, Flex, Typography } from 'antd';
 import React from 'react';
@@ -8,12 +8,14 @@ import useLocale from '../../../.dumi/hooks/useLocale';
 const locales = {
   cn: {
     prefix: '前缀',
+    suffix: '后缀',
     input: '输入框',
     actions: '操作列表',
     footer: '底部',
   },
   en: {
     prefix: 'Prefix',
+    suffix: 'Suffix',
     input: 'Input',
     actions: 'Action List',
     footer: 'Footer',
@@ -42,6 +44,7 @@ const App: React.FC = () => {
         componentName="Sender"
         semantics={[
           { name: 'prefix', desc: locale.prefix },
+          { name: 'suffix', desc: locale.suffix },
           { name: 'input', desc: locale.input },
           { name: 'actions', desc: locale.actions },
           { name: 'footer', desc: locale.footer },
@@ -49,6 +52,7 @@ const App: React.FC = () => {
       >
         <Sender
           prefix={<Button type="text" icon={<SmileOutlined />} />}
+          suffix={<Button type="text" icon={<SunOutlined />} />}
           footer={() => (
             <Typography.Text type="secondary">
               Deep thinking can understand the intent behind.
diff --git a/components/sender/index.zh-CN.md b/components/sender/index.zh-CN.md
index a4b154412..1c08c1afd 100644
--- a/components/sender/index.zh-CN.md
+++ b/components/sender/index.zh-CN.md
@@ -46,6 +46,7 @@ coverDark: https://mdn.alipayobjects.com/huamei_iwk9zp/afts/img/A*cOfrS4fVkOMAAA
 | loading | 是否加载中 | boolean | false | - |
 | header | 头部面板 | ReactNode | - | - |
 | prefix | 前缀内容 | ReactNode | - | - |
+| suffix | 后缀内容 | ReactNode | - | - |
 | footer | 底部内容 | ReactNode \| (info: { components: ActionsComponents }) => ReactNode | - | - |
 | readOnly | 是否让输入框只读 | boolean | false | - |
 | rootClassName | 根元素样式类 | string | - | - |