@@ -0,0 +1,22 @@
+/*
+Copyright 2026 Element Creations Ltd.
+
+SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial
+Please see LICENSE in the repository root for full details.
+*/
+
+/**
+ * The handle on an attachment that a document viewer needs: something to key per-file state on, and
+ * a way to get at the bytes. `blob` is expected to decrypt transparently for encrypted media, so a
+ * viewer never has to care whether the room is encrypted.
+ */
+export interface DocumentMedia {
+    /** The MXC URI of the file. */
+    uri: string;
+    /** The file name, as sent. */
+    name?: string;
+    /** The size in bytes the sender declared for the file, if any. A claim, not a measurement. */
+    size?: number;
+    /** Resolves the file contents, decrypting first if the media is encrypted. */
+    blob: () => Promise<Blob>;
+}
@@ -28,19 +28,3 @@ export interface PdfViewerState {
     /** When this position was last recorded, in milliseconds since the epoch. Used to evict old entries. */
     updatedAt: number;
 }
-
-/**
- * The handle on a PDF that `PdfViewer` needs: something to key the saved reading position on,
- * and a way to get at the bytes. `blob` is expected to decrypt transparently for encrypted media, so
- * the viewer never has to care whether the room is encrypted.
- */
-export interface PdfMedia {
-    /** The MXC URI of the file, used as the key for its saved reading position. */
-    uri: string;
-    /** The file name, as sent. */
-    name?: string;
-    /** The size in bytes the sender declared for the file, if any. A claim, not a measurement. */
-    size?: number;
-    /** Resolves the file contents, decrypting first if the media is encrypted. */
-    blob: () => Promise<Blob>;
-}
@@ -174,3 +174,17 @@ describe("Markdown parser test", () => {
         });
     });
 });
+
+describe("Markdown soft breaks", () => {
+    const wrapped = "First line\nsecond line\n\nNext paragraph";
+
+    it("turns soft breaks into line breaks by default, as messages want", () => {
+        expect(new Markdown(wrapped).toHTML()).toEqual("<p>First line<br />second line</p>\n<p>Next paragraph</p>\n");
+    });
+
+    it("keeps soft breaks as newlines when asked, as a wrapped document wants", () => {
+        expect(new Markdown(wrapped).toHTML({ hardSoftBreaks: false })).toEqual(
+            "<p>First line\nsecond line</p>\n<p>Next paragraph</p>\n",
+        );
+    });
+});
@@ -275,16 +275,20 @@ export default class Markdown {
         return true;
     }
 
-    public toHTML({ externalLinks = false } = {}): string {
+    /**
+     * Render the markdown to HTML.
+     *
+     * @param externalLinks - Open every link in a new tab, as a document viewer wants; messages
+     *     leave this off and decide per link at render time.
+     * @param hardSoftBreaks - Turn a single newline inside a paragraph into a line break. Messages
+     *     want this, so that multi-line quotes stay multi-line
+     *     (https://github.com/vector-im/element-web/issues/3154). A document wrapped at a fixed
+     *     column does not, since every wrapped line would otherwise break.
+     */
+    public toHTML({ externalLinks = false, hardSoftBreaks = true } = {}): string {
         const renderer = new commonmark.HtmlRenderer({
             safe: false,
-
-            // Set soft breaks to hard HTML breaks: commonmark
-            // puts softbreaks in for multiple lines in a blockquote,
-            // so if these are just newline characters then the
-            // block quote ends up all on one line
-            // (https://github.com/vector-im/element-web/issues/3154)
-            softbreak: "<br />",
+            softbreak: hardSoftBreaks ? "<br />" : "\n",
         });
 
         // Trying to strip out the wrapping <p/> causes a lot more complication
 
@@ -153,7 +153,7 @@ describe("RightPanel", () => {
         expect(screen.getByRole("heading", { name: "r2" })).toBeInTheDocument();
     });
 
-    it("renders the PDF viewer card, named after the file, for the PdfViewer phase", async () => {
+    it("renders the document viewer card, named after the file, for a PDF", async () => {
         const room = mkRoom(cli, "r1");
         cli.getRoom.mockImplementation((roomId) => (roomId === "r1" ? room : null));
 
@@ -188,13 +188,57 @@ describe("RightPanel", () => {
         await rpsUpdated;
 
         RightPanelStore.instance.setCard(
-            { phase: RightPanelPhases.PdfViewer, state: { pdfViewerEvent: pdfEvent } },
+            { phase: RightPanelPhases.DocumentViewer, state: { documentViewerEvent: pdfEvent } },
             true,
             "r1",
         );
 
         // The viewer itself is code split, so the card header is what proves the phase was wired up
-        // to PdfViewerCard with the right event.
+        // to DocumentViewerCard with the right event.
         await waitFor(() => expect(screen.getByRole("heading", { name: "spec.pdf" })).toBeInTheDocument());
     });
+
+    it("renders the document viewer card, named after the file, for a Markdown file", async () => {
+        const room = mkRoom(cli, "r1");
+        cli.getRoom.mockImplementation((roomId) => (roomId === "r1" ? room : null));
+
+        const markdownEvent = new MatrixEvent({
+            room_id: "r1",
+            sender: "@user:example.org",
+            event_id: "$markdown",
+            type: EventType.RoomMessage,
+            content: {
+                body: "README.md",
+                msgtype: MsgType.File,
+                url: "mxc://example.org/readme",
+                info: { mimetype: "text/markdown" },
+            },
+        });
+
+        // The card is only valid while the lab is on, so the store would otherwise drop it.
+        await SettingsStore.setValue("feature_pdf_viewer", null, SettingLevel.DEVICE, true);
+
+        await spinUpStores();
+
+        render(
+            <RightPanel
+                room={room}
+                resizeNotifier={resizeNotifier}
+                permalinkCreator={new RoomPermalinkCreator(room, room.roomId)}
+            />,
+        );
+
+        const rpsUpdated = waitForRpsUpdate();
+        dis.dispatch({ action: Action.ViewRoom, room_id: "r1" });
+        await rpsUpdated;
+
+        RightPanelStore.instance.setCard(
+            { phase: RightPanelPhases.DocumentViewer, state: { documentViewerEvent: markdownEvent } },
+            true,
+            "r1",
+        );
+
+        // As above: the header proves the card picked up this event.
+        await waitFor(() => expect(screen.getByRole("heading", { name: "README.md" })).toBeInTheDocument());
+    });
 });
@@ -31,7 +31,7 @@ import TimelineCard from "../views/right_panel/TimelineCard";
 import { UPDATE_EVENT } from "../../stores/AsyncStore";
 import { type IRightPanelCard, type IRightPanelCardState } from "../../stores/right-panel/RightPanelStoreIPanelState";
 import { Action } from "../../dispatcher/actions";
-import { PdfViewerCard } from "../views/right_panel/PdfViewerCard";
+import { DocumentViewerCard } from "../views/right_panel/DocumentViewerCard";
 import { type XOR } from "../../@types/common";
 import ExtensionsCard from "../views/right_panel/ExtensionsCard";
 import MemberListView from "../views/rooms/MemberList/MemberListView";
@@ -279,9 +279,9 @@ export default class RightPanel extends React.Component<Props, IState> {
                 }
                 break;
 
-            case RightPanelPhases.PdfViewer:
-                if (!!cardState?.pdfViewerEvent) {
-                    card = <PdfViewerCard mxEvent={cardState.pdfViewerEvent} onClose={this.onClose} />;
+            case RightPanelPhases.DocumentViewer:
+                if (!!cardState?.documentViewerEvent) {
+                    card = <DocumentViewerCard mxEvent={cardState.documentViewerEvent} onClose={this.onClose} />;
                 }
                 break;
         }
 
@@ -177,8 +177,10 @@ describe("MBodyFactory", () => {
         });
     });
 
-    describe("FileBodyFactory and the PDF viewer lab", () => {
-        afterEach(() => {
+    describe("FileBodyFactory and the document previews lab, for a PDF", () => {
+        afterEach(async () => {
+            // Both viewers share the lab, so a value left on the device would leak into the next test.
+            await SettingsStore.setValue("feature_pdf_viewer", null, SettingLevel.DEVICE, false);
             SettingsStore.reset();
         });
 
@@ -205,6 +207,31 @@ describe("MBodyFactory", () => {
         });
     });
 
+    describe("FileBodyFactory and the document previews lab, for Markdown", () => {
+        afterEach(async () => {
+            // Both viewers share the lab, so a value left on the device would leak into the next test.
+            await SettingsStore.setValue("feature_pdf_viewer", null, SettingLevel.DEVICE, false);
+            SettingsStore.reset();
+        });
+
+        it("offers the viewer only once the lab is turned on, without a remount", async () => {
+            const mediaEvent = mkEvent("m.file", { body: "README.md", info: { mimetype: "text/markdown" } });
+
+            renderInRoomContext(
+                renderMBody(
+                    { ...props, mxEvent: mediaEvent, mediaEventHelper: new MediaEventHelper(mediaEvent) },
+                    FileBodyFactory,
+                ),
+                TimelineRenderingType.Room,
+            );
+            expect(screen.queryByRole("button", { name: "Open Markdown" })).not.toBeInTheDocument();
+
+            await act(() => SettingsStore.setValue("feature_pdf_viewer", null, SettingLevel.DEVICE, true));
+
+            expect(screen.getByRole("button", { name: "Open Markdown" })).toBeInTheDocument();
+        });
+    });
+
     it("renderMBody fallback shows m.audio generic placeholder when showFileInfo is true", async () => {
         const mediaEvent = new MatrixEvent({
             room_id: "!room:server",
 
@@ -59,7 +59,7 @@ function LegacyFileBody({ mxEvent, mediaEventHelper, forExport, showFileInfo }:
     const { timelineRenderingType } = useContext(RoomContext);
     const refIFrame = useRef<HTMLIFrameElement>(null) as RefObject<HTMLIFrameElement>;
     const refLink = useRef<HTMLAnchorElement>(null) as RefObject<HTMLAnchorElement>;
-    const pdfViewerEnabled = useSettingValue("feature_pdf_viewer");
+    const documentPreviewsEnabled = useSettingValue("feature_pdf_viewer");
 
     const vm = useCreateAutoDisposedViewModel(
         () =>
@@ -71,7 +71,7 @@ function LegacyFileBody({ mxEvent, mediaEventHelper, forExport, showFileInfo }:
                 timelineRenderingType,
                 refIFrame,
                 refLink,
-                pdfViewerEnabled,
+                documentPreviewsEnabled,
             }),
     );
 
@@ -82,9 +82,9 @@ function LegacyFileBody({ mxEvent, mediaEventHelper, forExport, showFileInfo }:
             forExport,
             showFileInfo,
             timelineRenderingType,
-            pdfViewerEnabled,
+            documentPreviewsEnabled,
         });
-    }, [mxEvent, mediaEventHelper, forExport, showFileInfo, timelineRenderingType, pdfViewerEnabled, vm]);
+    }, [mxEvent, mediaEventHelper, forExport, showFileInfo, timelineRenderingType, documentPreviewsEnabled, vm]);
 
     return <FileBodyView vm={vm} refIFrame={refIFrame} refLink={refLink} className="mx_MFileBody" />;
 }
@@ -96,15 +96,15 @@ interface PreviewFileBodyProps {
 
 /// the new preview file tile
 function PreviewFileBody({ mxEvent, mediaEventHelper }: PreviewFileBodyProps): JSX.Element {
-    const pdfViewerEnabled = useSettingValue("feature_pdf_viewer");
+    const documentPreviewsEnabled = useSettingValue("feature_pdf_viewer");
     const vm = useCreateAutoDisposedViewModel(
-        () => new MBodyTileViewModel(mxEvent, mediaEventHelper, pdfViewerEnabled),
+        () => new MBodyTileViewModel(mxEvent, mediaEventHelper, documentPreviewsEnabled),
     );
 
     // The view model is built once, so turning the lab on has to reach an already-rendered tile.
     useEffect(() => {
-        vm.setPdfViewerEnabled(pdfViewerEnabled);
-    }, [pdfViewerEnabled, vm]);
+        vm.setDocumentPreviewsEnabled(documentPreviewsEnabled);
+    }, [documentPreviewsEnabled, vm]);
 
     return (
         <div className="mx_EventTile_content">
 
@@ -0,0 +1,73 @@
+/*
+Copyright 2026 Element Creations Ltd.
+
+SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial
+Please see LICENSE in the repository root for full details.
+*/
+
+// @vitest-environment happy-dom
+
+import React from "react";
+import { beforeEach, describe, expect, it, vi } from "vitest";
+import { render, screen } from "test-utils-rtl";
+import userEvent from "@testing-library/user-event";
+import { EventType, type MatrixClient, MatrixEvent, MsgType, Room } from "matrix-js-sdk/src/matrix";
+
+import { DocumentViewerCard } from "./DocumentViewerCard";
+import { clientAndSDKContextRenderOptions, stubClient, TestSDKContext } from "../../../test/test-utils";
+
+function mkFileEvent(): MatrixEvent {
+    return new MatrixEvent({
+        room_id: "!room:example.org",
+        sender: "@user:example.org",
+        event_id: "$readme",
+        type: EventType.RoomMessage,
+        content: {
+            body: "README.md",
+            msgtype: MsgType.File,
+            url: "mxc://example.org/readme",
+            info: { mimetype: "text/markdown" },
+        },
+    });
+}
+
+describe("DocumentViewerCard", () => {
+    let client: MatrixClient;
+    let sdkContext: TestSDKContext;
+
+    beforeEach(() => {
+        client = stubClient();
+        sdkContext = new TestSDKContext();
+        sdkContext._client = client;
+    });
+
+    it("names the card after the file and mounts its viewer", async () => {
+        render(
+            <DocumentViewerCard mxEvent={mkFileEvent()} onClose={vi.fn()} />,
+            clientAndSDKContextRenderOptions(client, sdkContext),
+        );
+
+        expect(screen.getByRole("heading", { name: "README.md" })).toBeInTheDocument();
+        // The viewer is code split, so it shows up once its chunk has loaded.
+        expect(await screen.findByRole("status")).toHaveTextContent("Loading document");
+    });
+
+    it("shows an error that can be closed when the attachment can no longer be opened", async () => {
+        const user = userEvent.setup();
+        const onClose = vi.fn();
+        const mxEvent = mkFileEvent();
+        // A redaction while the card is open leaves an event no viewer handles.
+        mxEvent.makeRedacted(mxEvent, new Room(mxEvent.getRoomId()!, client, client.getSafeUserId()));
+
+        render(
+            <DocumentViewerCard mxEvent={mxEvent} onClose={onClose} />,
+            clientAndSDKContextRenderOptions(client, sdkContext),
+        );
+
+        expect(screen.getByRole("heading", { name: "Document" })).toBeInTheDocument();
+        expect(screen.getByRole("alert")).toHaveTextContent("Unable to load this file.");
+
+        await user.click(screen.getByRole("button", { name: "Close" }));
+        expect(onClose).toHaveBeenCalledOnce();
+    });
+});