# @cratis/showrunner\.usher\.react 中文文档

规范地址：https://npmcn.com/package/%40cratis/showrunner.usher.react/

版本：1\.21\.1
npm 元数据更新时间：2026-11-10T23:01:12.573Z
中文译文更新时间：2026-11-10T23:39:07.924Z
软件包许可：MIT

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40cratis/showrunner.usher.react
原文对照：https://npmcn.com/package/%40cratis/showrunner.usher.react/?lang=original
项目主页：https://github.com/Cratis/Showrunner
源码仓库：https://github.com/Cratis/Showrunner

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：929 kB，507 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：包内自带
- 运行依赖：1 个
- peer 依赖：react ^19\.0\.0，@cratis/arc ^22\.155\.0，@cratis/arc\.react ^22\.155\.0，@cratis/components ^4\.38\.0，@cratis/fundamentals ^7\.27\.0
- 首次发布：2026-10-27T05:35:06.051Z
- 最新版本发布：2026-11-10T23:01:12.158Z
- 近 30 天下载量：2946（2026-10-11 至 2026-11-09，npm 官方下载统计）
- 已发布版本数：18（近 12 个月 18 个）

## 中文简介

Usher的回放组件——Showrunner支持部分用于议题报告和支持对话,基于Cratis Arc和Cratis组件.

## 安装

```sh
npm install @cratis/showrunner.usher.react
```

也可以使用：`pnpm add @cratis/showrunner.usher.react`、`yarn add @cratis/showrunner.usher.react`、`bun add @cratis/showrunner.usher.react`

## README

# @cratis/showrunner. usher. react

为 Usher 反应组件, Showrunner 支持部分: 报告一个问题, 报告这个错误, 以及我的问题侧面 每期的谈话记录 建造在 `@cratis/components` 和生成的代理 `@cratis/showrunner.usher`。如何使用它: [文件/用户/反应](https://npmcn.com/Documentation/Usher/react.md)。 。 。 .

## 构成部分等级

```
UsherProvider                 provides UsherContext, wraps ArcContext for correlation tracking, renders the dialogs once
├── ReportIssueDialog         CommandDialog<ReportIssue>
│   ├── SentWithReport        what is sent along: location, version, recent requests
│   └── AccessFields          share identity / grant access / duration, with AccessNotice
├── ReportErrorDialog         CommandDialog<ReportError>
│   ├── TechnicalDetails      collapsed <details>: type, correlation id, stack frames
│   ├── SentWithReport
│   └── AccessFields
└── MyIssuesDialog            Dialog placement='end', 720px
    ├── IssueList             DataTableForObservableQuery<MyIssues>
    └── IssueView             also exported on its own
        ├── IssueHeader, StatusStrip, QuestionBanner
        ├── IssueConversationPanel   ChatConversation; AnswerQuestion or AddDetails
        ├── IdentityPanel            ShareIdentityDialog
        ├── AccessPanel              GrantAccessDialog, revoke with confirmation, SupportSessions
        └── IssueActions             ReopenIssueDialog, withdraw with confirmation
ReportButton, MyIssuesButton  open the dialogs through useUsher()
```

## 结构决定

-   **一个提供商,一次完成对话框.** `UsherProvider` 拥有 `useDialog` 包装; 按钮和 `useUsher()` 仅调用 `UsherContext`。呼叫者的位置与 `useSliceContext()` 地点 `useUsher()` 实值 呼叫并传递到对话框, 因为对话框在提供者, 在呼叫者的切片范围之外渲染.
-   **通过HTTP头回调进行关联跟踪.** Arc没有全局的指令或查询结果观察者, 但是Arc React 将每个命令和快照查询 `httpHeadersCallback` 最远者 `ArcContext`编辑 提供者将其包成添加 `X-Correlation-ID` 对每一次请求,都要记念它`Correlation/`) (中文(简体) ). Arc 的后端用途 id 一个请求携带。 可观察的查询通过Arc的共享中枢连接,没有被跟踪.
-   **`UsherBoundary` 保留 乌舍出所报.** Usher自己的组件与未跟踪者运行 `ArcContext` 内部 `<Slice>` 边框,所以它的请求没有随报告一起发送,它的代理人不会改变切片 上下文.
-   **授予共享身份的准入部队.** `useAccessChoice` 沿着窗体通过 `onFieldChange` 和部队 `shareIdentity` 结束 `currentValues`。 。 。 . `shareIdentity` 被删除 `initialValues`,因为表单合并 `initialValues` 结束 `currentValues`。 。 。 .

## 状态

决定以纯的、指定的模块进行;组件渲染和电线事件:

| 模块 | 决定 |
| --- | --- |
| `Reporting/AccessChoice.ts` | 访问选择转换,强制身份,直到访问持续 |
| `Reporting/reportValues.ts` | 报告初始值、 错误细节 |
| `Issues/issueStates.ts` | 州徽, 关闭州, 状态剥离阶梯 |
| `Issues/MyIssuesList.ts` | 等待计数, 关闭过滤器, 修复已释放 |
| `Issues/conversationMessages.ts` | 聊天作者和消息机构 |
| `Issues/accessStatus.ts` | 支持是否在时钟上签名 |
| `Issues/MyIssues/MyIssuesNavigation.ts` | 列表或发行,显示已关闭 |
| `Buttons/buttonModels.ts` | 文本、工具提示和按钮的可访问名称 |
| `Labels/` | 英语默认值、 深重覆被、 占位符 |

## CSS公约

一个样式表, `styles.css`,导出为 `@cratis/showrunner.usher.react/styles`建筑没有CSS管道,所以 组件不导入 CSS。 类为前缀 `usher-` 带有类似 BEM 的元素名称,以及每种颜色、边框和 半径来自 `--cratis-*` 标志 状态通过 `data-*` 属性( e)`data-highlighted`, (中文(简体) ), `data-reached`, (中文(简体) ), `data-current`) (中文(简体) ).

## 扩展

-   新案文:添加到 `UsherLabels` 财务报告和审定财务报表 `defaultUsherLabels`;每个组件读取标签 `UsherContext`。 。 。 .
-   新对话条目类型: 添加其句子到 `ConversationEventLabels` 并将其映射到 `conversationMessages.ts`。 。 。 .
-   一个新的对话框: 渲染它 `useDialog` 包装 `UsherProvider` 并添加打开器到 `UsherContextValue` 财务报告和审定财务报表 `useUsher`。 。 。 .

## 常见问题

### @cratis/showrunner\.usher\.react 是什么？

Usher的回放组件——Showrunner支持部分用于议题报告和支持对话,基于Cratis Arc和Cratis组件\.

### 如何安装 @cratis/showrunner\.usher\.react？

在项目目录运行 npm install @cratis/showrunner\.usher\.react，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：react（^19\.0\.0）、@cratis/arc（^22\.155\.0）、@cratis/arc\.react（^22\.155\.0）、@cratis/components（^4\.38\.0）、@cratis/fundamentals（^7\.27\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @cratis/showrunner\.usher\.react 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @cratis/showrunner\.usher\.react 支持 ESM 还是 CommonJS？

同时提供 ES Module 与 CommonJS 入口，import 和 require\(\) 都可以使用，打包工具会自动选择合适的版本。

### @cratis/showrunner\.usher\.react 可以商用吗？

@cratis/showrunner\.usher\.react 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @cratis/showrunner\.usher\.react 的下载量有多少？

根据 npm 官方下载统计，@cratis/showrunner\.usher\.react 在 2026/10/11 – 2026/11/09 这 30 天内被下载 2,946 次，日均约 98 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @cratis/showrunner\.usher\.react 还在维护吗？

最新版本 1\.21\.1 发布于 2026/11/11（今天）；至今共发布 18 个版本，其中过去 12 个月发布了 18 个；首次发布于 2026/10/27。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。