# @dbx-tools/ui-teams 中文文档

规范地址：https://npmcn.com/package/%40dbx-tools/ui-teams/

版本：0\.9\.144
npm 元数据更新时间：2026-10-20T04:39:53.338Z
中文译文更新时间：2026-11-12T05:07:06.232Z
软件包许可：Apache-2\.0

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

原始 npm 页面：https://www.npmjs.com/package/%40dbx-tools/ui-teams
原文对照：https://npmcn.com/package/%40dbx-tools/ui-teams/?lang=original
项目主页：https://github.com/reggie-db/dbx-tools#readme
源码仓库：https://github.com/reggie-db/dbx-tools

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

- 包体积（解压后）：42 kB，11 个文件
- 模块格式：ES Module
- TypeScript 类型：未声明
- 运行依赖：5 个
- peer 依赖：react ~19\.2\.4，react-dom ~19\.2\.4
- 首次发布：2026-07-27T17:58:20.696Z
- 最新版本发布：2026-10-20T04:39:52.935Z
- 近 30 天下载量：2849（2026-10-12 至 2026-11-10，npm 官方下载统计）
- 已发布版本数：258（近 12 个月 258 个）

## 中文简介

微软团队适配卡和团队聊天表面的反相渲染器

## 安装

```sh
npm install @dbx-tools/ui-teams
```

也可以使用：`pnpm add @dbx-tools/ui-teams`、`yarn add @dbx-tools/ui-teams`、`bun add @dbx-tools/ui-teams`

## README

# @dbx-tools/ui-teams (英语)

微软团队适应卡或团队风格的对话预览 a 反应应用程序。 此浏览器包使用 [适应卡](https://www.npmjs.com/package/adaptivecards) 发卡器 合同来源 [@dbx-tools/ 共享团队](https://npmcn.com/package/shared/teams),共享 [@dbx-tools/ ui (英语)](https://npmcn.com/package/%40dbx-tools/appkit) 基础.

## 快开始

```tsx
import { TeamsChat } from "@dbx-tools/ui-teams/react";

export function SupportChat() {
  return <TeamsChat className="h-full" />;
}
```

在您的 AppKit 用户界面主题后导入样式表 .

## 包装

使用此软件包 [@dbx-工具/团队](https://npmcn.com/package/node/teams) 服务器插件. 导入 `@databricks/appkit-ui/styles.css` 在此软件包的样式表之前 。 这个 组件不读取 AppKit 客户端配置. `TeamsChat` 财务报告和审定财务报表 `AdaptiveCardGallery` 使用明确的 `endpoint` 财务报告和审定财务报表 `buildEndpoint` 道具吗, 默认为 `/api/teams/messages` 财务报告和审定财务报表 `/api/teams/card`。 。 。 .

浏览器预览不执行Microsoft Bot框架认证. 这个 `/messages` 路由返回 HTTP 响应中的活动 服务器只允许开发 `allowUnauthenticated` 选项。 为本地人 对照正常服务器配置进行预览,设置 `endpoint="/api/teams/activity"`保持微软团队的bot 证书和 服务器上的连接器 API 发送 .

使用 [@dbx-tools/ui-mastra (英语)](https://npmcn.com/package/%40dbx-tools/mastra) 为 Mastra 聊天和 [@dbx-tools/ ui (英语)](https://npmcn.com/package/%40dbx-tools/appkit) 用于常见的 AppKit、认证、电子邮件和搜索 组件.

## 软件包内容

-   `TeamsChat` 将 Bot 框架活动作为答复附件 适应卡. 它每个挂载一个对话ID, 取消一个活动 在卸载时请求,并支持启动提示.
-   `AdaptiveCardView` 制作已编译的可适配卡并提供支持 `Action.OpenUrl` 处理通过 `onOpenUrl`。 。 。 .
-   `AdaptiveCardGallery` 编辑 a `CardSpec`,通过 `POST /api/teams/card`,并得出结果.
-   `CARD_SAMPLES` 提供有事实的例子,将行动和说明联系起来.
-   `TextBlock` 标记用途 `marked`。如果解析失败,则渲染器显示 源为纯文本.

## 配置聊天预览

```tsx
import { TeamsChat } from "@dbx-tools/ui-teams/react";

const Chat = () => <TeamsChat className="h-full" />;
```

点 `endpoint` 如果插件以不同名称挂起, 则在其它位置 通过 `agentId` 以与特定代理人对质,而不是服务器的默认值. `starters` 替换内置 `DEFAULT_STARTERS` 电源.

## 张牌

```tsx
import { AdaptiveCardView, type AdaptiveCard } from "@dbx-tools/ui-teams/react";

const Preview = ({ card }: { card: AdaptiveCard }) => (
  <AdaptiveCardView card={card} className="ac-container" />
);
```

`AdaptiveCardView` 制作任何编译的可适应卡文档,包括一个 返回时间 `create_teams_card` 工具,插件的 `buildCard` 导出,或 页:1 `/api/teams/card` 路线。 卡片文本作为Markdown 处理, 匹配方式 团队 `TextBlock`。 。 。 .

## 添加实时预览页面

```tsx
import { AdaptiveCardGallery } from "@dbx-tools/ui-teams/react";

const Cards = () => <AdaptiveCardGallery />;
export default Cards;
```

添加 `<AdaptiveCardGallery />` 到一条路线。 它张贴编辑器 `CardSpec` 页:1 `@dbx-tools/teams` 插头 `/api/teams/card` 路径和编译 纸牌。 指向另一个山 `buildEndpoint`。 。 。 .

## 样式

从主机应用程序的 Tailwind 条目中导入样式表一次, 在 Tailwind 和 您的 AppKit 用户界面主题 :

```css
@import "tailwindcss";
@import "@databricks/appkit-ui/styles.css";
@import "@dbx-tools/ui-teams/styles.css";
```

团队样式表导入共享 `@dbx-tools/ui` 基础和用途 AppKit语义符号. 从主机应用程序 Tailwind 导入一次 进入点.

## 软件包出口

-   `./react`数字 : `TeamsChat`, (中文(简体) ), `DEFAULT_STARTERS`, (中文(简体) ), `AdaptiveCardView`, (中文(简体) ), `AdaptiveCardGallery`, (中文(简体) ), `CARD_SAMPLES`,则 再出口 `Activity`, (中文(简体) ), `AdaptiveCard`, (中文(简体) ), `CardResult`,以及 `CardSpec` 类型.
-   `./styles.css`: 基于 AppKit-token 的画廊样式和最小 适应卡容器外皮.

## 常见问题

### @dbx-tools/ui-teams 是什么？

微软团队适配卡和团队聊天表面的反相渲染器

### 如何安装 @dbx-tools/ui-teams？

在项目目录运行 npm install @dbx-tools/ui-teams，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：react（~19\.2\.4）、react-dom（~19\.2\.4）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @dbx-tools/ui-teams 支持 TypeScript 吗？

该包的 package\.json 没有声明类型入口。需要类型提示时，可以在 npm 上查找社区维护的 @types/dbx-tools\_\_ui-teams 是否存在。

### @dbx-tools/ui-teams 支持 ESM 还是 CommonJS？

以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。

### @dbx-tools/ui-teams 可以商用吗？

@dbx-tools/ui-teams 使用 Apache-2\.0 许可。宽松许可：允许商业使用、修改和再分发，并附带明确的专利授权；分发时需保留许可与 NOTICE 文件，修改过的文件要注明改动。以上为概括，不构成法律意见，请以许可原文为准。

### @dbx-tools/ui-teams 的下载量有多少？

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

### @dbx-tools/ui-teams 还在维护吗？

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