Skip to content

Commit 184dc92

Browse files
chenshuai2144chenshuai2144
committed
feat: 更新prettier及其插件版本，优化代码格式化；调整Markdown编辑器相关逻辑，提升性能和可读性
1 parent 74b90d8 commit 184dc92

File tree

21 files changed

+4069
-3936
lines changed

21 files changed

+4069
-3936
lines changed

‎README.md

+83-22
Original file line numberDiff line numberDiff line change
@@ -3,44 +3,105 @@
33
[![NPM version](https://img.shields.io/npm/v/@ant-design/md-editor.svg?style=flat)](https://npmjs.org/package/@ant-design/md-editor)
44
[![NPM downloads](http://img.shields.io/npm/dm/@ant-design/md-editor.svg?style=flat)](https://npmjs.org/package/@ant-design/md-editor)
55

6-
A react library developed with dumi
6+
一个使用 dumi 开发的 React 库
77

8-
## Usage
8+
## 用法
99

10-
TODO
10+
```tsx
11+
import React from 'react';
12+
import { MarkdownEditor } from '@ant-design/md-editor';
1113

12-
## Options
14+
export default () => {
15+
return (
16+
<MarkdownEditor
17+
initValue={`## 创始人
1318
14-
TODO
19+
腾讯，全称深圳市腾讯计算机系统有限公司，是由五位创始人共同创立的，他们是马化腾、张志东、许晨晔、陈一丹和曾李青。 以下是关于这些创始人的详细信息： 马化腾 马化腾，1971 年 10 月 29 日出生于广东省东方县（现海南省东方市）八所港，广东汕头人，汉族，无党派人士。他毕业于深圳大学电子工程系计算机专业。马化腾是腾讯科技（深圳）有限公司的创始人、董事会主席、首席执行官，并曾是中华人民共和国第十二、十三届全国人民代表大会代表 。马化腾在 1998 年 11 月 11 日与合伙人共同注册成立了腾讯，并在 2004 年 6 月 16 日带领腾讯在香港联合交易所有限公司主板上市。 张志东 张志东，马化腾的同学，被称为 QQ 之父。他的计算机技术非常出色，曾是深圳大学最拔尖的学生之一。张志东在腾讯担任 CTO，并在 2014 年 9 月离职，转任腾讯公司终身荣誉顾问及腾讯学院荣誉院长等职位 。
20+
`}
21+
/>
22+
);
23+
};
24+
```
1525

16-
## Development
26+
## 选项
27+
28+
### MarkdownEditor
29+
30+
| 属性 | 类型 | 描述 |
31+
| ----------------------- | -------------------------------------------------------------------------- | --------------------------- |
32+
| className | `string` | 自定义类名 |
33+
| width | `string \| number` | 编辑器宽度 |
34+
| height | `string \| number` | 编辑器高度 |
35+
| codeProps | `{ Languages?: string[] }` | 代码高亮配置 |
36+
| image | `{ upload?: (file: File[] \| string[]) => Promise<string[] \| string> }` | 图片上传配置 |
37+
| initValue | `string` | 初始内容 |
38+
| readonly | `boolean` | 是否为只读模式 |
39+
| style | `React.CSSProperties` | 容器样式 |
40+
| contentStyle | `React.CSSProperties` | 内容区域样式 |
41+
| editorStyle | `React.CSSProperties` | 编辑器样式 |
42+
| toc | `boolean` | 是否显示目录 |
43+
| toolBar | `ToolBarProps` | 工具栏配置 |
44+
| rootContainer | `React.MutableRefObject<HTMLDivElement \| undefined>` | markdown 编辑器的根容器引用 |
45+
| fncProps | `fnProps` | 功能属性配置 |
46+
| editorRef | `React.MutableRefObject<MarkdownEditorInstance \| undefined>` | 编辑器实例引用 |
47+
| eleItemRender | `(props: ElementProps, defaultDom: React.ReactNode) => React.ReactElement` | 自定义渲染元素 |
48+
| initSchemaValue | `Elements[]` | 初始结构数据 |
49+
| onChange | `(value: string, schema: Elements[]) => void` | 内容变化回调 |
50+
| reportMode | `boolean` | 是否开启报告模式 |
51+
| slideMode | `boolean` | 是否开启 PPT 模式 |
52+
| typewriter | `boolean` | 是否开启打字机模式 |
53+
| insertAutocompleteProps | `InsertAutocompleteProps` | 自动补全配置 |
54+
| titlePlaceholderContent | `string` | 标题占位符内容 |
55+
| comment | `Comment` | 评论功能配置 |
56+
57+
### ToolBarProps
58+
59+
| 属性 | 类型 | 描述 |
60+
| --------- | ----------------- | ------------------------ |
61+
| min | boolean | 控制是否启用最小化模式 |
62+
| enable | boolean | 控制是否启用工具栏 |
63+
| extra | React.ReactNode[] | 额外的自定义工具栏项目 |
64+
| hideTools | ToolsKeyType[] | 指定需要隐藏的工具栏选项 |
65+
66+
### fnProps
67+
68+
| 属性 | 类型 | 描述 |
69+
| ------ | ------------------------------------------------------------------------------- | -------------- |
70+
| render | `(props: { children: string }, defaultDom: React.ReactNode) => React.ReactNode` | 自定义渲染元素 |
71+
72+
### CommentProps
73+
74+
| Property | Type | Description |
75+
| ------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------- |
76+
| enable | `boolean` | Flag to enable/disable the component |
77+
| onSubmit | `(id: string, comment: CommentDataType) => void` | Callback when comment is submitted |
78+
| commentList | `CommentDataType[]` | Array of comments to display |
79+
| deleteConfirmText | `string` | Text shown in delete confirmation dialog |
80+
| loadMentions | `(keyword: string) => Promise<{ name: string; avatar?: string }[]>` | Function to load mention suggestions based on keyword |
81+
| mentionsPlaceholder | `string` | Placeholder text for mentions input |
82+
| editorRender | `(defaultDom: ReactNode) => ReactNode` | Custom render function for editor |
83+
| previewRender | `(props: { comment: CommentDataType[] }, defaultDom: ReactNode) => React.ReactElement` | Custom render function for preview |
84+
| onDelete | `(id: string \| number, item: CommentDataType) => void` | Callback when comment is deleted |
85+
| listItemRender | `(doms: { checkbox: React.ReactNode; mentionsUser: React.ReactNode; children: React.ReactNode }, props: ElementProps<ListItemNode>) => React.ReactNode` | Custom render function for list items |
86+
87+
## 开发
1788

1889
```bash
19-
# install dependencies
90+
# 安装依赖
2091
$ pnpm install
2192

22-
# develop library by docs demo
93+
# 通过文档示例开发库
2394
$ pnpm start
2495

25-
# build library source code
96+
# 构建库源代码
2697
$ pnpm run build
2798

28-
# build library source code in watch mode
99+
# 以监视模式构建库源代码
29100
$ pnpm run build:watch
30101

31-
# build docs
102+
# 构建文档
32103
$ pnpm run docs:build
33104

34-
# check your project for potential problems
105+
# 检查项目中的潜在问题
35106
$ pnpm run doctor
36107
```
37-
38-
## LICENSE
39-
40-
MIT
41-
42-
```pie
43-
"Dogs" : 386
44-
"Cats" : 85
45-
"Rats" : 15
46-
```

‎package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -109,8 +109,8 @@
109109
"jsdom": "^25.0.1",
110110
"lint-staged": "^13.3.0",
111111
"nwsapi": "2.2.13",
112-
"prettier": "^2.8.8",
113-
"prettier-plugin-organize-imports": "^3.2.4",
112+
"prettier": "^3.0.0",
113+
"prettier-plugin-organize-imports": "^4.1.0",
114114
"prettier-plugin-packagejson": "^2.5.6",
115115
"react": "^18.3.1",
116116
"react-dom": "^18.3.1",

0 commit comments

Comments
 (0)