* 安装
[大
这个软件包是 仅限无害环境管理。 。 。 .
要安装 @ant-design/pro-editor,运行以下命令:
$ pnpm install @ant-design/pro-editor
由 Next.js 编译
[注]
加上:transpilePackages: ['@ant-design/pro-editor']改为next.config.js。例如:
const nextConfig = {
transpilePackages: ['@ant-design/pro-editor', 'leva', 'zustand'],
};
使用量
import { SmileOutlined } from '@ant-design/icons';
import { ActionIcon } from '@ant-design/pro-editor';
export default () => (
<ActionIcon
title={'Function button description'}
icon={<SmileOutlined />}
onClick={() => {
alert('Trigger action');
}}
/>
);
* 特性
[注]
前端组件库使发展发生了革命性的变化,通过规模级提高了效率,并提高了用户的经验。 然而,像Ant Design(antd)和ProComponents这样的图书馆一样成熟,人们可能会怀疑是否有创新的余地.
增强ProEditor的功能
[注]
我们设想ProEditor作为编辑组件的基础库,类似于蚂蚁,使开发者能够轻松地创建具有固有的优越用户经验的复杂的交互式组件. 之所以如此
ProEditor。 。 。 .
我们的proEditor原则:
- 🖐️ 直观编辑: 支持多选取,脱选等自然用户互动,以及键盘快捷键,确保编辑体验平稳.
- ✨ 默认修改: 增强 Ant Design组件,以提供更好的用户体验并进行更多的抛光和完善.
- 🔧 打开灵活性:提供原子级能力,提供广泛的组件,钩子,以及用于广泛定制和灵活性的公用功能.
编辑领域的UI框架和前端组件解决方案 :
[TIP]
ProEditor专注于扩大可行的限制,并增加开发者可用于构建精密,互动和以用户为中心的网络应用程序的各种工具. 例如:
- 📦 可拖动面板:允许可扩展和可移动面板,增强用户界面的交互性.
- 📝 列列表: 提供方便用户的可分类列表,通过列定义可以管理,简化了复杂的列表交互.
- 🎨 自由加拿大语Name:提供类似于Sketch或Figma等应用程序的可缩放画布,为用户提供巨大的创意设计空间.
- 🔍 图标选择器:一个与图标font相容的图标选择工具,使得将一大批图标融入到设计中更为容易.
- 👥 在线协作: 利用yjs和zustand store等技术整合多用户能力,实现实时协作编辑和互动.
框架结构
ProEditor的结构是为了有效地促进这些原则.
显示大小写
让我们展示一下ProEditor的一些签名组件:
| 可拖动面板 | 列列表 |
|---|---|
| 可换装和可移动面板 | 基于列定义的方便用户排序列表 |
 |  |
| 自由加拿大语Name | 图标选择器 |
| 类似于 Skech 或 Figma 的无限可缩放画布 | 一个与图标font相容的图标选择工具 |
 |  |
| 在线协作 | |
| 由yjs和zustand商店包裹的多用户能力. | |
 |
QQ 浏览器兼容性
[注]
 |  |  |  |  |
|---|---|---|---|---|
| 边缘 | 上两个版本 | 上两个版本 | 上两个版本 | 上两个版本 |
地方发展
您可以使用 Github 代码空间进行在线开发 :
或者复制它用于本地发展:
$ git clone https://github.com/ant-design/pro-editor.git
$ cd pro-editor
$ pnpm install
$ pnpm dev
捐款
[大
加入我们的合作生态系统。 你的贡献是我们项目的心跳。 这就是你如何成为我们充满生机的社区的一个组成部分:
- 整合和创新: 将Ant Design Pro, umi, ProEditor 纳入您的项目中. 你的用法和反馈对我们来说是宝贵的.
- 声音你的洞察力-遇到故障了吗? 有问题吗? 你的观点很重要 通过提交来分享 问题 帮助我们增强用户体验.
- 塑造未来:有代码增强或功能创意? 我们邀请你提议 拖动请求 并直接促进我们代码库的发展.
每个贡献,无论大小,都会被庆祝. 加入我们的任务,完善和提升开放源码企业UI组件的世界
|
|
|
|---|---|
|
|
|
|
生态系统
- 亲组件 - 为企业级应用程序设计,像Pro一样使用蚂蚁设计.
- 编辑器 - 最终编辑器UI框架和组件.
- 前进 - React-Flow上的流程编辑框架基础.
- ProChat 语录 - 用于快速构建 LLM 聊天界面的组件库.