Ilia Mashkov
839460726e
Convert the eager scrollBreadcrumbsStore singleton to getScrollBreadcrumbsStore() (+ __resetScrollBreadcrumbsStore for tests) and add a public destroy() that disconnects the IntersectionObserver and scroll listener. Update the feature barrel and consumers (BreadcrumbHeader, BreadcrumbHeaderSeeded, NavigationWrapper).
47 lines
956 B
Svelte
47 lines
956 B
Svelte
<!--
|
|
Component: NavigationWrapper
|
|
Wrapper for breadcrumb registration with scroll tracking
|
|
-->
|
|
<script lang="ts">
|
|
import { type Snippet } from 'svelte';
|
|
import {
|
|
type NavigationAction,
|
|
getScrollBreadcrumbsStore,
|
|
} from '../../model';
|
|
|
|
const scrollBreadcrumbsStore = getScrollBreadcrumbsStore();
|
|
|
|
interface Props {
|
|
/**
|
|
* Navigation index
|
|
*/
|
|
index: number;
|
|
/**
|
|
* Navigation title
|
|
*/
|
|
title: string;
|
|
/**
|
|
* Scroll offset
|
|
* @default 96
|
|
*/
|
|
offset?: number;
|
|
/**
|
|
* Content snippet
|
|
*/
|
|
content: Snippet<[action: NavigationAction]>;
|
|
}
|
|
|
|
const { index, title, offset = 96, content }: Props = $props();
|
|
|
|
function registerBreadcrumb(node: HTMLElement) {
|
|
scrollBreadcrumbsStore.add({ index, title, element: node }, offset);
|
|
return {
|
|
destroy() {
|
|
scrollBreadcrumbsStore.remove(index);
|
|
},
|
|
};
|
|
}
|
|
</script>
|
|
|
|
{@render content(registerBreadcrumb)}
|