@visactor/vrender-core 0.22.0-vstory.5 → 0.22.0-vstory.7

package/cjs/interface/graphic/richText.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/interface/graphic/richText.ts"],"names":[],"mappings":"","file":"richText.js","sourcesContent":["import type { IColor } from '../color';\nimport type { IContext2d } from '../context';\nimport type { IGraphicAttribute, IGraphic } from '../graphic';\nimport type { IImage, IImageGraphicAttribute } from './image';\nimport type { ITextGraphicAttribute } from './text';\n\nexport type IRichTextEditOptionsType = {\n  placeholder?: string;\n  placeholderColor?: string;\n  placeholderFontSize?: number;\n  placeholderFontFamily?: string;\n  // 是否将placeholder同步到textConfig中\n  syncPlaceholderToTextConfig?: boolean;\n  // 即使是空文本，是否也保持高度\n  keepHeightWhileEmpty?: boolean;\n  // 是否在输入的时候展示包围框，不传默认是false，可以传入颜色\n  boundsStrokeWhenInput?: string;\n};\n\nexport type IRichTextAttribute = {\n  width: number;\n  height: number;\n  editable: boolean;\n  editOptions: IRichTextEditOptionsType | null;\n  ellipsis: boolean | string;\n  wordBreak: RichTextWordBreak;\n  verticalDirection: RichTextVerticalDirection;\n  maxHeight: number;\n  maxWidth: number;\n  textAlign: RichTextGlobalAlignType;\n  textBaseline: RichTextGlobalBaselineType;\n  layoutDirection: RichTextLayoutDirectionType;\n  textConfig: IRichTextCharacter[];\n  // 是否不自动每行截断\n  disableAutoWrapLine: boolean;\n  singleLine: boolean;\n};\n\nexport type IRichTextGraphicAttribute = Partial<IGraphicAttribute & ITextGraphicAttribute> &\n  Partial<IRichTextAttribute>;\n\nexport type RichTextWordBreak = 'break-word' | 'break-all';\nexport type RichTextVerticalDirection = 'top' | 'middle' | 'bottom';\nexport type RichTextGlobalAlignType = 'left' | 'right' | 'center';\nexport type RichTextGlobalBaselineType = 'top' | 'middle' | 'bottom';\nexport type RichTextLayoutDirectionType = 'horizontal' | 'vertical';\nexport type RichTextFontStyle = 'normal' | 'italic' | 'oblique';\nexport type RichTextTextDecoration = 'none' | 'underline' | 'line-through';\n// export type RichTextTextAlign = 'left' | 'right' | 'center';\nexport type RichTextScript = 'normal' | 'sub' | 'super';\n\nexport type IRichTextBasicCharacter = {\n  lineHeight?: number | string;\n  textAlign?: CanvasTextAlign; // left, right, center\n  textBaseline?: CanvasTextBaseline;\n  direction?: RichTextLayoutDirectionType;\n};\n\nexport type IRichTextParagraphCharacter = IRichTextBasicCharacter & {\n  text: string | number;\n  fontSize?: number;\n  fontFamily?: string;\n  fill?: IColor | boolean;\n  stroke?: IColor | boolean;\n  fontWeight?: string;\n  lineWidth?: number;\n  // lineHeight?: number;\n  fontStyle?: RichTextFontStyle; // normal, italic, oblique\n  textDecoration?: RichTextTextDecoration; // none, underline, line-through\n  // textAlign?: RichTextTextAlign; // left, right, center\n  script?: RichTextScript; // normal, sub, super\n  underline?: boolean;\n  lineThrough?: boolean;\n  opacity?: number;\n  fillOpacity?: number;\n  strokeOpacity?: number;\n  // 仅支持纯色背景\n  background?: string;\n  // 背景透明度\n  backgroundOpacity?: number;\n  // direction?: RichTextLayoutDirectionType;\n};\n\nexport type IRichTextImageCharacter = IRichTextBasicCharacter & {\n  // 图片基础属性\n  image: string | HTMLImageElement | HTMLCanvasElement;\n  width: number;\n  height: number;\n\n  // hover相关属性\n  // backgroundShow?: boolean; // 是否显示background\n  backgroundShowMode?: 'always' | 'hover';\n  backgroundFill?: boolean | IColor; // 背景矩形填充颜色\n  backgroundFillOpacity?: number; // 背景矩形填充透明度\n  backgroundStroke?: boolean | IColor; // 背景矩形边框颜色\n  backgroundStrokeOpacity?: number; // 背景矩形边框透明度\n  backgroundRadius?: number; // 背景矩形圆角\n  // background size 同时控制了该icon的响应范围\n  backgroundWidth?: number;\n  backgroundHeight?: number;\n\n  // 唯一标识符\n  id?: string;\n\n  // lineHeight?: number;\n  // textAlign?: RichTextTextAlign; // left, right, center\n  // direction?: RichTextLayoutDirectionType;\n  margin?: number | number[];\n\n  funcType?: string;\n  hoverImage?: string | HTMLImageElement | HTMLCanvasElement;\n};\n\nexport type IRichTextCharacter = IRichTextParagraphCharacter | IRichTextImageCharacter;\n\nexport type IRichTextIconGraphicAttribute = IImageGraphicAttribute & {\n  id?: string;\n  backgroundShowMode?: 'always' | 'hover' | 'never';\n  backgroundFill?: boolean | IColor; // 背景矩形填充颜色\n  backgroundFillOpacity?: number; // 背景矩形填充透明度\n  backgroundStroke?: boolean | IColor; // 背景矩形边框颜色\n  backgroundStrokeOpacity?: number; // 背景矩形边框透明度\n  backgroundRadius?: number; // 背景矩形圆角\n  backgroundWidth?: number;\n  backgroundHeight?: number;\n\n  // lineHeight?: number;\n  textAlign?: CanvasTextAlign; // left, right, center\n  textBaseline?: CanvasTextBaseline;\n  direction?: RichTextLayoutDirectionType;\n\n  margin?: number | number[];\n\n  // backgroundShow?: boolean;\n};\n\nexport interface IRichTextParagraph {\n  text: string;\n  ascent: number;\n  descent: number;\n  width: number;\n  height: number;\n  lineHeight: number;\n  fontSize: number;\n  length: number;\n  newLine: boolean;\n  character: IRichTextParagraphCharacter;\n  left: number;\n  top: number;\n  direction?: 'horizontal' | 'vertical';\n  widthOrigin?: number;\n  heightOrigin?: number;\n  textBaseline?: CanvasTextBaseline;\n  ellipsis: 'normal' | 'add' | 'replace' | 'hide';\n  ellipsisWidth: number;\n  ellipsisOtherParagraphWidth: number;\n  verticalEllipsis?: boolean;\n  updateWidth: () => void;\n  draw: (ctx: IContext2d, baseline: number, deltaLeft: number, isLineFirst: boolean, textAlign: string) => void;\n  getWidthWithEllips: (direction: string) => number;\n}\n\nexport interface IRichTextLine {\n  left: number;\n  top: number;\n  width: number;\n  height: number;\n  baseline: number;\n  ascent: number;\n  descent: number;\n  paragraphs: (IRichTextParagraph | IRichTextIcon)[];\n  actualWidth: number;\n  blankWidth: number;\n  textAlign: string;\n  direction: 'horizontal' | 'vertical';\n  directionKey: {\n    width: string;\n    height: string;\n    left: string;\n    x: string;\n    y: string;\n  };\n  draw: (\n    ctx: IContext2d,\n    lastLine: boolean,\n    x: number,\n    y: number,\n    drawEllipsis: boolean | string,\n    drawIcon: (icon: IRichTextIcon, context: IContext2d, x: number, y: number, baseline: number) => void\n  ) => void;\n  getWidthWithEllips: (ellipsis: string) => number;\n}\n\nexport interface IRichTextFrame {\n  left: number;\n  top: number;\n  bottom: number;\n  right: number;\n  width: number;\n  height: number;\n  actualHeight: number;\n  ellipsis: boolean | string;\n  wordBreak: 'break-word' | 'break-all';\n  verticalDirection: 'top' | 'middle' | 'bottom';\n  lines: IRichTextLine[];\n  globalAlign: 'left' | 'center' | 'right' | 'start' | 'end';\n  globalBaseline: 'top' | 'middle' | 'bottom';\n  layoutDirection: 'horizontal' | 'vertical';\n  directionKey: {\n    width: string;\n    height: string;\n    left: string;\n    top: string;\n    bottom: string;\n  };\n  isWidthMax: boolean;\n  isHeightMax: boolean;\n  singleLine: boolean;\n  icons: Map<string, IRichTextIcon>;\n  draw: (\n    ctx: IContext2d,\n    drawIcon: (icon: IRichTextIcon, context: IContext2d, x: number, y: number, baseline: number) => void\n  ) => boolean;\n  getActualSize: () => {\n    width: number;\n    height: number;\n  };\n  getRawActualSize: () => {\n    width: number;\n    height: number;\n  };\n  getActualSizeWidthEllipsis: () => {\n    width: number;\n    height: number;\n  };\n}\n\nexport interface IRichText extends IGraphic<IRichTextGraphicAttribute> {\n  getFrameCache: () => IRichTextFrame;\n  cliped?: boolean;\n}\n\nexport interface IRichTextIcon extends IImage {\n  attribute: IRichTextIconGraphicAttribute;\n  richtextId?: string;\n  globalX?: number;\n  globalY?: number;\n\n  _x: number;\n  _y: number;\n  _hovered: boolean;\n  _marginArray: [number, number, number, number];\n\n  setHoverState: (hovered: boolean) => void;\n}\n"]}
+{"version":3,"sources":["../src/interface/graphic/richText.ts"],"names":[],"mappings":"","file":"richText.js","sourcesContent":["import type { IColor } from '../color';\nimport type { IContext2d } from '../context';\nimport type { IGraphicAttribute, IGraphic } from '../graphic';\nimport type { IImage, IImageGraphicAttribute } from './image';\nimport type { ITextGraphicAttribute } from './text';\n\nexport type IRichTextEditOptionsType = {\n  placeholder?: string;\n  syncPlaceHolderToTextConfig?: boolean;\n  placeholderColor?: string;\n  placeholderFontSize?: number;\n  placeholderFontFamily?: string;\n  // 是否将placeholder同步到textConfig中\n  syncPlaceholderToTextConfig?: boolean;\n  // 即使是空文本，是否也保持高度\n  keepHeightWhileEmpty?: boolean;\n  // 是否在输入的时候展示包围框，不传默认是false，可以传入颜色\n  boundsStrokeWhenInput?: string;\n};\n\nexport type IRichTextAttribute = {\n  width: number;\n  height: number;\n  editable: boolean;\n  editOptions: IRichTextEditOptionsType | null;\n  ellipsis: boolean | string;\n  wordBreak: RichTextWordBreak;\n  verticalDirection: RichTextVerticalDirection;\n  maxHeight: number;\n  maxWidth: number;\n  textAlign: RichTextGlobalAlignType;\n  textBaseline: RichTextGlobalBaselineType;\n  layoutDirection: RichTextLayoutDirectionType;\n  textConfig: IRichTextCharacter[];\n  // 是否不自动每行截断\n  disableAutoWrapLine: boolean;\n  singleLine: boolean;\n};\n\nexport type IRichTextGraphicAttribute = Partial<IGraphicAttribute & ITextGraphicAttribute> &\n  Partial<IRichTextAttribute>;\n\nexport type RichTextWordBreak = 'break-word' | 'break-all';\nexport type RichTextVerticalDirection = 'top' | 'middle' | 'bottom';\nexport type RichTextGlobalAlignType = 'left' | 'right' | 'center';\nexport type RichTextGlobalBaselineType = 'top' | 'middle' | 'bottom';\nexport type RichTextLayoutDirectionType = 'horizontal' | 'vertical';\nexport type RichTextFontStyle = 'normal' | 'italic' | 'oblique';\nexport type RichTextTextDecoration = 'none' | 'underline' | 'line-through';\n// export type RichTextTextAlign = 'left' | 'right' | 'center';\nexport type RichTextScript = 'normal' | 'sub' | 'super';\n\nexport type IRichTextBasicCharacter = {\n  lineHeight?: number | string;\n  textAlign?: CanvasTextAlign; // left, right, center\n  textBaseline?: CanvasTextBaseline;\n  direction?: RichTextLayoutDirectionType;\n};\n\nexport type IRichTextParagraphCharacter = IRichTextBasicCharacter & {\n  text: string | number;\n  fontSize?: number;\n  fontFamily?: string;\n  fill?: IColor | boolean;\n  stroke?: IColor | boolean;\n  fontWeight?: string;\n  lineWidth?: number;\n  // lineHeight?: number;\n  fontStyle?: RichTextFontStyle; // normal, italic, oblique\n  textDecoration?: RichTextTextDecoration; // none, underline, line-through\n  // textAlign?: RichTextTextAlign; // left, right, center\n  script?: RichTextScript; // normal, sub, super\n  underline?: boolean;\n  lineThrough?: boolean;\n  opacity?: number;\n  fillOpacity?: number;\n  strokeOpacity?: number;\n  // 仅支持纯色背景\n  background?: string;\n  // 背景透明度\n  backgroundOpacity?: number;\n  // direction?: RichTextLayoutDirectionType;\n};\n\nexport type IRichTextImageCharacter = IRichTextBasicCharacter & {\n  // 图片基础属性\n  image: string | HTMLImageElement | HTMLCanvasElement;\n  width: number;\n  height: number;\n\n  // hover相关属性\n  // backgroundShow?: boolean; // 是否显示background\n  backgroundShowMode?: 'always' | 'hover';\n  backgroundFill?: boolean | IColor; // 背景矩形填充颜色\n  backgroundFillOpacity?: number; // 背景矩形填充透明度\n  backgroundStroke?: boolean | IColor; // 背景矩形边框颜色\n  backgroundStrokeOpacity?: number; // 背景矩形边框透明度\n  backgroundRadius?: number; // 背景矩形圆角\n  // background size 同时控制了该icon的响应范围\n  backgroundWidth?: number;\n  backgroundHeight?: number;\n\n  // 唯一标识符\n  id?: string;\n\n  // lineHeight?: number;\n  // textAlign?: RichTextTextAlign; // left, right, center\n  // direction?: RichTextLayoutDirectionType;\n  margin?: number | number[];\n\n  funcType?: string;\n  hoverImage?: string | HTMLImageElement | HTMLCanvasElement;\n};\n\nexport type IRichTextCharacter = IRichTextParagraphCharacter | IRichTextImageCharacter;\n\nexport type IRichTextIconGraphicAttribute = IImageGraphicAttribute & {\n  id?: string;\n  backgroundShowMode?: 'always' | 'hover' | 'never';\n  backgroundFill?: boolean | IColor; // 背景矩形填充颜色\n  backgroundFillOpacity?: number; // 背景矩形填充透明度\n  backgroundStroke?: boolean | IColor; // 背景矩形边框颜色\n  backgroundStrokeOpacity?: number; // 背景矩形边框透明度\n  backgroundRadius?: number; // 背景矩形圆角\n  backgroundWidth?: number;\n  backgroundHeight?: number;\n\n  // lineHeight?: number;\n  textAlign?: CanvasTextAlign; // left, right, center\n  textBaseline?: CanvasTextBaseline;\n  direction?: RichTextLayoutDirectionType;\n\n  margin?: number | number[];\n\n  // backgroundShow?: boolean;\n};\n\nexport interface IRichTextParagraph {\n  text: string;\n  ascent: number;\n  descent: number;\n  width: number;\n  height: number;\n  lineHeight: number;\n  fontSize: number;\n  length: number;\n  newLine: boolean;\n  character: IRichTextParagraphCharacter;\n  left: number;\n  top: number;\n  direction?: 'horizontal' | 'vertical';\n  widthOrigin?: number;\n  heightOrigin?: number;\n  textBaseline?: CanvasTextBaseline;\n  ellipsis: 'normal' | 'add' | 'replace' | 'hide';\n  ellipsisWidth: number;\n  ellipsisOtherParagraphWidth: number;\n  verticalEllipsis?: boolean;\n  updateWidth: () => void;\n  draw: (ctx: IContext2d, baseline: number, deltaLeft: number, isLineFirst: boolean, textAlign: string) => void;\n  getWidthWithEllips: (direction: string) => number;\n}\n\nexport interface IRichTextLine {\n  left: number;\n  top: number;\n  width: number;\n  height: number;\n  baseline: number;\n  ascent: number;\n  descent: number;\n  paragraphs: (IRichTextParagraph | IRichTextIcon)[];\n  actualWidth: number;\n  blankWidth: number;\n  textAlign: string;\n  direction: 'horizontal' | 'vertical';\n  directionKey: {\n    width: string;\n    height: string;\n    left: string;\n    x: string;\n    y: string;\n  };\n  draw: (\n    ctx: IContext2d,\n    lastLine: boolean,\n    x: number,\n    y: number,\n    drawEllipsis: boolean | string,\n    drawIcon: (icon: IRichTextIcon, context: IContext2d, x: number, y: number, baseline: number) => void\n  ) => void;\n  getWidthWithEllips: (ellipsis: string) => number;\n}\n\nexport interface IRichTextFrame {\n  left: number;\n  top: number;\n  bottom: number;\n  right: number;\n  width: number;\n  height: number;\n  actualHeight: number;\n  ellipsis: boolean | string;\n  wordBreak: 'break-word' | 'break-all';\n  verticalDirection: 'top' | 'middle' | 'bottom';\n  lines: IRichTextLine[];\n  globalAlign: 'left' | 'center' | 'right' | 'start' | 'end';\n  globalBaseline: 'top' | 'middle' | 'bottom';\n  layoutDirection: 'horizontal' | 'vertical';\n  directionKey: {\n    width: string;\n    height: string;\n    left: string;\n    top: string;\n    bottom: string;\n  };\n  isWidthMax: boolean;\n  isHeightMax: boolean;\n  singleLine: boolean;\n  icons: Map<string, IRichTextIcon>;\n  draw: (\n    ctx: IContext2d,\n    drawIcon: (icon: IRichTextIcon, context: IContext2d, x: number, y: number, baseline: number) => void\n  ) => boolean;\n  getActualSize: () => {\n    width: number;\n    height: number;\n  };\n  getRawActualSize: () => {\n    width: number;\n    height: number;\n  };\n  getActualSizeWidthEllipsis: () => {\n    width: number;\n    height: number;\n  };\n}\n\nexport interface IRichText extends IGraphic<IRichTextGraphicAttribute> {\n  getFrameCache: () => IRichTextFrame;\n  cliped?: boolean;\n}\n\nexport interface IRichTextIcon extends IImage {\n  attribute: IRichTextIconGraphicAttribute;\n  richtextId?: string;\n  globalX?: number;\n  globalY?: number;\n\n  _x: number;\n  _y: number;\n  _hovered: boolean;\n  _marginArray: [number, number, number, number];\n\n  setHoverState: (hovered: boolean) => void;\n}\n"]}

package/cjs/plugins/builtin-plugin/edit-module.js

@@ -150,9 +150,9 @@ class EditModule {
         const {textConfig: textConfig = []} = this.currRt.attribute, lastConfig = textConfig[configIdx];
         textConfig.splice(configIdx, 1);
         const text = lastConfig.text, textList = text ? Array.from(text.toString()) : [];
-        for (let i = 0; i < textList.length; i++) textConfig.splice(i + configIdx, 0, Object.assign(Object.assign({
+        for (let i = 0; i < textList.length; i++) textConfig.splice(i + configIdx, 0, Object.assign(Object.assign(Object.assign(Object.assign({}, getDefaultCharacterConfig(this.currRt.attribute)), {
             fill: "black"
-        }, lastConfig), {
+        }), lastConfig), {
             isComposing: !1,
             text: textList[i]
         }));

package/cjs/plugins/builtin-plugin/edit-module.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/plugins/builtin-plugin/edit-module.ts"],"names":[],"mappings":"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","file":"edit-module.js","sourcesContent":["import { application } from '../../application';\nimport type {\n  IRichText,\n  IRichTextCharacter,\n  IRichTextGraphicAttribute,\n  IRichTextParagraphCharacter\n} from '../../interface';\n\n// function getMaxConfigIndexIgnoreLinebreak(textConfig: IRichTextCharacter[]) {\n//   let idx = 0;\n//   for (let i = 0; i < textConfig.length; i++) {\n//     const c = textConfig[i] as IRichTextParagraphCharacter;\n//     if (c.text !== '\\n') {\n//       idx++;\n//     }\n//   }\n//   return Math.max(idx - 1, 0);\n// }\n\nexport function getDefaultCharacterConfig(attribute: IRichTextGraphicAttribute) {\n  const { fill = 'black', stroke = false, fontWeight = 'normal', fontFamily = 'Arial' } = attribute;\n  let { fontSize = 12 } = attribute;\n  if (!isFinite(fontSize)) {\n    fontSize = 12;\n  }\n  return {\n    fill,\n    stroke,\n    fontSize,\n    fontWeight,\n    fontFamily\n  } as any;\n}\n\n/**\n * 找到cursorIndex所在的textConfig的位置，给出的index就是要插入的准确位置\n * @param textConfig\n * @param cursorIndex\n * @returns\n */\nexport function findConfigIndexByCursorIdx(textConfig: IRichTextCharacter[], cursorIndex: number): number {\n  if (cursorIndex < 0) {\n    return 0;\n  }\n\n  // 排序找到对应的元素\n  const intCursorIndex = Math.round(cursorIndex);\n  let tempCursorIndex = intCursorIndex;\n  // 跳过连续换行符中的第一个换行符\n  let lineBreak = false;\n  let configIdx = 0;\n  for (configIdx = 0; configIdx < textConfig.length && tempCursorIndex >= 0; configIdx++) {\n    const c = textConfig[configIdx] as IRichTextParagraphCharacter;\n    if (c.text === '\\n') {\n      tempCursorIndex -= Number(lineBreak);\n      lineBreak = true;\n    } else {\n      tempCursorIndex--;\n      lineBreak = false;\n    }\n  }\n  // 说明过限了\n  if (tempCursorIndex >= 0) {\n    return textConfig.length;\n  }\n  configIdx -= 1;\n\n  // 如果有换行，一定在换行符左边写\n  if (cursorIndex > intCursorIndex && !lineBreak) {\n    configIdx += 1;\n  }\n  return configIdx;\n}\n\n/**\n * 根据configIndex找到cursorIndex的位置，忽略单个换行符，连续换行符的时候只忽略第一个\n * @param textConfig\n * @param configIndex\n * @returns\n */\nexport function findCursorIdxByConfigIndex(textConfig: IRichTextCharacter[], configIndex: number): number {\n  let cursorIndex = 0;\n  if (configIndex < 0) {\n    return -0.1;\n  }\n  // 仅有一个\\n，那不算\n  // 如果有连续的\\n，那就少算一个\n  let lastLineBreak = false;\n\n  for (let i = 0; i <= configIndex && i < textConfig.length; i++) {\n    const c = textConfig[i] as IRichTextParagraphCharacter;\n    if (c.text === '\\n') {\n      cursorIndex += Number(lastLineBreak);\n      lastLineBreak = true;\n    } else {\n      cursorIndex++;\n      lastLineBreak = false;\n    }\n  }\n  cursorIndex = Math.max(cursorIndex - 1, 0);\n\n  // 超出区间了直接设置到尾部，configIndex超过区间，cursorIndex不会超过\n  if (configIndex > textConfig.length - 1) {\n    // 如果最后一行是一个换行符，那么就得是xx.9否则就是xx.1\n    if ((textConfig[textConfig.length - 1] as any)?.text === '\\n') {\n      return cursorIndex + 0.9;\n    }\n    return cursorIndex + 0.1;\n  }\n\n  // 如果是这个configIdx对应到的是单个换行的话，那么算到下一个字符上\n  const lineBreak = (textConfig[configIndex] as any)?.text === '\\n';\n  if (configIndex >= textConfig.length - 1 && lineBreak) {\n    return cursorIndex + 1 - 0.1;\n  }\n  const singleLineBreak = lineBreak && (textConfig[configIndex - 1] as any)?.text !== '\\n';\n\n  // 光标往左放\n  cursorIndex -= 0.1;\n\n  // 如果是单行，那么这一个换行符没有算字符，光标要往右放\n  if (singleLineBreak) {\n    cursorIndex += 0.2;\n  }\n  return cursorIndex;\n}\n\nexport class EditModule {\n  container: HTMLElement;\n  textAreaDom: HTMLTextAreaElement;\n  currRt: IRichText;\n  isComposing: boolean;\n  composingConfigIdx: number;\n  cursorIndex: number;\n  selectionStartCursorIdx: number;\n  // 输入的回调（composing的时候每次也会触发）\n  onInputCbList: Array<(text: string, isComposing: boolean, cursorIdx: number, rt: IRichText) => void>;\n  // change的回调（composing确认才会触发）\n  onChangeCbList: Array<(text: string, isComposing: boolean, cursorIdx: number, rt: IRichText) => void>;\n  onFocusInList: Array<() => void>;\n  onFocusOutList: Array<() => void>;\n  focusOutTimer: number;\n\n  constructor(container?: HTMLElement) {\n    this.container = container ?? document.body;\n\n    const textAreaDom = document.createElement('textarea');\n    textAreaDom.autocomplete = 'off';\n    textAreaDom.innerText = '';\n    this.applyStyle(textAreaDom);\n    this.container.append(textAreaDom);\n    this.textAreaDom = textAreaDom;\n    this.isComposing = false;\n    this.composingConfigIdx = -1;\n    this.onInputCbList = [];\n    this.onChangeCbList = [];\n    this.onFocusInList = [];\n    this.onFocusOutList = [];\n  }\n\n  onInput(cb: (text: string, isComposing: boolean, cursorIdx: number, rt: IRichText) => void) {\n    this.onInputCbList.push(cb);\n  }\n\n  onChange(cb: (text: string, isComposing: boolean, cursorIdx: number, rt: IRichText) => void) {\n    this.onChangeCbList.push(cb);\n  }\n\n  onFocusIn(cb: () => void) {\n    this.onFocusInList.push(cb);\n  }\n\n  onFocusOut(cb: () => void) {\n    this.onFocusOutList.push(cb);\n  }\n\n  applyStyle(textAreaDom: HTMLTextAreaElement) {\n    textAreaDom.setAttribute(\n      'style',\n      `width: 100px; height: 30px; left: 0; top: 0; position: absolute; z-index: -1; outline: none; resize: none; border: none; overflow: hidden; color: transparent; user-select: none; caret-color: transparent;background-color: transparent;`\n    );\n\n    textAreaDom.addEventListener('input', this.handleInput);\n    textAreaDom.addEventListener('compositionstart', this.handleCompositionStart);\n    textAreaDom.addEventListener('compositionend', this.handleCompositionEnd);\n    // 监听焦点\n    textAreaDom.addEventListener('focusin', this.handleFocusIn);\n    textAreaDom.addEventListener('focusout', this.handleFocusOut);\n    application.global.addEventListener('keydown', this.handleKeyDown);\n  }\n\n  handleFocusIn = () => {\n    // this.focusOutTimer && clearTimeout(this.focusOutTimer);\n    // this.focusOutTimer = 0;\n    // this.onFocusInList && this.onFocusInList.forEach(cb => cb());\n  };\n  handleFocusOut = () => {\n    // 暂时注释，会导致非期待情况下的误关闭\n    // // 延时触发，避免误关闭\n    // this.focusOutTimer = setTimeout(() => {\n    //   this.onFocusOutList && this.onFocusOutList.forEach(cb => cb());\n    // }, 100);\n  };\n\n  handleKeyDown = (e: KeyboardEvent) => {\n    if (e.key === 'Delete' || e.key === 'Backspace') {\n      this.handleInput({ data: null, type: 'Backspace' });\n    }\n  };\n\n  handleCompositionStart = () => {\n    this.isComposing = true;\n    const { textConfig = [] } = this.currRt.attribute;\n    this.composingConfigIdx = this.cursorIndex < 0 ? 0 : findConfigIndexByCursorIdx(textConfig, this.cursorIndex);\n    if (this.cursorIndex < 0) {\n      const config = textConfig[0];\n      textConfig.unshift({ ...getDefaultCharacterConfig(this.currRt.attribute), ...config, text: '' });\n    } else {\n      const configIdx = this.composingConfigIdx;\n      const lastConfig = textConfig[configIdx] || textConfig[configIdx - 1];\n      textConfig.splice(configIdx, 0, { ...lastConfig, text: '' });\n    }\n  };\n  handleCompositionEnd = () => {\n    this.isComposing = false;\n\n    const text = this.parseCompositionStr(this.composingConfigIdx);\n    // 拆分上一次的内容\n    // const { textConfig = [] } = this.currRt.attribute;\n    // const configIdx = this.composingConfigIdx;\n\n    // const lastConfig = textConfig[configIdx];\n    // textConfig.splice(configIdx, 1);\n    // const text = (lastConfig as any).text;\n    // const textList: string[] = text ? Array.from(text.toString()) : [];\n    // for (let i = 0; i < textList.length; i++) {\n    //   textConfig.splice(i + configIdx, 0, { ...lastConfig, isComposing: false, text: textList[i] } as any);\n    // }\n    // this.currRt.setAttributes({ textConfig });\n    // const nextConfigIdx = configIdx + textList.length;\n    // this.cursorIndex = findCursorIdxByConfigIndex(textConfig, nextConfigIdx);\n    this.composingConfigIdx = -1;\n\n    this.onChangeCbList.forEach(cb => {\n      cb(\n        text,\n        this.isComposing,\n        // TODO 当换行后刚开始输入会有问题，后续看这里具体Cursor变换逻辑\n        this.cursorIndex,\n        this.currRt\n      );\n    });\n  };\n\n  /**\n   * 复合输入以及粘贴，都会复制出一大段内容，这时候需要重新处理textConfig和cursorIndex\n   * 1. 拆分text到textConfig\n   * 2. 计算新的cursorIndex\n   * @param configIdx\n   */\n  parseCompositionStr(configIdx: number) {\n    const { textConfig = [] } = this.currRt.attribute;\n\n    const lastConfig = textConfig[configIdx];\n    textConfig.splice(configIdx, 1);\n    const text = (lastConfig as any).text;\n    const textList: string[] = text ? Array.from(text.toString()) : [];\n    for (let i = 0; i < textList.length; i++) {\n      textConfig.splice(i + configIdx, 0, {\n        fill: 'black',\n        ...lastConfig,\n        isComposing: false,\n        text: textList[i]\n      } as any);\n    }\n    this.currRt.setAttributes({ textConfig });\n    const nextConfigIdx = configIdx + textList.length;\n    this.cursorIndex = findCursorIdxByConfigIndex(textConfig, nextConfigIdx);\n    return text;\n  }\n\n  handleInput = (ev: any) => {\n    if (!this.currRt) {\n      return;\n    }\n    if (ev.inputType === 'historyUndo') {\n      return;\n    }\n    const { textConfig = [], ...rest } = this.currRt.attribute;\n    // 删完了，直接返回\n    if (ev.type === 'Backspace' && !textConfig.length) {\n      return;\n    }\n\n    let str = (ev as any).data;\n    if (!this.isComposing && ev.type !== 'Backspace' && !str) {\n      str = '\\n';\n    }\n\n    // 处理正反选\n    if (this.selectionStartCursorIdx > this.cursorIndex) {\n      [this.cursorIndex, this.selectionStartCursorIdx] = [this.selectionStartCursorIdx, this.cursorIndex];\n    }\n\n    const startIdx = findConfigIndexByCursorIdx(textConfig, this.selectionStartCursorIdx);\n    const endIdx = findConfigIndexByCursorIdx(textConfig, this.cursorIndex);\n\n    // composing的话会插入一个字符，所以往右加一个\n    const lastConfigIdx = this.isComposing ? this.composingConfigIdx : Math.max(startIdx - 1, 0);\n    // 算一个默认属性\n    let lastConfig: any = textConfig[lastConfigIdx];\n    if (!lastConfig) {\n      lastConfig = getDefaultCharacterConfig(rest);\n    }\n    let nextConfig = lastConfig;\n\n    if (startIdx !== endIdx) {\n      textConfig.splice(startIdx, endIdx - startIdx);\n      if (this.isComposing) {\n        this.composingConfigIdx = startIdx;\n      }\n    }\n\n    let nextConfigIdx = startIdx;\n\n    // 删除键\n    if (ev.type === 'Backspace' && !this.isComposing) {\n      if (startIdx === endIdx) {\n        if (startIdx <= 0) {\n          return;\n        }\n        // 删除\n        textConfig.splice(startIdx - 1, 1);\n        nextConfigIdx = Math.max(startIdx - 1, 0);\n      } else {\n        // 不插入内容\n      }\n    } else {\n      // 插入\n      if (!this.isComposing) {\n        nextConfig = { fill: 'black', ...lastConfig, text: '' };\n        textConfig.splice(startIdx, 0, nextConfig);\n        nextConfigIdx++;\n      }\n      // 插入\n      nextConfig.text = str;\n      // 标记isComposing，用来判定是否应该拆分成单个字符\n      nextConfig.isComposing = this.isComposing;\n    }\n\n    this.currRt.setAttributes({ textConfig });\n    // 重新计算cursorIdx\n    // nextConfigIdx = Math.min(nextConfigIdx, textConfig.length - 1);\n\n    let cursorIndex = this.cursorIndex;\n    if (str && str.length > 1 && !this.isComposing) {\n      // 如果字符长度大于1且不是composing，那说明是粘贴\n      // 拆分\n      this.parseCompositionStr(nextConfigIdx - 1);\n      cursorIndex = this.cursorIndex;\n    } else {\n      // composing的时候不偏移，只有完整输入后才偏移\n      cursorIndex = findCursorIdxByConfigIndex(textConfig, nextConfigIdx);\n      if (!this.isComposing) {\n        this.cursorIndex = cursorIndex;\n      } else {\n        this.cursorIndex = this.selectionStartCursorIdx;\n      }\n    }\n\n    if (!this.isComposing) {\n      this.onChangeCbList.forEach(cb => {\n        cb(str, this.isComposing, cursorIndex, this.currRt);\n      });\n    } else {\n      this.onInputCbList.forEach(cb => {\n        cb(str, this.isComposing, cursorIndex, this.currRt);\n      });\n    }\n  };\n\n  moveTo(x: number, y: number, rt: IRichText, cursorIndex: number, selectionStartCursorIdx: number) {\n    this.textAreaDom.style.left = `${x}px`;\n    this.textAreaDom.style.top = `${y}px`;\n    setTimeout(() => {\n      this.textAreaDom.focus();\n      this.textAreaDom.setSelectionRange(0, 0);\n    });\n    this.currRt = rt;\n\n    this.cursorIndex = cursorIndex;\n    this.selectionStartCursorIdx = selectionStartCursorIdx;\n  }\n\n  release() {\n    this.textAreaDom.removeEventListener('input', this.handleInput);\n    this.textAreaDom.removeEventListener('compositionstart', this.handleCompositionStart);\n    this.textAreaDom.removeEventListener('compositionend', this.handleCompositionEnd);\n    this.textAreaDom.addEventListener('focusin', this.handleFocusOut);\n    this.textAreaDom.addEventListener('focusout', this.handleFocusOut);\n    application.global.removeEventListener('keydown', this.handleKeyDown);\n  }\n}\n"]}
+{"version":3,"sources":["../src/plugins/builtin-plugin/edit-module.ts"],"names":[],"mappings":"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","file":"edit-module.js","sourcesContent":["import { application } from '../../application';\nimport type {\n  IRichText,\n  IRichTextCharacter,\n  IRichTextGraphicAttribute,\n  IRichTextParagraphCharacter\n} from '../../interface';\n\n// function getMaxConfigIndexIgnoreLinebreak(textConfig: IRichTextCharacter[]) {\n//   let idx = 0;\n//   for (let i = 0; i < textConfig.length; i++) {\n//     const c = textConfig[i] as IRichTextParagraphCharacter;\n//     if (c.text !== '\\n') {\n//       idx++;\n//     }\n//   }\n//   return Math.max(idx - 1, 0);\n// }\n\nexport function getDefaultCharacterConfig(attribute: IRichTextGraphicAttribute) {\n  const { fill = 'black', stroke = false, fontWeight = 'normal', fontFamily = 'Arial' } = attribute;\n  let { fontSize = 12 } = attribute;\n  if (!isFinite(fontSize)) {\n    fontSize = 12;\n  }\n  return {\n    fill,\n    stroke,\n    fontSize,\n    fontWeight,\n    fontFamily\n  } as any;\n}\n\n/**\n * 找到cursorIndex所在的textConfig的位置，给出的index就是要插入的准确位置\n * @param textConfig\n * @param cursorIndex\n * @returns\n */\nexport function findConfigIndexByCursorIdx(textConfig: IRichTextCharacter[], cursorIndex: number): number {\n  if (cursorIndex < 0) {\n    return 0;\n  }\n\n  // 排序找到对应的元素\n  const intCursorIndex = Math.round(cursorIndex);\n  let tempCursorIndex = intCursorIndex;\n  // 跳过连续换行符中的第一个换行符\n  let lineBreak = false;\n  let configIdx = 0;\n  for (configIdx = 0; configIdx < textConfig.length && tempCursorIndex >= 0; configIdx++) {\n    const c = textConfig[configIdx] as IRichTextParagraphCharacter;\n    if (c.text === '\\n') {\n      tempCursorIndex -= Number(lineBreak);\n      lineBreak = true;\n    } else {\n      tempCursorIndex--;\n      lineBreak = false;\n    }\n  }\n  // 说明过限了\n  if (tempCursorIndex >= 0) {\n    return textConfig.length;\n  }\n  configIdx -= 1;\n\n  // 如果有换行，一定在换行符左边写\n  if (cursorIndex > intCursorIndex && !lineBreak) {\n    configIdx += 1;\n  }\n  return configIdx;\n}\n\n/**\n * 根据configIndex找到cursorIndex的位置，忽略单个换行符，连续换行符的时候只忽略第一个\n * @param textConfig\n * @param configIndex\n * @returns\n */\nexport function findCursorIdxByConfigIndex(textConfig: IRichTextCharacter[], configIndex: number): number {\n  let cursorIndex = 0;\n  if (configIndex < 0) {\n    return -0.1;\n  }\n  // 仅有一个\\n，那不算\n  // 如果有连续的\\n，那就少算一个\n  let lastLineBreak = false;\n\n  for (let i = 0; i <= configIndex && i < textConfig.length; i++) {\n    const c = textConfig[i] as IRichTextParagraphCharacter;\n    if (c.text === '\\n') {\n      cursorIndex += Number(lastLineBreak);\n      lastLineBreak = true;\n    } else {\n      cursorIndex++;\n      lastLineBreak = false;\n    }\n  }\n  cursorIndex = Math.max(cursorIndex - 1, 0);\n\n  // 超出区间了直接设置到尾部，configIndex超过区间，cursorIndex不会超过\n  if (configIndex > textConfig.length - 1) {\n    // 如果最后一行是一个换行符，那么就得是xx.9否则就是xx.1\n    if ((textConfig[textConfig.length - 1] as any)?.text === '\\n') {\n      return cursorIndex + 0.9;\n    }\n    return cursorIndex + 0.1;\n  }\n\n  // 如果是这个configIdx对应到的是单个换行的话，那么算到下一个字符上\n  const lineBreak = (textConfig[configIndex] as any)?.text === '\\n';\n  if (configIndex >= textConfig.length - 1 && lineBreak) {\n    return cursorIndex + 1 - 0.1;\n  }\n  const singleLineBreak = lineBreak && (textConfig[configIndex - 1] as any)?.text !== '\\n';\n\n  // 光标往左放\n  cursorIndex -= 0.1;\n\n  // 如果是单行，那么这一个换行符没有算字符，光标要往右放\n  if (singleLineBreak) {\n    cursorIndex += 0.2;\n  }\n  return cursorIndex;\n}\n\nexport class EditModule {\n  container: HTMLElement;\n  textAreaDom: HTMLTextAreaElement;\n  currRt: IRichText;\n  isComposing: boolean;\n  composingConfigIdx: number;\n  cursorIndex: number;\n  selectionStartCursorIdx: number;\n  // 输入的回调（composing的时候每次也会触发）\n  onInputCbList: Array<(text: string, isComposing: boolean, cursorIdx: number, rt: IRichText) => void>;\n  // change的回调（composing确认才会触发）\n  onChangeCbList: Array<(text: string, isComposing: boolean, cursorIdx: number, rt: IRichText) => void>;\n  onFocusInList: Array<() => void>;\n  onFocusOutList: Array<() => void>;\n  focusOutTimer: number;\n\n  constructor(container?: HTMLElement) {\n    this.container = container ?? document.body;\n\n    const textAreaDom = document.createElement('textarea');\n    textAreaDom.autocomplete = 'off';\n    textAreaDom.innerText = '';\n    this.applyStyle(textAreaDom);\n    this.container.append(textAreaDom);\n    this.textAreaDom = textAreaDom;\n    this.isComposing = false;\n    this.composingConfigIdx = -1;\n    this.onInputCbList = [];\n    this.onChangeCbList = [];\n    this.onFocusInList = [];\n    this.onFocusOutList = [];\n  }\n\n  onInput(cb: (text: string, isComposing: boolean, cursorIdx: number, rt: IRichText) => void) {\n    this.onInputCbList.push(cb);\n  }\n\n  onChange(cb: (text: string, isComposing: boolean, cursorIdx: number, rt: IRichText) => void) {\n    this.onChangeCbList.push(cb);\n  }\n\n  onFocusIn(cb: () => void) {\n    this.onFocusInList.push(cb);\n  }\n\n  onFocusOut(cb: () => void) {\n    this.onFocusOutList.push(cb);\n  }\n\n  applyStyle(textAreaDom: HTMLTextAreaElement) {\n    textAreaDom.setAttribute(\n      'style',\n      `width: 100px; height: 30px; left: 0; top: 0; position: absolute; z-index: -1; outline: none; resize: none; border: none; overflow: hidden; color: transparent; user-select: none; caret-color: transparent;background-color: transparent;`\n    );\n\n    textAreaDom.addEventListener('input', this.handleInput);\n    textAreaDom.addEventListener('compositionstart', this.handleCompositionStart);\n    textAreaDom.addEventListener('compositionend', this.handleCompositionEnd);\n    // 监听焦点\n    textAreaDom.addEventListener('focusin', this.handleFocusIn);\n    textAreaDom.addEventListener('focusout', this.handleFocusOut);\n    application.global.addEventListener('keydown', this.handleKeyDown);\n  }\n\n  handleFocusIn = () => {\n    // this.focusOutTimer && clearTimeout(this.focusOutTimer);\n    // this.focusOutTimer = 0;\n    // this.onFocusInList && this.onFocusInList.forEach(cb => cb());\n  };\n  handleFocusOut = () => {\n    // 暂时注释，会导致非期待情况下的误关闭\n    // // 延时触发，避免误关闭\n    // this.focusOutTimer = setTimeout(() => {\n    //   this.onFocusOutList && this.onFocusOutList.forEach(cb => cb());\n    // }, 100);\n  };\n\n  handleKeyDown = (e: KeyboardEvent) => {\n    if (e.key === 'Delete' || e.key === 'Backspace') {\n      this.handleInput({ data: null, type: 'Backspace' });\n    }\n  };\n\n  handleCompositionStart = () => {\n    this.isComposing = true;\n    const { textConfig = [] } = this.currRt.attribute;\n    this.composingConfigIdx = this.cursorIndex < 0 ? 0 : findConfigIndexByCursorIdx(textConfig, this.cursorIndex);\n    if (this.cursorIndex < 0) {\n      const config = textConfig[0];\n      textConfig.unshift({ ...getDefaultCharacterConfig(this.currRt.attribute), ...config, text: '' });\n    } else {\n      const configIdx = this.composingConfigIdx;\n      const lastConfig = textConfig[configIdx] || textConfig[configIdx - 1];\n      textConfig.splice(configIdx, 0, { ...lastConfig, text: '' });\n    }\n  };\n  handleCompositionEnd = () => {\n    this.isComposing = false;\n\n    const text = this.parseCompositionStr(this.composingConfigIdx);\n    // 拆分上一次的内容\n    // const { textConfig = [] } = this.currRt.attribute;\n    // const configIdx = this.composingConfigIdx;\n\n    // const lastConfig = textConfig[configIdx];\n    // textConfig.splice(configIdx, 1);\n    // const text = (lastConfig as any).text;\n    // const textList: string[] = text ? Array.from(text.toString()) : [];\n    // for (let i = 0; i < textList.length; i++) {\n    //   textConfig.splice(i + configIdx, 0, { ...lastConfig, isComposing: false, text: textList[i] } as any);\n    // }\n    // this.currRt.setAttributes({ textConfig });\n    // const nextConfigIdx = configIdx + textList.length;\n    // this.cursorIndex = findCursorIdxByConfigIndex(textConfig, nextConfigIdx);\n    this.composingConfigIdx = -1;\n\n    this.onChangeCbList.forEach(cb => {\n      cb(\n        text,\n        this.isComposing,\n        // TODO 当换行后刚开始输入会有问题，后续看这里具体Cursor变换逻辑\n        this.cursorIndex,\n        this.currRt\n      );\n    });\n  };\n\n  /**\n   * 复合输入以及粘贴，都会复制出一大段内容，这时候需要重新处理textConfig和cursorIndex\n   * 1. 拆分text到textConfig\n   * 2. 计算新的cursorIndex\n   * @param configIdx\n   */\n  parseCompositionStr(configIdx: number) {\n    const { textConfig = [] } = this.currRt.attribute;\n\n    const lastConfig = textConfig[configIdx];\n    textConfig.splice(configIdx, 1);\n    const text = (lastConfig as any).text;\n    const textList: string[] = text ? Array.from(text.toString()) : [];\n    for (let i = 0; i < textList.length; i++) {\n      textConfig.splice(i + configIdx, 0, {\n        ...getDefaultCharacterConfig(this.currRt.attribute),\n        fill: 'black',\n        ...lastConfig,\n        isComposing: false,\n        text: textList[i]\n      } as any);\n    }\n    this.currRt.setAttributes({ textConfig });\n    const nextConfigIdx = configIdx + textList.length;\n    this.cursorIndex = findCursorIdxByConfigIndex(textConfig, nextConfigIdx);\n    return text;\n  }\n\n  handleInput = (ev: any) => {\n    if (!this.currRt) {\n      return;\n    }\n    if (ev.inputType === 'historyUndo') {\n      return;\n    }\n    const { textConfig = [], ...rest } = this.currRt.attribute;\n    // 删完了，直接返回\n    if (ev.type === 'Backspace' && !textConfig.length) {\n      return;\n    }\n\n    let str = (ev as any).data;\n    if (!this.isComposing && ev.type !== 'Backspace' && !str) {\n      str = '\\n';\n    }\n\n    // 处理正反选\n    if (this.selectionStartCursorIdx > this.cursorIndex) {\n      [this.cursorIndex, this.selectionStartCursorIdx] = [this.selectionStartCursorIdx, this.cursorIndex];\n    }\n\n    const startIdx = findConfigIndexByCursorIdx(textConfig, this.selectionStartCursorIdx);\n    const endIdx = findConfigIndexByCursorIdx(textConfig, this.cursorIndex);\n\n    // composing的话会插入一个字符，所以往右加一个\n    const lastConfigIdx = this.isComposing ? this.composingConfigIdx : Math.max(startIdx - 1, 0);\n    // 算一个默认属性\n    let lastConfig: any = textConfig[lastConfigIdx];\n    if (!lastConfig) {\n      lastConfig = getDefaultCharacterConfig(rest);\n    }\n    let nextConfig = lastConfig;\n\n    if (startIdx !== endIdx) {\n      textConfig.splice(startIdx, endIdx - startIdx);\n      if (this.isComposing) {\n        this.composingConfigIdx = startIdx;\n      }\n    }\n\n    let nextConfigIdx = startIdx;\n\n    // 删除键\n    if (ev.type === 'Backspace' && !this.isComposing) {\n      if (startIdx === endIdx) {\n        if (startIdx <= 0) {\n          return;\n        }\n        // 删除\n        textConfig.splice(startIdx - 1, 1);\n        nextConfigIdx = Math.max(startIdx - 1, 0);\n      } else {\n        // 不插入内容\n      }\n    } else {\n      // 插入\n      if (!this.isComposing) {\n        nextConfig = { fill: 'black', ...lastConfig, text: '' };\n        textConfig.splice(startIdx, 0, nextConfig);\n        nextConfigIdx++;\n      }\n      // 插入\n      nextConfig.text = str;\n      // 标记isComposing，用来判定是否应该拆分成单个字符\n      nextConfig.isComposing = this.isComposing;\n    }\n\n    this.currRt.setAttributes({ textConfig });\n    // 重新计算cursorIdx\n    // nextConfigIdx = Math.min(nextConfigIdx, textConfig.length - 1);\n\n    let cursorIndex = this.cursorIndex;\n    if (str && str.length > 1 && !this.isComposing) {\n      // 如果字符长度大于1且不是composing，那说明是粘贴\n      // 拆分\n      this.parseCompositionStr(nextConfigIdx - 1);\n      cursorIndex = this.cursorIndex;\n    } else {\n      // composing的时候不偏移，只有完整输入后才偏移\n      cursorIndex = findCursorIdxByConfigIndex(textConfig, nextConfigIdx);\n      if (!this.isComposing) {\n        this.cursorIndex = cursorIndex;\n      } else {\n        this.cursorIndex = this.selectionStartCursorIdx;\n      }\n    }\n\n    if (!this.isComposing) {\n      this.onChangeCbList.forEach(cb => {\n        cb(str, this.isComposing, cursorIndex, this.currRt);\n      });\n    } else {\n      this.onInputCbList.forEach(cb => {\n        cb(str, this.isComposing, cursorIndex, this.currRt);\n      });\n    }\n  };\n\n  moveTo(x: number, y: number, rt: IRichText, cursorIndex: number, selectionStartCursorIdx: number) {\n    this.textAreaDom.style.left = `${x}px`;\n    this.textAreaDom.style.top = `${y}px`;\n    setTimeout(() => {\n      this.textAreaDom.focus();\n      this.textAreaDom.setSelectionRange(0, 0);\n    });\n    this.currRt = rt;\n\n    this.cursorIndex = cursorIndex;\n    this.selectionStartCursorIdx = selectionStartCursorIdx;\n  }\n\n  release() {\n    this.textAreaDom.removeEventListener('input', this.handleInput);\n    this.textAreaDom.removeEventListener('compositionstart', this.handleCompositionStart);\n    this.textAreaDom.removeEventListener('compositionend', this.handleCompositionEnd);\n    this.textAreaDom.addEventListener('focusin', this.handleFocusOut);\n    this.textAreaDom.addEventListener('focusout', this.handleFocusOut);\n    application.global.removeEventListener('keydown', this.handleKeyDown);\n  }\n}\n"]}

package/cjs/plugins/builtin-plugin/richtext-edit-plugin.d.ts

@@ -1,7 +1,7 @@
 import type { IPointLike } from '@visactor/vutils';
 import type { IGroup, ILine, IPlugin, IPluginService, IRect, IRichText, IRichTextCharacter, IRichTextFrame, IRichTextIcon, IRichTextLine, IRichTextParagraph, ITicker, ITimeline } from '../../interface';
 import { EditModule } from './edit-module';
-type UpdateType = 'input' | 'change' | 'onfocus' | 'defocus' | 'selection' | 'dispatch';
+type UpdateType = 'input' | 'change' | 'onfocus' | 'beforeOnfocus' | 'defocus' | 'beforeDefocus' | 'selection' | 'dispatch';
 declare class Selection {
     selectionStartCursorIdx: number;
     curCursorIdx: number;
@@ -38,7 +38,7 @@ export declare class RichTextEditPlugin implements IPlugin {
     startCursorPos?: IPointLike;
     editModule: EditModule;
     protected commandCbs: Map<string, Array<(payload: any, p: RichTextEditPlugin) => void>>;
-    protected updateCbs: Array<(type: UpdateType, p: RichTextEditPlugin) => void>;
+    protected updateCbs: Array<(type: UpdateType, p: RichTextEditPlugin, params?: any) => void>;
     protected deltaX: number;
     protected deltaY: number;
     static tryUpdateRichtext(richtext: IRichText): void;
@@ -84,6 +84,7 @@ export declare class RichTextEditPlugin implements IPlugin {
         y2: number;
     }, cache: IRichTextFrame): void;
     hideSelection(): void;
+    protected getShadow(rt: IRichText): import("../../interface").IShadowRoot;
     protected getLineByPoint(cache: IRichTextFrame, p1: IPointLike): IRichTextLine;
     protected getColumnAndIndexByLinePoint(lineInfo: IRichTextLine, p1: IPointLike): {
         columnInfo: IRichTextParagraph | IRichTextIcon;

package/cjs/plugins/builtin-plugin/richtext-edit-plugin.js

@@ -185,7 +185,10 @@ class RichTextEditPlugin {
             if (!currRt) return;
             const cache = currRt.getFrameCache();
             if (!cache) return;
-            const {lines: lines} = cache, totalCursorCount = lines.reduce(((total, line) => total + line.paragraphs.length), 0) - 1;
+            const {lines: lines} = cache;
+            if (0 === lines.length) return;
+            if (!lines[0].paragraphs || 0 === lines[0].paragraphs.length) return;
+            const totalCursorCount = lines.reduce(((total, line) => total + line.paragraphs.length), 0) - 1;
             return this.selectionRange(-.1, totalCursorCount + .1), e.preventDefault(), !0;
         }
         return !1;
@@ -233,29 +236,32 @@ class RichTextEditPlugin {
         const {textConfig: textConfig, editOptions: editOptions} = this.currRt.attribute;
         if (textConfig && textConfig.length) return;
         if (!editOptions || !editOptions.placeholder) return;
-        const {placeholder: placeholder, placeholderColor: placeholderColor = "rgba(0, 0, 0, 0.6)", placeholderFontFamily: placeholderFontFamily, placeholderFontSize: placeholderFontSize} = editOptions, shadow = this.currRt.shadowRoot || this.currRt.attachShadow();
-        this.shadowPlaceHolder = (0, graphic_1.createRichText)(Object.assign(Object.assign({}, this.currRt.attribute), {
+        const {placeholder: placeholder, placeholderColor: placeholderColor = "rgba(0, 0, 0, 0.6)", placeholderFontFamily: placeholderFontFamily, placeholderFontSize: placeholderFontSize} = editOptions, shadow = this.getShadow(this.currRt), textConfigItem = Object.assign(Object.assign({}, (0, 
+        edit_module_1.getDefaultCharacterConfig)(this.currRt.attribute)), {
+            text: placeholder
+        });
+        placeholderColor && (textConfigItem.fill = placeholderColor), placeholderFontFamily && (textConfigItem.fontFamily = placeholderFontFamily), 
+        placeholderFontSize && (textConfigItem.fontSize = placeholderFontSize), this.shadowPlaceHolder = (0, 
+        graphic_1.createRichText)(Object.assign(Object.assign({}, this.currRt.attribute), {
             x: 0,
             y: 0,
+            pickable: !1,
+            editable: !1,
+            editOptions: null,
             angle: 0,
             _debug_bounds: !1,
-            textConfig: [ {
-                text: placeholder,
-                fill: placeholderColor,
-                fontFamily: placeholderFontFamily,
-                fontSize: placeholderFontSize
-            } ]
+            textConfig: [ textConfigItem ]
         })), shadow.add(this.shadowPlaceHolder);
     }
     tryShowInputBounds() {
         if (!this.currRt || !this.focusing) return;
         const {editOptions: editOptions = {}} = this.currRt.attribute, {boundsStrokeWhenInput: boundsStrokeWhenInput} = editOptions;
         if (!editOptions || !boundsStrokeWhenInput) return;
-        const {attribute: attribute} = this.currRt, b = this.currRt.AABBBounds;
-        let h = b.height();
+        const {attribute: attribute} = this.currRt;
+        let b = this.currRt.AABBBounds, h = b.height();
         if (!attribute.textConfig.length && this.editLine) {
             const {points: points} = this.editLine.attribute;
-            h = points[1].y - points[0].y;
+            h = points[1].y - points[0].y, b = (0, graphic_1.getRichTextBounds)(Object.assign({}, this.shadowPlaceHolder.attribute));
         }
         this.shadowBounds = this.shadowBounds || (0, graphic_1.createRect)({}), this.shadowBounds.setAttributes({
             x: 0,
@@ -265,16 +271,15 @@ class RichTextEditPlugin {
             fill: !1,
             stroke: boundsStrokeWhenInput,
             lineWidth: 1,
-            boundsMode: "empty",
             zIndex: -1
         });
-        (this.currRt.shadowRoot || this.currRt.attachShadow()).add(this.shadowBounds), this.offsetLineBgAndShadowBounds();
+        this.getShadow(this.currRt).add(this.shadowBounds), this.offsetLineBgAndShadowBounds();
     }
     trySyncPlaceholderToTextConfig() {
         if (!this.currRt) return;
         const {textConfig: textConfig, editOptions: editOptions} = this.currRt.attribute;
         if (textConfig && textConfig.length) return;
-        if (!editOptions || !editOptions.placeholder) return;
+        if (!(editOptions && editOptions.placeholder && editOptions.syncPlaceHolderToTextConfig)) return;
         const {placeholder: placeholder} = editOptions;
         this.currRt.setAttributes({
             textConfig: [ Object.assign({
@@ -288,11 +293,12 @@ class RichTextEditPlugin {
         context.stage.off("dblclick", this.handleDBLClick), application_1.application.global.addEventListener("keydown", this.handleKeyDown);
     }
     onFocus(e, data) {
-        this.deFocus(!1), this.focusing = !0;
+        this.updateCbs && this.updateCbs.forEach((cb => cb("beforeOnfocus", this))), this.deFocus(!1), 
+        this.focusing = !0;
         const target = e.target;
         if (!target || "richtext" !== target.type) return;
         this.currRt = target, RichTextEditPlugin.tryUpdateRichtext(target);
-        const shadowRoot = target.shadowRoot || target.attachShadow(), cache = target.getFrameCache();
+        const shadowRoot = this.getShadow(target), cache = target.getFrameCache();
         if (cache) {
             if (this.computeGlobalDelta(cache), shadowRoot.setAttributes({
                 shadowRootIdx: 1,
@@ -304,16 +310,14 @@ class RichTextEditPlugin {
                     x: 0,
                     y: 0,
                     lineWidth: 1,
-                    stroke: "black",
-                    boundsMode: "empty"
+                    stroke: "black"
                 });
                 this.addAnimateToLine(line), this.editLine = line, this.ticker.start(!0);
                 const g = (0, graphic_1.createGroup)({
                     x: 0,
                     y: 0,
                     width: 0,
-                    height: 0,
-                    boundsMode: "empty"
+                    height: 0
                 });
                 this.editBg = g, shadowRoot.add(this.editLine), shadowRoot.add(this.editBg);
             }
@@ -357,7 +361,9 @@ class RichTextEditPlugin {
     deFocus(trulyDeFocus = !1) {
         const target = this.currRt;
         if (!target) return;
-        trulyDeFocus && (this.trySyncPlaceholderToTextConfig(), target.detachShadow());
+        this.updateCbs && this.updateCbs.forEach((cb => cb("beforeDefocus", this, {
+            trulyDeFocus: trulyDeFocus
+        }))), trulyDeFocus && (this.trySyncPlaceholderToTextConfig(), target.detachShadow());
         const currRt = this.currRt;
         this.currRt = null, this.editLine && (this.editLine.parent && this.editLine.parent.removeChild(this.editLine), 
         this.editLine.release(), this.editLine = null, this.editBg.parent && this.editBg.parent.removeChild(this.editBg), 
@@ -411,67 +417,75 @@ class RichTextEditPlugin {
             x: currCursorData.x,
             y: (currCursorData.y1 + currCursorData.y2) / 2
         }, line0Info = this.getLineByPoint(cache, startCursorPos), line1Info = this.getLineByPoint(cache, endCursorPos);
-        if ((startCursorPos.y > endCursorPos.y || startCursorPos.y === endCursorPos.y && startCursorPos.x > endCursorPos.x) && ([startCursorPos, endCursorPos] = [ endCursorPos, startCursorPos ], 
-        [line1Info, line0Info] = [ line0Info, line1Info ]), this.hideSelection(), line0Info === line1Info) this.editBg.setAttributes({
-            x: startCursorPos.x,
-            y: line0Info.top,
-            width: endCursorPos.x - startCursorPos.x,
-            height: line0Info.height,
-            fill: "#336df4",
-            fillOpacity: .2
-        }); else {
-            this.editBg.setAttributes({
-                x: 0,
+        if (line0Info && line1Info) {
+            if ((startCursorPos.y > endCursorPos.y || startCursorPos.y === endCursorPos.y && startCursorPos.x > endCursorPos.x) && ([startCursorPos, endCursorPos] = [ endCursorPos, startCursorPos ], 
+            [line1Info, line0Info] = [ line0Info, line1Info ]), this.hideSelection(), line0Info === line1Info) this.editBg.setAttributes({
+                x: startCursorPos.x,
                 y: line0Info.top,
-                width: 0,
-                height: 0
-            });
-            const startIdx = cache.lines.findIndex((item => item === line0Info)), endIdx = cache.lines.findIndex((item => item === line1Info));
-            let y = 0;
-            for (let i = startIdx; i <= endIdx; i++) {
-                const line = cache.lines[i];
-                if (i === startIdx) {
-                    const p = line.paragraphs[line.paragraphs.length - 1];
-                    this.editBg.add((0, graphic_1.createRect)({
-                        x: startCursorPos.x,
-                        y: y,
-                        width: p.left + p.width - startCursorPos.x,
-                        height: line.height,
-                        fill: "#336df4",
-                        fillOpacity: .2
-                    }));
-                } else if (i === endIdx) {
-                    const p = line.paragraphs[0];
-                    this.editBg.add((0, graphic_1.createRect)({
-                        x: p.left,
-                        y: y,
-                        width: endCursorPos.x - p.left,
-                        height: line.height,
-                        fill: "#336df4",
-                        fillOpacity: .2
-                    }));
-                } else {
-                    const p0 = line.paragraphs[0], p1 = line.paragraphs[line.paragraphs.length - 1];
-                    this.editBg.add((0, graphic_1.createRect)({
-                        x: p0.left,
-                        y: y,
-                        width: p1.left + p1.width - p0.left,
-                        height: line.height,
-                        fill: "#336df4",
-                        fillOpacity: .2
-                    }));
+                width: endCursorPos.x - startCursorPos.x,
+                height: line0Info.height,
+                fill: "#336df4",
+                fillOpacity: .2
+            }); else {
+                this.editBg.setAttributes({
+                    x: 0,
+                    y: line0Info.top,
+                    width: 0,
+                    height: 0
+                });
+                const startIdx = cache.lines.findIndex((item => item === line0Info)), endIdx = cache.lines.findIndex((item => item === line1Info));
+                let y = 0;
+                for (let i = startIdx; i <= endIdx; i++) {
+                    const line = cache.lines[i];
+                    if (i === startIdx) {
+                        const p = line.paragraphs[line.paragraphs.length - 1];
+                        this.editBg.add((0, graphic_1.createRect)({
+                            x: startCursorPos.x,
+                            y: y,
+                            width: p.left + p.width - startCursorPos.x,
+                            height: line.height,
+                            fill: "#336df4",
+                            fillOpacity: .2
+                        }));
+                    } else if (i === endIdx) {
+                        const p = line.paragraphs[0];
+                        this.editBg.add((0, graphic_1.createRect)({
+                            x: p.left,
+                            y: y,
+                            width: endCursorPos.x - p.left,
+                            height: line.height,
+                            fill: "#336df4",
+                            fillOpacity: .2
+                        }));
+                    } else {
+                        const p0 = line.paragraphs[0], p1 = line.paragraphs[line.paragraphs.length - 1];
+                        this.editBg.add((0, graphic_1.createRect)({
+                            x: p0.left,
+                            y: y,
+                            width: p1.left + p1.width - p0.left,
+                            height: line.height,
+                            fill: "#336df4",
+                            fillOpacity: .2
+                        }));
+                    }
+                    y += line.height;
                 }
-                y += line.height;
             }
+            this.setCursorAndTextArea(currCursorData.x, currCursorData.y1, currCursorData.y2, this.currRt), 
+            this.triggerRender(), this.updateCbs.forEach((cb => cb("selection", this)));
         }
-        this.setCursorAndTextArea(currCursorData.x, currCursorData.y1, currCursorData.y2, this.currRt), 
-        this.triggerRender(), this.updateCbs.forEach((cb => cb("selection", this)));
     }
     hideSelection() {
         this.editBg && (this.editBg.removeAllChild(), this.editBg.setAttributes({
             fill: "transparent"
         }));
     }
+    getShadow(rt) {
+        const sr = rt.shadowRoot || rt.attachShadow();
+        return sr.setAttributes({
+            boundsMode: "empty"
+        }), sr;
+    }
     getLineByPoint(cache, p1) {
         let lineInfo = cache.lines[0];
         for (let i = 0; i < cache.lines.length && !(lineInfo.top <= p1.y && lineInfo.top + lineInfo.height >= p1.y); i++) lineInfo = cache.lines[i + 1];