Functional reasoning edit
| @@ -8042,11 +8042,25 @@ function updateEditArrowClasses() { | ||
| 8042 | 8042 | } |
| 8043 | 8043 | } |
| 8044 | 8044 | |
| 8045 | -export function closeMessageEditor() { | |
| 8045 | +/** | |
| 8046 | + * Closes the message editor. | |
| 8047 | + * @param {'message'|'reasoning'|'all'} what What to close. Default is 'all'. | |
| 8048 | + */ | |
| 8049 | +export function closeMessageEditor(what = 'all') { | |
| 8050 | + if (what === 'message' || what === 'all') { | |
| 8046 | 8051 | if (this_edit_mes_id) { |
| 8047 | 8052 | $(`#chat .mes[mesid="${this_edit_mes_id}"] .mes_edit_cancel`).click(); |
| 8048 | 8053 | } |
| 8049 | 8054 | } |
| 8055 | + if (what === 'reasoning' || what === 'all') { | |
| 8056 | + document.querySelectorAll('.reasoning_edit_textarea').forEach((el) => { | |
| 8057 | + const cancelButton = el.closest('.mes')?.querySelector('.mes_reasoning_edit_cancel'); | |
| 8058 | + if (cancelButton instanceof HTMLElement) { | |
| 8059 | + cancelButton.click(); | |
| 8060 | + } | |
| 8061 | + }); | |
| 8062 | + } | |
| 8063 | +} | |
| 8050 | 8064 | |
| 8051 | 8065 | export function setGenerationProgress(progress) { |
| 8052 | 8066 | if (!progress) { |
| @@ -11274,14 +11288,15 @@ jQuery(async function () { | ||
| 11274 | 11288 | |
| 11275 | 11289 | $(document).keyup(function (e) { |
| 11276 | 11290 | if (e.key === 'Escape') { |
| 11277 | 11291 | const isEditVisible = $('#curEditTextarea').is(':visible') || $('.reasoning_edit_textarea').length > 0; |
| 11278 | 11292 | if (isEditVisible && power_user.auto_save_msg_edits === false) { |
| 11279 | 11293 | closeMessageEditor('all'); |
| 11280 | 11294 | $('#send_textarea').focus(); |
| 11281 | 11295 | return; |
| 11282 | 11296 | } |
| 11283 | 11297 | if (isEditVisible && power_user.auto_save_msg_edits === true) { |
| 11284 | 11298 | $(`#chat .mes[mesid="${this_edit_mes_id}"] .mes_edit_done`).click(); |
| 11299 | + closeMessageEditor('reasoning'); | |
| 11285 | 11300 | $('#send_textarea').focus(); |
| 11286 | 11301 | return; |
| 11287 | 11302 | } |
| @@ -1650,11 +1650,61 @@ jQuery(function () { | ||
| 1650 | 1650 | } |
| 1651 | 1651 | |
| 1652 | 1652 | const reasoning = message?.extra?.reasoning; |
| 1653 | + const chatElement = document.getElementById('chat'); | |
| 1653 | 1654 | const textarea = document.createElement('textarea'); |
| 1654 | 1655 | const reasoningBlock = messageBlock.find('.mes_reasoning'); |
| 1655 | 1656 | textarea.classList.add('reasoning_edit_textarea'); |
| 1656 | 1657 | textarea.value = reasoning === PromptReasoning.REASONING_PLACEHOLDER ? '' : reasoning; |
| 1657 | 1658 | $(textarea).insertBefore(reasoningBlock); |
| 1659 | + | |
| 1660 | + if (!CSS.supports('field-sizing', 'content')) { | |
| 1661 | + const resetHeight = function () { | |
| 1662 | + const scrollTop = chatElement.scrollTop; | |
| 1663 | + textarea.style.height = '0px'; | |
| 1664 | + textarea.style.height = `${textarea.scrollHeight}px`; | |
| 1665 | + chatElement.scrollTop = scrollTop; | |
| 1666 | + }; | |
| 1667 | + | |
| 1668 | + textarea.addEventListener('input', resetHeight); | |
| 1669 | + resetHeight(); | |
| 1670 | + } | |
| 1671 | + | |
| 1672 | + textarea.focus(); | |
| 1673 | + textarea.setSelectionRange(textarea.value.length, textarea.value.length); | |
| 1674 | + | |
| 1675 | + const textareaRect = textarea.getBoundingClientRect(); | |
| 1676 | + const chatRect = chatElement.getBoundingClientRect(); | |
| 1677 | + | |
| 1678 | + // Scroll if textarea bottom is below visible area | |
| 1679 | + if (textareaRect.bottom > chatRect.bottom) { | |
| 1680 | + const scrollOffset = textareaRect.bottom - chatRect.bottom; | |
| 1681 | + chatElement.scrollTop += scrollOffset; | |
| 1682 | + } | |
| 1683 | + }); | |
| 1684 | + | |
| 1685 | + $(document).on('click', '.mes_reasoning_edit_done', async function (e) { | |
| 1686 | + e.stopPropagation(); | |
| 1687 | + e.preventDefault(); | |
| 1688 | + const { message, messageId, messageBlock } = getMessageFromJquery(this); | |
| 1689 | + if (!message?.extra) { | |
| 1690 | + return; | |
| 1691 | + } | |
| 1692 | + | |
| 1693 | + const textarea = messageBlock.find('.reasoning_edit_textarea'); | |
| 1694 | + const reasoning = String(textarea.val()); | |
| 1695 | + message.extra.reasoning = reasoning; | |
| 1696 | + await saveChatConditional(); | |
| 1697 | + updateMessageBlock(messageId, message); | |
| 1698 | + textarea.remove(); | |
| 1699 | + }); | |
| 1700 | + | |
| 1701 | + $(document).on('click', '.mes_reasoning_edit_cancel', function (e) { | |
| 1702 | + e.stopPropagation(); | |
| 1703 | + e.preventDefault(); | |
| 1704 | + | |
| 1705 | + const { messageBlock } = getMessageFromJquery(this); | |
| 1706 | + const textarea = messageBlock.find('.reasoning_edit_textarea'); | |
| 1707 | + textarea.remove(); | |
| 1658 | 1708 | }); |
| 1659 | 1709 | |
| 1660 | 1710 | $(document).on('click', '.mes_edit_add_reasoning', async function () { |
| @@ -356,6 +356,12 @@ input[type='checkbox']:focus-visible { | ||
| 356 | 356 | margin: 2px; |
| 357 | 357 | } |
| 358 | 358 | |
| 359 | +@supports not selector(:has(*)) { | |
| 360 | + .mes_reasoning_details { | |
| 361 | + display: none !important; | |
| 362 | + } | |
| 363 | +} | |
| 364 | + | |
| 359 | 365 | .mes_bias:empty, |
| 360 | 366 | .mes_reasoning:empty, |
| 361 | 367 | .mes_reasoning_details:has(.mes_reasoning:empty), |
| @@ -1089,6 +1095,10 @@ body .panelControlBar { | ||
| 1089 | 1095 | /*only affects bubblechat to make it sit nicely at the bottom*/ |
| 1090 | 1096 | } |
| 1091 | 1097 | |
| 1098 | +.last_mes:has(.mes_text:empty):has(.mes_reasoning_details[open]) .mes_reasoning:not(:empty) { | |
| 1099 | + margin-bottom: 30px; | |
| 1100 | +} | |
| 1101 | + | |
| 1092 | 1102 | .last_mes .mes_reasoning, |
| 1093 | 1103 | .last_mes .mes_text { |
| 1094 | 1104 | padding-right: 30px; |