App Rail
Svelte ComponentA side navigation rail component
Import
Package
Source
Doc
Examples
Selected: 1
Getting Started
Create a Svelte writable store to house the selected tile value.
import { writable, type Writable } from 'svelte/store';
const storeValue: Writable<number> = writable(1);
Implement your App Rail component and append the selected
prop and store.
<AppRail selected={storeValue}>
<svelte:fragment slot="lead">(lead)</svelte:fragment>
<!-- (AppRailTiles Here) -->
<svelte:fragment slot="trail">(trail)</svelte:fragment>
</AppRail>
Adding Tiles
Create one or more rail tile components within your app rail's available slots.
<AppRailTile label="Tile" title="Tile" value={1}>(icon)</AppRailTile>
You can use tag="a"
to convert any tile to an anchor link, then append
href, target, rel, and other attributes as needed.
<AppRailTile tag="a" href="https://github.com/">(icon)</AppRailTile>