Modify when "Add reasoning" button shows up

2d335e27ff6186fc7311b78e8b29fbcdb20c9ed9

Wolfsblvt <wolfsblvt@gmail.com>

public/script.js+25 -0 Viewed

     timerValue && mes.find('.mes_timer').attr('title', timerTitle).text(timerValue);
     bookmarkLink && updateBookmarkDisplay(mes);
+    if (reasoning) {
+        mes.addClass('reasoning');
+    }
     if (reasoningDuration) {
         updateReasoningTimeUI(mes.find('.mes_reasoning_header_title')[0], reasoningDuration, { forceEnd: true });
+    }

     const text = message?.extra?.display_text ?? message.mes;
     messageElement.find('.mes_text').html(messageFormatting(text, message.name, message.is_system, message.is_user, messageId, {}, false));
     messageElement.find('.mes_reasoning').html(messageFormatting(message.extra?.reasoning ?? '', '', false, false, messageId, {}, true));
+    messageElement.toggleClass('reasoning', !!message.extra?.reasoning);
     addCopyToCodeBlocks(messageElement);
     appendMediaToMessage(message, messageElement);
+}

@@ -3262,6 +3266,9 @@ class StreamingProcessor {
3262	if (this.messageReasoningDom instanceof HTMLElement) {	3266	if (this.messageReasoningDom instanceof HTMLElement) {
3263	const formattedReasoning = messageFormatting(this.reasoning, '', false, false, messageId, {}, true);	3267	const formattedReasoning = messageFormatting(this.reasoning, '', false, false, messageId, {}, true);
3264	this.messageReasoningDom.innerHTML = formattedReasoning;	3268	this.messageReasoningDom.innerHTML = formattedReasoning;
		3269	if (this.reasoning) {
		3270	this.messageDom.classList.add('reasoning');
		3271	}
3265	}	3272	}
3266	}	3273	}
3267		3274

+        }
     });
+    $(document).on('click', '.mes_reasoning_header', function () {
+        // If we are in message edit mode and reasoning area is closed, a click opens and edits it
+        const mes = $(this).closest('.mes');
+        const mesEditArea = mes.find('#curEditTextarea');
+        if (mesEditArea.length) {
+            const summary = $(mes).find('.mes_reasoning_summary');
+            if (!summary.attr('open')) {
+                summary.find('.mes_reasoning_edit').trigger('click');
+            }
+        }
+    });
     $(document).on('input', '#curEditTextarea', function () {
         if (power_user.auto_save_msg_edits === true) {
             messageEditAuto($(this));

         $(this).closest('.mes').find('.mes_reasoning_edit_cancel:visible').trigger('click');
     });
+    $(document).on('click', '.mes_reasoning_details', function (e) {
+        if (!e.target.closest('.mes_reasoning_actions') && !e.target.closest('.mes_reasoning_header')) {
+            e.preventDefault();
+        }
+    });
     $(document).keyup(function (e) {
         if (e.key === 'Escape') {
             const isEditVisible = $('#curEditTextarea').is(':visible') || $('.reasoning_edit_textarea').length > 0;

public/style.css+11 -5 Viewed

     /*only affects bubblechat to make it sit nicely at the bottom*/
+}
-.last_mes:has(.mes_text:empty):has(.mes_reasoning_details[open]) .mes_reasoning:not(:empty) {
+.last_mes:has(.mes_text:empty):has(.mes_reasoning_details) .mes_reasoning:not(:empty) {
     margin-bottom: var(--mes-right-spacing);
+}
-.last_mes .mes_text {
-    padding-right: var(--mes-right-spacing);
-}
 /* SWIPE RELATED STYLES*/
 .mes {

     padding-left: 0;
     padding-top: 5px;
     padding-bottom: 5px;
+    padding-right: var(--mes-right-spacing);
+}
 br {

     transition: 0.3s ease-in-out;
+}
+.mes_reasoning_actions {
+    margin: 0;
+    margin-top: 0.5rem;
+}
 .mes_edit_buttons .menu_button,
 .mes_reasoning_actions .edit_button {
     opacity: 0.5;

@@ -4298,6 +4300,10 @@ input[type="range"]::-webkit-slider-thumb {
4298	field-sizing: content;	4300	field-sizing: content;
4299	}	4301	}
4300		4302
		4303	.mes.reasoning .mes_edit_add_reasoning {
		4304	display: none;
		4305	}
		4306
4301	#anchor_order {	4307	#anchor_order {
4302	margin-bottom: 15px;	4308	margin-bottom: 15px;
4303	}	4309	}