# @elaraai/east-ui 中文文档

规范地址：https://npmcn.com/package/%40elaraai/east-ui/

版本：1\.0\.107
npm 元数据更新时间：2026-11-13T06:54:15.421Z
中文译文更新时间：2026-11-13T11:42:53.770Z
软件包许可：AGPL-3\.0-or-later

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

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

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

- 包体积（解压后）：12.3 MB，2073 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- Node.js 要求：\>=22\.0\.0
- 运行依赖：0 个
- peer 依赖：@elaraai/east 1\.0\.107
- 首次发布：2025-12-01T08:10:02.586Z
- 最新版本发布：2026-11-13T06:54:14.979Z
- 近 30 天下载量：4147（2026-10-13 至 2026-11-11，npm 官方下载统计）
- 已发布版本数：154（近 12 个月 154 个）

## 中文简介

东 UI - 东语的 UI 组件

## 安装

```sh
npm install @elaraai/east-ui
```

也可以使用：`pnpm add @elaraai/east-ui`、`yarn add @elaraai/east-ui`、`bun add @elaraai/east-ui`

## README

# 东方大学

> 东语的 UI 组件定义

[![License](https://img.shields.io/badge/license-AGPL--3.0-blue.svg)](https://npmcn.com/package/%40elaraai/east-ui/LICENSE.md) [![Node Version](https://img.shields.io/badge/node-%3E%3D22.0.0-brightgreen.svg)](https://nodejs.org/)

**东方大学** 提供输入的 UI 组件定义 [东方语言](https://github.com/elaraai/east-workspace/tree/main/libs/east). 组件返回描述UI布局的数据结构,而不是直接渲染,使不同渲染环境中的可移植性得以实现.

## 特征

-   **版式组件** - 盒子, Stack, Grid, 分解器, 分解器
-   **类型** - 文本、代码、标题、链接、高亮、标记、列表、代码Block
-   **按钮** - 有变体和状态的按钮、图标按钮
-   **表单** - 字段、输入、选择、检查框、切换、滑动、文本区域、标签输入、文件上载
-   **收款** - 表、计划、数据列表、树影
-   **图表** - 区域、酒吧、行会、派会、雷达、散会、火花会、酒吧、酒吧
-   **反馈** - 警报,进步
-   **显示** - 徽章、塔克、神通、Stat、图标
-   **披露** - 手风琴、塔布斯、卡鲁塞尔
-   **重叠** - 对话框、绘图器、波波弗、工具提示、菜单、HoverCard、TogletTip、动作栏
-   **样式** - 类型安全样式变体(FontWight,TextAlign,ColorScheme,大小等)
-   **州管理层** - 状态读作/写作的平台功能

## 安装

```bash
npm install @elaraai/east-ui @elaraai/east
```

## 快速启动

```typescript
import { East, ArrayType } from "@elaraai/east";
import { Stack, Text, Button, UIComponentType } from "@elaraai/east-ui";

// Define a UI component
const MyComponent = East.function(
    [],
    UIComponentType,
    $ => {
        return Stack.Root([
            Text.Root("Hello, World!", { fontSize: "xl", fontWeight: "bold" }),
            Button.Root("Click Me", { variant: "solid", colorPalette: "blue" }),
        ], { gap: "4", direction: "column" });
    }
);

// Convert to IR for serialization or rendering
const ir = MyComponent.toIR();
```

## 构成部分类别

| 类别 | 构成部分 | 说明 |
| --- | --- | --- |
| **版式** | `Box`, (中文(简体) ), `Stack`, (中文(简体) ), `Grid`, (中文(简体) ), `Splitter`, (中文(简体) ), `Separator` | 集装箱和布局组件 |
| **类型** | `Text`, (中文(简体) ), `Code`, (中文(简体) ), `Heading`, (中文(简体) ), `Link`, (中文(简体) ), `Highlight`, (中文(简体) ), `Mark`, (中文(简体) ), `List`, (中文(简体) ), `CodeBlock` | 文本和打字组件 |
| **按钮** | `Button`, (中文(简体) ), `IconButton` | 交互式按钮组件 |
| **表单** | `Input`, (中文(简体) ), `Select`, (中文(简体) ), `Checkbox`, (中文(简体) ), `Switch`, (中文(简体) ), `Slider`, (中文(简体) ), `Textarea`, (中文(简体) ), `TagsInput`, (中文(简体) ), `FileUpload`, (中文(简体) ), `Field` | 窗体输入组件 |
| **收款** | `Table`, (中文(简体) ), `Plan`, (中文(简体) ), `DataList`, (中文(简体) ), `TreeView` | 数据显示组件 |
| **图表** | `Chart.Line`, (中文(简体) ), `Chart.Column` (纵向), `Chart.Bar` (横向), `Chart.Area`, (中文(简体) ), `Chart.Scatter`, (中文(简体) ), `Chart.Band`, (中文(简体) ), `Sparkline` | 数据可视化 |
| **显示** | `Badge`, (中文(简体) ), `Tag`, (中文(简体) ), `Avatar`, (中文(简体) ), `Stat`, (中文(简体) ), `Icon` | 视觉显示组件 |
| **反馈** | `Alert`, (中文(简体) ), `Progress` | 用户反馈组件 |
| **披露** | `Accordion`, (中文(简体) ), `Tabs`, (中文(简体) ), `Carousel` | 内容组织 |
| **重叠** | `Dialog`, (中文(简体) ), `Drawer`, (中文(简体) ), `Popover`, (中文(简体) ), `Tooltip`, (中文(简体) ), `Menu`, (中文(简体) ), `HoverCard`, (中文(简体) ), `ToggleTip`, (中文(简体) ), `ActionBar` | 重叠组件 |
| **集装箱** | `Card` | 内容容器 |

## 文档

-   **[用户](https://npmcn.com/package/%40elaraai/east-ui/USAGE.md)** - 综合指南,包括所有组成部分的例子
-   **[东方文档](https://github.com/elaraai/east-workspace/tree/main/libs/east)** - 东部核心语文文件

## 设计哲学

东UI组件 **声明性数据结构**,不包含要素:

1.  **可移动性** - 用户界面定义可在任何环境中序列化和渲染
2.  **类型安全** - 对组件结构和型式进行全面编译时间检查
3.  **可编译性** - 组件是返回所输入值的东函数
4.  **关注的分离** - UI逻辑(East UI)与渲染(@elaai/east-ui-组件)分离

## 发展

```bash
npm run build     # Compile TypeScript
npm run test      # Run test suite (requires build)
npm run lint      # Check code quality
```

## Claude 代码插件

东方生态系统也运载a [克劳德代码](https://claude.com/claude-code) 插件 — East 语言技能, 实例搜索, 以及 East 代码的先发制人诊断 `elaraai` 市场:

```text
# Inside Claude Code
/plugin marketplace add elaraai/east-workspace
/plugin install east@elaraai
```

```bash
# From a terminal
claude plugin marketplace add elaraai/east-workspace
claude plugin install east@elaraai
```

## 许可证

双重许可证:

-   **开源**数字 : [AGPL-3.0 导弹](https://npmcn.com/package/%40elaraai/east-ui/LICENSE.md) - 免费开放源码使用
-   **商业**:可供专有用途-联系方式 [支助@elara.ai](mailto:support@elara.ai)

### 生态系统

-   **[东](https://github.com/elaraai/east-workspace/tree/main/libs/east)**: statical地打出,以表达为主的语言有可序列的IR. 运行跨 TypeScript, Python, C 等运行时间的可移植逻辑.
    
    -   [@elaraai/东边](https://www.npmjs.com/package/@elaraai/east): 有类型系统、表达式和参考JS编译器的核心语言SDK
-   **[东节点](https://github.com/elaraai/east-workspace/tree/main/libs/east-node)**: Node.js 平台用于I/O,数据库和系统操作的功能.
    
    -   [@elaraai/东节点-std](https://www.npmjs.com/package/@elaraai/east-node-std): 控制台、 文件系统、 获取、 加密、 时间、 路径、 随机
    -   [@elaraai/东-北-欧](https://www.npmjs.com/package/@elaraai/east-node-io): SQLite, PostgreSQL, MySQL, MongoDB, Redis, S3, FTP, SFTP, XLSX, XML, 压缩
    -   [@elaraai/东-节点-cli](https://www.npmjs.com/package/@elaraai/east-node-cli): 用于在 Node.js 运行 East IR 程序的 CLI
-   **[东 C](https://github.com/elaraai/east-workspace/tree/main/libs/east-c)**: C11本土运行时间用于执行东IR. 被压死 `linux-x64` 财务报告和审定财务报表 `linux-arm64`,附于每个 GitHub 发布.
    
    -   `east-c`: Core 运行时间 — 类型系统, IR 解释器, 200+内置, 序列化( Beast2, JSON, CSV, East text)
    -   `east-c-std`: 控制台、 文件系统、 获取、 加密、 时间、 路径、 随机
    -   `east-c-cli`: 用于在本地运行 East IR 程序的 CLI
-   **[东 Py](https://github.com/elaraai/east-workspace/tree/main/libs/east-py)**: Python 运行时间,标准平台,I/O,以及数据科学平台功能. 发布至PyPI.
    
    -   [东平](https://pypi.org/project/east-py/): Core Python 运行时间——类型系统,IR编译器,212+内建,Cython加速热路
    -   [东平-上](https://pypi.org/project/east-py-std/): 控制台、 文件系统、 获取、 加密、 时间、 路径、 随机
    -   [东比欧](https://pypi.org/project/east-py-io/): SQLite, PostgreSQL, MySQL, MongoDB, Redis, S3, FTP, SFTP, XLSX, XML, 压缩
    -   [东-平-克利](https://pypi.org/project/east-py-cli/): 用于在 Python 运行 East IR 程序的 CLI
    -   [东平数据科学](https://pypi.org/project/east-py-datascience/) (平价)+ [@elaraai/东平数据科学](https://www.npmjs.com/package/@elaraai/east-py-datascience) (npm):优化(MADS, Optuna, ALNS, GoogleOR),ML(XGBoost, LightGBM, NGBoost, PyTorch, Lightning, GP), 贝叶斯推论(PyMC),可解释性(SHAP),相通性预测(MAPIE)
-   **[东方大学](https://github.com/elaraai/east-workspace/tree/main/libs/east-ui)**:已打入UI组件定义和React渲染器,外加VS代码预览.
    
    -   [@elaraai/东-伊](https://www.npmjs.com/package/@elaraai/east-ui): 50+ 键入的UI 组件用于布局,窗体,图表,表格,对话框
    -   [@elaraai/ 东- ui- 组件](https://www.npmjs.com/package/@elaraai/east-ui-components): 带有 Chakra UI v3 样式的反相渲染器
    -   [@elaraai/e3-ui (英语)](https://www.npmjs.com/package/@elaraai/e3-ui):e3 + UI桥-数据绑定, `e3.ui()` 任务,显示
    -   [@elaai/e3-ui-组件](https://www.npmjs.com/package/@elaraai/e3-ui-components): 为 e3 API 执行查询钩和预览组件
    -   [@elaraai/e3-ui-cli (英语)](https://www.npmjs.com/package/@elaraai/e3-ui-cli): 在终端浏览一个 e3 寄存器(`e3-ui [repo]`),并将East-ui / e3-ui组件制入PNG(`e3-ui shot`(中文(简体) )
-   **[e3——东行发动机](https://github.com/elaraai/east-workspace/tree/main/libs/e3)**: 大规模运行东方管线的持久执行引擎。 类似Git的内容可处理存储,自动记忆,反应数据流,实时监测.
    
    -   [@elaraai/e3 请检查url=值 (帮助)](https://www.npmjs.com/package/@elaraai/e3): SDK 用于编写带有打字任务和管道的 E3 包
    -   [@elaraai/e3-core (英语)](https://www.npmjs.com/package/@elaraai/e3-core): 对象存储、数据流管弦器、执行状态
    -   [@elaai/e3型](https://www.npmjs.com/package/@elaraai/e3-types): e3 包的共享类型定义
    -   [@elaraai/e3-cli (英语)](https://www.npmjs.com/package/@elaraai/e3-cli)数字 : `e3 repo`, (中文(简体) ), `e3 package`, (中文(简体) ), `e3 workspace`, (中文(简体) ), `e3 dataflow run`, (中文(简体) ), `e3 watch`, (中文(简体) ), `e3 task logs` 命令
    -   [@elaraai/e3-api-客户端](https://www.npmjs.com/package/@elaraai/e3-api-client)远程 e3 寄存器的 HTTP 客户端
    -   [@elaraai/e3-api-服务器](https://www.npmjs.com/package/@elaraai/e3-api-server): 用于 e3 寄存器的 REST API 服务器
    -   [@elaraai/e3-api测试](https://www.npmjs.com/package/@elaraai/e3-api-tests): 共享 API 合规测试套件

## 链接

-   **现场显示大小写**数字 : [https://elaai.github.io/东-伊/](https://elaraai.github.io/east-ui/)
-   **网站**数字 : [https://elaai.com/ (中文(简体) )](https://elaraai.com/)
-   **东仓库**数字 : [https://github.com/elaraai/east-workspace/tree/main/libs/east 页面存档备份,存于互联网档案馆](https://github.com/elaraai/east-workspace/tree/main/libs/east)
-   **问题**数字 : [https://github.com/elaraai/east-workspace/issues (中文(简体) )](https://github.com/elaraai/east-workspace/issues)
-   **电子邮件**数字 : [支助@elara.ai](mailto:support@elara.ai)

## 关于埃拉拉

东方由 [Elara AI Pty有限公司](https://elaraai.com/)一个由AI驱动的平台 创造经济数字双胞胎 企业优化业绩。 Elara将业务目标、决定和数据结合起来,以帮助各组织在业务、采购、销售和客户参与以及项目和投资规划方面作出由数据驱动的决定。 东能给以埃拉拉解决方案的计算层,使得复杂的商业逻辑和数据能够以简单,类型安全和可移植的语言来表达.

* * *

_开发者 [Elara AI Pty有限公司](https://elaraai.com/)。 。 。 ._

* * *

_开发者 [Elara AI Pty有限公司](https://elaraai.com/) - 为AI驱动的商业优化的计算层提供动力._

## 常见问题

### @elaraai/east-ui 是什么？

东 UI - 东语的 UI 组件

### 如何安装 @elaraai/east-ui？

在项目目录运行 npm install @elaraai/east-ui，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：@elaraai/east（1\.0\.107）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @elaraai/east-ui 支持 TypeScript 吗？

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

### @elaraai/east-ui 支持 ESM 还是 CommonJS？

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

### @elaraai/east-ui 需要什么版本的 Node\.js？

package\.json 的 engines 字段要求 Node\.js \>=22\.0\.0。版本不符时 npm 默认只给出警告，开启 engine-strict 后会拒绝安装。

### @elaraai/east-ui 可以商用吗？

@elaraai/east-ui 使用 AGPL-3\.0-or-later 许可。最严格的 Copyleft：除分发外，通过网络向用户提供基于它的服务也需要开源对应源码。闭源 SaaS 使用前务必评估。以上为概括，不构成法律意见，请以许可原文为准。

### @elaraai/east-ui 的下载量有多少？

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

### @elaraai/east-ui 还在维护吗？

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