Using [@click=] links in MarkdownViewer

[pawamoy]

Is this possible? These links currently do not seem to get rendered:

I also notice that <code><a href="#hello">hey</a></code> does not get rendered as a link, and is not styled as code. I suppose that is not supported either?

Fortunately enough, it seems that <code>[hey](#hello)</code> works, and I get a link in the terminal (though hey does not look like code). Should I assume HTML tags are stripped, which would explain case 2 above?

Finally, is this how I can customize the action when a user clicks on a link in the MarkdownViewer?

    @on(Markdown.LinkClicked)
    def go(self, event: Markdown.LinkClicked) -> None:
        # do something with the event

[davep]

The Markdown widget just handles Markdown; not Rich style links and not HTML.

[pawamoy]

I see, thanks. I'll continue digging in the docs and code to see how I can customize link clicks 🤔

[willmcgugan]

re detecting link clicks, that code looks correct.

[pawamoy]

Thanks Will, it doesn't work though. I'll elaborate in another comment.

[pawamoy]

Here's what I have yet:

from __future__ import annotations

import logging
from pathlib import Path
from typing import TYPE_CHECKING

from textual import on
from textual._path import CSSPathType
from textual.app import App, ComposeResult, CSSPathType
from textual.containers import ScrollableContainer
from textual.widgets import Footer, Header, Input, MarkdownViewer, Markdown


WELCOME = """
# Welcome

To view documentation for a package, module, class,
or any other documented object, try typing its Python path
in the search bar at the top.

By *Python path*, we mean for example `package.module.Class`
or `package.function`.

Testing [links](#hello).
"""


class CustomMarkdownViewer(MarkdownViewer):
    async def _on_markdown_link_clicked(self, message: Markdown.LinkClicked) -> None:
        message.stop()
        try:
            await self.go(message.href)
        except Exception as error:
            # error is a proper FileNotFoundError
            message.stop(stop=False)


class GriffeTUIApp(App):
    """A Textual app to visualize docs collected by Griffe."""

    BINDINGS = [
        ("d", "toggle_dark", "Toggle dark mode"),
    ]

    def compose(self) -> ComposeResult:
        """Create child widgets for the app."""
        yield Header()
        yield CustomMarkdownViewer(WELCOME, id="page")
        yield Footer()

    def action_toggle_dark(self) -> None:
        """An action to toggle dark mode."""
        self.dark = not self.dark

    @on(Markdown.LinkClicked)
    def go(message: Markdown.LinkClicked) -> None:
        print(message.href)

It seems to never get into my own go method. When I run a debugging session, I do enter CustomMarkdownViewer._on_markdown_link_clicked, un-stopping the message in the exception handler, however it doesn't bubble up, and the traceback mentions /project/__pypackages__/3.11/lib/textual/widgets/_markdown.py:969 in _on_markdown_link_clicked instead. Not sure what's happening.

I've just started using Textual so forgive my intuitions 😅

[willmcgugan]

The default _on_markdown_link_clicked calls message.stop(). You can call message.prevent_default() to prevent that.

Do you definitely need MarkdownViewer, and not Markdown? The former is a more complete viewer which has link handling builtin. If you want to roll your own, then Markdown may be a better starting point.

[pawamoy]

I super-like the Table of Contents on the left, it's extremely useful 😅

Thanks! I'll try message.prevent_default() and other things 🙂

[pawamoy]

OK I was able to make it work by moving my logic into my custom Markdown viewer, instead of trying to have the message bubble up into the app itself.