Breadcrumb #

import Breadcrumb from '@fuzdev/fuz_ui/Breadcrumb.svelte'; <Breadcrumb />

Default icon from context
#

The root link defaults to the site_context icon, rendered as an Svg. Set the SiteState once at your app's root layout and every Breadcrumb picks it up. It falls back to the site_context glyph, then a bullet.

import {SiteState, site_context} from '@fuzdev/fuz_ui/site.svelte.js';
import {logo_fuz} from '@fuzdev/fuz_ui/logos.js';

site_context.set(new SiteState({icon: logo_fuz, glyph: '🧶'}));

With custom icon
#

<Breadcrumb>🏠</Breadcrumb>

With custom separator
#

<Breadcrumb>
	{#snippet separator()}.{/snippet}
</Breadcrumb>

With custom paths
#

<Breadcrumb
	path="/a/b/c/d"
	selected_path="/a/b"
	base_path={resolve('/docs/Breadcrumb')}
>
	<span class="font_size_xl">🔡</span>
	{#snippet separator()}.{/snippet}
</Breadcrumb>