---
name: deppon-npm-skills
description: >-
    deppon 业务前端专项 Cursor skills 的总索引：按场景选用 skill，并映射到私有 npm 包
    @deppon/deppon-template、@deppon/deppon-ui、@deppon/deppon-router、@deppon/deppon-request。
    用户提到 deppon-npm-skills、选型、不知用哪个 skill、外仓接入 deppon 时先读本 skill。
---

# deppon-npm-skills：专项技能索引（npm 为准）

## 前置（外仓必读）

接入与文档来源：**`deppon-npm-private-registry`**（私有 registry、以 `node_modules/@deppon/*` 内 README / `.d.ts` 为权威，**不依赖** `deppon-npm` 的 `site/` 示例路径）。

## 场景 → 专项 skill → 主要 npm 包

| 场景摘要                              | 专项 skill                          | 主要 npm 包                                       |
| ------------------------------------- | ----------------------------------- | ------------------------------------------------- |
| ProLayout 壳、侧栏、菜单路由          | `deppon-pro-layout-page`            | `@deppon/deppon-template`                         |
| 单字段 ProField（非整表）             | `deppon-pro-field`                  | `@deppon/deppon-template`                         |
| 单页 ProForm、规则、actions           | `deppon-pro-form`                   | `@deppon/deppon-template`，UI `@deppon/deppon-ui` |
| 多卡片多表单、锚点、统一提交          | `deppon-pro-form-group`             | 同上                                              |
| 多卡片只读切换、头部自定义按钮        | `deppon-pro-form-advanced-customer` | 同上                                              |
| 多实例表单性能（可见/缓存/数据分离）  | `deppon-pro-form-performance`       | 同上                                              |
| 多产品 × 线路组合表单                 | `deppon-product-route-multi-form`   | 同上                                              |
| 列表搜索、分页、工具栏、插槽列        | `deppon-pro-table`                  | `@deppon/deppon-template`，UI `@deppon/deppon-ui` |
| 多 Tab 内多套 ProTable                | `deppon-pro-table-advanced-tabs`    | 同上                                              |
| 多级表头                              | `deppon-pro-table-multi-header`     | 同上                                              |
| 展开行、嵌套子表                      | `deppon-pro-table-expand-nested`    | 同上                                              |
| 单元格可编辑表                        | `deppon-pro-table-cell-editable`    | 同上                                              |
| 行编辑 `row-edit`                     | `deppon-pro-table-row-edit`         | 同上                                              |
| 非 fixed、自定义表头区、滚动容器      | `deppon-pro-table-nofixed-scroll`   | 同上                                              |
| 独立查询 Form + Table + 底部/弹窗实体 Form | `deppon-pro-page-query-table-form` | 同上（非表格内单元格编辑）                        |
| 新建 / 详情 / 工作流 **同页三态**（`query.sourceType`、多套底栏、子表 row-edit 切换） | `deppon-pro-page-insert-detail-workflow` | 同上                                              |
| ProDialog、表单弹窗、自定义 body      | `deppon-pro-dialog`                 | 同上                                              |
| ElCard / Button / Message 基础用法    | `deppon-ui-examples-primitives`     | `@deppon/deppon-ui`                               |
| depponPush、viewTab、路由参数         | `deppon-router-push-viewtab`        | `@deppon/deppon-router`，常配合 `vue-router`      |
| 请求封装与错误结构                    | `deppon-request-package-demo`       | `@deppon/deppon-request`                          |

> **产品 PRD / 高保真原型**：不在本包。请用 `@deppon/pm-toolkit` 内的 `deppon-prd-generator`（`npx @deppon/pm-toolkit` / `deppon-pm` 安装）。

## 选用专项 Skill（与上表一致，便于 @ 引用）

-   私有 registry 与包文档：`deppon-npm-private-registry`
-   产品 PRD + 原型：走 `@deppon/pm-toolkit` → `deppon-prd-generator`（本包不包含）
-   表单单页：`deppon-pro-form`
-   表单分组/多表单：`deppon-pro-form-group`
-   高级客户类表单：`deppon-pro-form-advanced-customer`
-   多表单性能：`deppon-pro-form-performance`、`deppon-product-route-multi-form`
-   列表：`deppon-pro-table`
-   多级表头：`deppon-pro-table-multi-header`
-   列表高级 tab：`deppon-pro-table-advanced-tabs`
-   展开行/子表：`deppon-pro-table-expand-nested`
-   单元格可编辑：`deppon-pro-table-cell-editable`
-   行编辑：`deppon-pro-table-row-edit`
-   非 fixed + 自定义头：`deppon-pro-table-nofixed-scroll`
-   查询条+表+底部/弹窗实体表单：`deppon-pro-page-query-table-form`（旧名 `deppon-pro-page-crud`）
-   新建+详情+工作流同页三态：`deppon-pro-page-insert-detail-workflow`
-   弹窗：`deppon-pro-dialog`
-   单字段：`deppon-pro-field`
-   布局壳：`deppon-pro-layout-page`
-   路由：`deppon-router-push-viewtab`
-   请求：`deppon-request-package-demo`
-   基础 UI：`deppon-ui-examples-primitives`

## Agent 工作方式

0. 外仓或未确认依赖时：先 **`deppon-npm-private-registry`**，再生成代码。
1. 需求对标：用本表选 **专项 skill**；需要 PRD/原型时改用 **`@deppon/pm-toolkit`** 的 `deppon-prd-generator`。
2. 实现时：**以消费者项目内 `node_modules/@deppon/*` 的 README 与 `*.d.ts` 为准**；不要默认读取 `deppon-npm` 的 `site/src/views/examples`，除非用户当前工作区就是该 monorepo 并明确要求对齐 demo。
3. `import` 路径与 peer 依赖版本遵守各包 README。
