Reasoning inline edit improvements + style

public/script.js

@@ -7306,6 +7306,11 @@ async function messageEditDone(div) {
     appendMediaToMessage(mes, div.closest('.mes'));
     addCopyToCodeBlocks(div.closest('.mes'));
 
+    const reasoningEditDone = mesBlock.find('.mes_reasoning_edit_done:visible');
+    if (reasoningEditDone.length > 0) {
+        reasoningEditDone.trigger('click');
+    }
+
     await eventSource.emit(event_types.MESSAGE_UPDATED, this_edit_mes_id);
     this_edit_mes_id = undefined;
     await saveChatConditional();
@@ -10813,6 +10818,12 @@ jQuery(async function () {
             var edit_mes_id = $(this).closest('.mes').attr('mesid');
             this_edit_mes_id = edit_mes_id;
 
+            // Also edit reasoning, if it exists
+            const reasoningEdit = $(this).closest('.mes_block').find('.mes_reasoning_edit:visible');
+            if (reasoningEdit.length > 0) {
+                reasoningEdit.trigger('click');
+            }
+
             var text = chat[edit_mes_id]['mes'];
             if (chat[edit_mes_id]['is_user']) {
                 this_edit_mes_chname = name1;
@@ -10946,6 +10957,11 @@ jQuery(async function () {
         appendMediaToMessage(chat[this_edit_mes_id], $(this).closest('.mes'));
         addCopyToCodeBlocks($(this).closest('.mes'));
 
+        const reasoningEditDone = $(this).closest('.mes_block').find('.mes_reasoning_edit_cancel:visible');
+        if (reasoningEditDone.length > 0) {
+            reasoningEditDone.trigger('click');
+        }
+
         await eventSource.emit(event_types.MESSAGE_UPDATED, this_edit_mes_id);
         this_edit_mes_id = undefined;
     });
@@ -11400,6 +11416,11 @@ jQuery(async function () {
         }
     });
 
+    $(document).on('click', '.mes_reasoning_summary', function () {
+        // If you toggle summary header while editing reasoning, yup - we just cancel it
+        $(this).closest('.mes').find('.mes_reasoning_edit_cancel:visible').trigger('click');
+    });
+
     $(document).keyup(function (e) {
         if (e.key === 'Escape') {
             const isEditVisible = $('#curEditTextarea').is(':visible') || $('.reasoning_edit_textarea').length > 0;

public/style.css

@@ -106,6 +106,8 @@
     --tool-cool-color-picker-btn-bg: transparent;
     --tool-cool-color-picker-btn-border-color: transparent;
 
+    --mes-right-spacing: 30px;
+
     --avatar-base-height: 50px;
     --avatar-base-width: 50px;
     --avatar-base-border-radius: 2px;
@@ -345,12 +347,18 @@ input[type='checkbox']:focus-visible {
     border-left: 2px solid var(--SmartThemeEmColor);
     border-radius: 2px;
     padding: 5px;
-    padding-left: 14px;
     margin-bottom: 0.5rem;
     overflow-y: auto;
     color: var(--SmartThemeEmColor);
 }
 
+.mes_reasoning_details {
+    margin-right: var(--mes-right-spacing);
+}
+.mes_reasoning_details .mes_reasoning_summary {
+    margin-right: calc(var(--mes-right-spacing) * -1);
+}
+
 .mes_reasoning *:last-child {
     margin-bottom: 0;
 }
@@ -391,7 +399,6 @@ input[type='checkbox']:focus-visible {
 .mes_bias:empty,
 .mes_reasoning:empty,
 .mes_reasoning_details:has(.mes_reasoning:empty),
-.mes_block:has(.edit_textarea) .mes_reasoning_details,
 .mes_reasoning_details:not([open]) .mes_reasoning_actions,
 .mes_reasoning_details:has(.reasoning_edit_textarea) .mes_reasoning,
 .mes_reasoning_details:not(:has(.reasoning_edit_textarea)) .mes_reasoning_actions .edit_button,
@@ -1123,12 +1130,11 @@ body .panelControlBar {
 }
 
 .last_mes:has(.mes_text:empty):has(.mes_reasoning_details[open]) .mes_reasoning:not(:empty) {
-    margin-bottom: 30px;
+    margin-bottom: var(--mes-right-spacing);
 }
 
-.last_mes .mes_reasoning,
 .last_mes .mes_text {
-    padding-right: 30px;
+    padding-right: var(--mes-right-spacing);
 }
 
 /* SWIPE RELATED STYLES*/