Skip to content

Commit

Permalink
💥 feat: release 1.0
Browse files Browse the repository at this point in the history
  • Loading branch information
rdmclin2 committed Mar 7, 2024
2 parents 5859a5b + 7e92317 commit d41ed46
Show file tree
Hide file tree
Showing 21 changed files with 535 additions and 324 deletions.
67 changes: 0 additions & 67 deletions .dumirc.ts
Original file line number Diff line number Diff line change
@@ -1,84 +1,17 @@
import { defineConfig } from 'dumi';

const isProd = process.env.NODE_ENV === 'production';

export default defineConfig({
outputPath: 'docs-dist',
mfsu: false,
favicons: ['https://gw.alipayobjects.com/zos/antfincdn/upvrAjAPQX/Logo_Tech%252520UI.svg'],
// @ts-ignore
ssr: false,
hash: true,
ignoreMomentLocale: true,
themeConfig: {
hero: {
'zh-CN': {
title: 'ProEditor',
description: '🌟 通用编辑器 UI 框架',
actions: [
{
text: '快速开始 →',
link: '/guide/intro',
},
{
text: 'Github',
link: 'https://github.com/ant-design/pro-editor',
},
],
},
'en-US': {
title: 'ProEditor',
description: '🌟 A General Editor UI Framework',
actions: [
{
text: 'Quick Start →',
link: '/guide/intro',
},
],
},
},
socialLinks: {
github: 'https://github.com/ant-design/pro-editor',
},
footer: 'Made with ❤️ by 蚂蚁集团 - AFX & 数字科技',
features: [
{
image:
'https://mdn.alipayobjects.com/yuyan_qk0oxh/afts/img/q48YQ5X4ytAAAAAAAAAAAAAAFl94AQBr',
title: '简单易用',
description: '在 Ant Design 上进行了自己的封装,更加易用',
},
{
image: 'https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg',
title: 'Ant Design',
description: '与 Ant Design 设计体系一脉相承,无缝对接 antd 项目',
},
{
image:
'https://mdn.alipayobjects.com/yuyan_qk0oxh/afts/img/UKqDTIp55HYAAAAAAAAAAAAAFl94AQBr',
title: '通用编辑器组件',
description: '提供完备的编辑器组件,方便使用者定制自己的编辑器',
},

{
image:
'https://mdn.alipayobjects.com/yuyan_qk0oxh/afts/img/Y_NMQKxw7OgAAAAAAAAAAAAAFl94AQBr',
title: '预设样式',
description: '样式风格与 antd 一脉相承,无需魔改,浑然天成。默认好用的主题系统',
},
{
image:
'https://mdn.alipayobjects.com/yuyan_qk0oxh/afts/img/U3XjS5IA1tUAAAAAAAAAAAAAFl94AQBr',
title: '预设行为',
description: '更少的代码,更少的 Bug,更多的功能',
},

{
image: 'https://gw.alipayobjects.com/zos/antfincdn/Eb8IHpb9jE/Typescript_logo_2020.svg',
title: 'TypeScript',
description: '使用 TypeScript 开发,提供完整的类型定义文件,无需频繁打开官网',
},
],
logo: 'https://gw.alipayobjects.com/zos/antfincdn/upvrAjAPQX/Logo_Tech%252520UI.svg',
name: '@ant-design/pro-editor',
},
Expand Down
69 changes: 0 additions & 69 deletions .github/workflows/release.yml

This file was deleted.

1 change: 0 additions & 1 deletion .i18nrc.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@ module.exports = {
markdown: {
entry: ['docs/**/**.md', 'src/**/**.md'],
entryLocale: 'zh-CN',
exclude: ['docs/index.zh-CN.md'],
entryExtension: '.zh-CN.md',
outputLocales: ['en-US'],
},
Expand Down
66 changes: 33 additions & 33 deletions docs/guide/demos/ColumnList/data.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,37 +2,37 @@
* Column 所有类型
* */
export const tableColumnValueOptions = [
{ label: '序号', value: 'index' },
{ label: '圆形序号', value: 'indexBorder' },
{ label: '数字', value: 'digit' },
{ label: '密码', value: 'password' },
{ label: '金额', value: 'money' },
{ label: '文本', value: 'text' },
{ label: '文本域', value: 'textarea' },
{ label: '日期', value: 'date' },
{ label: '操作', value: 'option' },
{ label: '日期时间', value: 'dateTime' },
{ label: '', value: 'dateWeek' },
{ label: '', value: 'dateMonth' },
{ label: '季度', value: 'dateQuarter' },
{ label: '年份', value: 'dateYear' },
{ label: '日期区间', value: 'dateRange' },
{ label: '日期时间区间', value: 'dateTimeRange' },
{ label: '时间', value: 'time' },
{ label: '时间区间', value: 'timeRange' },
{ label: '下拉框', value: 'select' },
{ label: '多选框', value: 'checkbox' },
{ label: '星级组件', value: 'rate' },
{ label: '单选框', value: 'radio' },
{ label: '按钮单选框', value: 'radioButton' },
{ label: '进度条', value: 'progress' },
{ label: '百分比', value: 'percent' },
{ label: '秒格式化', value: 'second' },
{ label: '头像', value: 'avatar' },
{ label: '代码框', value: 'code' },
{ label: '开关', value: 'switch' },
{ label: '显示当前时间', value: 'fromNow' },
{ label: '图片', value: 'image' },
{ label: 'json 格式化', value: 'jsonCode' },
{ label: '颜色选择器', value: 'color' },
{ label: 'index', value: 'index' },
{ label: 'indexBorder', value: 'indexBorder' },
{ label: 'digit', value: 'digit' },
{ label: 'password', value: 'password' },
{ label: 'money', value: 'money' },
{ label: 'text', value: 'text' },
{ label: 'textarea', value: 'textarea' },
{ label: 'date', value: 'date' },
{ label: 'option', value: 'option' },
{ label: 'dateTime', value: 'dateTime' },
{ label: 'dateWeek', value: 'dateWeek' },
{ label: 'dateMonth', value: 'dateMonth' },
{ label: 'dateQuarter', value: 'dateQuarter' },
{ label: 'dateYear', value: 'dateYear' },
{ label: 'dateRange', value: 'dateRange' },
{ label: 'dateTimeRange', value: 'dateTimeRange' },
{ label: 'time', value: 'time' },
{ label: 'timeRange', value: 'timeRange' },
{ label: 'select', value: 'select' },
{ label: 'checkbox', value: 'checkbox' },
{ label: 'rate', value: 'rate' },
{ label: 'radio', value: 'radio' },
{ label: 'radioButton', value: 'radioButton' },
{ label: 'progress', value: 'progress' },
{ label: 'percent', value: 'percent' },
{ label: 'second', value: 'second' },
{ label: 'avatar', value: 'avatar' },
{ label: 'code', value: 'code' },
{ label: 'switch', value: 'switch' },
{ label: 'fromNow', value: 'fromNow' },
{ label: 'image', value: 'image' },
{ label: 'jsonCode', value: 'jsonCode' },
{ label: 'color', value: 'color' },
];
42 changes: 6 additions & 36 deletions docs/guide/intro.en-US.md
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
---
title: Quick Start
group:
title: Quick Start
title: Getting Started Quickly
order: 1
nav:
title: Document
title: Documentation
order: 1
---

Expand All @@ -22,54 +22,24 @@ $ npm install @ant-design/pro-editor -S

### Using Components

ProEditor provides a series of components optimized for the "editing" scenario, including but not limited to "SortableList", "SortableTree", "DraggablePanel", "Highlight", "ContextMenu", etc. For the complete component documentation, please refer to: [Basic Components](/components/action-icon)
ProEditor provides a series of components optimized for the "editing" scenario, including but not limited to "SortableList", "SortableTree", "DraggablePanel", "Highlight", "ContextMenu", and more. For complete component documentation, please refer to: [Basic Components](/components/action-icon)

Below is a typical array object editing scenario. Our provided ColumnList can help developers quickly implement a high-quality array editing component.

<code src="./demos/ColumnList/index.tsx" ></code>

### Component Assembler

ProEditor was initially positioned as a visual configuration framework for components. Therefore, ProEditor provides a series of containers and atomic components for visual component assembly, helping developers quickly implement a visual configuration component.
Initially, ProEditor was positioned as a visual configuration framework for components. Therefore, ProEditor provides a series of containers and atomic components for visual component assembly, helping developers quickly implement a visual configuration component.

See: [ProEditor Assembler Container](/pro-editor)

### 🚧 Using Atomic Capabilities

> Working in Progress
ProEditor will provide various atomic capabilities required for editing scenarios, including but not limited to "undo/redo", "real-time collaboration", "keyboard shortcuts", "selection capabilities", etc.

This part of the capability is still under rapid development, so stay tuned.

## Integration with Frameworks

### Integration with Umi

In the development scenario of the middle and back office, Umi is a very good choice. Integrating ProEditor with Umi is very easy. After installation, you can use it directly.

### Integration with Next.js

[Next.js](https://nextjs.org/) is a very popular development framework in the community. Integrating ProEditor with Next.js is also very easy.

Since Next.js is a CSR/SSR isomorphic React framework, and ProEditor only provides esm modules by default, after installation, you need to add relevant dependencies to `transpilePackages` in `next.config.(m)js`:

```js
/** @type {import('next').NextConfig} */
const nextConfig = {
// Convert pure esm modules to node-compatible modules
transpilePackages: ['@ant-design/pro-editor', 'leva', 'zustand'], // leva is a ProEditor dependency module
};
```

Then you can use it just like any other component.

## Engineering Capabilities

### On-Demand Loading

ProEditor supports tree shaking based on ES modules by default. Simply import `import { ActionIcon } from '@ant-design/pro-editor`; to achieve on-demand loading.
ProEditor supports tree shaking based on ES modules by default. Directly importing `import { ActionIcon } from '@ant-design/pro-editor';` will achieve on-demand loading.

### TypeScript

ProEditor is developed using TypeScript, so it provides complete type definitions.
ProEditor is developed using TypeScript, thus providing complete type definitions.
30 changes: 0 additions & 30 deletions docs/guide/intro.zh-CN.md
Original file line number Diff line number Diff line change
Expand Up @@ -34,36 +34,6 @@ ProEditor 最初的定位是作为组件的可视化配置框架。因此在 Pro

详见:[ProEditor 装配器容器](/pro-editor)

### 🚧 使用原子化能力

> Working in Progress
ProEditor 将会提供编辑场景需要的各类原子化能力,包括但不限于「撤销重做」、「实时协同」、「键盘快捷键」、「选择能力」等。

当前该部分能力仍处于高速开发中,敬请期待。

## 与框架集成

### 与 Umi 集成

在中后台的研发场景, umi 是一个非常不错的选择。ProEditor 与 umi 的集成非常容易。安装后直接使用即可。

### 与 Next.js 集成

[Next.js](https://nextjs.org/) 是社区中非常流行的研发框架。ProEditor 与 Next.js 的集成也非常容易。

由于 Next.js 是一个 CSR、SSR 同构的 React 框架,而 ProEditor 默认只提供 esm 模块,因此在安装后,需要在 `next.config.(m)js``transpilePackages` 中加入相关依赖:

```js
/** @type {import('next').NextConfig} */
const nextConfig = {
// 将纯 esm 模块转为 node 兼容模块
transpilePackages: ['@ant-design/pro-editor', 'leva', 'zustand'], // leva 为 ProEditor 依赖模块
};
```

接下来和其他组件一样使用即可。

## 工程化能力

### 按需加载
Expand Down
Loading

0 comments on commit d41ed46

Please sign in to comment.