[Question] Split into sections about svelte-toc

[janosh]

Don't remember deactivating the discussions tab but it's back now.

Thanks for the describing your use case! This feature sounds like it's out of scope for svelte-toc though. If the goal is to render anchors for each heading like on the demo site for this component:

then my advice would be to use a markdown/HTML parser that allows customizing the output based on tag. This site uses
mdsvex with plugins rehype-autolink-headings and rehype-slug in svelte.config.js to do this:

svelte-toc/svelte.config.js

Lines 3 to 30 in b7f6f49

	import { mdsvex } from 'mdsvex'
	import linkHeadings from 'rehype-autolink-headings'
	import headingSlugs from 'rehype-slug'
	import preprocess from 'svelte-preprocess'
	const rehypePlugins = [
	headingSlugs,
	[
	linkHeadings,
	{
	behavior: `append`,
	test: [`h2`, `h3`, `h4`, `h5`, `h6`], // don't auto-link <h1>
	content: s(
	`svg`,
	{ width: 16, height: 16, viewBox: `0 0 16 16` },
	// symbol #octicon-link defined in app.html
	s(`use`, { 'xlink:href': `#octicon-link` })
	),
	},
	],
	]
	export default {
	extensions: [`.svelte`, `.svx`, `.md`],
	preprocess: [
	preprocess(),
	mdsvex({ rehypePlugins, extensions: [`.svx`, `.md`] }),

[oskar-gmerek]

Thanks, @janosh.
I was think that was breaking the bank, as the rehype has a plugin doing exactly what I need, but unfortunately is broken and not maintained. I need it for animations, so the rehype-slug will be close, but not enough.

Anyway thanks a lot!

BTW. Is it possible to detect in someway when ToC is turning to be fixed position? My use case is on top of my content currently and can't find a way to move it out at the exact time.

[janosh]

BTW. Is it possible to detect in someway when ToC is turning to be fixed position? My use case is on top of my content currently and can't find a way to move it out at the exact time.

Maybe this helps? https://css-tricks.com/how-to-detect-when-a-sticky-element-gets-pinned

[oskar-gmerek]

https://css-tricks.com/how-to-detect-when-a-sticky-element-gets-pinned

Thanks again!