# @silkrun/ui 中文文档
规范地址：https://npmcn.com/package/%40silkrun/ui/
版本：0\.1\.17
npm 元数据更新时间：2026-11-02T11:02:50.178Z
中文译文更新时间：2026-11-02T11:48:46.769Z
软件包许可：MIT
本文由上游 README 机器翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。
原始 npm 页面：https://www.npmjs.com/package/%40silkrun/ui
原文对照：https://npmcn.com/package/%40silkrun/ui/?lang=original
## 关键信息（来自 npm 元数据）
- 包体积（解压后）：3.2 MB，735 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- 运行依赖：15 个
- peer 依赖：react ^18\.3\.1，lexical ^0\.43\.0，react-dom ^18\.3\.1，pdfjs-dist ^4\.10\.38，@lexical/link ^0\.43\.0，@lexical/list ^0\.43\.0，@lexical/react ^0\.43\.0，@lexical/utils ^0\.43\.0，@lexical/markdown ^0\.43\.0，@lexical/code-core ^0\.43\.0，@lexical/rich-text ^0\.43\.0，@lexical/selection ^0\.43\.0，micromark-util-decode-string ^2\.0\.1
- 首次发布：2026-09-29T11:13:38.993Z
- 最新版本发布：2026-11-02T11:02:49.970Z
- 已发布版本数：18（近 12 个月 18 个）
## 中文简介
带有主题CSS的Silkrun React组件库
## 安装
```sh
npm install @silkrun/ui
```
也可以使用：`pnpm add @silkrun/ui`、`yarn add @silkrun/ui`、`bun add @silkrun/ui`
## README
# @silkrun / ui
用于Silkrun应用的React组件和主题CSS。
## 安装
```sh
npm install @silkrun/ui react react-dom
```
需要React 18。
## 使用
在应用的入口点导入一次样式表，然后从各自的路径导入每个组件：
```tsx
import '@silkrun/ui/styles.css'
import { Button } from '@silkrun/ui/button'
import { Dialog } from '@silkrun/ui/dialog'
export function App() {
return
}
```
没有根 `@silkrun/ui` 导入。每个组件路径将你的bundle保存为你使用的组件。
样式表是预编译的，所以你的应用不需要Tailwind设置。字体是通过相对URL捆绑和引用的，所以任何处理CSS的捆绑器 `url()` （Vite, webpack, Next.js）为你复制它们。
## 明暗模式
集 `data-theme` 在 ``：
```html
```
组件读取属性，并且没有自己的主题道具。没有它，光的主题适用。
## 组件
`accordion`， `account-menu`， `action-bar`， `action-sheet`， `alert`， `app-card`， `app-header`， `app-icon-status`， `avatar`， `badge`， `bottom-dock`， `breadcrumb`， `button`， `calendar`， `card`， `checkbox`， `checkbox-group`， `chip`， `code`， `command-dialog`， `context-menu`， `copy-field`， `corner-cluster`， `date-picker`， `descriptions`， `dialog`， `divider`， `dot`， `dropdown-menu`， `dynamic-island`， `empty-state`， `event-block`， `fab`， `field`， `file-drop`， `form`， `grid`， `heading`， `hover-actions`， `hover-card`， `icon`， `icon-button`， `image`， `image-grid`， `input`， `launchpad`， `lazy-load`， `list`， `markdown-text`， `media-viewer`， `message-row`， `messages`， `overlay`， `page-header`， `pagination`， `pane`， `pane-header`， `picker`， `popconfirm`， `popover`， `progress`， `radio-group`， `rich-text-input`， `row`， `row-group`， `scroll-area`， `search-trigger`， `segmented`， `select`， `settings-navigation`， `sheet`， `sidebar-app-identity`， `sidebar-nav`， `sidebar-screen`， `sidebar-shell`， `sidebar-user`， `skeleton`， `slider`， `smart-list`， `spinner`， `splitter`， `stack`， `stage-progress`， `surface`， `switch`， `tab-bar`， `table`， `tabs`， `tags-input`， `text`， `text-diff`， `textarea`， `time-picker`， `toaster`， `tool-use`， `tooltip`， `topbar-ghost`， `ui-provider`， `use-roving-focus`， `workspace-stage`
每个名称都是它的导入路径： `@silkrun/ui/` (或 `@silkrun/ui/components/`）。 `select` 也有 `@silkrun/ui/components/select/native-select`, `@silkrun/ui/lib/cn` 是类名帮助器。
`rich-text-input` 需要Lexical包，它是可选的peers: install `lexical` 和 `@lexical/*` 列表中列出的包 `peerDependencies` 如果你使用它。
## 许可证
麻省理工学院。捆绑字体有自己的许可证：Noto Sans （Apache 2.0）和Roboto （SIL开放字体许可证1.1） `theme/fonts/`.
## 常见问题
### @silkrun/ui 是什么？
带有主题CSS的Silkrun React组件库
### 如何安装 @silkrun/ui？
在项目目录运行 npm install @silkrun/ui，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：react（^18\.3\.1）、react-dom（^18\.3\.1）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。
### @silkrun/ui 支持 TypeScript 吗？
支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。
### @silkrun/ui 支持 ESM 还是 CommonJS？
以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。
### @silkrun/ui 可以商用吗？
@silkrun/ui 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。
### @silkrun/ui 还在维护吗？
最新版本 0\.1\.17 发布于 2026/11/02（1 天前）；至今共发布 18 个版本，其中过去 12 个月发布了 18 个；首次发布于 2026/09/29。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。