用途：该技能是 Agenta 前端代码放置位置与 @agenta/* 工作区包使用方式的权威说明，适用于在 web/packages/ 编写或迁移代码、在应用层与包之间做选择、使用实体状态原语（molecules、bridges、picker）或编写包单元测试时。
代码放置：若代码被两个及以上功能使用，则移入包，按用途选择——可复用 UI 组件/样式工具归 @agenta/ui；实体状态（molecule、atoms、controllers）归 @agenta/entities；实体专属 UI（弹窗、选择器）归 @agenta/entity-ui；Playground 状态归 @agenta/playground，其 UI 归 @agenta/playground-ui；纯工具/类型（无 React、无 antd）归 @agenta/shared。包只能向下依赖：shared ← ui ← entities ← entity-ui ← playground ← playground-ui，禁止循环导入；包内不要旧格式兼容垫片，不要 any 类型，不要导入 queryClient 单例（用 getHostQueryClient()），应使用导出的子路径导入而非内部路径。推送前需通过 pnpm turbo run build --filter=@agenta/<package> 与 pnpm turbo run lint --filter=@agenta/<package> 校验。
主要能力与用法：新弹窗须使用 @agenta/ui 的 EnhancedModal；样式工具用 cn、textColors、bgColors，并需验证明暗主题。molecule 提供 draft、loading、cache 的统一 API，React 组件用 useAtom/molecule.useController，原子内用 get(molecule.atoms.)，回调中用 molecule.get./set.*。loadable 与 runnable bridge 通过 @agenta/entities/loadable 与 /runnable 使用选择器与动作。实体选择用 @agenta/entity-ui 的 EntityPicker，支持 cascading、breadcrumb、list-popover 三种变体及 appRevision、evaluatorRevision、testset 适配器。
测试与限制：包测试放在 tests/unit/（非 src/），目前 @agenta/entities 与 @agenta/playground 使用 vitest；测试中应 mock @agenta/sdk 而非 axios；涉及真实后端的用独立 vitest.integration.config.ts。其余包 README 提及但未在资料中展开。