From 424fd73ed3a61b5d13b1729d930fae47a69e510d Mon Sep 17 00:00:00 2001
From: niv <nicolas.varlot@ac-versailles.fr>
Date: Wed, 13 May 2026 14:41:25 +0200
Subject: [PATCH 1/3] fix(assistant): render markdown in TextInput output

Wrap the output field in NcRichText when isOutput is true, falling back to NcRichContenteditable for the input case. Headings, lists, bold, italic, code blocks and links are now rendered. Tables are not rendered due to the markdown-it configuration of NcRichText in @nextcloud/vue, which does not enable the table plugin by default. The copy still functions and keeps the markdown as expected.

Signed-off-by: niv <nicolas.varlot@ac-versailles.fr>
---
 src/components/fields/TextInput.vue | 63 ++++++++++++++++++++++++++++-
 1 file changed, 62 insertions(+), 1 deletion(-)

diff --git a/src/components/fields/TextInput.vue b/src/components/fields/TextInput.vue
index c9b9e243..8933e113 100644
--- a/src/components/fields/TextInput.vue
+++ b/src/components/fields/TextInput.vue
@@ -9,7 +9,16 @@
 			<br v-if="limitLabel">
 			{{ limitLabel ?? '' }}
 		</label>
+		<NcRichText
+			v-if="isOutput && hasValue && !isEditing"
+			class="rendered-output output-wrapper"
+			:title="t('assistant', 'Double-click to edit')"
+			:text="value ?? ''"
+			:use-markdown="true"
+			:autolink="true"
+			@dblclick="enterEditMode" />
 		<NcRichContenteditable
+			v-else
 			:id="id"
 			ref="input"
 			:model-value="value ?? ''"
@@ -21,7 +30,8 @@
 			:placeholder="placeholder"
 			:title="title"
 			@submit="hasValue && $emit('submit', $event)"
-			@update:model-value="$emit('update:value', $event)" />
+			@update:model-value="$emit('update:value', $event)"
+			@blur="onEditableBlur" />
 		<div v-if="isOutput && hasValue"
 			class="output-buttons">
 			<NcButton v-if="!streaming() && canImproveOutput"
@@ -73,6 +83,7 @@ import ContentCopyIcon from 'vue-material-design-icons/ContentCopy.vue'
 import NcButton from '@nextcloud/vue/components/NcButton'
 import NcRichContenteditable from '@nextcloud/vue/components/NcRichContenteditable'
 import { NcLoadingIcon } from '@nextcloud/vue'
+import { NcRichText } from '@nextcloud/vue/components/NcRichText'
 
 import isMobile from '../../mixins/isMobile.js'
 
@@ -98,6 +109,7 @@ export default {
 
 	components: {
 		NcRichContenteditable,
+		NcRichText,
 		NcButton,
 		NcLoadingIcon,
 		FileDocumentOutlineIcon,
@@ -156,6 +168,7 @@ export default {
 	data() {
 		return {
 			copied: false,
+			isEditing: false,
 			maxLength: MAX_TEXT_INPUT_LENGTH,
 		}
 	},
@@ -233,6 +246,39 @@ export default {
 				showError(t('assistant', 'Result could not be copied to clipboard'))
 			}
 		},
+		enterEditMode() {
+			if (!this.isOutput) {
+				return
+			}
+			this.isEditing = true
+			this.$nextTick(() => {
+				const ref = this.$refs.input
+				if (!ref) {
+					return
+				}
+				if (typeof ref.focus === 'function') {
+					ref.focus()
+					return
+				}
+				const el = ref.$el
+				if (!el) {
+					return
+				}
+				if (typeof el.focus === 'function') {
+					el.focus()
+					return
+				}
+				const editable = el.querySelector?.('[contenteditable]')
+				if (editable && typeof editable.focus === 'function') {
+					editable.focus()
+				}
+			})
+		},
+		onEditableBlur() {
+			if (this.isOutput && this.isEditing) {
+				this.isEditing = false
+			}
+		},
 	},
 }
 </script>
@@ -272,6 +318,20 @@ body[dir="rtl"] .output-buttons {
 		bottom: 2px;
 	}
 
+	.output-wrapper {
+		display: block !important;
+		box-sizing: border-box !important;
+		border: 2px solid var(--color-primary-element) !important;
+		border-radius: var(--border-radius-large) !important;
+		padding: 8px !important;
+		padding-bottom: 42px !important;
+		max-height: 35vh !important;
+		overflow-y: auto !important;
+		.rendered-output, .rendered-output * {
+			cursor: text;
+		}
+	}
+
 	.rich-contenteditable__input {
 		min-height: calc(var(--default-clickable-area) * 3 + 4px);
 		padding-top: 5px !important;
@@ -280,6 +340,7 @@ body[dir="rtl"] .output-buttons {
 	.shadowed .rich-contenteditable__input {
 		border: 2px solid var(--color-primary-element);
 		padding-bottom: 38px !important;
+		max-height: 35vh !important;
 	}
 	.shadowed.streaming .rich-contenteditable__input {
 		animation: pulse 2s infinite;

From 1a61c4bd28abf462bd3314a03806c304e33c17f9 Mon Sep 17 00:00:00 2001
From: Julien Veyssier <julien-nc@posteo.net>
Date: Fri, 10 Jul 2026 10:33:28 +0200
Subject: [PATCH 2/3] fix: change the min height of NcRichText in <TextInput>

Signed-off-by: Julien Veyssier <julien-nc@posteo.net>
---
 src/components/fields/TextInput.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/components/fields/TextInput.vue b/src/components/fields/TextInput.vue
index 8933e113..c5b2a012 100644
--- a/src/components/fields/TextInput.vue
+++ b/src/components/fields/TextInput.vue
@@ -325,6 +325,7 @@ body[dir="rtl"] .output-buttons {
 		border-radius: var(--border-radius-large) !important;
 		padding: 8px !important;
 		padding-bottom: 42px !important;
+		min-height: calc(var(--default-clickable-area) * 3 + 4px);
 		max-height: 35vh !important;
 		overflow-y: auto !important;
 		.rendered-output, .rendered-output * {

From 8de2d26fb48cf48aaa9c56896f03b82e0fed74f1 Mon Sep 17 00:00:00 2001
From: Julien Veyssier <julien-nc@posteo.net>
Date: Fri, 10 Jul 2026 10:39:41 +0200
Subject: [PATCH 3/3] fix: make NcRichText scroll while streaming in
 <TextInput>

Signed-off-by: Julien Veyssier <julien-nc@posteo.net>
---
 src/components/fields/TextInput.vue | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

diff --git a/src/components/fields/TextInput.vue b/src/components/fields/TextInput.vue
index c5b2a012..0df983e1 100644
--- a/src/components/fields/TextInput.vue
+++ b/src/components/fields/TextInput.vue
@@ -11,6 +11,7 @@
 		</label>
 		<NcRichText
 			v-if="isOutput && hasValue && !isEditing"
+			ref="richText"
 			class="rendered-output output-wrapper"
 			:title="t('assistant', 'Double-click to edit')"
 			:text="value ?? ''"
@@ -196,10 +197,16 @@ export default {
 			if (!this.streaming()) {
 				return
 			}
-			const scrollableArea = this.$refs.input?.$el?.querySelector('#' + this.id)
-			if (scrollableArea) {
-				scrollableArea.scrollTo(0, scrollableArea.scrollHeight)
-			}
+			this.$nextTick(() => {
+				const scrollableArea = this.$refs.input?.$el?.querySelector('#' + this.id)
+				if (scrollableArea) {
+					scrollableArea.scrollTo(0, scrollableArea.scrollHeight)
+				}
+				const richText = this.$refs.richText?.$el
+				if (richText) {
+					richText.scrollTo(0, richText.scrollHeight)
+				}
+			})
 		},
 	},