收口充值弹窗图标槽

将充值结果弹窗和支付确认遮罩的图标槽迁移到共享 PlatformIconBadge
为 PlatformIconBadge 补充稳定类名并更新相关测试
同步更新 PlatformUiKit 收口文档与团队决策记录

src/components/common/PlatformIconBadge.test.tsx

@@ -11,6 +11,7 @@ test('renders neutral circular icon badge by default', () => {
 
   const badge = document.querySelector('[aria-hidden="true"]');
 
+  expect(badge?.className).toContain('platform-icon-badge');
   expect(badge?.className).toContain('h-9');
   expect(badge?.className).toContain('rounded-full');
   expect(badge?.className).toContain('bg-[var(--platform-neutral-bg)]');

src/components/common/PlatformIconBadge.tsx

@@ -69,6 +69,7 @@ export function PlatformIconBadge({
       aria-label={label}
       aria-hidden={label ? undefined : true}
       className={[
+        'platform-icon-badge',
         'grid shrink-0 place-items-center',
         PLATFORM_ICON_BADGE_SIZE_CLASS[size],
         PLATFORM_ICON_BADGE_SHAPE_CLASS[shape],

src/components/rpg-entry/RpgEntryHomeView.recharge.test.tsx

@@ -2173,7 +2173,11 @@ test('profile recharge modal confirms virtual payment after returning without ha
   act(() => {
     window.dispatchEvent(new PageTransitionEvent('pageshow'));
   });
-  expect(screen.getByRole('dialog', { name: '正在确认支付' })).toBeTruthy();
+  const confirmingDialog = screen.getByRole('dialog', { name: '正在确认支付' });
+  expect(confirmingDialog).toBeTruthy();
+  expect(
+    confirmingDialog.querySelector('.platform-icon-badge')?.className,
+  ).toContain('h-14');
   await waitFor(() => {
     expect(mockConfirmWechatRpgProfileRechargeOrder).toHaveBeenCalledWith(
       'order-wechat-no-hash-paid',
@@ -2442,6 +2446,10 @@ test('profile recharge modal releases submitting state after cancelled wechat pa
   expect(
     await screen.findByRole('dialog', { name: '支付已取消' }),
   ).toBeTruthy();
+  const cancelDialog = screen.getByRole('dialog', { name: '支付已取消' });
+  expect(
+    cancelDialog.querySelector('.platform-icon-badge')?.className,
+  ).toContain('platform-icon-badge');
   expect(screen.getByText('本次没有扣款，账户状态未发生变化。')).toBeTruthy();
   await waitFor(() => {
     expect(

src/components/rpg-entry/RpgEntryHomeView.tsx

@@ -123,6 +123,7 @@ import {
 import { PlatformActionButton } from '../common/PlatformActionButton';
 import { PlatformEmptyState } from '../common/PlatformEmptyState';
 import { PlatformFieldLabel } from '../common/PlatformFieldLabel';
+import { PlatformIconBadge } from '../common/PlatformIconBadge';
 import { PlatformIconButton } from '../common/PlatformIconButton';
 import { PlatformModalCloseButton } from '../common/PlatformModalCloseButton';
 import { PlatformPillBadge } from '../common/PlatformPillBadge';
@@ -3297,11 +3298,12 @@ function RechargePaymentResultModal({
         className="platform-modal-shell platform-remap-surface w-full max-w-sm overflow-hidden rounded-[1.4rem]"
       >
         <div className="px-5 pb-5 pt-6 text-center">
-          <div
-            className={`mx-auto flex h-14 w-14 items-center justify-center rounded-full bg-white/10 ${iconClass}`}
-          >
-            <Icon className="h-8 w-8" aria-hidden="true" />
-          </div>
+          <PlatformIconBadge
+            icon={<Icon className="h-8 w-8" aria-hidden="true" />}
+            size="xl"
+            tone="neutral"
+            className={`mx-auto bg-white/10 ${iconClass}`}
+          />
           <div
             id="recharge-payment-result-title"
             className="mt-4 text-xl font-black text-[var(--platform-text-strong)]"
@@ -3336,9 +3338,12 @@ function RechargePaymentConfirmationMask({ orderId }: { orderId: string }) {
         className="platform-modal-shell platform-remap-surface w-full max-w-sm overflow-hidden rounded-[1.4rem]"
       >
         <div className="px-5 pb-5 pt-6 text-center">
-          <div className="mx-auto flex h-14 w-14 items-center justify-center rounded-full bg-white/10 text-[var(--platform-accent)]">
-            <Loader2 className="h-8 w-8 animate-spin" aria-hidden="true" />
-          </div>
+          <PlatformIconBadge
+            icon={<Loader2 className="h-8 w-8 animate-spin" aria-hidden="true" />}
+            size="xl"
+            tone="neutral"
+            className="mx-auto bg-white/10 text-[var(--platform-accent)]"
+          />
           <div className="mt-4 text-xl font-black text-[var(--platform-text-strong)]">
             正在确认支付
           </div>