Genarrative/docs/technical/WORK_PUBLISH_SHARE_PANEL_2026-05-02.md

作品发布完成分享面板 2026-05-02

背景

当前 RPG、拼图、大鱼吃小鱼、抓大鹅 Match3D 的发布链路已经能把作品同步到公开广场，但发布成功后的用户反馈主要是跳转到作品详情或按钮状态变化。用户完成发布后缺少一个明确的“分享给朋友”收口动作，导致公开作品号与链接不够显眼。

目标

发布动作确认成功后弹出独立平台风面板：

1. 面板标题固定为“分享给朋友”。
2. 标题下显示可复制的分享文本。
3. 分享文本下方显示主按钮“分享”，点击后复制完整分享文本。
4. 页面底部显示三个分享渠道 icon：微信、QQ、抖音。
5. 移动端与桌面端都使用居中独立面板，复用 UnifiedModal 的平台弹窗外壳。

分享文本

分享文本统一使用：

邀请你来玩《作品名》
作品号：公开作品码
公开链接

公开作品码来源：

• RPG：优先使用发布后作品库 / 公开详情返回的 publicWorkCode。
• 拼图：使用 buildPuzzlePublicWorkCode(profileId)。
• 大鱼吃小鱼：使用 buildBigFishPublicWorkCode(sourceSessionId)。
• 抓大鹅 Match3D：使用 buildMatch3DPublicWorkCode(profileId)。

公开链接统一使用 buildPublicWorkStagePath(stage, publicWorkCode) 转换为当前站点绝对链接。

渠道 icon 规则

本次只做前端分享引导，不接入微信、QQ、抖音的原生 SDK。点击渠道 icon 与主“分享”按钮保持一致，复制同一份分享文本。

仓库现有 media/social-media-group/wechat.png 与 qq.png 是社群二维码，不作为本面板渠道 icon 使用。渠道 icon 必须使用微信、QQ、抖音的品牌 SVG 轮廓，外层保持圆形触控底座；不能用通用聊天气泡、音乐符号或纯文字替代 logo。

面板样式约束

分享面板通过 UnifiedModal portal 挂载到页面根部时，需要在遮罩层补齐当前平台主题类，避免主题变量脱离页面容器后丢失。面板外壳继续使用 platform-modal-shell 的 --platform-modal-fill 背景，并在移动端覆盖平台弹窗默认底部抽屉布局，保持居中显示。

同类平台弹窗，包括删除作品等确认面板，也必须遵守同一条约束：portal 挂载时遮罩层必须带 platform-theme platform-theme--light/dark，面板必须保留 platform-modal-shell 的实体背景，不能把主面板做成透明或只依赖 backdrop blur。移动端高风险确认弹窗必须显式居中显示，避免被底部导航、安全区或底部抽屉布局遮住。

接入范围

• RpgCreationResultActionBar：RPG 发布成功后由父层回传分享数据并打开面板。
• PuzzleResultView：拼图发布 action 完成后由平台父层打开面板。
• BigFishResultView：大鱼发布 action 完成后由平台父层打开面板。
• Match3DResultView：本地 publishMatch3DWork 成功后直接触发面板数据，分享链接对齐现有作品详情入口。
• PlatformEntryFlowShellImpl：集中维护发布完成分享状态，避免各玩法重复实现弹窗。

验收标准

1. 用户完成作品发布后能看到“分享给朋友”面板。
2. 面板内展示完整分享文本，主按钮点击后复制成功并短暂显示成功态。
3. 底部固定展示微信、QQ、抖音三个渠道 icon。
4. 关闭面板不影响已发布作品进入详情、刷新广场或继续游玩。
5. 不新增后端接口，不改动 SpacetimeDB 表结构。