Вебкомпонент для оглавления веб-страницы

Некоторые страницы на этом сайте (например, Шпаргалка по гиту), имеют много глав и хотелось бы иметь оглавление, через которое быстро найти что нужно.

Долго думал, как это сделать правильно.

Есть куча плагинов для markdown-it, которые умеют создавать оглавление. Но мне хотелось создавать оглавление уровнем выше markdown-обработчика. Почему? Потому что оглавление будет создаваться только для markdown-документов.

Обратил внимание, что оглавления страниц есть на сайте 11ty и решил посмотреть, как они его сделали.

Ребята используют markdown-it-table-of-contents (github) и там я нашёл упоминание веб-компонента <table-of-contents>. Вот его и решил заиспользовать.

Однако, я использую ещё другой веб-компонент - <heading-anchors>. Он шёл с шаблоном для блога, который я заиспользовал для этого сайта. И он добавлял # ко всем заголовкам. И они таким образом копировались в оглавление.

На странице демки веб-компонента я увидел пример с иконкой из font-awesome. Его и заиспользовал пока что.