diff --git a/web/js/autocompleter.js b/web/js/autocompleter.js index b126fb9..7a81c1e 100644 --- a/web/js/autocompleter.js +++ b/web/js/autocompleter.js @@ -466,6 +466,29 @@ app.registerExtension({ ), ] ), + $el( + "label", + { + textContent: "Max suggestions: ", + style: { + display: "block", + }, + }, + [ + $el("input", { + type: "number", + value: +TextAreaAutoComplete.suggestionCount, + style: { + width: "80px" + }, + onchange: (event) => { + const value = +event.target.value; + TextAreaAutoComplete.suggestionCount = value;; + localStorage.setItem(id + ".SuggestionCount", TextAreaAutoComplete.suggestionCount); + }, + }), + ] + ), $el("button", { textContent: "Manage Custom Words", onclick: () => { @@ -488,6 +511,7 @@ app.registerExtension({ TextAreaAutoComplete.insertOnTab = localStorage.getItem(id + ".InsertOnTab") !== "false"; TextAreaAutoComplete.insertOnEnter = localStorage.getItem(id + ".InsertOnEnter") !== "false"; TextAreaAutoComplete.lorasEnabled = localStorage.getItem(id + ".ShowLoras") === "true"; + TextAreaAutoComplete.suggestionCount = +localStorage.getItem(id + ".SuggestionCount"); }, setup() { async function addEmbeddings() { diff --git a/web/js/common/autocomplete.css b/web/js/common/autocomplete.css index fa22a39..1f371d6 100644 --- a/web/js/common/autocomplete.css +++ b/web/js/common/autocomplete.css @@ -5,6 +5,7 @@ font-family: sans-serif; box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.4); z-index: 9999; + overflow: auto; } .pysssss-autocomplete-item { diff --git a/web/js/common/autocomplete.js b/web/js/common/autocomplete.js index d2b017a..cb25b83 100644 --- a/web/js/common/autocomplete.js +++ b/web/js/common/autocomplete.js @@ -355,6 +355,7 @@ export class TextAreaAutoComplete { static insertOnEnter = true; static replacer = undefined; static lorasEnabled = false; + static suggestionCount = 20; /** @type {Record>} */ static groups = {}; @@ -529,7 +530,7 @@ export class TextAreaAutoComplete { ); const top = priorityMatches.length * 0.2; - return priorityMatches.slice(0, top).concat(prefixMatches, priorityMatches.slice(top), includesMatches).slice(0, 20); + return priorityMatches.slice(0, top).concat(prefixMatches, priorityMatches.slice(top), includesMatches).slice(0, TextAreaAutoComplete.suggestionCount); } #update() { @@ -649,6 +650,7 @@ export class TextAreaAutoComplete { const position = this.helper.getCursorOffset(); this.dropdown.style.left = (position.left ?? 0) + "px"; this.dropdown.style.top = (position.top ?? 0) + "px"; + this.dropdown.style.maxHeight = (window.innerHeight - position.top) + "px"; } #hide() {