@onereach/ui-components 4.3.8 → 4.3.9-beta.2653.0

package/dist/bundled/v2/components/OrCode/OrCode.js

@@ -1,5 +1,5 @@
-import { E as EditorView, F as Facet, c as combineConfig, S as StateField, a as EditorSelection, T as Transaction, C as ChangeSet, b as ChangeDesc, I as IndentContext, g as getIndentation, i as indentString, d as Text, e as indentUnit, f as countColumn, h as getIndentUnit, A as Annotation, j as StateEffect, m as matchBrackets, s as syntaxTree, N as NodeProp, D as Direction, k as findClusterBreak, V as ViewPlugin, l as Decoration, n as codePointAt, o as codePointSize, p as getPanel, q as CharCategory, P as Prec, r as fromCodePoint, t as showPanel, R as RangeSetBuilder, u as EditorState, v as runScopeHandlers, w as hoverTooltip, W as WidgetType, x as logException, y as lineNumbers, z as highlightActiveLineGutter, B as highlightSpecialChars, G as foldGutter, H as drawSelection, J as dropCursor, K as indentOnInput, L as syntaxHighlighting, M as defaultHighlightStyle, O as bracketMatching, Q as rectangularSelection, U as crosshairCursor, X as highlightActiveLine, Y as keymap, Z as foldKeymap } from '../../index-6976c52a.js';
-import { c as closeBrackets, a as autocompletion, b as closeBracketsKeymap, d as completionKeymap, l as languages } from '../../lang-02d2bb2d.js';
+import { E as EditorView, F as Facet, c as combineConfig, S as StateField, a as EditorSelection, T as Transaction, C as ChangeSet, b as ChangeDesc, I as IndentContext, g as getIndentation, i as indentString, d as Text, e as indentUnit, f as countColumn, h as getIndentUnit, A as Annotation, j as StateEffect, m as matchBrackets, s as syntaxTree, N as NodeProp, D as Direction, k as findClusterBreak, V as ViewPlugin, l as Decoration, n as codePointAt, o as codePointSize, p as getPanel, q as CharCategory, P as Prec, r as fromCodePoint, t as showPanel, R as RangeSetBuilder, u as EditorState, v as runScopeHandlers, w as hoverTooltip, W as WidgetType, x as logException, y as lineNumbers, z as highlightActiveLineGutter, B as highlightSpecialChars, G as foldGutter, H as drawSelection, J as dropCursor, K as indentOnInput, L as syntaxHighlighting, M as defaultHighlightStyle, O as bracketMatching, Q as rectangularSelection, U as crosshairCursor, X as highlightActiveLine, Y as keymap, Z as foldKeymap } from '../../index-cf2c3c27.js';
+import { c as closeBrackets, a as autocompletion, b as closeBracketsKeymap, d as completionKeymap, l as languages } from '../../lang-0fb8f78b.js';
 import { useElementHover } from '@vueuse/core';
 import { defineComponent, ref } from 'vue-demi';
 import __vue_component__$3 from '../OrTeleport/OrTeleport.js';
@@ -38,15 +38,16 @@ const toggleComment = target => {
   let {
       state
     } = target,
-    line = state.doc.lineAt(state.selection.main.head),
+    line = state.doc.lineAt(state.selection.main.from),
     config = getConfig(target.state, line.from);
   return config.line ? toggleLineComment(target) : config.block ? toggleBlockCommentByLine(target) : false;
 };
 function command(f, option) {
-  return ({
-    state,
-    dispatch
-  }) => {
+  return _ref => {
+    let {
+      state,
+      dispatch
+    } = _ref;
     if (state.readOnly) return false;
     let tr = f(option, state);
     if (!tr) return false;
@@ -82,10 +83,11 @@ const SearchMargin = 50;
 Determines if the given range is block-commented in the given
 state.
 */
-function findBlockComment(state, {
-  open,
-  close
-}, from, to) {
+function findBlockComment(state, _ref2, from, to) {
+  let {
+    open,
+    close
+  } = _ref2;
   let textBefore = state.sliceDoc(from - SearchMargin, from);
   let textAfter = state.sliceDoc(to, to + SearchMargin);
   let spaceBefore = /\s*$/.exec(textBefore)[0].length,
@@ -142,7 +144,8 @@ function selectedLineRanges(state) {
 }
 // Performs toggle, comment and uncomment of block comments in
 // languages that support them.
-function changeBlockComment(option, state, ranges = state.selection.ranges) {
+function changeBlockComment(option, state) {
+  let ranges = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : state.selection.ranges;
   let tokens = ranges.map(r => getConfig(state, r.from).block);
   if (!tokens.every(c => c)) return null;
   let comments = ranges.map((r, i) => findBlockComment(state, tokens[i], r.from, r.to));
@@ -182,7 +185,8 @@ function changeBlockComment(option, state, ranges = state.selection.ranges) {
   return null;
 }
 // Performs toggle, comment and uncomment of line comments.
-function changeLineComment(option, state, ranges = state.selection.ranges) {
+function changeLineComment(option, state) {
+  let ranges = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : state.selection.ranges;
   let lines = [];
   let prevLine = -1;
   for (let {
@@ -191,12 +195,12 @@ function changeLineComment(option, state, ranges = state.selection.ranges) {
   } of ranges) {
     let startI = lines.length,
       minIndent = 1e9;
+    let token = getConfig(state, from).line;
+    if (!token) continue;
     for (let pos = from; pos <= to;) {
       let line = state.doc.lineAt(pos);
       if (line.from > prevLine && (from == to || to > line.from)) {
         prevLine = line.from;
-        let token = getConfig(state, line.from).line;
-        if (!token) continue;
         let indent = /^\s*/.exec(line.text)[0].length;
         let empty = indent == line.length;
         let comment = line.text.slice(indent, indent + token.length) == token ? indent : -1;
@@ -326,7 +330,8 @@ const historyField_ = /*@__PURE__*/StateField.define({
 /**
 Create a history extension with the given configuration.
 */
-function history(config = {}) {
+function history() {
+  let config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   return [historyField_, historyConfig.of(config), EditorView.domEventHandlers({
     beforeinput(e, view) {
       let command = e.inputType == "historyUndo" ? undo : e.inputType == "historyRedo" ? redo : null;
@@ -337,10 +342,11 @@ function history(config = {}) {
   })];
 }
 function cmd(side, selection) {
-  return function ({
-    state,
-    dispatch
-  }) {
+  return function (_ref3) {
+    let {
+      state,
+      dispatch
+    } = _ref3;
     if (!selection && state.readOnly) return false;
     let historyState = state.field(historyField_, false);
     if (!historyState) return false;
@@ -504,7 +510,9 @@ function mapEvent(event, mapping, extraSelections) {
 }
 const joinableUserEvent = /^(input\.type|delete)($|\.)/;
 class HistoryState {
-  constructor(done, undone, prevTime = 0, prevUserEvent = undefined) {
+  constructor(done, undone) {
+    let prevTime = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+    let prevUserEvent = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : undefined;
     this.done = done;
     this.undone = undone;
     this.prevTime = prevTime;
@@ -609,10 +617,11 @@ function setSel(state, selection) {
     userEvent: "select"
   });
 }
-function moveSel({
-  state,
-  dispatch
-}, how) {
+function moveSel(_ref4, how) {
+  let {
+    state,
+    dispatch
+  } = _ref4;
   let selection = updateSel(state.selection, how);
   if (selection.eq(state.selection)) return false;
   dispatch(setSel(state, selection));
@@ -802,10 +811,13 @@ function toMatchingBracket(state, dispatch, extend) {
 Move the selection to the bracket matching the one it is currently
 on, if any.
 */
-const cursorMatchingBracket = ({
-  state,
-  dispatch
-}) => toMatchingBracket(state, dispatch, false);
+const cursorMatchingBracket = _ref5 => {
+  let {
+    state,
+    dispatch
+  } = _ref5;
+  return toMatchingBracket(state, dispatch, false);
+};
 function extendSel(view, how) {
   let selection = updateSel(view.state.selection, range => {
     let head = how(range);
@@ -896,10 +908,11 @@ const selectLineEnd = view => extendSel(view, range => EditorSelection.cursor(vi
 /**
 Move the selection to the start of the document.
 */
-const cursorDocStart = ({
-  state,
-  dispatch
-}) => {
+const cursorDocStart = _ref7 => {
+  let {
+    state,
+    dispatch
+  } = _ref7;
   dispatch(setSel(state, {
     anchor: 0
   }));
@@ -908,10 +921,11 @@ const cursorDocStart = ({
 /**
 Move the selection to the end of the document.
 */
-const cursorDocEnd = ({
-  state,
-  dispatch
-}) => {
+const cursorDocEnd = _ref8 => {
+  let {
+    state,
+    dispatch
+  } = _ref8;
   dispatch(setSel(state, {
     anchor: state.doc.length
   }));
@@ -920,10 +934,11 @@ const cursorDocEnd = ({
 /**
 Move the selection head to the start of the document.
 */
-const selectDocStart = ({
-  state,
-  dispatch
-}) => {
+const selectDocStart = _ref9 => {
+  let {
+    state,
+    dispatch
+  } = _ref9;
   dispatch(setSel(state, {
     anchor: state.selection.main.anchor,
     head: 0
@@ -933,10 +948,11 @@ const selectDocStart = ({
 /**
 Move the selection head to the end of the document.
 */
-const selectDocEnd = ({
-  state,
-  dispatch
-}) => {
+const selectDocEnd = _ref10 => {
+  let {
+    state,
+    dispatch
+  } = _ref10;
   dispatch(setSel(state, {
     anchor: state.selection.main.anchor,
     head: state.doc.length
@@ -946,10 +962,11 @@ const selectDocEnd = ({
 /**
 Select the entire document.
 */
-const selectAll = ({
-  state,
-  dispatch
-}) => {
+const selectAll = _ref11 => {
+  let {
+    state,
+    dispatch
+  } = _ref11;
   dispatch(state.update({
     selection: {
       anchor: 0,
@@ -962,14 +979,18 @@ const selectAll = ({
 /**
 Expand the selection to cover entire lines.
 */
-const selectLine = ({
-  state,
-  dispatch
-}) => {
-  let ranges = selectedLineBlocks(state).map(({
-    from,
-    to
-  }) => EditorSelection.range(from, Math.min(to + 1, state.doc.length)));
+const selectLine = _ref12 => {
+  let {
+    state,
+    dispatch
+  } = _ref12;
+  let ranges = selectedLineBlocks(state).map(_ref13 => {
+    let {
+      from,
+      to
+    } = _ref13;
+    return EditorSelection.range(from, Math.min(to + 1, state.doc.length));
+  });
   dispatch(state.update({
     selection: EditorSelection.create(ranges),
     userEvent: "select"
@@ -982,10 +1003,11 @@ selection. Note that this will only work insofar as the language
 [provider](https://codemirror.net/6/docs/ref/#language.language) you use builds up a full
 syntax tree.
 */
-const selectParentSyntax = ({
-  state,
-  dispatch
-}) => {
+const selectParentSyntax = _ref14 => {
+  let {
+    state,
+    dispatch
+  } = _ref14;
   let selection = updateSel(state.selection, range => {
     var _a;
     let context = syntaxTree(state).resolveInner(range.head, 1);
@@ -1000,10 +1022,11 @@ Simplify the current selection. When multiple ranges are selected,
 reduce it to its main range. Otherwise, if the selection is
 non-empty, convert it to a cursor selection.
 */
-const simplifySelection = ({
-  state,
-  dispatch
-}) => {
+const simplifySelection = _ref15 => {
+  let {
+    state,
+    dispatch
+  } = _ref15;
   let cur = state.selection,
     selection = null;
   if (cur.ranges.length > 1) selection = EditorSelection.create([cur.main]);else if (!cur.main.empty) selection = EditorSelection.create([EditorSelection.cursor(cur.main.head)]);
@@ -1142,10 +1165,11 @@ const deleteToLineStart = view => deleteBy(view, pos => {
 Replace each selection range with a line break, leaving the cursor
 on the line before the break.
 */
-const splitLine = ({
-  state,
-  dispatch
-}) => {
+const splitLine = _ref17 => {
+  let {
+    state,
+    dispatch
+  } = _ref17;
   if (state.readOnly) return false;
   let changes = state.changeByRange(range => {
     return {
@@ -1166,10 +1190,11 @@ const splitLine = ({
 /**
 Flip the characters before and after the cursor(s).
 */
-const transposeChars = ({
-  state,
-  dispatch
-}) => {
+const transposeChars = _ref18 => {
+  let {
+    state,
+    dispatch
+  } = _ref18;
   if (state.readOnly) return false;
   let changes = state.changeByRange(range => {
     if (!range.empty || range.from == 0 || range.from == state.doc.length) return {
@@ -1257,17 +1282,23 @@ function moveLine(state, dispatch, forward) {
 /**
 Move the selected lines up one line.
 */
-const moveLineUp = ({
-  state,
-  dispatch
-}) => moveLine(state, dispatch, false);
+const moveLineUp = _ref19 => {
+  let {
+    state,
+    dispatch
+  } = _ref19;
+  return moveLine(state, dispatch, false);
+};
 /**
 Move the selected lines down one line.
 */
-const moveLineDown = ({
-  state,
-  dispatch
-}) => moveLine(state, dispatch, true);
+const moveLineDown = _ref20 => {
+  let {
+    state,
+    dispatch
+  } = _ref20;
+  return moveLine(state, dispatch, true);
+};
 function copyLine(state, dispatch, forward) {
   if (state.readOnly) return false;
   let changes = [];
@@ -1290,17 +1321,23 @@ function copyLine(state, dispatch, forward) {
 /**
 Create a copy of the selected lines. Keep the selection in the top copy.
 */
-const copyLineUp = ({
-  state,
-  dispatch
-}) => copyLine(state, dispatch, false);
+const copyLineUp = _ref21 => {
+  let {
+    state,
+    dispatch
+  } = _ref21;
+  return copyLine(state, dispatch, false);
+};
 /**
 Create a copy of the selected lines. Keep the selection in the bottom copy.
 */
-const copyLineDown = ({
-  state,
-  dispatch
-}) => copyLine(state, dispatch, true);
+const copyLineDown = _ref22 => {
+  let {
+    state,
+    dispatch
+  } = _ref22;
+  return copyLine(state, dispatch, true);
+};
 /**
 Delete selected lines.
 */
@@ -1309,10 +1346,11 @@ const deleteLine = view => {
   let {
       state
     } = view,
-    changes = state.changes(selectedLineBlocks(state).map(({
-      from,
-      to
-    }) => {
+    changes = state.changes(selectedLineBlocks(state).map(_ref23 => {
+      let {
+        from,
+        to
+      } = _ref23;
       if (from > 0) from--;else if (to < state.doc.length) to++;
       return {
         from,
@@ -1356,10 +1394,11 @@ Create a blank, indented line below the current line.
 */
 const insertBlankLine = /*@__PURE__*/newlineAndIndent(true);
 function newlineAndIndent(atEof) {
-  return ({
-    state,
-    dispatch
-  }) => {
+  return _ref25 => {
+    let {
+      state,
+      dispatch
+    } = _ref25;
     if (state.readOnly) return false;
     let changes = state.changeByRange(range => {
       let {
@@ -1422,10 +1461,11 @@ Auto-indent the selected lines. This uses the [indentation service
 facet](https://codemirror.net/6/docs/ref/#language.indentService) as source for auto-indent
 information.
 */
-const indentSelection = ({
-  state,
-  dispatch
-}) => {
+const indentSelection = _ref26 => {
+  let {
+    state,
+    dispatch
+  } = _ref26;
   if (state.readOnly) return false;
   let updated = Object.create(null);
   let context = new IndentContext(state, {
@@ -1458,10 +1498,11 @@ const indentSelection = ({
 Add a [unit](https://codemirror.net/6/docs/ref/#language.indentUnit) of indentation to all selected
 lines.
 */
-const indentMore = ({
-  state,
-  dispatch
-}) => {
+const indentMore = _ref27 => {
+  let {
+    state,
+    dispatch
+  } = _ref27;
   if (state.readOnly) return false;
   dispatch(state.update(changeBySelectedLine(state, (line, changes) => {
     changes.push({
@@ -1477,10 +1518,11 @@ const indentMore = ({
 Remove a [unit](https://codemirror.net/6/docs/ref/#language.indentUnit) of indentation from all
 selected lines.
 */
-const indentLess = ({
-  state,
-  dispatch
-}) => {
+const indentLess = _ref28 => {
+  let {
+    state,
+    dispatch
+  } = _ref28;
   if (state.readOnly) return false;
   dispatch(state.update(changeBySelectedLine(state, (line, changes) => {
     let space = /^\s*/.exec(line.text)[0];
@@ -1852,7 +1894,11 @@ class SearchCursor {
   [`.normalize("NFKD")`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/normalize)
   (when supported).
   */
-  constructor(text, query, from = 0, to = text.length, normalize, test) {
+  constructor(text, query) {
+    let from = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+    let to = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : text.length;
+    let normalize = arguments.length > 4 ? arguments[4] : undefined;
+    let test = arguments.length > 5 ? arguments[5] : undefined;
     this.test = test;
     /**
     The current match (only holds a meaningful value after
@@ -1974,7 +2020,9 @@ class RegExpCursor {
   document. `query` should be the raw pattern (as you'd pass it to
   `new RegExp`).
   */
-  constructor(text, query, options, from = 0, to = text.length) {
+  constructor(text, query, options) {
+    let from = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
+    let to = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : text.length;
     this.text = text;
     this.to = to;
     this.curLine = "";
@@ -2219,9 +2267,6 @@ Supports line numbers, relative line offsets prefixed with `+` or
 `-`, document percentages suffixed with `%`, and an optional
 column position by adding `:` and a second number after the line
 number.
-
-The dialog can be styled with the `panel.gotoLine` theme
-selector.
 */
 const gotoLine = view => {
   let panel = getPanel(view, createLineDialog);
@@ -2347,10 +2392,11 @@ const defaultTheme = /*@__PURE__*/EditorView.baseTheme({
   }
 });
 // Select the words around the cursors.
-const selectWord = ({
-  state,
-  dispatch
-}) => {
+const selectWord = _ref => {
+  let {
+    state,
+    dispatch
+  } = _ref;
   let {
     selection
   } = state;
@@ -2390,10 +2436,11 @@ function findNextOccurrence(state, query) {
 Select next occurrence of the current selection. Expand selection
 to the surrounding word when the selection is empty.
 */
-const selectNextOccurrence = ({
-  state,
-  dispatch
-}) => {
+const selectNextOccurrence = _ref2 => {
+  let {
+    state,
+    dispatch
+  } = _ref2;
   let {
     ranges
   } = state.selection;
@@ -2418,7 +2465,8 @@ const searchConfigFacet = /*@__PURE__*/Facet.define({
       caseSensitive: false,
       literal: false,
       wholeWord: false,
-      createPanel: view => new SearchPanel(view)
+      createPanel: view => new SearchPanel(view),
+      scrollToMatch: range => EditorView.scrollIntoView(range)
     });
   }
 });
@@ -2461,7 +2509,9 @@ class SearchQuery {
   Get a search cursor for this query, searching through the given
   range in the given state.
   */
-  getCursor(state, from = 0, to) {
+  getCursor(state) {
+    let from = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+    let to = arguments.length > 2 ? arguments[2] : undefined;
     let st = state.doc ? state : EditorState.create({
       doc: state
     });
@@ -2622,10 +2672,11 @@ const searchHighlighter = /*@__PURE__*/ViewPlugin.fromClass(class {
     let state = update.state.field(searchState);
     if (state != update.startState.field(searchState) || update.docChanged || update.selectionSet || update.viewportChanged) this.decorations = this.highlight(state);
   }
-  highlight({
-    query,
-    panel
-  }) {
+  highlight(_ref3) {
+    let {
+      query,
+      panel
+    } = _ref3;
     if (!panel || !query.spec.valid) return Decoration.none;
     let {
       view
@@ -2659,21 +2710,20 @@ selection to the first match after the current main selection.
 Will wrap around to the start of the document when it reaches the
 end.
 */
-const findNext = /*@__PURE__*/searchCommand((view, {
-  query
-}) => {
+const findNext = /*@__PURE__*/searchCommand((view, _ref4) => {
+  let {
+    query
+  } = _ref4;
   let {
     to
   } = view.state.selection.main;
   let next = query.nextMatch(view.state, to, to);
   if (!next) return false;
+  let selection = EditorSelection.single(next.from, next.to);
+  let config = view.state.facet(searchConfigFacet);
   view.dispatch({
-    selection: {
-      anchor: next.from,
-      head: next.to
-    },
-    scrollIntoView: true,
-    effects: announceMatch(view, next),
+    selection,
+    effects: [announceMatch(view, next), config.scrollToMatch(selection.main)],
     userEvent: "select.search"
   });
   return true;
@@ -2683,24 +2733,23 @@ Move the selection to the previous instance of the search query,
 before the current main selection. Will wrap past the start
 of the document to start searching at the end again.
 */
-const findPrevious = /*@__PURE__*/searchCommand((view, {
-  query
-}) => {
+const findPrevious = /*@__PURE__*/searchCommand((view, _ref5) => {
+  let {
+    query
+  } = _ref5;
   let {
       state
     } = view,
     {
       from
     } = state.selection.main;
-  let range = query.prevMatch(state, from, from);
-  if (!range) return false;
+  let prev = query.prevMatch(state, from, from);
+  if (!prev) return false;
+  let selection = EditorSelection.single(prev.from, prev.to);
+  let config = view.state.facet(searchConfigFacet);
   view.dispatch({
-    selection: {
-      anchor: range.from,
-      head: range.to
-    },
-    scrollIntoView: true,
-    effects: announceMatch(view, range),
+    selection,
+    effects: [announceMatch(view, prev), config.scrollToMatch(selection.main)],
     userEvent: "select.search"
   });
   return true;
@@ -2708,9 +2757,10 @@ const findPrevious = /*@__PURE__*/searchCommand((view, {
 /**
 Select all instances of the search query.
 */
-const selectMatches = /*@__PURE__*/searchCommand((view, {
-  query
-}) => {
+const selectMatches = /*@__PURE__*/searchCommand((view, _ref6) => {
+  let {
+    query
+  } = _ref6;
   let ranges = query.matchAll(view.state, 1000);
   if (!ranges || !ranges.length) return false;
   view.dispatch({
@@ -2722,10 +2772,11 @@ const selectMatches = /*@__PURE__*/searchCommand((view, {
 /**
 Select all instances of the currently selected text.
 */
-const selectSelectionMatches = ({
-  state,
-  dispatch
-}) => {
+const selectSelectionMatches = _ref7 => {
+  let {
+    state,
+    dispatch
+  } = _ref7;
   let sel = state.selection;
   if (sel.ranges.length > 1 || sel.main.empty) return false;
   let {
@@ -2748,9 +2799,10 @@ const selectSelectionMatches = ({
 /**
 Replace the current match of the search query.
 */
-const replaceNext = /*@__PURE__*/searchCommand((view, {
-  query
-}) => {
+const replaceNext = /*@__PURE__*/searchCommand((view, _ref8) => {
+  let {
+    query
+  } = _ref8;
   let {
       state
     } = view,
@@ -2764,7 +2816,7 @@ const replaceNext = /*@__PURE__*/searchCommand((view, {
   let changes = [],
     selection,
     replacement;
-  let announce = [];
+  let effects = [];
   if (next.from == from && next.to == to) {
     replacement = state.toText(query.getReplacement(next));
     changes.push({
@@ -2773,21 +2825,18 @@ const replaceNext = /*@__PURE__*/searchCommand((view, {
       insert: replacement
     });
     next = query.nextMatch(state, next.from, next.to);
-    announce.push(EditorView.announce.of(state.phrase("replaced match on line $", state.doc.lineAt(from).number) + "."));
+    effects.push(EditorView.announce.of(state.phrase("replaced match on line $", state.doc.lineAt(from).number) + "."));
   }
   if (next) {
     let off = changes.length == 0 || changes[0].from >= next.to ? 0 : next.to - next.from - replacement.length;
-    selection = {
-      anchor: next.from - off,
-      head: next.to - off
-    };
-    announce.push(announceMatch(view, next));
+    selection = EditorSelection.single(next.from - off, next.to - off);
+    effects.push(announceMatch(view, next));
+    effects.push(state.facet(searchConfigFacet).scrollToMatch(selection.main));
   }
   view.dispatch({
     changes,
     selection,
-    scrollIntoView: !!selection,
-    effects: announce,
+    effects,
     userEvent: "input.replace"
   });
   return true;
@@ -2796,9 +2845,10 @@ const replaceNext = /*@__PURE__*/searchCommand((view, {
 Replace all instances of the search query with the given
 replacement.
 */
-const replaceAll = /*@__PURE__*/searchCommand((view, {
-  query
-}) => {
+const replaceAll = /*@__PURE__*/searchCommand((view, _ref9) => {
+  let {
+    query
+  } = _ref9;
   if (view.state.readOnly) return false;
   let changes = query.matchAll(view.state, 1e9).map(match => {
     let {
@@ -3032,10 +3082,11 @@ function phrase(view, phrase) {
 }
 const AnnounceMargin = 30;
 const Break = /[\s\.,:;?!]/;
-function announceMatch(view, {
-  from,
-  to
-}) {
+function announceMatch(view, _ref10) {
+  let {
+    from,
+    to
+  } = _ref10;
   let line = view.state.doc.lineAt(from),
     lineEnd = view.state.doc.lineAt(to).to;
   let start = Math.max(line.from, from - AnnounceMargin),
@@ -3128,11 +3179,14 @@ class LintState {
     return new LintState(ranges, panel, findDiagnostic(ranges));
   }
 }
-function findDiagnostic(diagnostics, diagnostic = null, after = 0) {
+function findDiagnostic(diagnostics) {
+  let diagnostic = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+  let after = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
   let found = null;
-  diagnostics.between(after, 1e9, (from, to, {
-    spec
-  }) => {
+  diagnostics.between(after, 1e9, (from, to, _ref) => {
+    let {
+      spec
+    } = _ref;
     if (diagnostic && spec.diagnostic != diagnostic) return;
     found = new SelectedDiagnostic(from, to, spec.diagnostic);
     return false;
@@ -3207,9 +3261,10 @@ function lintTooltip(view, pos, side) {
   let found = [],
     stackStart = 2e8,
     stackEnd = 0;
-  diagnostics.between(pos - (side < 0 ? 1 : 0), pos + (side > 0 ? 1 : 0), (from, to, {
-    spec
-  }) => {
+  diagnostics.between(pos - (side < 0 ? 1 : 0), pos + (side > 0 ? 1 : 0), (from, to, _ref2) => {
+    let {
+      spec
+    } = _ref2;
     if (pos >= from && pos <= to && (from == to || (pos > from || side > 0) && (pos < to || side < 0))) {
       found.push(spec.diagnostic);
       stackStart = Math.min(from, stackStart);
@@ -3327,7 +3382,7 @@ const lintPlugin = /*@__PURE__*/ViewPlugin.fromClass(class {
   }
   update(update) {
     let config = update.state.facet(lintConfig);
-    if (update.docChanged || config != update.startState.facet(lintConfig)) {
+    if (update.docChanged || config != update.startState.facet(lintConfig) || config.needsRefresh && config.needsRefresh(update)) {
       this.lintTime = Date.now() + config.delay;
       if (!this.set) {
         this.set = true;
@@ -3352,7 +3407,10 @@ const lintConfig = /*@__PURE__*/Facet.define({
     }, combineConfig(input.map(i => i.config), {
       delay: 750,
       markerFilter: null,
-      tooltipFilter: null
+      tooltipFilter: null,
+      needsRefresh: null
+    }, {
+      needsRefresh: (a, b) => !a ? b : !b ? a : u => a(u) || b(u)
     }));
   },
   enables: lintPlugin
@@ -3381,11 +3439,14 @@ function renderDiagnostic(view, diagnostic, inPanel) {
   }, crelt("span", {
     class: "cm-diagnosticText"
   }, diagnostic.renderMessage ? diagnostic.renderMessage() : diagnostic.message), (_a = diagnostic.actions) === null || _a === void 0 ? void 0 : _a.map((action, i) => {
-    let click = e => {
-      e.preventDefault();
-      let found = findDiagnostic(view.state.field(lintState).diagnostics, diagnostic);
-      if (found) action.apply(view, found.from, found.to);
-    };
+    let fired = false,
+      click = e => {
+        e.preventDefault();
+        if (fired) return;
+        fired = true;
+        let found = findDiagnostic(view.state.field(lintState).diagnostics, diagnostic);
+        if (found) action.apply(view, found.from, found.to);
+      };
     let {
         name
       } = action,
@@ -3500,9 +3561,10 @@ class LintPanel {
     let i = 0,
       needsSync = false,
       newSelectedItem = null;
-    diagnostics.between(0, this.view.state.doc.length, (_start, _end, {
-      spec
-    }) => {
+    diagnostics.between(0, this.view.state.doc.length, (_start, _end, _ref3) => {
+      let {
+        spec
+      } = _ref3;
       let found = -1,
         item;
       for (let j = i; j < this.items.length; j++) if (this.items[j].diagnostic == spec.diagnostic) {
@@ -3551,10 +3613,11 @@ class LintPanel {
           sel: newSelectedItem.dom.getBoundingClientRect(),
           panel: this.list.getBoundingClientRect()
         }),
-        write: ({
-          sel,
-          panel
-        }) => {
+        write: _ref4 => {
+          let {
+            sel,
+            panel
+          } = _ref4;
           if (sel.top < panel.top) this.list.scrollTop -= panel.top - sel.top;else if (sel.bottom > panel.bottom) this.list.scrollTop += sel.bottom - panel.bottom;
         }
       });
@@ -3598,7 +3661,8 @@ class LintPanel {
     return new LintPanel(view);
   }
 }
-function svg(content, attrs = `viewBox="0 0 40 40"`) {
+function svg(content) {
+  let attrs = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : `viewBox="0 0 40 40"`;
   return `url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" ${attrs}>${encodeURIComponent(content)}</svg>')`;
 }
 function underline(color) {
@@ -3627,7 +3691,8 @@ const baseTheme = /*@__PURE__*/EditorView.baseTheme({
     backgroundColor: "#444",
     color: "white",
     borderRadius: "3px",
-    marginLeft: "8px"
+    marginLeft: "8px",
+    cursor: "pointer"
   },
   ".cm-diagnosticSource": {
     fontSize: "70%",
@@ -3835,9 +3900,10 @@ var script = defineComponent({
     }
   },
   emits: ['update:modelValue', 'focus', 'blur'],
-  setup(props, {
-    emit
-  }) {
+  setup(props, _ref) {
+    let {
+      emit
+    } = _ref;
     // editor config
     const root = ref();
     const target = ref();