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

feat(uishell): make component based

Browse source
This commit is contained in:
Marcus Feitoza 2020-03-31 00:10:03 -03:00
commit e24de4e797
24 changed files with 172 additions and 1261 deletions
Download patch file Download diff file Expand all files Collapse all files

32
src/components/UIShell/UIShell.svelte
View file

@ -3,21 +3,13 @@
export let href = undefined;
export let company = undefined;
export let platformName = undefined;
export let navMenu = undefined;
export let rightPanel = undefined;
export let sideNavMenu = undefined;
import { cx } from '../../lib';
import UIShellNavWrapper from './UIShellNav/UIShellNavWrapper.svelte';
import UIShellNavItem from './UIShellNav/UIShellNavItem.svelte';
import UIShellRightPanel from './UIShellRightPanel/UIShellRightPanel.svelte';
import UIShellSideNavWrapper from './UIShellSideNav/UIShellSideNavWrapper.svelte';
import UIShellSideNavItem from './UIShellSideNav/UIShellSideNavItem.svelte';
import HamburgerMenu from './UIShellSideNav/HamburgerMenu.svelte';
import HamburgerMenu from './SideNav/HamburgerMenu.svelte';
let isSideNavOpen = undefined;
let winWidth = undefined;
$: isSideNavOpen = winWidth >= 1056
$: isSideNavOpen = winWidth >= 1056;
$: ariaLabel = company + (uiShellAriaLabel || $$props['aria-label'] || platformName);
</script>
@ -32,21 +24,5 @@
<span class={cx('--header__name--prefix')}>{company}</span>
&nbsp;{platformName}
</a>
{#if navMenu}
<UIShellNavWrapper ariaLabel>
{#each navMenu as itemMenu}
<UIShellNavItem {...itemMenu} />
{/each}
</UIShellNavWrapper>
{/if}
{#if rightPanel}
<UIShellRightPanel {rightPanel} on:inputSearch />
{/if}
{#if sideNavMenu}
<UIShellSideNavWrapper bind:isOpen={isSideNavOpen} bind:winWidth>
{#each sideNavMenu as itemSideMenu}
<UIShellSideNavItem {...itemSideMenu} />
{/each}
</UIShellSideNavWrapper>
{/if}
<slot name="SideNav" />
</header>