@codemirror/autocomplete 6.20.0 → 6.20.1

package/CHANGELOG.md

@@ -1,3 +1,8 @@
+## 6.20.1 (2026-03-02)
+
+### Bug fixes
+
+Clicking the horizontal dots at the top/bottom of a list of completion options now moves the selection there, so that more completions become visible.
 ## 6.20.0 (2025-11-20)
 
 ### New features

package/dist/index.cjs

@@ -441,6 +441,7 @@ function defaultPositionInfo(view$1, list, option, info, space, tooltip) {
     };
 }
 
+const setSelectedEffect = state.StateEffect.define();
 function optionContent(config) {
     let content = config.addToOptions.slice();
     if (config.icons)
@@ -532,6 +533,16 @@ class CompletionTooltip {
                     return;
                 }
             }
+            if (e.target == this.list) {
+                let move = this.list.classList.contains("cm-completionListIncompleteTop") &&
+                    e.clientY < this.list.firstChild.getBoundingClientRect().top ? this.range.from - 1 :
+                    this.list.classList.contains("cm-completionListIncompleteBottom") &&
+                        e.clientY > this.list.lastChild.getBoundingClientRect().bottom ? this.range.to : null;
+                if (move != null) {
+                    view.dispatch({ effects: setSelectedEffect.of(move) });
+                    e.preventDefault();
+                }
+            }
         });
         this.dom.addEventListener("focusout", (e) => {
             let state = view.state.field(this.stateField, false);
@@ -1033,7 +1044,6 @@ function checkValid(validFor, state, from, to) {
 const setActiveEffect = state.StateEffect.define({
     map(sources, mapping) { return sources.map(s => s.map(mapping)); }
 });
-const setSelectedEffect = state.StateEffect.define();
 const completionState = state.StateField.define({
     create() { return CompletionState.start(); },
     update(value, tr) { return value.update(tr); },
@@ -1767,7 +1777,8 @@ A completion source that will scan the document for words (using a
 return those as completions.
 */
 const completeAnyWord = context => {
-    let wordChars = context.state.languageDataAt("wordChars", context.pos).join("");
+    var _a;
+    let wordChars = (_a = context.state.languageDataAt("wordChars", context.pos)[0]) !== null && _a !== void 0 ? _a : "";
     let re = wordRE(wordChars);
     let token = context.matchBefore(mapRE(re, s => s + "$"));
     if (!token && !context.explicit)

package/dist/index.js

@@ -439,6 +439,7 @@ function defaultPositionInfo(view, list, option, info, space, tooltip) {
     };
 }
 
+const setSelectedEffect = /*@__PURE__*/StateEffect.define();
 function optionContent(config) {
     let content = config.addToOptions.slice();
     if (config.icons)
@@ -530,6 +531,16 @@ class CompletionTooltip {
                     return;
                 }
             }
+            if (e.target == this.list) {
+                let move = this.list.classList.contains("cm-completionListIncompleteTop") &&
+                    e.clientY < this.list.firstChild.getBoundingClientRect().top ? this.range.from - 1 :
+                    this.list.classList.contains("cm-completionListIncompleteBottom") &&
+                        e.clientY > this.list.lastChild.getBoundingClientRect().bottom ? this.range.to : null;
+                if (move != null) {
+                    view.dispatch({ effects: setSelectedEffect.of(move) });
+                    e.preventDefault();
+                }
+            }
         });
         this.dom.addEventListener("focusout", (e) => {
             let state = view.state.field(this.stateField, false);
@@ -1031,7 +1042,6 @@ function checkValid(validFor, state, from, to) {
 const setActiveEffect = /*@__PURE__*/StateEffect.define({
     map(sources, mapping) { return sources.map(s => s.map(mapping)); }
 });
-const setSelectedEffect = /*@__PURE__*/StateEffect.define();
 const completionState = /*@__PURE__*/StateField.define({
     create() { return CompletionState.start(); },
     update(value, tr) { return value.update(tr); },
@@ -1765,7 +1775,8 @@ A completion source that will scan the document for words (using a
 return those as completions.
 */
 const completeAnyWord = context => {
-    let wordChars = context.state.languageDataAt("wordChars", context.pos).join("");
+    var _a;
+    let wordChars = (_a = context.state.languageDataAt("wordChars", context.pos)[0]) !== null && _a !== void 0 ? _a : "";
     let re = wordRE(wordChars);
     let token = context.matchBefore(mapRE(re, s => s + "$"));
     if (!token && !context.explicit)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codemirror/autocomplete",
-  "version": "6.20.0",
+  "version": "6.20.1",
   "description": "Autocompletion for the CodeMirror code editor",
   "scripts": {
     "test": "cm-runtests",
@@ -36,6 +36,6 @@
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/codemirror/autocomplete.git"
+    "url": "git+https://github.com/codemirror/autocomplete.git"
   }
 }