First published a live version of the component nearly four years ago, with ongoing minor tweaks, including a visual update for arun.is 2.0.
Inspired by various implementations seen on websites like Framer and Make Something Wonderful, incorporating design elements into own language.
Table of contents utilizes GraphQL queries to generate headings, offers configurability by turning off for short posts and limiting maximum depth for long lists.
Sticky feature crucial for the table of contents, achieved through a mix of position: sticky; and position: absolute; for on-screen presence as users scroll.
[
add
]
[
|
|
...
]