This commit is contained in:
yanmao 2021-11-08 20:09:23 +08:00
parent 163c39d1f8
commit f587b17e32
32 changed files with 909 additions and 509 deletions

View File

@ -114,6 +114,7 @@ function getMenus(opts: { lang?: string; base: '/docs' | '/plugin' | '/api' }) {
'/api/editor-inline',
'/api/editor-block',
'/api/editor-list',
'/api/editor-node-id',
],
},
{
@ -134,22 +135,22 @@ function getMenus(opts: { lang?: string; base: '/docs' | '/plugin' | '/api' }) {
},
{
title: 'Schema',
'title_zh-CN': '架构',
'title_zh-CN': 'Schema',
path: '/api/schema',
},
{
title: 'Range',
'title_zh-CN': '光标范围',
'title_zh-CN': 'Range',
children: ['/api/range', '/api/selection'],
},
{
title: 'History',
'title_zh-CN': '历史记录',
'title_zh-CN': 'History',
path: '/api/history',
},
{
title: 'Editor',
'title_zh-CN': '编辑器',
'title_zh-CN': 'Editor',
children: [
{
title: 'Change',
@ -160,12 +161,15 @@ function getMenus(opts: { lang?: string; base: '/docs' | '/plugin' | '/api' }) {
`${
opts.lang === 'zh-CN' ? '/zh-CN' : ''
}/api/editor-change-event`,
`${
opts.lang === 'zh-CN' ? '/zh-CN' : ''
}/api/editor-change-range`,
],
},
{
title:
opts.lang === 'zh-CN'
? '共有属性和方法'
? 'Engine & View'
: 'Common attributes and methods',
path: `${
opts.lang === 'zh-CN' ? '/zh-CN' : ''
@ -173,13 +177,13 @@ function getMenus(opts: { lang?: string; base: '/docs' | '/plugin' | '/api' }) {
exact: true,
},
{
title: opts.lang === 'zh-CN' ? '引擎' : 'Engine',
title: opts.lang === 'zh-CN' ? 'Engine' : 'Engine',
path: `${
opts.lang === 'zh-CN' ? '/zh-CN' : ''
}/api/engine`,
},
{
title: opts.lang === 'zh-CN' ? '阅读器' : 'View',
title: opts.lang === 'zh-CN' ? 'View' : 'View',
path: `${
opts.lang === 'zh-CN' ? '/zh-CN' : ''
}/api/view`,

View File

@ -2,6 +2,10 @@
## Node
### `DATA-ID`
data-id
### `DATA_ELEMENT`
Mark node type

View File

@ -2,6 +2,10 @@
## 节点
### `DATA-ID`
data-id
### `DATA_ELEMENT`
标记节点类型

View File

@ -323,6 +323,34 @@ Render the card
render(container?: NodeInterface): void;
```
### `focusPrevBlock`
Focus on the previous block-level node where the card is located
```ts
/**
* Focus on the previous block-level node where the card is located
* @param card card
* @param range cursor
* @param hasModify When there is no node, whether to create an empty node and focus
*/
focusPrevBlock(card: CardInterface, range: RangeInterface, hasModify: boolean): void;
```
### `focusNextBlock`
Focus on the next block-level node where the card is located
```ts
/**
* Focus on the next block-level node where the card is located
* @param card card
* @param range cursor
* @param hasModify When there is no node, whether to create an empty node and focus
*/
focusNextBlock(card: CardInterface, range: RangeInterface, hasModify: boolean): void;
```
### `gc`
Release card

View File

@ -319,6 +319,34 @@ create(
render(container?: NodeInterface): void;
```
### `focusPrevBlock`
聚焦卡片所在位置的前一个块级节点
```ts
/**
* 聚焦卡片所在位置的前一个块级节点
* @param card 卡片
* @param range 光标
* @param hasModify 没有节点时,是否创建一个空节点并聚焦
*/
focusPrevBlock(card: CardInterface, range: RangeInterface, hasModify: boolean): void;
```
### `focusNextBlock`
聚焦卡片所在位置的下一个块级节点
```ts
/**
* 聚焦卡片所在位置的下一个块级节点
* @param card 卡片
* @param range 光标
* @param hasModify 没有节点时,是否创建一个空节点并聚焦
*/
focusNextBlock(card: CardInterface, range: RangeInterface, hasModify: boolean): void;
```
### `gc`
释放卡片

View File

@ -79,7 +79,7 @@ Bind the document event
onDocument(
eventType: string,
listener: EventListener,
rewrite?: boolean,
index?: number
): void;
```
@ -91,16 +91,24 @@ Bind window events
onWindow(
eventType: string,
listener: EventListener,
rewrite?: boolean,
index?: number
): void;
```
### `onContainer`
Binding editor container node event
```ts
onContainer(eventType: string, listener: EventListener, index?: number): void;
```
### `onRoot`
Binding editor root node event
```ts
onContainer(eventType: string, listener: EventListener): void;
onRoot(eventType: string, listener: EventListener, index?: number): void;
```
### `destroy`

View File

@ -73,13 +73,13 @@ onDrop(
### `onDocument`
绑定 document 事件
绑定事件到 document 中
```ts
onDocument(
eventType: string,
listener: EventListener,
rewrite?: boolean,
index?: number,
): void;
```
@ -91,7 +91,7 @@ onDocument(
onWindow(
eventType: string,
listener: EventListener,
rewrite?: boolean,
index?: number
): void;
```
@ -100,7 +100,15 @@ onWindow(
绑定编辑器根节点事件
```ts
onContainer(eventType: string, listener: EventListener): void;
onContainer(eventType: string, listener: EventListener, index?: number): void;
```
### `onRoot`
绑定事件到编辑器根节点中
```ts
onRoot(eventType: string, listener: EventListener, index?: number): void;
```
### `destroy`

View File

@ -0,0 +1,65 @@
# Change Range
Editor to change cursor related operations
Type: `ChangeRangeInterface`
## method
### `get`
Get the range of the current selection
```ts
/**
* Get the range of the current selection
*/
get(): RangeInterface;
```
### `toTrusty`
Obtain a safe and controllable cursor object
```ts
/**
* Obtain a safe and controllable cursor object
* @param range default current cursor
*/
toTrusty(range?: RangeInterface): RangeInterface;
```
### `select`
Select the specified range
```ts
/**
* Select the specified range
* @param range cursor
*/
select(range: RangeInterface): void;
```
### `focus`
Focus editor
```ts
/**
* Focus editor
* @param toStart true: start position, false: end position, the default is the previous operation position
*/
focus(toStart?: boolean): void;
```
### `blur`
Cancel focus
```ts
/**
* Cancel focus
*/
blur(): void;
```

View File

@ -0,0 +1,65 @@
# Change Range
编辑器变更光标的相关操作
类型:`ChangeRangeInterface`
## 方法
### `get`
获取当前选区的范围
```ts
/**
* 获取当前选区的范围
*/
get(): RangeInterface;
```
### `toTrusty`
获取安全可控的光标对象
```ts
/**
* 获取安全可控的光标对象
* @param range 默认当前光标
*/
toTrusty(range?: RangeInterface): RangeInterface;
```
### `select`
选中指定的范围
```ts
/**
* 选中指定的范围
* @param range 光标
*/
select(range: RangeInterface): void;
```
### `focus`
聚焦编辑器
```ts
/**
* 聚焦编辑器
* @param toStart true:开始位置,false:结束位置,默认为之前操作位置
*/
focus(toStart?: boolean): void;
```
### `blur`
取消焦点
```ts
/**
* 取消焦点
*/
blur(): void;
```

View File

@ -34,6 +34,14 @@ event
event: ChangeEventInterface;
```
### `range`
Range of the change
```ts
range: ChangeRangeInterface;
```
### `marks`
All style nodes in the current cursor selection
@ -60,64 +68,6 @@ inlines: Array<NodeInterface>;
## Method
### `getRange`
Get the range of the current selection
```ts
/**
* Get the range of the current selection
*/
getRange(): RangeInterface;
```
### `getSafeRange`
Obtain a safe and controllable cursor object
```ts
/**
* Obtain a safe and controllable cursor object
* @param range default current cursor
*/
getSafeRange(range?: RangeInterface): RangeInterface;
```
### `select`
Select the specified range
```ts
/**
* Select the specified range
* @param range cursor
*/
select(range: RangeInterface): ChangeInterface;
```
### `focus`
Focus editor
```ts
/**
* Focus editor
* @param toStart true: start position, false: end position, the default is the previous operation position
*/
focus(toStart?: boolean): ChangeInterface;
```
### `blur`
Cancel focus
```ts
/**
* Cancel focus
*/
blur(): ChangeInterface;
```
### `apply`
Apply an operation that changes the dom structure
@ -233,15 +183,22 @@ destroy(): void;
### `insert`
Insert
Insert Fragment
```ts
/**
* Insert fragment
* @param fragment fragment
* @param callback callback function after insertion
*/
insert(fragment: DocumentFragment, callback?: () => void): void;
* Insert fragment
* @param fragment fragment
* @param range cursor position, default current cursor position
* @param callback callback function after insertion
* @param followActiveMark Whether the empty label follows the currently activated mark style after deletion
*/
insert(
fragment: DocumentFragment,
range?: RangeInterface,
callback?: (range: RangeInterface) => void,
followActiveMark?: boolean,
): void;
```
### `delete`
@ -250,11 +207,16 @@ Delete content
```ts
/**
* Delete content
* @param range cursor, get the current cursor by default
* @param isDeepMerge Perform merge operation after deletion
*/
delete(range?: RangeInterface, isDeepMerge?: boolean): void;
* Delete content
* @param range cursor, get the current cursor by default
* @param isDeepMerge Whether to merge after deletion
* @param followActiveMark Whether the empty label follows the currently activated mark style after deletion
*/
delete(
range?: RangeInterface,
isDeepMerge?: boolean,
followActiveMark?: boolean,
): void;
```
### `unwrap`
@ -280,16 +242,3 @@ Delete the block node closest to the current cursor or the previous node of the
*/
mergeAfterDelete(node?: NodeInterface): void;
```
### `focusPrevBlock`
The focus moves to the block node closest to the current cursor or the block before the incoming node
```ts
/**
* The focus moves to the block node closest to the current cursor or the block before the incoming node
* @param block node
* @param isRemoveEmptyBlock If the previous block is empty, whether to delete, the default is no
*/
focusPrevBlock(block?: NodeInterface, isRemoveEmptyBlock?: boolean): void;
```

View File

@ -23,7 +23,7 @@ new (container: NodeInterface, options: ChangeOptions): ChangeInterface;
命令执行前的光标转换后的路径
```ts
rangePathBeforeCommand: Path[] | null;
rangePathBeforeCommand?: { start: RangePath; end: RangePath };
```
### `event`
@ -34,6 +34,14 @@ rangePathBeforeCommand: Path[] | null;
event: ChangeEventInterface;
```
### `range`
Range 对象
```ts
range: ChangeRangeInterface;
```
### `marks`
当前光标选区中的所有样式节点
@ -60,64 +68,6 @@ inlines: Array<NodeInterface>;
## 方法
### `getRange`
获取当前选区的范围
```ts
/**
* 获取当前选区的范围
*/
getRange(): RangeInterface;
```
### `getSafeRange`
获取安全可控的光标对象
```ts
/**
* 获取安全可控的光标对象
* @param range 默认当前光标
*/
getSafeRange(range?: RangeInterface): RangeInterface;
```
### `select`
选中指定的范围
```ts
/**
* 选中指定的范围
* @param range 光标
*/
select(range: RangeInterface): ChangeInterface;
```
### `focus`
聚焦编辑器
```ts
/**
* 聚焦编辑器
* @param toStart true:开始位置,false:结束位置,默认为之前操作位置
*/
focus(toStart?: boolean): ChangeInterface;
```
### `blur`
取消焦点
```ts
/**
* 取消焦点
*/
blur(): ChangeInterface;
```
### `apply`
应用一个具有改变 dom 结构的操作
@ -233,15 +183,22 @@ destroy(): void;
### `insert`
插入片段
插入 Fragment
```ts
/**
* 插入片段
* @param fragment 片段
* @param range 光标位置,默认当前光标位置
* @param callback 插入后的回调函数
* @param followActiveMark 删除后空标签是否跟随当前激活的mark样式
*/
insert(fragment: DocumentFragment, callback?: () => void): void;
insert(
fragment: DocumentFragment,
range?: RangeInterface,
callback?: (range: RangeInterface) => void,
followActiveMark?: boolean,
): void;
```
### `delete`
@ -252,9 +209,14 @@ insert(fragment: DocumentFragment, callback?: () => void): void;
/**
* 删除内容
* @param range 光标,默认获取当前光标
* @param isDeepMerge 删除后执行合并操作
* @param isDeepMerge 删除后是否合并
* @param followActiveMark 删除后空标签是否跟随当前激活的mark样式
*/
delete(range?: RangeInterface, isDeepMerge?: boolean): void;
delete(
range?: RangeInterface,
isDeepMerge?: boolean,
followActiveMark?: boolean,
): void;
```
### `unwrap`
@ -280,16 +242,3 @@ unwrap(node?: NodeInterface): void;
*/
mergeAfterDelete(node?: NodeInterface): void;
```
### `focusPrevBlock`
焦点移动到当前光标最接近的 block 节点或传入的节点前一个 Block
```ts
/**
* 焦点移动到当前光标最接近的block节点或传入的节点前一个 Block
* @param block 节点
* @param isRemoveEmptyBlock 如果前一个block为空是否删除默认为否
*/
focusPrevBlock(block?: NodeInterface, isRemoveEmptyBlock?: boolean): void;
```

View File

@ -0,0 +1,85 @@
# NodeId
Node data-id generator
Type: `NodeIdInterface`
## use
### init
initialization
```ts
/**
* Initialization
*/
init(): void;
```
### getRules
Get rules
```ts
/**
* Obtain the label name collection that needs to create data-id for the node according to the rules
* @returns
*/
getRules(): {[key: string]: SchemaRule[] };
```
### create
Create data-id for the node
```ts
/**
* Create data-id for the node
* @param node node
* @returns
*/
create(node: Node | NodeInterface): string;
```
### generateAll
Create a data-id for the child node that needs to create a data-id in the root node
```ts
/**
* Create a data-id in the root node for the child node that needs to create a data-id
* @param root root node
*/
generateAll(root?: Element | NodeInterface, force?: boolean): void;
```
### generate
Create a random data-id for the node
```ts
/**
* Create a random data-id for the node
* @param node node
* @param isCreate If yes, do you need to recreate
* @returns
*/
generate(
root: Element | NodeInterface | DocumentFragment,
force?: boolean,
): string | undefined;
```
### isNeed
Determine whether a node needs to create data-id
```ts
/**
* Determine whether a node needs to create data-id
* @param name node name
* @returns
*/
isNeed(node: NodeInterface): boolean;
```

View File

@ -0,0 +1,85 @@
# NodeId
节点 data-id 生成器
类型:`NodeIdInterface`
## 使用
### init
初始化
```ts
/**
* 初始化
*/
init(): void;
```
### getRules
获取规则
```ts
/**
* 根据规则获取需要为节点创建 data-id 的标签名称集合
* @returns
*/
getRules(): { [key: string]: SchemaRule[] };
```
### create
给节点创建 data-id
```ts
/**
* 给节点创建data-id
* @param node 节点
* @returns
*/
create(node: Node | NodeInterface): string;
```
### generateAll
在根节点内为需要创建 data-id 的子节点创建 data-id
```ts
/**
* 在根节点内为需要创建data-id的子节点创建data-id
* @param root 根节点
*/
generateAll(root?: Element | NodeInterface, force?: boolean): void;
```
### generate
为节点创建一个随机 data-id
```ts
/**
* 为节点创建一个随机data-id
* @param node 节点
* @param isCreate 如果有,是否需要重新创建
* @returns
*/
generate(
root: Element | NodeInterface | DocumentFragment,
force?: boolean,
): string | undefined;
```
### isNeed
判断一个节点是否需要创建 data-id
```ts
/**
* 判断一个节点是否需要创建data-id
* @param name 节点名称
* @returns
*/
isNeed(node: NodeInterface): boolean;
```

View File

@ -295,7 +295,7 @@ Remove the labels on both sides of the node
removeSide(node: NodeInterface, tagName?: string): void;
```
### `flatten`
### `flat`
Organize the nodes and restore the nodes to the state that meets the editor value
@ -305,7 +305,7 @@ Organize the nodes and restore the nodes to the state that meets the editor valu
* @param node node
* @param root root node, the default is node node
*/
flatten(node: NodeInterface, root?: NodeInterface): void;
flat(node: NodeInterface, root?: NodeInterface): void;
```
### `normalize`
@ -341,11 +341,13 @@ Copy element node
```ts
/**
* Copy element node
* @param {boolean} deep whether deep copy
* @return copied element node
*/
clone(node: NodeInterface, deep?: boolean): NodeInterface;
* Copy element node
* @param node node
* @param deep Whether to deep copy
* @param copyId whether to copy data-id, copy by default
* @return copied element node
*/
clone(node: NodeInterface, deep?: boolean, copyId?: boolean): NodeInterface;
```
### `getBatchAppendHTML`

View File

@ -295,9 +295,9 @@ mergeAdjacent(node: NodeInterface): void;
removeSide(node: NodeInterface, tagName?: string): void;
```
### `flatten`
### `flat`
整理节点,把节点修复到符合编辑器值的状态
扁平化节点,把节点修复到符合编辑器值的状态
```ts
/**
@ -305,7 +305,7 @@ removeSide(node: NodeInterface, tagName?: string): void;
* @param node 节点
* @param root 根节点默认为node节点
*/
flatten(node: NodeInterface, root?: NodeInterface): void;
flat(node: NodeInterface, root?: NodeInterface): void;
```
### `normalize`
@ -342,10 +342,12 @@ html(node: NodeInterface, val?: string): NodeInterface | string;
```ts
/**
* 复制元素节点
* @param {boolean} deep 是否深度复制
* @param node 节点
* @param deep 是否深度复制
* @param copyId 是否复制data-id默认复制
* @return 复制后的元素节点
*/
clone(node: NodeInterface, deep?: boolean): NodeInterface;
clone(node: NodeInterface, deep?: boolean, copyId?: boolean): NodeInterface;
```
### `getBatchAppendHTML`

View File

@ -56,6 +56,17 @@ Node management, including node type judgment, inserting nodes in the DOM tree
Type: `NodeModelInterface`
### nodeId
Node data-id manager
```ts
/**
* Node id manager
*/
nodeId: NodeIdInterface;
```
### `list`
List node management

View File

@ -56,6 +56,17 @@ readonly kind: 'engine' | 'view';
类型:`NodeModelInterface`
### nodeId
节点 data-id 管理器
```ts
/**
* 节点id管理器
*/
nodeId: NodeIdInterface;
```
### `list`
列表节点管理

View File

@ -60,6 +60,17 @@ Focus on the editor
focus(start?: boolean): void;
```
### `blur`
Unfocus
```ts
/**
* Make the editor lose focus
*/
blur(): void;
```
### `isFocus`
Whether the current cursor is focused on the editor
@ -100,11 +111,19 @@ Get the editor value asynchronously, and will wait for the plug-in processing to
```ts
/**
* Obtain the editor value asynchronously, and wait for the plug-in processing to complete before obtaining the value
* For example, plug-in upload is waiting, and the value will be obtained after the upload is completed.
* @param ignoreCursor whether to include cursor position information
*/
getValueAsync(ignoreCursor?: boolean): Promise<string>;
* Obtain the editor value asynchronously, and wait for the plug-in processing to complete before obtaining the value
* For example, plug-in upload is waiting, and the value will be obtained after the upload is completed.
* @param ignoreCursor Whether to include the cursor position information, it is not included by default
* @param callback Callback when there are plugins and actions that have not been executed, return false to terminate the value acquisition, return number to set the current action waiting time, in milliseconds
*/
getValueAsync(
ignoreCursor?: boolean,
callback?: (
name: string,
card?: CardInterface,
...args: any
) => boolean | number | void,
): Promise<string>;
```
### `getHtml`
@ -161,10 +180,13 @@ Set the json format value, which is mainly used to synchronize with the value of
```ts
/**
* Set the json format value, mainly used for collaboration
* @param value
*/
setJsonValue(value: Array<any>): EngineInterface;
* Set json format value, mainly used for collaboration
* @param callback Callback after the card is rendered asynchronously
*/
setJsonValue(
value: Array<any>,
callback?: (count: number) => void,
): EngineInterface;
```
### `setScrollNode`
@ -175,6 +197,28 @@ Set editor scroll bar node
setScrollNode(node?: HTMLElement)
```
### showPlaceholder
Display placeholder
```ts
/**
* Show placeholder
*/
showPlaceholder(): void;
```
Hide placeholder
### hidePlaceholder
```ts
/**
* Hide placeholder
*/
hidePlaceholder(): void;
```
### `destroy`
Destroy the editor

View File

@ -60,6 +60,17 @@
focus(start?: boolean): void;
```
### `blur`
取消聚焦
```ts
/**
* 让编辑器失去焦点
*/
blur(): void;
```
### `isFocus`
当前光标是否已聚焦到编辑器
@ -102,9 +113,17 @@ getValue(ignoreCursor?: boolean): string;
/**
* 异步获取编辑器值,将等候插件处理完成后再获取值
* 比如插件上传等待中,将等待上传完成后再获取值
* @param ignoreCursor 是否包含光标位置信息
* @param ignoreCursor 是否包含光标位置信息,默认不包含
* @param callback 有插件还有动作未执行完时回调,返回 false 终止获取值,返回 number 设置当前动作等待时间,毫秒
*/
getValueAsync(ignoreCursor?: boolean): Promise<string>;
getValueAsync(
ignoreCursor?: boolean,
callback?: (
name: string,
card?: CardInterface,
...args: any
) => boolean | number | void,
): Promise<string>;
```
### `getHtml`
@ -162,9 +181,12 @@ setHtml(html: string, callback?: (count: number) => void): EngineInterface
```ts
/**
* 设置json格式值主要用于协同
* @param value 值
* @param callback 异步渲染卡片后的回调
*/
setJsonValue(value: Array<any>): EngineInterface;
setJsonValue(
value: Array<any>,
callback?: (count: number) => void,
): EngineInterface;
```
### `setScrollNode`
@ -175,6 +197,28 @@ setJsonValue(value: Array<any>): EngineInterface;
setScrollNode(node?: HTMLElement)
```
### showPlaceholder
展示占位符
```ts
/**
* 展示 placeholder
*/
showPlaceholder(): void;
```
隐藏占位符
### hidePlaceholder
```ts
/**
* 隐藏 placeholder
*/
hidePlaceholder(): void;
```
### `destroy`
销毁编辑器

View File

@ -126,7 +126,7 @@ Collect local editing operations
handleSelfOps(ops: Op[]): void;
```
### `collectRemoteOps`
### `handleRemoteOps`
Collect remote operations (operations from other coordinators)
@ -134,7 +134,7 @@ Collect remote operations (operations from other coordinators)
/**
* @param ops operation set
* */
collectRemoteOps(ops: Op[]): void;
handleRemoteOps(ops: Op[]): void;
```
### `getUndoOp`

View File

@ -52,33 +52,6 @@ undo(): void;
redo(): void;
```
### `hold`
在接下来的多少毫秒内的动作保持为一个历史片段
```ts
/**
* 多少毫秒内的动作保持为一个历史片段
* @param time 毫秒
*/
hold(time?: number): void;
```
### `releaseHold`
重置 hold
```ts
/**
* 重置 hold
*/
releaseHold(): void;
```
### `lock`
在接下来的多少毫秒内的动作将不作为历史记录
### `onFilter`
监听过滤存入历史记录的 ops
@ -130,7 +103,7 @@ saveOp(): void;
handleSelfOps(ops: Op[]): void;
```
### `collectRemoteOps`
### `handleRemoteOps`
收集远程的操作(来自其它协同者的操作)
@ -138,7 +111,7 @@ handleSelfOps(ops: Op[]): void;
/**
* @param ops 操作集合
* */
collectRemoteOps(ops: Op[]): void;
handleRemoteOps(ops: Op[]): void;
```
### `getUndoOp`

View File

@ -36,13 +36,13 @@ Type: `EventInterface[]`
### `document`
The Document object where the current Node node is located. In the use of iframe, the document in different frames is not consistent, and there are other environments as well, so we need to follow this object.
The Document object where the current Node node is located. In the use of iframe, the document in different frames is not consistent, and there are some other environments as well, so we need to follow this object.
Type: `Document | null`
### `window`
The Window object where the current Node node is located. In the use of iframes, the windows in different frames are not consistent, and the same is true in some other environments, so we need to follow this object.
The Window object where the current Node node is located. In the use of iframe, the window in different frames is not consistent, and there are some other environments as well, so we need to follow this object.
Type: `Window | null`
@ -78,11 +78,11 @@ Type: `boolean`
### `[n: number]`
Node node collection, which can be accessed by subscript index
Node node collection, can be accessed by subscript index
Return type: Node
## Method
## method
### `each`
@ -239,7 +239,7 @@ Query all child nodes of the current node
```ts
/**
*
* @param {Node | string} selector finder
* @param {Node | string} selector querier
* @return {NodeInterface} Eligible child nodes
*/
children(selector?: string): NodeInterface;
@ -271,7 +271,7 @@ last(): NodeInterface | null;
### `prev`
Return the sibling nodes before the node (including text nodes and comment nodes)
Return the sibling node before the node (including text node, comment node)
```ts
/**
@ -593,7 +593,7 @@ text(text?: string): string | NodeInterface;
### `show`
Set the node to display state
Set node to display state
```ts
/**
@ -610,7 +610,7 @@ Set node to hidden state
```ts
/**
* Set the node to hidden
* Set the node to be hidden
* @return {NodeInterface} current instance
*/
hide(): NodeInterface;
@ -763,5 +763,87 @@ Get child nodes according to path
```ts
/**
* According to the path to obtain
* Get child nodes according to the path
* @param path path
*/
getChildByPath(path: Path, filter?: (node: Node) => boolean): Node;
```
### `getIndex`
Get the index of the parent node where the current node is located
```ts
/**
* Get the index in the parent node of the current node
*/
getIndex(filter?: (node: Node) => boolean): number;
```
### `findParent`
Get the parent node in the specified container
```ts
/**
* Get the parent node in the specified container
* @param container container node, the default is the editor root node
*/
findParent(container?: Node | NodeInterface): NodeInterface | null;
```
### `allChildren`
Get all child nodes under the node
```ts
/**
* Get all child nodes under the node
*/
allChildren(): Array<Node>;
```
### `getViewport`
Returns the view boundary of the top-level window object of the current node or the current node where the passed node is located
```ts
/**
* Returns the view boundary of the top-level window object of the current node where the current node or the passed-in node is located
* @param node node
*/
getViewport(
node?: NodeInterface,
): {top: number; left: number; bottom: number; right: number };
```
### `inViewport`
Determine whether the view is within the view boundary calculated by the node node based on the top-level window object of the current node
```ts
/**
* Determine whether the view is within the view boundary calculated by the node node according to the top-level window object of the current node
* @param node node
* @param view is at the node of the view
*/
inViewport(node: NodeInterface, view: NodeInterface): boolean;
```
### `scrollIntoView`
If the view node is not visible, it will scroll to the align position, the default is nearest
```ts
/**
* If the view node is not visible, it will scroll to the align position, the default is nearest
* @param node node
* @param view view node
* @param align position
*/
scrollIntoView(
node: NodeInterface,
view: NodeInterface,
align?:'start' |'center' |'end' |'nearest',
): void;
```

View File

@ -847,15 +847,3 @@ scrollIntoView(
align?: 'start' | 'center' | 'end' | 'nearest',
): void;
```
### `removeZeroWidthSpace`
移除节点内的所有零宽字符占位符 \u200B
```ts
/**
* 移除占位符 \u200B
* @param root 节点
*/
removeZeroWidthSpace(): void;
```

View File

@ -51,7 +51,7 @@ Traverse the DOM tree to generate standard editor values
*/
toValue(
schema?: SchemaInterface | null,
conversionRules?: any,
conversionRules?: ConversionInterface,
replaceSpaces?: boolean,
customTags?: boolean,
): string
@ -78,7 +78,7 @@ Return to the DOM tree
/**
* Return to the DOM tree
*/
toDOM(schema?: SchemaInterface | null, conversionRules?: any): DocumentFragment
toDOM(schema?: SchemaInterface | null, conversionRules?: ConversionInterface): DocumentFragment
```
### `toText`
@ -87,13 +87,14 @@ Convert to text
```ts
/**
* Convert to text
* @param conversionRules tag conversion rules
* @param includeCard whether to include the card
*/
* Convert to text
* @param schema Schema rules
* @param includeCard Whether to traverse the inside of the card, the default is not to traverse
* @param formatOL Whether to format the ordered list, <ol><li>a</li><li>b</li></ol> -> 1. a 2. b Default conversion
*/
toText(
schema?: SchemaInterface | null,
conversionRules?: any,
schema?: SchemaInterface,
includeCard?: boolean,
): string
formatOL?: boolean,
): string;
```

View File

@ -51,7 +51,7 @@ traverse(
*/
toValue(
schema?: SchemaInterface | null,
conversionRules?: any,
conversionRules?: ConversionInterface,
replaceSpaces?: boolean,
customTags?: boolean,
): string
@ -78,7 +78,7 @@ toHTML(inner?: Node, outter?: Node): { html: string, text: string}
/**
* 返回DOM树
*/
toDOM(schema?: SchemaInterface | null, conversionRules?: any): DocumentFragment
toDOM(schema?: SchemaInterface | null, conversionRules?: ConversionInterface): DocumentFragment
```
### `toText`
@ -88,12 +88,13 @@ toDOM(schema?: SchemaInterface | null, conversionRules?: any): DocumentFragment
```ts
/**
* 转换为文本
* @param conversionRules 标签转换规则
* @param includeCard 是否包含卡片
* @param schema Schema 规则
* @param includeCard 是否遍历卡片内部,默认不遍历
* @param formatOL 是否格式化有序列表,<ol><li>a</li><li>b</li></ol> -> 1. a 2. b 默认转换
*/
toText(
schema?: SchemaInterface | null,
conversionRules?: any,
schema?: SchemaInterface,
includeCard?: boolean,
): string
formatOL?: boolean,
): string;
```

View File

@ -333,13 +333,28 @@ Get the nearest root node of the current selection
getRootBlock(): NodeInterface | undefined;
```
### `toPath`
### `filterPath`
Convert range selection to path
Filter path
```ts
/**
* Get the range path
*/
toPath(): Path[];
* Filter path
* @param includeCardCursor
*/
filterPath(includeCardCursor?: boolean): (node: Node) => boolean;
```
### `toPath`
Convert cursor selection to path
```ts
/**
* Get the cursor path
* @param includeCardCursor whether to include the cursor on both sides of the card
*/
toPath(
includeCardCursor?: boolean,
): {start: RangePath; end: RangePath} | undefined;
```

View File

@ -333,6 +333,18 @@ equal(range: RangeInterface | globalThis.Range): boolean;
getRootBlock(): NodeInterface | undefined;
```
### `filterPath`
过滤路径
```ts
/**
* 过滤路径
* @param includeCardCursor
*/
filterPath(includeCardCursor?: boolean): (node: Node) => boolean;
```
### `toPath`
将光标选区转换为路径
@ -340,6 +352,9 @@ getRootBlock(): NodeInterface | undefined;
```ts
/**
* 获取光标路径
* @param includeCardCursor 是否包含卡片两侧光标
*/
toPath(): Path[];
toPath(
includeCardCursor?: boolean,
): { start: RangePath; end: RangePath } | undefined;
```

View File

@ -34,6 +34,18 @@ add(
): void;
```
### `remove`
Remove a rule
```ts
/**
* Remove a rule
* @param rule
*/
remove(rule: SchemaRule): void;
```
### `find`
Find rules
@ -52,10 +64,31 @@ Get node type
```ts
/**
* Get the node type
* @param node node
*/
getType(node: NodeInterface):'block' |'mark' |'inline' | undefined;
* Get the node type
* @param node node
* @param filter
*/
getType(
node: NodeInterface,
filter?: (rule: SchemaRule) => boolean,
):'block' |'mark' |'inline' | undefined;
```
### `getRule`
Get the matching rules according to the node
```ts
/**
* Obtain the matching rules according to the node
* @param node node
* @param filter
* @returns
*/
getRule(
node: NodeInterface,
filter?: (rule: SchemaRule) => boolean,
): SchemaRule | undefined;
```
### `checkNode`
@ -74,112 +107,37 @@ checkNode(
): boolean;
```
### `checkStyle`
Check whether the style value meets the node style rules
```ts
/**
* Check whether the style value meets the node style rules
* @param name node name
* @param styleName style name
* @param styleValue style value
*/
checkStyle(name: string, styleName: string, styleValue: string): boolean;
```
### `checkAttributes`
Check whether the value meets the rules of node attributes
```ts
/**
* Check whether the value meets the rules of node attributes
* @param name node name
* @param attributesName attribute name
* @param attributesValue attribute value
*/
checkAttributes(
name: string,
attributesName: string,
attributesValue: string,
): boolean;
```
### `checkValue`
Check whether the value meets the rules
```ts
/**
* Whether the detection value meets the rules
* @param rule
* @param attributesName attribute name
* @param attributesValue attribute value
*/
* Whether the detection value meets the rules
* @param rule
* @param attributesName attribute name
* @param attributesValue attribute value
* @param force Whether to force the comparison value
*/
checkValue(
rule: SchemaAttributes | SchemaStyle,
attributesName: string,
attributesValue: string,
force?: boolean,
): boolean;
```
### `checkStyle`
Check whether the style value meets the node style rules
```ts
/**
* Check whether the style value meets the node style rules
* @param name node name
* @param styleName style name
* @param styleValue style value
* @param type specifies the type
*/
checkStyle(
name: string,
styleName: string,
styleValue: string,
type?:'block' |'mark' |'inline',
): void;
```
### `checkAttributes`
Check whether the value meets the rules of node attributes
```ts
/**
* Check whether the value meets the rules of node attributes
* @param name node name
* @param attributesName attribute name
* @param attributesValue attribute value
* @param type specifies the type
*/
checkAttributes(
name: string,
attributesName: string,
attributesValue: string,
type?:'block' |'mark' |'inline',
): void;
```
### `filterStyles`
Filter node style
```ts
/**
* Filter node style
* @param name node name
* @param styles style
* @param type specifies the type
*/
filterStyles(
name: string,
styles: {[k: string]: string },
type?:'block' |'mark' |'inline',
): void;
* Filter node style
* @param styles style
* @param rule
*/
filterStyles(styles: {[k: string]: string }, rule: SchemaRule): void;
```
### `filterAttributes`
@ -188,15 +146,32 @@ Filter node attributes
```ts
/**
* Filter node attributes
* @param name node name
* @param attributes
* @param type specifies the type
*/
* Filter node attributes
* @param attributes
* @param rule
*/
filterAttributes(
name: string,
attributes: {[k: string]: string },
type?:'block' |'mark' |'inline',
rule: SchemaRule,
): void;
```
### `filter`
Filter attributes and styles that meet the node rules
```ts
/**
* Filter attributes and styles that meet the node rules
* @param node node, used to get rules
* @param attributes
* @param styles style
* @returns
*/
filter(
node: NodeInterface,
attributes: {[k: string]: string },
styles: {[k: string]: string },
): void;
```
@ -262,6 +237,19 @@ Determine whether the child node name is allowed to be placed in the specified p
isAllowIn(source: string, target: string): boolean;
```
### `addAllowIn`
Add block child nodes that are allowed to be placed in a block node
```ts
/**
* Add block child nodes that are allowed to be placed in a block node
* @param parent Allowed parent node
* @param child allows the node to be placed, default p
*/
addAllowIn(parent: string, child?: string): void;
```
### `getAllowInTags`
Get the label collection that allows sub-block nodes

View File

@ -34,6 +34,18 @@ add(
): void;
```
### `remove`
移除一个规则
```ts
/**
* 移除一个规则
* @param rule
*/
remove(rule: SchemaRule): void;
```
### `find`
查找规则
@ -54,8 +66,29 @@ find(callback: (rule: SchemaRule) => boolean): Array<SchemaRule>;
/**
* 获取节点类型
* @param node 节点
* @param filter 过滤
*/
getType(node: NodeInterface): 'block' | 'mark' | 'inline' | undefined;
getType(
node: NodeInterface,
filter?: (rule: SchemaRule) => boolean,
): 'block' | 'mark' | 'inline' | undefined;
```
### `getRule`
根据节点获取符合的规则
```ts
/**
* 根据节点获取符合的规则
* @param node 节点
* @param filter 过滤
* @returns
*/
getRule(
node: NodeInterface,
filter?: (rule: SchemaRule) => boolean,
): SchemaRule | undefined;
```
### `checkNode`
@ -74,38 +107,6 @@ checkNode(
): boolean;
```
### `checkStyle`
检测样式值是否符合节点样式规则
```ts
/**
* 检测样式值是否符合节点样式规则
* @param name 节点名称
* @param styleName 样式名称
* @param styleValue 样式值
*/
checkStyle(name: string, styleName: string, styleValue: string): boolean;
```
### `checkAttributes`
检测值是否符合节点属性的规则
```ts
/**
* 检测值是否符合节点属性的规则
* @param name 节点名称
* @param attributesName 属性名称
* @param attributesValue 属性值
*/
checkAttributes(
name: string,
attributesName: string,
attributesValue: string,
): boolean;
```
### `checkValue`
检测值是否符合规则
@ -116,54 +117,16 @@ checkAttributes(
* @param rule 规则
* @param attributesName 属性名称
* @param attributesValue 属性值
* @param force 是否强制比较值
*/
checkValue(
rule: SchemaAttributes | SchemaStyle,
attributesName: string,
attributesValue: string,
force?: boolean,
): boolean;
```
### `checkStyle`
检测样式值是否符合节点样式规则
```ts
/**
* 检测样式值是否符合节点样式规则
* @param name 节点名称
* @param styleName 样式名称
* @param styleValue 样式值
* @param type 指定类型
*/
checkStyle(
name: string,
styleName: string,
styleValue: string,
type?: 'block' | 'mark' | 'inline',
): void;
```
### `checkAttributes`
检测值是否符合节点属性的规则
```ts
/**
* 检测值是否符合节点属性的规则
* @param name 节点名称
* @param attributesName 属性名称
* @param attributesValue 属性值
* @param type 指定类型
*/
checkAttributes(
name: string,
attributesName: string,
attributesValue: string,
type?: 'block' | 'mark' | 'inline',
): void;
```
### `filterStyles`
过滤节点样式
@ -171,15 +134,10 @@ checkAttributes(
```ts
/**
* 过滤节点样式
* @param name 节点名称
* @param styles 样式
* @param type 指定类型
* @param rule 规则
*/
filterStyles(
name: string,
styles: { [k: string]: string },
type?: 'block' | 'mark' | 'inline',
): void;
filterStyles(styles: { [k: string]: string }, rule: SchemaRule): void;
```
### `filterAttributes`
@ -189,14 +147,31 @@ filterStyles(
```ts
/**
* 过滤节点属性
* @param name 节点名称
* @param attributes 属性
* @param type 指定类型
* @param rule 规则
*/
filterAttributes(
name: string,
attributes: { [k: string]: string },
type?: 'block' | 'mark' | 'inline',
rule: SchemaRule,
): void;
```
### `filter`
过滤满足 node 节点规则的属性和样式
```ts
/**
* 过滤满足node节点规则的属性和样式
* @param node 节点,用于获取规则
* @param attributes 属性
* @param styles 样式
* @returns
*/
filter(
node: NodeInterface,
attributes: { [k: string]: string },
styles: { [k: string]: string },
): void;
```
@ -262,6 +237,19 @@ closest(name: string): string;
isAllowIn(source: string, target: string): boolean;
```
### `addAllowIn`
给一个 block 节点添加允许放入的 block 子节点
```ts
/**
* 给一个block节点添加允许放入的block子节点
* @param parent 允许放入的父节点
* @param child 允许放入的节点,默认 p
*/
addAllowIn(parent: string, child?: string): void;
```
### `getAllowInTags`
获取允许有子 block 节点的标签集合

View File

@ -12,7 +12,7 @@
/**
* 渲染内容
* @param content 渲染的内容
* @param trigger 是否触发渲染完成事件,用来展示插件的特俗效果。例如在heading插件中展示锚点显示功能。默认为 true
* @param trigger 是否触发渲染完成事件用来展示插件的效果。例如在heading插件中展示锚点显示功能。默认为 true
*/
render(content: string, trigger?: boolean): void;
```

View File

@ -275,6 +275,7 @@ class Test extends Card {
}
destroy() {
super.destroy();
ReactDOM.unmountComponentAtNode(this.#container?.get<HTMLElement>()!);
}
}
@ -651,6 +652,7 @@ class Test extends Card {
}
destroy() {
super.destroy();
this.#vm?.unmount();
}
}
@ -844,7 +846,7 @@ export default class extends Card<{ count: number }> {
// Create a div node
this.container = $(`<div>${value.count}</div>`)
// bind the click event
this.container.on("click" => this.onClick)
this.container.on("click" => () => this.onClick())
// Return the node to load the container
return this.container
}
@ -1183,32 +1185,6 @@ Focus card
focus(range: RangeInterface, toStart?: boolean): void;
```
### `focusPrevBlock`
Focus on the previous block-level node where the card is located
```ts
/**
* Focus on the previous block-level node where the card is located
* @param range cursor
* @param hasModify When there is no node, whether to create an empty node and focus
*/
focusPrevBlock(range: RangeInterface, hasModify: boolean): void;
```
### `focusNextBlock`
Focus on the next block-level node where the card is located
```ts
/**
* Focus on the next block-level node where the card is located
* @param range cursor
* @param hasModify When there is no node, whether to create an empty node and focus
*/
focusNextBlock(range: RangeInterface, hasModify: boolean): void;
```
### `onFocus`
Triggered when the card is focused

View File

@ -275,6 +275,7 @@ class Test extends Card {
}
destroy() {
super.destroy();
ReactDOM.unmountComponentAtNode(this.#container?.get<HTMLElement>()!);
}
}
@ -651,7 +652,9 @@ class Test extends Card {
}
destroy() {
this.#vm?.unmount();
super.destroy();
this.vm?.unmount();
this.vm = undefined;
}
}
export default Test;
@ -844,7 +847,7 @@ export default class extends Card<{ count: number }> {
// 创建 div 节点
this.container = $(`<div>${value.count}</div>`)
// 绑定 click 事件
this.container.on("click" => this.onClick)
this.container.on("click" => () => this.onClick())
// 返回节点给容器加载
return this.container
}
@ -1183,32 +1186,6 @@ isRightCursor(node: NodeInterface): boolean;
focus(range: RangeInterface, toStart?: boolean): void;
```
### `focusPrevBlock`
聚焦卡片所在位置的前一个块级节点
```ts
/**
* 聚焦卡片所在位置的前一个块级节点
* @param range 光标
* @param hasModify 没有节点时,是否创建一个空节点并聚焦
*/
focusPrevBlock(range: RangeInterface, hasModify: boolean): void;
```
### `focusNextBlock`
聚焦卡片所在位置的下一个块级节点
```ts
/**
* 聚焦卡片所在位置的下一个块级节点
* @param range 光标
* @param hasModify 没有节点时,是否创建一个空节点并聚焦
*/
focusNextBlock(range: RangeInterface, hasModify: boolean): void;
```
### `onFocus`
当卡片聚焦时触发