ui: UI/chat form follow ups (#26743)

* ui: split the markdown rendering setting per surface

User content and thinking get their own toggle again, so turning off
markdown for a message leaves reasoning blocks formatted. Both default
to markdown. A stored renderContentAsRawText unfolds onto the user key
and is dropped from the config.

File mentions render as badges in the raw text path too, through a
narrow pass over [name](file://path) that leaves everything else
untouched.

* ui: let the rich chat input scroll past its max height

The contenteditable renderer caps its height with max-height but had no
overflow rule, so a long buffer overflowed into the input area wrapper
and got clipped by its overflow-hidden, leaving no way to reach the
bottom of the message. The textarea renderer scrolls natively and was
never affected.

* ui: apply the new lint and format config

* ui: move the render keys unfolding into the migration service

Address review from @allozaur: the settings store no longer rewrites
persisted config on load, the raw text toggle now unfolds onto the
per-surface render keys in migration.service.ts, next to the other
config migrations. The mention scanner flag and the directory path
suffix become named constants.

tools/ui/src/lib/components/app/content/MentionBadge.svelte

@@ -0,0 +1,36 @@
+<script lang="ts">
+	import { SETTINGS_KEYS } from '$lib/constants';
+	import { settingsStore } from '$lib/stores/settings.svelte';
+	import { toolsStore } from '$lib/stores/tools.svelte';
+	import {
+		getMentionBadgeIconPaths,
+		getMentionBadgeLabel,
+		MENTION_BADGE_CLASSNAME,
+		MENTION_BADGE_ICON_CLASSNAME,
+		MENTION_BADGE_SVG_ATTRIBUTES
+	} from '$lib/utils';
+
+	interface Props {
+		name: string;
+		path: string;
+	}
+
+	let { name, path }: Props = $props();
+
+	let showFullPath = $derived(
+		settingsStore.getConfig(SETTINGS_KEYS.SHOW_FULL_PATH_IN_MENTIONS) as boolean
+	);
+	let label = $derived(getMentionBadgeLabel(name, path, showFullPath, toolsStore.serverHome));
+</script>
+
+<!-- The chip is a flex container, so template whitespace between its
+     children collapses away and the icon keeps its `gap-1` spacing. -->
+<span class={MENTION_BADGE_CLASSNAME} title={path}>
+	<svg {...MENTION_BADGE_SVG_ATTRIBUTES} class={MENTION_BADGE_ICON_CLASSNAME}>
+		{#each getMentionBadgeIconPaths(path) as d (d)}
+			<path {d} />
+		{/each}
+	</svg>
+
+	<span class="shrink-0 truncate">{label}</span>
+</span>

tools/ui/src/lib/components/app/content/MentionText.svelte

@@ -0,0 +1,17 @@
+<script lang="ts">
+	import MentionBadge from './MentionBadge.svelte';
+	import { splitMentionSegments } from '$lib/utils';
+
+	interface Props {
+		content: string;
+	}
+
+	let { content }: Props = $props();
+
+	let segments = $derived(splitMentionSegments(content));
+</script>
+
+<!-- Segments sit in a `whitespace-pre-wrap` parent, so the markup stays
+     glued: any newline between the tags below would print as a space. -->
+<!-- prettier-ignore -->
+{#each segments as segment, index (index)}{#if segment.mention}<MentionBadge name={segment.mention.name} path={segment.mention.path} />{:else}{segment.text}{/if}{/each}

tools/ui/src/lib/components/app/content/index.ts

@@ -31,6 +31,20 @@
  */
 export { default as MarkdownContent } from './MarkdownContent/MarkdownContent.svelte';
 
+/**
+ * **MentionText** - Plain text with file mention badges
+ *
+ * Renders a message verbatim, turning only `[name](file://path)` links
+ * into the same badge chips the markdown path draws. Nothing else is
+ * interpreted, so pasted code keeps its `#` comments and underscores.
+ *
+ * @example
+ * ```svelte
+ * <span class="whitespace-pre-wrap"><MentionText content={message.content} /></span>
+ * ```
+ */
+export { default as MentionText } from './MentionText.svelte';
+
 /**
  * **SyntaxHighlightedCode** - Code syntax highlighting
  *