5.0.2 • Published 4 days ago
@svelte-put/toc v5.0.2
@svelte-put/toc
Svelte use:toc
action for building table of contents
svelte-put
This package is part of the @svelte-put family. For contributing guideline and more, refer to its readme.
Usage & Documentation
See the dedicated documentation page here.
Quick Start
<script>
import { toc, createTocStore, toclink } from '@svelte-put/toc';
const tocStore = createTocStore();
</script>
<main use:toc={{ store: tocStore, observe: true }}>
<h1>Page Heading</h1>
<section>
<h2>Table of Contents</h2>
{#if $tocStore.items.size}
<ul>
{#each $tocStore.items.values() as tocItem}
<li>
<!-- svelte-ignore a11y-missing-attribute -->
<a use:toclink={{ store: tocStore, tocItem, observe: true }} />
</li>
{/each}
</ul>
{/if}
</section>
<section>
<h2>Section Heading Level 2</h2>
<p>...</p>
</section>
<section>
<h3>Section Heading Level 3</h3>
<p>...</p>
</section>
<!-- ... -->
</main>
Acknowledgement
This package relies on svelte action strategy and attempts to stay minimal. If you are looking for a declarative, component-oriented solution, check out Janosh's svelte-toc.
Changelog
5.0.2
4 days ago
5.0.1
2 months ago
5.0.0
4 months ago
3.0.3
11 months ago
4.0.0
10 months ago
3.0.2
1 year ago
3.0.1
1 year ago
3.0.0
1 year ago
2.1.2
1 year ago
2.1.1
1 year ago
2.1.3
1 year ago
2.0.3
1 year ago
2.0.2
1 year ago
2.0.4
1 year ago
2.1.0
1 year ago
2.0.1
1 year ago
2.0.0
1 year ago
1.0.8
2 years ago
1.0.7
2 years ago
1.0.6
2 years ago
1.0.5
2 years ago
1.0.4
2 years ago
1.0.3
2 years ago
1.0.2
2 years ago
1.0.1
2 years ago
1.0.0
2 years ago