feat: add modify internal context menu interface #300

This commit is contained in:
Hufe921
2023-10-24 21:39:37 +08:00
parent 45e7eab119
commit 0891f053d2
15 changed files with 231 additions and 34 deletions
+12
View File
@@ -8,13 +8,25 @@ import Editor from "@hufe921/canvas-editor"
const instance = new Editor(container, <IElement[]>data, options)
instance.register.contextMenuList([
{
key?: string;
isDivider?: boolean;
icon?: string;
name?: string; // Use %s for selection text. Example: Search: %s
shortCut?: string;
disable?: boolean;
when?: (payload: IContextMenuContext) => boolean;
callback?: (command: Command, context: IContextMenuContext) => any;
childMenus?: IRegisterContextMenu[];
}
])
```
## getContextMenuList
Feature: Get context menu list
Usage:
```javascript
const contextMenuList = await instance.register.getContextMenuList()
```
+1
View File
@@ -56,6 +56,7 @@ interface IEditorOption {
printPixelRatio?: number // Print the pixel ratio (larger values are clearer, but larger sizes). default: 3
maskMargin?: IMargin // Masking margins above the editorfor example: menu bar, bottom toolbar)。default: [0, 0, 0, 0]
letterClass? string[] // Alphabet class supported by typesetting. default: a-zA-Z. Built-in alternative alphabet class: LETTER_CLASS
contextMenuDisableKeys?: string[] // Disable context menu keys. default: []
wordBreak?: WordBreak // Word and punctuation breaks: No punctuation in the first line of the BREAK_WORD &The word is not split, and the line is folded after BREAK_ALL full according to the width of the character. default: BREAK_WORD
watermark?: IWatermark // Watermark{data:string; color?:string; opacity?:number; size?:number; font?:string;}
control?: IControlOption // Control {placeholderColor?:string; bracketColor?:string; prefix?:string; postfix?:string;}
+12
View File
@@ -8,13 +8,25 @@ import Editor from "@hufe921/canvas-editor"
const instance = new Editor(container, <IElement[]>data, options)
instance.register.contextMenuList([
{
key?: string;
isDivider?: boolean;
icon?: string;
name?: string; // 使用%s代表选区文本。示例:搜索:%s
shortCut?: string;
disable?: boolean;
when?: (payload: IContextMenuContext) => boolean;
callback?: (command: Command, context: IContextMenuContext) => any;
childMenus?: IRegisterContextMenu[];
}
])
```
## getContextMenuList
功能:获取注册的右键菜单列表
用法:
```javascript
const contextMenuList = await instance.register.getContextMenuList()
```
+2 -1
View File
@@ -55,7 +55,8 @@ interface IEditorOption {
historyMaxRecordCount?: number // 历史(撤销重做)最大记录次数。默认:100次
printPixelRatio?: number // 打印像素比率(值越大越清晰,但尺寸越大)。默认:3
maskMargin?: IMargin // 编辑器上的遮盖边距(如悬浮到编辑器上的菜单栏、底部工具栏)。默认:[0, 0, 0, 0]
letterClass? string[] // 排版支持的字母类。默认:a-zA-Z。内置可选择的字母表类:LETTER_CLASS
letterClass?: string[] // 排版支持的字母类。默认:a-zA-Z。内置可选择的字母表类:LETTER_CLASS
contextMenuDisableKeys?: string[] // 禁用的右键菜单。默认:[]
wordBreak?: WordBreak // 单词与标点断行:BREAK_WORD首行不出现标点&单词不拆分、BREAK_ALL按字符宽度撑满后折行。默认:BREAK_WORD
watermark?: IWatermark // 水印信息。{data:string; color?:string; opacity?:number; size?:number; font?:string;}
control?: IControlOption // 控件信息。 {placeholderColor?:string; bracketColor?:string; prefix?:string; postfix?:string;}