editor-svg 1.0.2 → 1.0.3

package/src/editor/core/worker/works/wordCount.ts

@@ -1,132 +0,0 @@
-import { IElement } from '../../../interface/Element'
-
-enum ElementType {
-  TEXT = 'text',
-  TABLE = 'table',
-  HYPERLINK = 'hyperlink',
-  CONTROL = 'control'
-}
-
-enum ControlComponent {
-  VALUE = 'value'
-}
-
-const ZERO = '\u200B'
-const WRAP = '\n'
-
-function pickText(elementList: IElement[]): string {
-  let text = ''
-  let e = 0
-  while (e < elementList.length) {
-    const element = elementList[e]
-    // 表格、超链接递归处理
-    if (element.type === ElementType.TABLE) {
-      if (element.trList) {
-        for (let t = 0; t < element.trList.length; t++) {
-          const tr = element.trList[t]
-          for (let d = 0; d < tr.tdList.length; d++) {
-            const td = tr.tdList[d]
-            text += pickText(td.value)
-          }
-        }
-      }
-    } else if (element.type === ElementType.HYPERLINK) {
-      const hyperlinkId = element.hyperlinkId
-      const valueList: IElement[] = []
-      while (e < elementList.length) {
-        const hyperlinkE = elementList[e]
-        if (hyperlinkId !== hyperlinkE.hyperlinkId) {
-          e--
-          break
-        }
-        delete hyperlinkE.type
-        valueList.push(hyperlinkE)
-        e++
-      }
-      text += pickText(valueList)
-    } else if (element.controlId) {
-      if (!element.control?.hide) {
-        const controlId = element.controlId
-        const valueList: IElement[] = []
-        while (e < elementList.length) {
-          const controlE = elementList[e]
-          if (controlId !== controlE.controlId) {
-            e--
-            break
-          }
-          if (controlE.controlComponent === ControlComponent.VALUE) {
-            delete controlE.controlId
-            valueList.push(controlE)
-          }
-          e++
-        }
-        text += pickText(valueList)
-      }
-    } else if (
-      (!element.type || element.type === ElementType.TEXT) &&
-      !element.area?.hide
-    ) {
-      text += element.value
-    }
-    e++
-  }
-  return text
-}
-
-function groupText(text: string): string[] {
-  const characterList: string[] = []
-  // 英文或数字整体分隔为一个字数
-  const numberReg = /[0-9]/
-  const letterReg = /[A-Za-z]/
-  const blankReg = /\s/
-  // for of 循环字符
-  let isPreLetter = false
-  let isPreNumber = false
-  let compositionText = ''
-  // 处理组合文本
-  function pushCompositionText() {
-    if (compositionText) {
-      characterList.push(compositionText)
-      compositionText = ''
-    }
-  }
-  for (const t of text) {
-    if (letterReg.test(t)) {
-      if (!isPreLetter) {
-        pushCompositionText()
-      }
-      compositionText += t
-      isPreLetter = true
-      isPreNumber = false
-    } else if (numberReg.test(t)) {
-      if (!isPreNumber) {
-        pushCompositionText()
-      }
-      compositionText += t
-      isPreLetter = false
-      isPreNumber = true
-    } else {
-      pushCompositionText()
-      isPreLetter = false
-      isPreNumber = false
-      if (!blankReg.test(t)) {
-        characterList.push(t)
-      }
-    }
-  }
-  pushCompositionText()
-  return characterList
-}
-
-onmessage = evt => {
-  const elementList = <IElement[]>evt.data
-  // 提取文本
-  const originText = pickText(elementList)
-  // 过滤文本
-  const filterText = originText
-    .replace(new RegExp(`^${ZERO}`), '')
-    .replace(new RegExp(ZERO, 'g'), WRAP)
-  // 文本分组
-  const textGroup = groupText(filterText)
-  postMessage(textGroup.length)
-}

package/src/editor/core/zone/Zone.ts

@@ -1,183 +0,0 @@
-import { EDITOR_PREFIX } from '../../dataset/constant/Editor'
-import { EditorZone } from '../../dataset/enum/Editor'
-import { IEditorOption } from '../../interface/Editor'
-import { nextTick } from '../../utils'
-import { Draw } from '../draw/Draw'
-import { I18n } from '../i18n/I18n'
-import { ZoneTip } from './ZoneTip'
-
-export class Zone {
-  private readonly INDICATOR_PADDING = 2
-  private readonly INDICATOR_TITLE_TRANSLATE = [20, 5]
-
-  private draw: Draw
-  private options: Required<IEditorOption>
-  private i18n: I18n
-  private container: HTMLDivElement
-
-  private currentZone: EditorZone
-  private indicatorContainer: HTMLDivElement | null
-
-  constructor(draw: Draw) {
-    this.draw = draw
-    this.i18n = draw.getI18n()
-    this.options = draw.getOptions()
-    this.container = draw.getContainer()
-    this.currentZone = EditorZone.MAIN
-    this.indicatorContainer = null
-    // 区域提示
-    if (!this.options.zone.tipDisabled) {
-      new ZoneTip(draw, this)
-    }
-  }
-
-  public isHeaderActive(): boolean {
-    return this.getZone() === EditorZone.HEADER
-  }
-
-  public isMainActive(): boolean {
-    return this.getZone() === EditorZone.MAIN
-  }
-
-  public isFooterActive(): boolean {
-    return this.getZone() === EditorZone.FOOTER
-  }
-
-  public getZone(): EditorZone {
-    return this.currentZone
-  }
-
-  public setZone(payload: EditorZone) {
-    const { header, footer } = this.options
-    if (
-      (!header.editable && payload === EditorZone.HEADER) ||
-      (!footer.editable && payload === EditorZone.FOOTER)
-    ) {
-      return
-    }
-    if (this.currentZone === payload) return
-    this.currentZone = payload
-    this.draw.getRange().clearRange()
-    this.draw.render({
-      isSubmitHistory: false,
-      isSetCursor: false,
-      isCompute: false
-    })
-    // 指示器
-    this.drawZoneIndicator()
-    // 回调
-    nextTick(() => {
-      const listener = this.draw.getListener()
-      if (listener.zoneChange) {
-        listener.zoneChange(payload)
-      }
-      const eventBus = this.draw.getEventBus()
-      if (eventBus.isSubscribe('zoneChange')) {
-        eventBus.emit('zoneChange', payload)
-      }
-    })
-  }
-
-  public getZoneByY(y: number): EditorZone {
-    // 页眉底部距离页面顶部距离
-    const header = this.draw.getHeader()
-    const headerBottomY = header.getHeaderTop() + header.getHeight()
-    // 页脚上部距离页面顶部距离
-    const footer = this.draw.getFooter()
-    const pageHeight = this.draw.getHeight()
-    const footerTopY =
-      pageHeight - (footer.getFooterBottom() + footer.getHeight())
-    // 页眉：当前位置小于页眉底部位置
-    if (y < headerBottomY) {
-      return EditorZone.HEADER
-    }
-    // 页脚：当前位置大于页脚顶部位置
-    if (y > footerTopY) {
-      return EditorZone.FOOTER
-    }
-    return EditorZone.MAIN
-  }
-
-  public drawZoneIndicator() {
-    this._clearZoneIndicator()
-    if (!this.isHeaderActive() && !this.isFooterActive()) return
-    const { scale } = this.options
-    const isHeaderActive = this.isHeaderActive()
-    const [offsetX, offsetY] = this.INDICATOR_TITLE_TRANSLATE
-    const pageList = this.draw.getPageList()
-    const margins = this.draw.getMargins()
-    const innerWidth = this.draw.getInnerWidth()
-    const pageHeight = this.draw.getHeight()
-    const pageGap = this.draw.getPageGap()
-    const preY = pageHeight + pageGap
-    // 创建指示器容器
-    this.indicatorContainer = document.createElement('div')
-    this.indicatorContainer.classList.add(`${EDITOR_PREFIX}-zone-indicator`)
-    // 指示器位置
-    const header = this.draw.getHeader()
-    const footer = this.draw.getFooter()
-    const indicatorHeight = isHeaderActive
-      ? header.getHeight()
-      : footer.getHeight()
-    const indicatorTop = isHeaderActive
-      ? header.getHeaderTop()
-      : pageHeight - footer.getFooterBottom() - indicatorHeight
-    for (let p = 0; p < pageList.length; p++) {
-      const startY = preY * p + indicatorTop
-      const indicatorLeftX = margins[3] - this.INDICATOR_PADDING
-      const indicatorRightX = margins[3] + innerWidth + this.INDICATOR_PADDING
-      const indicatorTopY = isHeaderActive
-        ? startY - this.INDICATOR_PADDING
-        : startY + indicatorHeight + this.INDICATOR_PADDING
-      const indicatorBottomY = isHeaderActive
-        ? startY + indicatorHeight + this.INDICATOR_PADDING
-        : startY - this.INDICATOR_PADDING
-      // 标题
-      const indicatorTitle = document.createElement('div')
-      indicatorTitle.innerText = this.i18n.t(
-        `frame.${isHeaderActive ? 'header' : 'footer'}`
-      )
-      indicatorTitle.style.top = `${indicatorBottomY}px`
-      indicatorTitle.style.transform = `translate(${offsetX * scale}px, ${
-        offsetY * scale
-      }px) scale(${scale})`
-      this.indicatorContainer.append(indicatorTitle)
-
-      // 上边线
-      const lineTop = document.createElement('span')
-      lineTop.classList.add(`${EDITOR_PREFIX}-zone-indicator-border__top`)
-      lineTop.style.top = `${indicatorTopY}px`
-      lineTop.style.width = `${innerWidth}px`
-      lineTop.style.marginLeft = `${margins[3]}px`
-      this.indicatorContainer.append(lineTop)
-
-      // 左边线
-      const lineLeft = document.createElement('span')
-      lineLeft.classList.add(`${EDITOR_PREFIX}-zone-indicator-border__left`)
-      lineLeft.style.top = `${startY}px`
-      lineLeft.style.height = `${indicatorHeight}px`
-      lineLeft.style.left = `${indicatorLeftX}px`
-      this.indicatorContainer.append(lineLeft)
-
-      // 下边线
-      const lineBottom = document.createElement('span')
-      lineBottom.classList.add(`${EDITOR_PREFIX}-zone-indicator-border__bottom`)
-      lineBottom.style.top = `${indicatorBottomY}px`
-      this.indicatorContainer.append(lineBottom)
-
-      // 右边线
-      const lineRight = document.createElement('span')
-      lineRight.classList.add(`${EDITOR_PREFIX}-zone-indicator-border__right`)
-      lineRight.style.top = `${startY}px`
-      lineRight.style.height = `${indicatorHeight}px`
-      lineRight.style.left = `${indicatorRightX}px`
-      this.indicatorContainer.append(lineRight)
-    }
-    this.container.append(this.indicatorContainer)
-  }
-
-  private _clearZoneIndicator() {
-    this.indicatorContainer?.remove()
-    this.indicatorContainer = null
-  }
-}

package/src/editor/core/zone/ZoneTip.ts

@@ -1,108 +0,0 @@
-import { EDITOR_PREFIX } from '../../dataset/constant/Editor'
-import { EditorZone } from '../../dataset/enum/Editor'
-import { throttle } from '../../utils'
-import { Draw } from '../draw/Draw'
-import { I18n } from '../i18n/I18n'
-import { Zone } from './Zone'
-
-export class ZoneTip {
-  private draw: Draw
-  private zone: Zone
-  private i18n: I18n
-  private container: HTMLDivElement
-  private pageContainer: HTMLDivElement
-
-  private isDisableMouseMove: boolean
-  private tipContainer: HTMLDivElement
-  private tipContent: HTMLSpanElement
-  private currentMoveZone: EditorZone | undefined
-
-  constructor(draw: Draw, zone: Zone) {
-    this.draw = draw
-    this.zone = zone
-    this.i18n = draw.getI18n()
-    this.container = draw.getContainer()
-    this.pageContainer = draw.getPageContainer()
-
-    const { tipContainer, tipContent } = this._drawZoneTip()
-    this.tipContainer = tipContainer
-    this.tipContent = tipContent
-    this.isDisableMouseMove = true
-    this.currentMoveZone = EditorZone.MAIN
-    // 监听区域
-    const watchZones: EditorZone[] = []
-    const { header, footer } = draw.getOptions()
-    if (!header.disabled) {
-      watchZones.push(EditorZone.HEADER)
-    }
-    if (!footer.disabled) {
-      watchZones.push(EditorZone.FOOTER)
-    }
-    if (watchZones.length) {
-      this._watchMouseMoveZoneChange(watchZones)
-    }
-  }
-
-  private _watchMouseMoveZoneChange(watchZones: EditorZone[]) {
-    this.pageContainer.addEventListener(
-      'mousemove',
-      throttle((evt: MouseEvent) => {
-        if (this.isDisableMouseMove || !this.draw.getIsPagingMode()) return
-        if (!evt.offsetY) return
-        if (evt.target instanceof HTMLCanvasElement) {
-          const mousemoveZone = this.zone.getZoneByY(evt.offsetY)
-          if (!watchZones.includes(mousemoveZone)) {
-            this._updateZoneTip(false)
-            return
-          }
-          this.currentMoveZone = mousemoveZone
-          // 激活区域是正文，移动区域是页眉、页脚时绘制
-          this._updateZoneTip(
-            this.zone.getZone() === EditorZone.MAIN &&
-              (mousemoveZone === EditorZone.HEADER ||
-                mousemoveZone === EditorZone.FOOTER),
-            evt.x,
-            evt.y
-          )
-        } else {
-          this._updateZoneTip(false)
-        }
-      }, 250)
-    )
-    // mouseenter后mousemove有效，避免因节流导致的mouseleave后继续执行逻辑
-    this.pageContainer.addEventListener('mouseenter', () => {
-      this.isDisableMouseMove = false
-    })
-    this.pageContainer.addEventListener('mouseleave', () => {
-      this.isDisableMouseMove = true
-      this._updateZoneTip(false)
-    })
-  }
-
-  private _drawZoneTip() {
-    const tipContainer = document.createElement('div')
-    tipContainer.classList.add(`${EDITOR_PREFIX}-zone-tip`)
-    const tipContent = document.createElement('span')
-    tipContainer.append(tipContent)
-    this.container.append(tipContainer)
-    return {
-      tipContainer,
-      tipContent
-    }
-  }
-
-  private _updateZoneTip(visible: boolean, left?: number, top?: number) {
-    if (visible) {
-      this.tipContainer.classList.add('show')
-      this.tipContainer.style.left = `${left}px`
-      this.tipContainer.style.top = `${top}px`
-      this.tipContent.innerText = this.i18n.t(
-        `zone.${
-          this.currentMoveZone === EditorZone.HEADER ? 'headerTip' : 'footerTip'
-        }`
-      )
-    } else {
-      this.tipContainer.classList.remove('show')
-    }
-  }
-}

package/src/editor/dataset/constant/Background.ts

@@ -1,10 +0,0 @@
-import { IBackgroundOption } from '../../interface/Background'
-import { BackgroundRepeat, BackgroundSize } from '../enum/Background'
-
-export const defaultBackground: Readonly<Required<IBackgroundOption>> = {
-  color: '#FFFFFF',
-  image: '',
-  size: BackgroundSize.COVER,
-  repeat: BackgroundRepeat.NO_REPEAT,
-  applyPageNumbers: []
-}

package/src/editor/dataset/constant/Badge.ts

@@ -1,6 +0,0 @@
-import { IBadgeOption } from '../../interface/Badge'
-
-export const defaultBadgeOption: Readonly<Required<IBadgeOption>> = {
-  top: 0,
-  left: 5
-}

package/src/editor/dataset/constant/Checkbox.ts

@@ -1,12 +0,0 @@
-import { ICheckboxOption } from '../../interface/Checkbox'
-import { VerticalAlign } from '../enum/VerticalAlign'
-
-export const defaultCheckboxOption: Readonly<Required<ICheckboxOption>> = {
-  width: 14,
-  height: 14,
-  gap: 5,
-  lineWidth: 1,
-  fillStyle: '#5175f4',
-  strokeStyle: '#ffffff',
-  verticalAlign: VerticalAlign.BOTTOM
-}

package/src/editor/dataset/constant/Common.ts

@@ -1,44 +0,0 @@
-import { MaxHeightRatio } from '../enum/Common'
-
-export const ZERO = '\u200B'
-export const WRAP = '\n'
-export const HORIZON_TAB = '\t'
-export const NBSP = '\u0020'
-export const NON_BREAKING_SPACE = ' '
-export const PUNCTUATION_LIST = [
-  '·',
-  '、',
-  ':',
-  '：',
-  ',',
-  '，',
-  '.',
-  '。',
-  ';',
-  '；',
-  '?',
-  '？',
-  '!',
-  '！'
-]
-
-export const maxHeightRadioMapping: Record<MaxHeightRatio, number> = {
-  [MaxHeightRatio.HALF]: 1 / 2,
-  [MaxHeightRatio.ONE_THIRD]: 1 / 3,
-  [MaxHeightRatio.QUARTER]: 1 / 4
-}
-
-export const LETTER_CLASS = {
-  ENGLISH: 'A-Za-z',
-  SPANISH: 'A-Za-zÁÉÍÓÚáéíóúÑñÜü',
-  FRENCH: 'A-Za-zÀÂÇàâçÉéÈèÊêËëÎîÏïÔôÙùÛûŸÿ',
-  GERMAN: 'A-Za-zÄäÖöÜüß',
-  RUSSIAN: 'А-Яа-яЁё',
-  PORTUGUESE: 'A-Za-zÁÉÍÓÚáéíóúÃÕãõÇç',
-  ITALIAN: 'A-Za-zÀàÈèÉéÌìÍíÎîÓóÒòÙù',
-  DUTCH: 'A-Za-zÀàÁáÂâÄäÈèÉéÊêËëÌìÍíÎîÏïÓóÒòÔôÖöÙùÛûÜü',
-  SWEDISH: 'A-Za-zÅåÄäÖö',
-  GREEK: 'ΑαΒβΓγΔδΕεΖζΗηΘθΙιΚκΛλΜμΝνΞξΟοΠπΡρΣσςΤτΥυΦφΧχΨψΩω'
-}
-
-export const METRICS_BASIS_TEXT = '中'

package/src/editor/dataset/constant/ContextMenu.ts

@@ -1,61 +0,0 @@
-export const NAME_PLACEHOLDER = {
-  SELECTED_TEXT: '%s'
-}
-
-export const INTERNAL_CONTEXT_MENU_KEY = {
-  GLOBAL: {
-    CUT: 'globalCut',
-    COPY: 'globalCopy',
-    PASTE: 'globalPaste',
-    SELECT_ALL: 'globalSelectAll',
-    PRINT: 'globalPrint'
-  },
-  CONTROL: {
-    DELETE: 'controlDelete'
-  },
-  HYPERLINK: {
-    DELETE: 'hyperlinkDelete',
-    CANCEL: 'hyperlinkCancel',
-    EDIT: 'hyperlinkEdit'
-  },
-  IMAGE: {
-    CHANGE: 'imageChange',
-    SAVE_AS: 'imageSaveAs',
-    TEXT_WRAP: 'imageTextWrap',
-    TEXT_WRAP_EMBED: 'imageTextWrapEmbed',
-    TEXT_WRAP_UP_DOWN: 'imageTextWrapUpDown',
-    TEXT_WRAP_SURROUND: 'imageTextWrapSurround',
-    TEXT_WRAP_FLOAT_TOP: 'imageTextWrapFloatTop',
-    TEXT_WRAP_FLOAT_BOTTOM: 'imageTextWrapFloatBottom'
-  },
-  TABLE: {
-    BORDER: 'border',
-    BORDER_ALL: 'tableBorderAll',
-    BORDER_EMPTY: 'tableBorderEmpty',
-    BORDER_DASH: 'tableBorderDash',
-    BORDER_EXTERNAL: 'tableBorderExternal',
-    BORDER_INTERNAL: 'tableBorderInternal',
-    BORDER_TD: 'tableBorderTd',
-    BORDER_TD_TOP: 'tableBorderTdTop',
-    BORDER_TD_RIGHT: 'tableBorderTdRight',
-    BORDER_TD_BOTTOM: 'tableBorderTdBottom',
-    BORDER_TD_LEFT: 'tableBorderTdLeft',
-    BORDER_TD_FORWARD: 'tableBorderTdForward',
-    BORDER_TD_BACK: 'tableBorderTdBack',
-    VERTICAL_ALIGN: 'tableVerticalAlign',
-    VERTICAL_ALIGN_TOP: 'tableVerticalAlignTop',
-    VERTICAL_ALIGN_MIDDLE: 'tableVerticalAlignMiddle',
-    VERTICAL_ALIGN_BOTTOM: 'tableVerticalAlignBottom',
-    INSERT_ROW_COL: 'tableInsertRowCol',
-    INSERT_TOP_ROW: 'tableInsertTopRow',
-    INSERT_BOTTOM_ROW: 'tableInsertBottomRow',
-    INSERT_LEFT_COL: 'tableInsertLeftCol',
-    INSERT_RIGHT_COL: 'tableInsertRightCol',
-    DELETE_ROW_COL: 'tableDeleteRowCol',
-    DELETE_ROW: 'tableDeleteRow',
-    DELETE_COL: 'tableDeleteCol',
-    DELETE_TABLE: 'tableDeleteTable',
-    MERGE_CELL: 'tableMergeCell',
-    CANCEL_MERGE_CELL: 'tableCancelMergeCell'
-  }
-}

package/src/editor/dataset/constant/Control.ts

@@ -1,14 +0,0 @@
-import { IControlOption } from '../../interface/Control'
-
-export const defaultControlOption: Readonly<Required<IControlOption>> = {
-  placeholderColor: '#9c9b9b',
-  bracketColor: '#000000',
-  prefix: '{',
-  postfix: '}',
-  borderWidth: 1,
-  borderColor: '#000000',
-  activeBackgroundColor: '',
-  disabledBackgroundColor: '',
-  existValueBackgroundColor: '',
-  noValueBackgroundColor: ''
-}

package/src/editor/dataset/constant/Cursor.ts

@@ -1,11 +0,0 @@
-import { ICursorOption } from '../../interface/Cursor'
-
-export const CURSOR_AGENT_OFFSET_HEIGHT = 12
-
-export const defaultCursorOption: Readonly<Required<ICursorOption>> = {
-  width: 1,
-  color: '#000000',
-  dragWidth: 2,
-  dragColor: '#0000FF',
-  dragFloatImageDisabled: false
-}

package/src/editor/dataset/constant/Editor.ts

@@ -1,19 +0,0 @@
-import { DeepRequired } from '../../interface/Common'
-import { IModeRule } from '../../interface/Editor'
-
-export const EDITOR_COMPONENT = 'editor-component'
-export const EDITOR_PREFIX = 'ce'
-export const EDITOR_CLIPBOARD = `${EDITOR_PREFIX}-clipboard`
-
-export const defaultModeRuleOption: Readonly<DeepRequired<IModeRule>> = {
-  print: {
-    imagePreviewerDisabled: false,
-    backgroundDisabled: false
-  },
-  readonly: {
-    imagePreviewerDisabled: false
-  },
-  form: {
-    controlDeletableDisabled: false
-  }
-}