用途
该技能解决 CometChat 组件在 Angular 应用中的放置问题：聊天功能应放在哪里、如何组织布局、如何路由、如何在移动端降级显示。它基于 @cometchat/chat-uikit-angular@5（已验证 5.1.0–5.2.0），仅使用 angular-v5 目录中的组件，布局依据官方任务指南（new-chat、group-chat、threaded-messages、search-messages 等）构建。技能以增量方式追加到用户应用，不修改现有代码。
主要能力
- 提供放置决策：无范围请求默认使用核心界面（列表 + 消息窗格，线程和搜索作为面板）；完整聊天应用使用组合应用（标签选择器 + 面板）；仪表盘内嵌使用核心界面嵌入现有布局槽；支持小部件使用单会话（头部 + 列表 + 输入框，无列表面板）。
- 使用 ChatStateService 管理活动项：Angular 提供可注入的活动聊天状态源，暴露信号和可观察对象，模板中优先使用信号。避免使用本地选中字段导致状态漂移。
- 面板作为列而非覆盖层：线程、用户/群组详情和搜索是同一 flex 外壳中的额外列，打开面板不得调整或重新挂载消息列表，关闭后必须恢复原布局。
- 聊天页面路由：提供路由配置示例，强调不要按路由重新初始化 CometChat（初始化在引导时一次完成），离开时需取消订阅（takeUntil(destroy$)），:uid 解析在 ngOnInit 中通过 ChatStateService 完成。
- 嵌入现有仪表盘：为主机槽提供确定高度，让外壳填充，不要将套件放在由内容决定大小的容器中。
- 移动端单窗格：低于约 768px 时只显示列表或会话，不能同时显示。通过 ChatStateService 驱动 [hidden]，并提供返回控件调用 clearActiveChat()。
使用方式
先阅读配套技能：cometchat-angular-v5-core（安装、凭据、初始化→登录→渲染，以及布局尺寸规则）和 cometchat-angular-v5-components（组件选择及其真实输入/输出）。然后根据放置决策选择对应配方文件：references/core-surface.md 或 references/combined-app.md。布局特定输入应从组件的 .md 孪生文件获取，而非读取已安装包。
适用场景
- 决定聊天功能放在专用路由、现有仪表盘面板、小部件还是完整多窗格应用中。
- 需要将聊天嵌入现有 Angular 应用且保持增量修改。
- 需要处理移动端单窗格降级。
- 需要正确管理活动聊天状态和面板布局。
限制
- 仅适用于 @cometchat/chat-uikit-angular@5（5.1.0–5.2.0 已验证）。
- 仅使用 angular-v5 目录中的组件。
- 以增量方式追加到用户应用，不修改现有代码。
- 不提供自动入口（如反应、提及、回执、输入状态、媒体），这些在 v5 中为核心功能且已开启。
- 具体收费、价格、平台等信息暂未提供。
常见陷阱
- 两个状态源：本地选中字段加 ChatStateService，导致漂移，列表停止高亮。
- 面板作为覆盖层：线程渲染在列表上方而非旁边，关闭后无法恢复布局。
- 按路由重新初始化：初始化应在引导时一次完成。
- 导航时未清理：泄漏的监听器继续对已销毁视图触发。
- 嵌入槽未设置尺寸：套件在内容决定大小的容器中塌缩为零高度。
- 移动端同时显示两个窗格：在 375px 下不可用。
验证方式
点击会话打开并高亮行；打开线程不调整消息列表大小；关闭后恢复原布局；导航离开再返回不重复消息；375px 下只显示一个窗格且有可用的返回控件；无控制台错误。
完成时要求
告知开发者更改内容并命名文件：构建的布局——存在哪些窗格，移动端单窗格回退如何表现。标记仅开发用的内容，说明未触碰的部分（增量修改）。然后提供三个可选项并等待选择：添加另一功能、自定义主题、手动测试。