tui_editor-rails 1.0.2.0

data/vendor/assets/components/codemirror/src/display/selection.js

@@ -0,0 +1,158 @@
+import { Pos } from "../line/pos.js"
+import { visualLine } from "../line/spans.js"
+import { getLine } from "../line/utils_line.js"
+import { charCoords, cursorCoords, displayWidth, paddingH, wrappedLineExtentChar } from "../measurement/position_measurement.js"
+import { getOrder, iterateBidiSections } from "../util/bidi.js"
+import { elt } from "../util/dom.js"
+
+export function updateSelection(cm) {
+  cm.display.input.showSelection(cm.display.input.prepareSelection())
+}
+
+export function prepareSelection(cm, primary = true) {
+  let doc = cm.doc, result = {}
+  let curFragment = result.cursors = document.createDocumentFragment()
+  let selFragment = result.selection = document.createDocumentFragment()
+
+  for (let i = 0; i < doc.sel.ranges.length; i++) {
+    if (!primary && i == doc.sel.primIndex) continue
+    let range = doc.sel.ranges[i]
+    if (range.from().line >= cm.display.viewTo || range.to().line < cm.display.viewFrom) continue
+    let collapsed = range.empty()
+    if (collapsed || cm.options.showCursorWhenSelecting)
+      drawSelectionCursor(cm, range.head, curFragment)
+    if (!collapsed)
+      drawSelectionRange(cm, range, selFragment)
+  }
+  return result
+}
+
+// Draws a cursor for the given range
+export function drawSelectionCursor(cm, head, output) {
+  let pos = cursorCoords(cm, head, "div", null, null, !cm.options.singleCursorHeightPerLine)
+
+  let cursor = output.appendChild(elt("div", "\u00a0", "CodeMirror-cursor"))
+  cursor.style.left = pos.left + "px"
+  cursor.style.top = pos.top + "px"
+  cursor.style.height = Math.max(0, pos.bottom - pos.top) * cm.options.cursorHeight + "px"
+
+  if (pos.other) {
+    // Secondary cursor, shown when on a 'jump' in bi-directional text
+    let otherCursor = output.appendChild(elt("div", "\u00a0", "CodeMirror-cursor CodeMirror-secondarycursor"))
+    otherCursor.style.display = ""
+    otherCursor.style.left = pos.other.left + "px"
+    otherCursor.style.top = pos.other.top + "px"
+    otherCursor.style.height = (pos.other.bottom - pos.other.top) * .85 + "px"
+  }
+}
+
+function cmpCoords(a, b) { return a.top - b.top || a.left - b.left }
+
+// Draws the given range as a highlighted selection
+function drawSelectionRange(cm, range, output) {
+  let display = cm.display, doc = cm.doc
+  let fragment = document.createDocumentFragment()
+  let padding = paddingH(cm.display), leftSide = padding.left
+  let rightSide = Math.max(display.sizerWidth, displayWidth(cm) - display.sizer.offsetLeft) - padding.right
+  let docLTR = doc.direction == "ltr"
+
+  function add(left, top, width, bottom) {
+    if (top < 0) top = 0
+    top = Math.round(top)
+    bottom = Math.round(bottom)
+    fragment.appendChild(elt("div", null, "CodeMirror-selected", `position: absolute; left: ${left}px;
+                             top: ${top}px; width: ${width == null ? rightSide - left : width}px;
+                             height: ${bottom - top}px`))
+  }
+
+  function drawForLine(line, fromArg, toArg) {
+    let lineObj = getLine(doc, line)
+    let lineLen = lineObj.text.length
+    let start, end
+    function coords(ch, bias) {
+      return charCoords(cm, Pos(line, ch), "div", lineObj, bias)
+    }
+
+    function wrapX(pos, dir, side) {
+      let extent = wrappedLineExtentChar(cm, lineObj, null, pos)
+      let prop = (dir == "ltr") == (side == "after") ? "left" : "right"
+      let ch = side == "after" ? extent.begin : extent.end - (/\s/.test(lineObj.text.charAt(extent.end - 1)) ? 2 : 1)
+      return coords(ch, prop)[prop]
+    }
+
+    let order = getOrder(lineObj, doc.direction)
+    iterateBidiSections(order, fromArg || 0, toArg == null ? lineLen : toArg, (from, to, dir, i) => {
+      let ltr = dir == "ltr"
+      let fromPos = coords(from, ltr ? "left" : "right")
+      let toPos = coords(to - 1, ltr ? "right" : "left")
+
+      let openStart = fromArg == null && from == 0, openEnd = toArg == null && to == lineLen
+      let first = i == 0, last = !order || i == order.length - 1
+      if (toPos.top - fromPos.top <= 3) { // Single line
+        let openLeft = (docLTR ? openStart : openEnd) && first
+        let openRight = (docLTR ? openEnd : openStart) && last
+        let left = openLeft ? leftSide : (ltr ? fromPos : toPos).left
+        let right = openRight ? rightSide : (ltr ? toPos : fromPos).right
+        add(left, fromPos.top, right - left, fromPos.bottom)
+      } else { // Multiple lines
+        let topLeft, topRight, botLeft, botRight
+        if (ltr) {
+          topLeft = docLTR && openStart && first ? leftSide : fromPos.left
+          topRight = docLTR ? rightSide : wrapX(from, dir, "before")
+          botLeft = docLTR ? leftSide : wrapX(to, dir, "after")
+          botRight = docLTR && openEnd && last ? rightSide : toPos.right
+        } else {
+          topLeft = !docLTR ? leftSide : wrapX(from, dir, "before")
+          topRight = !docLTR && openStart && first ? rightSide : fromPos.right
+          botLeft = !docLTR && openEnd && last ? leftSide : toPos.left
+          botRight = !docLTR ? rightSide : wrapX(to, dir, "after")
+        }
+        add(topLeft, fromPos.top, topRight - topLeft, fromPos.bottom)
+        if (fromPos.bottom < toPos.top) add(leftSide, fromPos.bottom, null, toPos.top)
+        add(botLeft, toPos.top, botRight - botLeft, toPos.bottom)
+      }
+
+      if (!start || cmpCoords(fromPos, start) < 0) start = fromPos
+      if (cmpCoords(toPos, start) < 0) start = toPos
+      if (!end || cmpCoords(fromPos, end) < 0) end = fromPos
+      if (cmpCoords(toPos, end) < 0) end = toPos
+    })
+    return {start: start, end: end}
+  }
+
+  let sFrom = range.from(), sTo = range.to()
+  if (sFrom.line == sTo.line) {
+    drawForLine(sFrom.line, sFrom.ch, sTo.ch)
+  } else {
+    let fromLine = getLine(doc, sFrom.line), toLine = getLine(doc, sTo.line)
+    let singleVLine = visualLine(fromLine) == visualLine(toLine)
+    let leftEnd = drawForLine(sFrom.line, sFrom.ch, singleVLine ? fromLine.text.length + 1 : null).end
+    let rightStart = drawForLine(sTo.line, singleVLine ? 0 : null, sTo.ch).start
+    if (singleVLine) {
+      if (leftEnd.top < rightStart.top - 2) {
+        add(leftEnd.right, leftEnd.top, null, leftEnd.bottom)
+        add(leftSide, rightStart.top, rightStart.left, rightStart.bottom)
+      } else {
+        add(leftEnd.right, leftEnd.top, rightStart.left - leftEnd.right, leftEnd.bottom)
+      }
+    }
+    if (leftEnd.bottom < rightStart.top)
+      add(leftSide, leftEnd.bottom, null, rightStart.top)
+  }
+
+  output.appendChild(fragment)
+}
+
+// Cursor-blinking
+export function restartBlink(cm) {
+  if (!cm.state.focused) return
+  let display = cm.display
+  clearInterval(display.blinker)
+  let on = true
+  display.cursorDiv.style.visibility = ""
+  if (cm.options.cursorBlinkRate > 0)
+    display.blinker = setInterval(() => display.cursorDiv.style.visibility = (on = !on) ? "" : "hidden",
+      cm.options.cursorBlinkRate)
+  else if (cm.options.cursorBlinkRate < 0)
+    display.cursorDiv.style.visibility = "hidden"
+}

data/vendor/assets/components/codemirror/src/display/update_display.js

@@ -0,0 +1,260 @@
+import { sawCollapsedSpans } from "../line/saw_special_spans.js"
+import { heightAtLine, visualLineEndNo, visualLineNo } from "../line/spans.js"
+import { getLine, lineNumberFor } from "../line/utils_line.js"
+import { displayHeight, displayWidth, getDimensions, paddingVert, scrollGap } from "../measurement/position_measurement.js"
+import { mac, webkit } from "../util/browser.js"
+import { activeElt, removeChildren, contains } from "../util/dom.js"
+import { hasHandler, signal } from "../util/event.js"
+import { indexOf } from "../util/misc.js"
+
+import { buildLineElement, updateLineForChanges } from "./update_line.js"
+import { startWorker } from "./highlight_worker.js"
+import { maybeUpdateLineNumberWidth } from "./line_numbers.js"
+import { measureForScrollbars, updateScrollbars } from "./scrollbars.js"
+import { updateSelection } from "./selection.js"
+import { updateHeightsInViewport, visibleLines } from "./update_lines.js"
+import { adjustView, countDirtyView, resetView } from "./view_tracking.js"
+
+// DISPLAY DRAWING
+
+export class DisplayUpdate {
+  constructor(cm, viewport, force) {
+    let display = cm.display
+
+    this.viewport = viewport
+    // Store some values that we'll need later (but don't want to force a relayout for)
+    this.visible = visibleLines(display, cm.doc, viewport)
+    this.editorIsHidden = !display.wrapper.offsetWidth
+    this.wrapperHeight = display.wrapper.clientHeight
+    this.wrapperWidth = display.wrapper.clientWidth
+    this.oldDisplayWidth = displayWidth(cm)
+    this.force = force
+    this.dims = getDimensions(cm)
+    this.events = []
+  }
+
+  signal(emitter, type) {
+    if (hasHandler(emitter, type))
+      this.events.push(arguments)
+  }
+  finish() {
+    for (let i = 0; i < this.events.length; i++)
+      signal.apply(null, this.events[i])
+  }
+}
+
+export function maybeClipScrollbars(cm) {
+  let display = cm.display
+  if (!display.scrollbarsClipped && display.scroller.offsetWidth) {
+    display.nativeBarWidth = display.scroller.offsetWidth - display.scroller.clientWidth
+    display.heightForcer.style.height = scrollGap(cm) + "px"
+    display.sizer.style.marginBottom = -display.nativeBarWidth + "px"
+    display.sizer.style.borderRightWidth = scrollGap(cm) + "px"
+    display.scrollbarsClipped = true
+  }
+}
+
+function selectionSnapshot(cm) {
+  if (cm.hasFocus()) return null
+  let active = activeElt()
+  if (!active || !contains(cm.display.lineDiv, active)) return null
+  let result = {activeElt: active}
+  if (window.getSelection) {
+    let sel = window.getSelection()
+    if (sel.anchorNode && sel.extend && contains(cm.display.lineDiv, sel.anchorNode)) {
+      result.anchorNode = sel.anchorNode
+      result.anchorOffset = sel.anchorOffset
+      result.focusNode = sel.focusNode
+      result.focusOffset = sel.focusOffset
+    }
+  }
+  return result
+}
+
+function restoreSelection(snapshot) {
+  if (!snapshot || !snapshot.activeElt || snapshot.activeElt == activeElt()) return
+  snapshot.activeElt.focus()
+  if (snapshot.anchorNode && contains(document.body, snapshot.anchorNode) && contains(document.body, snapshot.focusNode)) {
+    let sel = window.getSelection(), range = document.createRange()
+    range.setEnd(snapshot.anchorNode, snapshot.anchorOffset)
+    range.collapse(false)
+    sel.removeAllRanges()
+    sel.addRange(range)
+    sel.extend(snapshot.focusNode, snapshot.focusOffset)
+  }
+}
+
+// Does the actual updating of the line display. Bails out
+// (returning false) when there is nothing to be done and forced is
+// false.
+export function updateDisplayIfNeeded(cm, update) {
+  let display = cm.display, doc = cm.doc
+
+  if (update.editorIsHidden) {
+    resetView(cm)
+    return false
+  }
+
+  // Bail out if the visible area is already rendered and nothing changed.
+  if (!update.force &&
+      update.visible.from >= display.viewFrom && update.visible.to <= display.viewTo &&
+      (display.updateLineNumbers == null || display.updateLineNumbers >= display.viewTo) &&
+      display.renderedView == display.view && countDirtyView(cm) == 0)
+    return false
+
+  if (maybeUpdateLineNumberWidth(cm)) {
+    resetView(cm)
+    update.dims = getDimensions(cm)
+  }
+
+  // Compute a suitable new viewport (from & to)
+  let end = doc.first + doc.size
+  let from = Math.max(update.visible.from - cm.options.viewportMargin, doc.first)
+  let to = Math.min(end, update.visible.to + cm.options.viewportMargin)
+  if (display.viewFrom < from && from - display.viewFrom < 20) from = Math.max(doc.first, display.viewFrom)
+  if (display.viewTo > to && display.viewTo - to < 20) to = Math.min(end, display.viewTo)
+  if (sawCollapsedSpans) {
+    from = visualLineNo(cm.doc, from)
+    to = visualLineEndNo(cm.doc, to)
+  }
+
+  let different = from != display.viewFrom || to != display.viewTo ||
+    display.lastWrapHeight != update.wrapperHeight || display.lastWrapWidth != update.wrapperWidth
+  adjustView(cm, from, to)
+
+  display.viewOffset = heightAtLine(getLine(cm.doc, display.viewFrom))
+  // Position the mover div to align with the current scroll position
+  cm.display.mover.style.top = display.viewOffset + "px"
+
+  let toUpdate = countDirtyView(cm)
+  if (!different && toUpdate == 0 && !update.force && display.renderedView == display.view &&
+      (display.updateLineNumbers == null || display.updateLineNumbers >= display.viewTo))
+    return false
+
+  // For big changes, we hide the enclosing element during the
+  // update, since that speeds up the operations on most browsers.
+  let selSnapshot = selectionSnapshot(cm)
+  if (toUpdate > 4) display.lineDiv.style.display = "none"
+  patchDisplay(cm, display.updateLineNumbers, update.dims)
+  if (toUpdate > 4) display.lineDiv.style.display = ""
+  display.renderedView = display.view
+  // There might have been a widget with a focused element that got
+  // hidden or updated, if so re-focus it.
+  restoreSelection(selSnapshot)
+
+  // Prevent selection and cursors from interfering with the scroll
+  // width and height.
+  removeChildren(display.cursorDiv)
+  removeChildren(display.selectionDiv)
+  display.gutters.style.height = display.sizer.style.minHeight = 0
+
+  if (different) {
+    display.lastWrapHeight = update.wrapperHeight
+    display.lastWrapWidth = update.wrapperWidth
+    startWorker(cm, 400)
+  }
+
+  display.updateLineNumbers = null
+
+  return true
+}
+
+export function postUpdateDisplay(cm, update) {
+  let viewport = update.viewport
+
+  for (let first = true;; first = false) {
+    if (!first || !cm.options.lineWrapping || update.oldDisplayWidth == displayWidth(cm)) {
+      // Clip forced viewport to actual scrollable area.
+      if (viewport && viewport.top != null)
+        viewport = {top: Math.min(cm.doc.height + paddingVert(cm.display) - displayHeight(cm), viewport.top)}
+      // Updated line heights might result in the drawn area not
+      // actually covering the viewport. Keep looping until it does.
+      update.visible = visibleLines(cm.display, cm.doc, viewport)
+      if (update.visible.from >= cm.display.viewFrom && update.visible.to <= cm.display.viewTo)
+        break
+    }
+    if (!updateDisplayIfNeeded(cm, update)) break
+    updateHeightsInViewport(cm)
+    let barMeasure = measureForScrollbars(cm)
+    updateSelection(cm)
+    updateScrollbars(cm, barMeasure)
+    setDocumentHeight(cm, barMeasure)
+    update.force = false
+  }
+
+  update.signal(cm, "update", cm)
+  if (cm.display.viewFrom != cm.display.reportedViewFrom || cm.display.viewTo != cm.display.reportedViewTo) {
+    update.signal(cm, "viewportChange", cm, cm.display.viewFrom, cm.display.viewTo)
+    cm.display.reportedViewFrom = cm.display.viewFrom; cm.display.reportedViewTo = cm.display.viewTo
+  }
+}
+
+export function updateDisplaySimple(cm, viewport) {
+  let update = new DisplayUpdate(cm, viewport)
+  if (updateDisplayIfNeeded(cm, update)) {
+    updateHeightsInViewport(cm)
+    postUpdateDisplay(cm, update)
+    let barMeasure = measureForScrollbars(cm)
+    updateSelection(cm)
+    updateScrollbars(cm, barMeasure)
+    setDocumentHeight(cm, barMeasure)
+    update.finish()
+  }
+}
+
+// Sync the actual display DOM structure with display.view, removing
+// nodes for lines that are no longer in view, and creating the ones
+// that are not there yet, and updating the ones that are out of
+// date.
+function patchDisplay(cm, updateNumbersFrom, dims) {
+  let display = cm.display, lineNumbers = cm.options.lineNumbers
+  let container = display.lineDiv, cur = container.firstChild
+
+  function rm(node) {
+    let next = node.nextSibling
+    // Works around a throw-scroll bug in OS X Webkit
+    if (webkit && mac && cm.display.currentWheelTarget == node)
+      node.style.display = "none"
+    else
+      node.parentNode.removeChild(node)
+    return next
+  }
+
+  let view = display.view, lineN = display.viewFrom
+  // Loop over the elements in the view, syncing cur (the DOM nodes
+  // in display.lineDiv) with the view as we go.
+  for (let i = 0; i < view.length; i++) {
+    let lineView = view[i]
+    if (lineView.hidden) {
+    } else if (!lineView.node || lineView.node.parentNode != container) { // Not drawn yet
+      let node = buildLineElement(cm, lineView, lineN, dims)
+      container.insertBefore(node, cur)
+    } else { // Already drawn
+      while (cur != lineView.node) cur = rm(cur)
+      let updateNumber = lineNumbers && updateNumbersFrom != null &&
+        updateNumbersFrom <= lineN && lineView.lineNumber
+      if (lineView.changes) {
+        if (indexOf(lineView.changes, "gutter") > -1) updateNumber = false
+        updateLineForChanges(cm, lineView, lineN, dims)
+      }
+      if (updateNumber) {
+        removeChildren(lineView.lineNumber)
+        lineView.lineNumber.appendChild(document.createTextNode(lineNumberFor(cm.options, lineN)))
+      }
+      cur = lineView.node.nextSibling
+    }
+    lineN += lineView.size
+  }
+  while (cur) cur = rm(cur)
+}
+
+export function updateGutterSpace(cm) {
+  let width = cm.display.gutters.offsetWidth
+  cm.display.sizer.style.marginLeft = width + "px"
+}
+
+export function setDocumentHeight(cm, measure) {
+  cm.display.sizer.style.minHeight = measure.docHeight + "px"
+  cm.display.heightForcer.style.top = measure.docHeight + "px"
+  cm.display.gutters.style.height = (measure.docHeight + cm.display.barHeight + scrollGap(cm)) + "px"
+}

data/vendor/assets/components/codemirror/src/display/update_line.js

@@ -0,0 +1,188 @@
+import { buildLineContent } from "../line/line_data.js"
+import { lineNumberFor } from "../line/utils_line.js"
+import { ie, ie_version } from "../util/browser.js"
+import { elt } from "../util/dom.js"
+import { signalLater } from "../util/operation_group.js"
+
+// When an aspect of a line changes, a string is added to
+// lineView.changes. This updates the relevant part of the line's
+// DOM structure.
+export function updateLineForChanges(cm, lineView, lineN, dims) {
+  for (let j = 0; j < lineView.changes.length; j++) {
+    let type = lineView.changes[j]
+    if (type == "text") updateLineText(cm, lineView)
+    else if (type == "gutter") updateLineGutter(cm, lineView, lineN, dims)
+    else if (type == "class") updateLineClasses(cm, lineView)
+    else if (type == "widget") updateLineWidgets(cm, lineView, dims)
+  }
+  lineView.changes = null
+}
+
+// Lines with gutter elements, widgets or a background class need to
+// be wrapped, and have the extra elements added to the wrapper div
+function ensureLineWrapped(lineView) {
+  if (lineView.node == lineView.text) {
+    lineView.node = elt("div", null, null, "position: relative")
+    if (lineView.text.parentNode)
+      lineView.text.parentNode.replaceChild(lineView.node, lineView.text)
+    lineView.node.appendChild(lineView.text)
+    if (ie && ie_version < 8) lineView.node.style.zIndex = 2
+  }
+  return lineView.node
+}
+
+function updateLineBackground(cm, lineView) {
+  let cls = lineView.bgClass ? lineView.bgClass + " " + (lineView.line.bgClass || "") : lineView.line.bgClass
+  if (cls) cls += " CodeMirror-linebackground"
+  if (lineView.background) {
+    if (cls) lineView.background.className = cls
+    else { lineView.background.parentNode.removeChild(lineView.background); lineView.background = null }
+  } else if (cls) {
+    let wrap = ensureLineWrapped(lineView)
+    lineView.background = wrap.insertBefore(elt("div", null, cls), wrap.firstChild)
+    cm.display.input.setUneditable(lineView.background)
+  }
+}
+
+// Wrapper around buildLineContent which will reuse the structure
+// in display.externalMeasured when possible.
+function getLineContent(cm, lineView) {
+  let ext = cm.display.externalMeasured
+  if (ext && ext.line == lineView.line) {
+    cm.display.externalMeasured = null
+    lineView.measure = ext.measure
+    return ext.built
+  }
+  return buildLineContent(cm, lineView)
+}
+
+// Redraw the line's text. Interacts with the background and text
+// classes because the mode may output tokens that influence these
+// classes.
+function updateLineText(cm, lineView) {
+  let cls = lineView.text.className
+  let built = getLineContent(cm, lineView)
+  if (lineView.text == lineView.node) lineView.node = built.pre
+  lineView.text.parentNode.replaceChild(built.pre, lineView.text)
+  lineView.text = built.pre
+  if (built.bgClass != lineView.bgClass || built.textClass != lineView.textClass) {
+    lineView.bgClass = built.bgClass
+    lineView.textClass = built.textClass
+    updateLineClasses(cm, lineView)
+  } else if (cls) {
+    lineView.text.className = cls
+  }
+}
+
+function updateLineClasses(cm, lineView) {
+  updateLineBackground(cm, lineView)
+  if (lineView.line.wrapClass)
+    ensureLineWrapped(lineView).className = lineView.line.wrapClass
+  else if (lineView.node != lineView.text)
+    lineView.node.className = ""
+  let textClass = lineView.textClass ? lineView.textClass + " " + (lineView.line.textClass || "") : lineView.line.textClass
+  lineView.text.className = textClass || ""
+}
+
+function updateLineGutter(cm, lineView, lineN, dims) {
+  if (lineView.gutter) {
+    lineView.node.removeChild(lineView.gutter)
+    lineView.gutter = null
+  }
+  if (lineView.gutterBackground) {
+    lineView.node.removeChild(lineView.gutterBackground)
+    lineView.gutterBackground = null
+  }
+  if (lineView.line.gutterClass) {
+    let wrap = ensureLineWrapped(lineView)
+    lineView.gutterBackground = elt("div", null, "CodeMirror-gutter-background " + lineView.line.gutterClass,
+                                    `left: ${cm.options.fixedGutter ? dims.fixedPos : -dims.gutterTotalWidth}px; width: ${dims.gutterTotalWidth}px`)
+    cm.display.input.setUneditable(lineView.gutterBackground)
+    wrap.insertBefore(lineView.gutterBackground, lineView.text)
+  }
+  let markers = lineView.line.gutterMarkers
+  if (cm.options.lineNumbers || markers) {
+    let wrap = ensureLineWrapped(lineView)
+    let gutterWrap = lineView.gutter = elt("div", null, "CodeMirror-gutter-wrapper", `left: ${cm.options.fixedGutter ? dims.fixedPos : -dims.gutterTotalWidth}px`)
+    cm.display.input.setUneditable(gutterWrap)
+    wrap.insertBefore(gutterWrap, lineView.text)
+    if (lineView.line.gutterClass)
+      gutterWrap.className += " " + lineView.line.gutterClass
+    if (cm.options.lineNumbers && (!markers || !markers["CodeMirror-linenumbers"]))
+      lineView.lineNumber = gutterWrap.appendChild(
+        elt("div", lineNumberFor(cm.options, lineN),
+            "CodeMirror-linenumber CodeMirror-gutter-elt",
+            `left: ${dims.gutterLeft["CodeMirror-linenumbers"]}px; width: ${cm.display.lineNumInnerWidth}px`))
+    if (markers) for (let k = 0; k < cm.options.gutters.length; ++k) {
+      let id = cm.options.gutters[k], found = markers.hasOwnProperty(id) && markers[id]
+      if (found)
+        gutterWrap.appendChild(elt("div", [found], "CodeMirror-gutter-elt",
+                                   `left: ${dims.gutterLeft[id]}px; width: ${dims.gutterWidth[id]}px`))
+    }
+  }
+}
+
+function updateLineWidgets(cm, lineView, dims) {
+  if (lineView.alignable) lineView.alignable = null
+  for (let node = lineView.node.firstChild, next; node; node = next) {
+    next = node.nextSibling
+    if (node.className == "CodeMirror-linewidget")
+      lineView.node.removeChild(node)
+  }
+  insertLineWidgets(cm, lineView, dims)
+}
+
+// Build a line's DOM representation from scratch
+export function buildLineElement(cm, lineView, lineN, dims) {
+  let built = getLineContent(cm, lineView)
+  lineView.text = lineView.node = built.pre
+  if (built.bgClass) lineView.bgClass = built.bgClass
+  if (built.textClass) lineView.textClass = built.textClass
+
+  updateLineClasses(cm, lineView)
+  updateLineGutter(cm, lineView, lineN, dims)
+  insertLineWidgets(cm, lineView, dims)
+  return lineView.node
+}
+
+// A lineView may contain multiple logical lines (when merged by
+// collapsed spans). The widgets for all of them need to be drawn.
+function insertLineWidgets(cm, lineView, dims) {
+  insertLineWidgetsFor(cm, lineView.line, lineView, dims, true)
+  if (lineView.rest) for (let i = 0; i < lineView.rest.length; i++)
+    insertLineWidgetsFor(cm, lineView.rest[i], lineView, dims, false)
+}
+
+function insertLineWidgetsFor(cm, line, lineView, dims, allowAbove) {
+  if (!line.widgets) return
+  let wrap = ensureLineWrapped(lineView)
+  for (let i = 0, ws = line.widgets; i < ws.length; ++i) {
+    let widget = ws[i], node = elt("div", [widget.node], "CodeMirror-linewidget")
+    if (!widget.handleMouseEvents) node.setAttribute("cm-ignore-events", "true")
+    positionLineWidget(widget, node, lineView, dims)
+    cm.display.input.setUneditable(node)
+    if (allowAbove && widget.above)
+      wrap.insertBefore(node, lineView.gutter || lineView.text)
+    else
+      wrap.appendChild(node)
+    signalLater(widget, "redraw")
+  }
+}
+
+function positionLineWidget(widget, node, lineView, dims) {
+  if (widget.noHScroll) {
+    ;(lineView.alignable || (lineView.alignable = [])).push(node)
+    let width = dims.wrapperWidth
+    node.style.left = dims.fixedPos + "px"
+    if (!widget.coverGutter) {
+      width -= dims.gutterTotalWidth
+      node.style.paddingLeft = dims.gutterTotalWidth + "px"
+    }
+    node.style.width = width + "px"
+  }
+  if (widget.coverGutter) {
+    node.style.zIndex = 5
+    node.style.position = "relative"
+    if (!widget.noHScroll) node.style.marginLeft = -dims.gutterTotalWidth + "px"
+  }
+}