feat: add a helper function and trigger it on textarea blur

web/js/main.js

@@ -6,6 +6,7 @@ import { loadCSS } from "./utils.js";
 import { TagSource, loadDataAsync } from "./data.js";
 import { AutocompleteEventHandler } from "./autocomplete.js";
 import { RelatedTagsEventHandler } from "./related-tags.js";
+import { formatTextareaOnBlur } from './utils.js';
 
 // --- Constants ---
 const id = "AutocompletePlus";
@@ -105,6 +106,10 @@ function initializeEventHandlers() {
     function handleBlur(event) {
         autocompleteEventHandler.handleBlur(event);
         relatedTagsEventHandler.handleBlur(event);
+
+        if (settingValues.enableAutoFormat && event.target.tagName === 'TEXTAREA') {
+            formatTextareaOnBlur(event.target);
+        }
     }
 
     function handleKeyDown(event) {

web/js/utils.js

@@ -705,3 +705,16 @@ export function formatPromptText(text) {
   // Rejoin all lines with newline characters
   return formattedLines.join('\n');
 }
+
+/**
+ * Format the content of a textarea when it loses focus.
+ * @param {HTMLTextAreaElement} textarea - The target textarea element.
+ */
+export function formatTextareaOnBlur(textarea) {
+  const originalText = textarea.value;
+  const formattedText = formatPromptText(originalText);
+
+  if (originalText !== formattedText) {
+    textarea.setRangeText(formattedText, 0, originalText.length, 'end');
+  }
+}