收口发布分享渠道按钮组件

发布分享弹窗渠道按钮改用 PlatformSubpanel 交互卡

分享弹窗测试断言渠道按钮接入公共子面板交互壳

补充 PlatformUiKit 收口文档和 Hermes 决策记录

src/components/common/PublishShareModal.test.tsx

@@ -57,9 +57,11 @@ describe('PublishShareModal', () => {
     expect(shareTextShell?.className).toContain('rounded-[1.25rem]');
     expect(shareTextBlock.className).toContain('whitespace-pre-wrap');
     expect(within(dialog).getByRole('button', { name: '分享' })).toBeTruthy();
-    expect(
-      within(dialog).getByRole('button', { name: '分享到微信' }),
-    ).toBeTruthy();
+    const wechatShareButton = within(dialog).getByRole('button', {
+      name: '分享到微信',
+    });
+    expect(wechatShareButton.className).toContain('bg-white/72');
+    expect(wechatShareButton.className).toContain('hover:bg-white');
     expect(
       within(dialog).getByRole('button', { name: '分享到QQ' }),
     ).toBeTruthy();

src/components/common/PublishShareModal.tsx

@@ -3,6 +3,7 @@ import { useEffect, useMemo } from 'react';
 import { useAuthUi } from '../auth/AuthUiContext';
 import { CopyFeedbackButton } from './CopyFeedbackButton';
 import { PlatformInfoBlock } from './PlatformInfoBlock';
+import { PlatformSubpanel } from './PlatformSubpanel';
 import {
   buildPublishShareText,
   type PublishShareModalPayload,
@@ -127,13 +128,17 @@ export function PublishShareModal({
         <div className="grid w-full grid-cols-3 gap-3">
           {SHARE_CHANNELS.map((channel) => {
             return (
-              <button
+              <PlatformSubpanel
+                as="button"
                 key={channel.id}
                 type="button"
                 onClick={copyShareText}
-                className="flex min-w-0 flex-col items-center gap-2 rounded-[1rem] px-2 py-2.5 text-xs font-bold text-[var(--platform-text-base)] transition hover:bg-white/62"
+                surface="flat"
+                radius="sm"
+                padding="tight"
+                interactive
+                className="flex min-w-0 flex-col items-center gap-2 text-xs font-bold text-[var(--platform-text-base)]"
                 aria-label={`分享到${channel.label}`}
-                title={channel.label}
               >
                 <span
                   className={`inline-flex h-11 w-11 items-center justify-center rounded-full shadow-sm ${channel.iconClassName}`}
@@ -141,7 +146,7 @@ export function PublishShareModal({
                   <ShareChannelLogo channel={channel} />
                 </span>
                 <span>{channel.label}</span>
-              </button>
+              </PlatformSubpanel>
             );
           })}
         </div>