dash-core-components icon indicating copy to clipboard operation
dash-core-components copied to clipboard

Support for anchor links

Open wbrgss opened this issue 5 years ago • 2 comments

This is something I implemented in a fork that never made it into dcc.Markdown.

To paraphrase from that fork PR:

This would enable hotlinking to anchor links automatically created from Markdown headers. This is pretty useful for [Dash] docs navigation, as it adds the ability to link directly to sub-sections of chapters.

On some pages, like the /reference chapter, anchor links work within the same page, but linking from an external link does not.

I used a modified HeadingRenderer (https://github.com/rexxars/react-markdown/issues/69#issuecomment-289860367), plus a scrollToAnchor() function because the Dash-rendered HTML doesn't seem to treat # hrefs as "jumpable" anchor links without some JS. I don't immediately have time right now to re-implement in DCC but that's the path I used.

wbrgss avatar Feb 06 '20 17:02 wbrgss

I feel like we had this discussion somewhere already but I can't find it...

The scrolling part of this may need to be handled in the renderer - the case I'm worried about is when some interaction modifies the page later and causes the anchor to rerender. We wouldn't want to scroll to it again. Also if you have a hash in the url whose ID isn't on the page, but some user action adds it later, it would be weird if that caused scrolling. Feels to me like we should only scroll to IDs added during the initial callback chain, or during a later callback chain that includes a change to the url hash.

alexcjohnson avatar Jul 10 '20 02:07 alexcjohnson

I feel like we had this discussion somewhere already but I can't find it...

@alexcjohnson this one? https://github.com/plotly/dash-core/issues/89 (private repo). If so, feel to copy your comment in there and close this issue. I was hoping this might generate more discussion on a public repo, but it has been a while. In the private repo above I discuss my attempt in a proprietary project in more detail...but I think you're right that it's not a fully robust solution

wbrgss avatar Jul 10 '20 16:07 wbrgss