mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-15 10:21:05 +00:00
Code Issues Projects Releases Packages Wiki Activity

docs(uishell): add side nav story

Browse source
This commit is contained in:
Marcus Feitoza 2020-04-18 15:18:46 -03:00
commit ee9f3e295c
2 changed files with 28 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

18
src/components/UIShell/UIShell.Story.svelte
View file

@ -111,6 +111,24 @@
{#if story === 'header'} {#if story === 'header'}
<Header {...$$props} /> <Header {...$$props} />
{:else if story === 'sidenav'}
<SideNav isOpen={true}>
<SideNavItems>
<SideNavMenu text="Menu 01" icon={iCatalog}>
<SideNavMenuItem text="Sub 01" href="/" />
<SideNavMenuItem text="Sub 02" href="/" />
<SideNavMenuItem text="Sub 03" href="/" />
<SideNavMenuItem text="Sub 04" href="/" />
</SideNavMenu>
<SideNavMenu text="Menu 02" icon={iAdjust}>
<SideNavMenuItem text="Sub 01" href="/" />
<SideNavMenuItem text="Sub 02" href="/" />
<SideNavMenuItem text="Sub 03" href="/" />
<SideNavMenuItem text="Sub 04" href="/" />
</SideNavMenu>
<SideNavLink text="Menu 03" href="/" icon={iProtection} />
</SideNavItems>
</SideNav>
{:else if story === 'header-with-nav'} {:else if story === 'header-with-nav'}
<Header {...$$props}> <Header {...$$props}>
<HeaderNav> <HeaderNav>

10
src/components/UIShell/UIShell.stories.js
View file

@ -13,6 +13,16 @@ export const Header = () => ({
} }
}); });
export const Sidenav = () => ({
Component,
props: {
story: 'sidenav',
href: text('The link href (href)', '#'),
company: text('Company name', 'IBM'),
platformName: text('Platform name', 'Platform Name')
}
});
export const HeaderWithNav = () => ({ export const HeaderWithNav = () => ({
Component, Component,
props: { props: {