/browser

the /browser module provides a hydrate() function that attaches interactivity to rendered markdown — such as toggling line numbers and copying code blocks to the clipboard.

hydrate() is designed to be framework-agnostic, but the usage shown here is optimized for Svelte 5 with SvelteKit. you can adapt it to any environment that supports mount/unmount hooks or action-like lifecycles.

	

		

			Toggle
Numbering
			Copy
		
	

	
<script>
	import { hydrate } from 'aubade/browser';
	import { navigating } from '$app/state';
</script>

<main {@attach hydrate(navigating.from)}>
	<!-- content here -->
</main>

the {@attach} directive calls hydrate() after the <main> element mounts. passing navigating.from ensures hydration re-runs when navigating between pages without a full remount, so code block features remain active across client-side transitions.