refactor(Breadcrumb): simplify entity structure and add tests
This commit is contained in:
@@ -0,0 +1,44 @@
|
||||
<!--
|
||||
Component: NavigationWrapper
|
||||
Wrapper for breadcrumb registration with scroll tracking
|
||||
-->
|
||||
<script lang="ts">
|
||||
import { type Snippet } from 'svelte';
|
||||
import {
|
||||
type NavigationAction,
|
||||
scrollBreadcrumbsStore,
|
||||
} from '../../model';
|
||||
|
||||
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)}
|
||||
Reference in New Issue
Block a user