From 2315fe555d1036a49cdc2040247216bd97be1062 Mon Sep 17 00:00:00 2001
From: xuml <1433424397@qq.com>
Date: Tue, 28 Mar 2023 17:12:50 +0800
Subject: [PATCH] fix: fix form error style for input addonAfter slot when
 disabled

---
 components/form/style/mixin.less           |  4 ++--
 components/input/ClearableLabeledInput.tsx | 11 +++++++++--
 2 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/components/form/style/mixin.less b/components/form/style/mixin.less
index 603212a275..bb0e724691 100644
--- a/components/form/style/mixin.less
+++ b/components/form/style/mixin.less
@@ -35,8 +35,8 @@
     color: @text-color;
   }
 
-  .@{ant-prefix}-input-group-addon,
-  .@{ant-prefix}-input-number-group-addon {
+  :not(.@{ant-prefix}-input-group-addon-disabled).@{ant-prefix}-input-group-addon,
+  :not(.@{ant-prefix}-input-number-group-addon-disabled).@{ant-prefix}-input-number-group-addon {
     color: @text-color;
     border-color: @border-color;
   }
diff --git a/components/input/ClearableLabeledInput.tsx b/components/input/ClearableLabeledInput.tsx
index 85a51a8337..018b9196cf 100644
--- a/components/input/ClearableLabeledInput.tsx
+++ b/components/input/ClearableLabeledInput.tsx
@@ -144,6 +144,7 @@ export default defineComponent({
         size,
         direction,
         hidden,
+        disabled,
       } = props;
       // Not wrap when there is not addons
       if (!hasAddon({ addonBefore, addonAfter })) {
@@ -152,10 +153,16 @@ export default defineComponent({
 
       const wrapperClassName = `${prefixCls}-group`;
       const addonClassName = `${wrapperClassName}-addon`;
+      // fix form error style for input addonAfter slot when disabled
+      const mergedAddonClassName = classNames(addonClassName, {
+        [`${addonClassName}-disabled`]: disabled,
+      });
       const addonBeforeNode = addonBefore ? (
-        <span class={addonClassName}>{addonBefore}</span>
+        <span class={mergedAddonClassName}>{addonBefore}</span>
+      ) : null;
+      const addonAfterNode = addonAfter ? (
+        <span class={mergedAddonClassName}>{addonAfter}</span>
       ) : null;
-      const addonAfterNode = addonAfter ? <span class={addonClassName}>{addonAfter}</span> : null;
 
       const mergedWrapperClassName = classNames(`${prefixCls}-wrapper`, wrapperClassName, {
         [`${wrapperClassName}-rtl`]: direction === 'rtl',