Function getLineRectsByRange

packages/editor/src/utils/selection.ts:302–425

(editor: Editor, range: Range, minWidth = 4)

 * @returns array of DOMRect objects
 */
export const getLineRectsByRange = (editor: Editor, range: Range, minWidth = 4) => {
  const anchor = Range.start(range)
  const focus = Range.end(range)
  // 开始位置的 block节点
  const anchorEntry = Editor.above<Element>(editor, {
    at: anchor,
    match: n => Editor.isBlock(editor, n),
    mode: 'lowest',
  })
  // 结束位置的 block 节点
  const focusEntry = Editor.above<Element>(editor, {
    at: focus,
    match: n => Editor.isBlock(editor, n),
    mode: 'lowest',
  })
  if (!anchorEntry || !focusEntry) return []

  const blockRects: DOMRect[] = []
  const rectMap: Map<
    DOMRect,
    {
      dom: DOMElement
      element: Element
    }
  > = new Map()

  let [startBlock, startPath] = anchorEntry
  let [_, endPath] = focusEntry
  const ranges: DOMRange[] = []
  let isStart = true
  let next: NodeEntry<Element> | undefined = anchorEntry
  while (next) {
    const [nextBlock, nextPath] = next as NodeEntry<Element>
    const element = Editable.toDOMNode(editor, nextBlock)
    const rect = element.getBoundingClientRect()
    rectMap.set(rect, {
      dom: element,
      element: nextBlock,
    })
    blockRects.push(rect)

    if (Path.equals(nextPath, endPath)) break
    if (!isStart) {
      const range = document.createRange()
      range.selectNodeContents(element)
      ranges.push(range)
    } else {
      isStart = false
    }
    next = Editor.next<Element>(editor, {
      at: nextPath,
      match: n => Editor.isBlock(editor, n),
    })
  }
  if (Path.equals(startPath, endPath)) {
    ranges.unshift(Editable.toDOMRange(editor, range))
  } else {
    ranges.unshift(