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

refactor(uishell): rename files

Browse source
This commit is contained in:
Marcus Feitoza 2020-04-05 14:18:44 -03:00
commit e2375b2a12
12 changed files with 72 additions and 64 deletions
Download patch file Download diff file Expand all files Collapse all files

0
src/components/UIShell/UIShellNav/UtilityComponent.svelte → src/components/UIShell/GlobalHeader/HeaderAction.svelte
View file

0
src/components/UIShell/UIShellNav/UtilityLink.svelte → src/components/UIShell/GlobalHeader/HeaderActionLink.svelte
View file

0
src/components/UIShell/UIShellNav/UtilitySearch.svelte → src/components/UIShell/GlobalHeader/HeaderActionSearch.svelte
View file

0
src/components/UIShell/UIShellNav/UIShellNav.svelte → src/components/UIShell/GlobalHeader/HeaderNav.svelte
View file

0
src/components/UIShell/UIShellNav/UIShellNavItem.svelte → src/components/UIShell/GlobalHeader/HeaderNavItem.svelte
View file

0
src/components/UIShell/UIShellNav/UIShellNavSubmenu.svelte → src/components/UIShell/GlobalHeader/HeaderNavMenu.svelte
View file

0
src/components/UIShell/UIShellNav/UIShellUtilities.svelte → src/components/UIShell/GlobalHeader/HeaderUtilities.svelte
View file

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

@ -15,13 +15,15 @@
import SideNavMenu from './SideNav/SideNavMenu.svelte'; import SideNavMenu from './SideNav/SideNavMenu.svelte';
import SideNavMenuItem from './SideNav/SideNavMenuItem.svelte'; import SideNavMenuItem from './SideNav/SideNavMenuItem.svelte';
import SideNavLink from './SideNav/SideNavLink.svelte'; import SideNavLink from './SideNav/SideNavLink.svelte';
import UIShellNav from './UIShellNav/UIShellNav.svelte'; import HeaderNav from './GlobalHeader/HeaderNav.svelte';
import UIShellNavItem from './UIShellNav/UIShellNavItem.svelte'; import HeaderNavItem from './GlobalHeader/HeaderNavItem.svelte';
import UIShellNavSubmenu from './UIShellNav/UIShellNavSubmenu.svelte'; import HeaderNavMenu from './GlobalHeader/HeaderNavMenu.svelte';
import UIShellUtilities from './UIShellNav/UIShellUtilities.svelte'; import HeaderUtilities from './GlobalHeader/HeaderUtilities.svelte';
import UtilitySearch from './UIShellNav/UtilitySearch.svelte'; import HeaderActionSearch from './GlobalHeader/HeaderActionSearch.svelte';
import UtilityLink from './UIShellNav/UtilityLink.svelte'; import HeaderActionLink from './GlobalHeader/HeaderActionLink.svelte';
import UtilityComponent from './UIShellNav/UtilityComponent.svelte'; import HeaderAction from './GlobalHeader/HeaderAction.svelte';
let isSideNavOpen = undefined;
let iCatalog = { let iCatalog = {
class: undefined, class: undefined,
@ -106,57 +108,53 @@
{#if story === 'with-nav'} {#if story === 'with-nav'}
<UIShell {...$$props}> <UIShell {...$$props}>
<div slot="Nav"> <HeaderNav>
<UIShellNav> <HeaderNavItem href="/" text="Link 1" />
<UIShellNavItem href="/" text="Link 1" /> <HeaderNavItem href="/" text="Link 2" />
<UIShellNavItem href="/" text="Link 2" /> <HeaderNavItem href="/" text="Link 3" />
<UIShellNavItem href="/" text="Link 3" /> <HeaderNavMenu text="Sub Menu">
<UIShellNavSubmenu text="Sub Menu"> <HeaderNavItem href="/" text="Link 1" />
<UIShellNavItem href="/" text="Link 1" /> <HeaderNavItem href="/" text="Link 2" />
<UIShellNavItem href="/" text="Link 2" /> <HeaderNavItem href="/" text="Link 3" />
<UIShellNavItem href="/" text="Link 3" /> </HeaderNavMenu>
</UIShellNavSubmenu> </HeaderNav>
</UIShellNav>
</div>
</UIShell> </UIShell>
{:else if story === 'with-actions'} {:else if story === 'with-actions'}
<UIShell {...$$props}> <UIShell {...$$props}>
<UIShellUtilities> <HeaderUtilities>
<UtilitySearch /> <HeaderActionSearch />
<UtilityComponent type="Settings" icon={iSettings}> <HeaderAction type="Settings" icon={iSettings}>
<p>Settings</p> <p>Settings</p>
</UtilityComponent> </HeaderAction>
<UtilityLink type="Help" icon={iHelp} /> <HeaderActionLink type="Help" icon={iHelp} />
<UtilityComponent type="Notifications" icon={iNotifications}> <HeaderAction type="Notifications" icon={iNotifications}>
<p>Notifications</p> <p>Notifications</p>
</UtilityComponent> </HeaderAction>
<UtilityLink type="Account" icon={iAccount} /> <HeaderActionLink type="Account" icon={iAccount} />
<UtilityComponent type="Switcher" icon={iSwitcher}> <HeaderAction type="Switcher" icon={iSwitcher}>
<p>Switcher</p> <p>Switcher</p>
</UtilityComponent> </HeaderAction>
</UIShellUtilities> </HeaderUtilities>
</UIShell> </UIShell>
{:else if story === 'with-actions-sidenav'} {:else if story === 'with-sidenav'}
<UIShell {...$$props}> <UIShell bind:isSideNavOpen {...$$props}>
<div slot="SideNav"> <SideNav isOpen={isSideNavOpen}>
<SideNav> <SideNavItems>
<SideNavItems> <SideNavMenu text="Menu 01" icon={iCatalog}>
<SideNavMenu text="Menu 01" icon={iCatalog}> <SideNavMenuItem text="Sub 01" href="/" />
<SideNavMenuItem text="Sub 01" href="/" /> <SideNavMenuItem text="Sub 02" href="/" />
<SideNavMenuItem text="Sub 02" href="/" /> <SideNavMenuItem text="Sub 03" href="/" />
<SideNavMenuItem text="Sub 03" href="/" /> <SideNavMenuItem text="Sub 04" href="/" />
<SideNavMenuItem text="Sub 04" href="/" /> </SideNavMenu>
</SideNavMenu> <SideNavMenu text="Menu 02" icon={iAdjust}>
<SideNavMenu text="Menu 02" icon={iAdjust}> <SideNavMenuItem text="Sub 01" href="/" />
<SideNavMenuItem text="Sub 01" href="/" /> <SideNavMenuItem text="Sub 02" href="/" />
<SideNavMenuItem text="Sub 02" href="/" /> <SideNavMenuItem text="Sub 03" href="/" />
<SideNavMenuItem text="Sub 03" href="/" /> <SideNavMenuItem text="Sub 04" href="/" />
<SideNavMenuItem text="Sub 04" href="/" /> </SideNavMenu>
</SideNavMenu> <SideNavLink text="Menu 03" href="/" icon={iProtection} />
<SideNavLink text="Menu 03" href="/" icon={iProtection} /> </SideNavItems>
</SideNavItems> </SideNav>
</SideNav>
</div>
</UIShell> </UIShell>
{:else} {:else}
<UIShell {...$$props} /> <UIShell {...$$props} />

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

@ -26,7 +26,7 @@ export const WithActions = () => ({
export const WithActionsAndSidenav = () => ({ export const WithActionsAndSidenav = () => ({
Component, Component,
props: { props: {
story: 'with-actions-sidenav', story: 'with-sidenav',
href: text('The link href (href)', '#'), href: text('The link href (href)', '#'),
company: text('Company name', 'IBM'), company: text('Company name', 'IBM'),
platformName: text('Platform name', 'Platform Name') platformName: text('Platform name', 'Platform Name')

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

@ -3,11 +3,11 @@
export let href = undefined; export let href = undefined;
export let company = undefined; export let company = undefined;
export let platformName = undefined; export let platformName = undefined;
export let isSideNavOpen = undefined;
import { cx } from '../../lib'; import { cx } from '../../lib';
import HamburgerMenu from './SideNav/HamburgerMenu.svelte'; import HamburgerMenu from './SideNav/HamburgerMenu.svelte';
let isSideNavOpen = undefined;
let winWidth = undefined; let winWidth = undefined;
$: isSideNavOpen = winWidth >= 1056; $: isSideNavOpen = winWidth >= 1056;
@ -24,7 +24,5 @@
<span class={cx('--header__name--prefix')}>{company}</span> <span class={cx('--header__name--prefix')}>{company}</span>
&nbsp;{platformName} &nbsp;{platformName}
</a> </a>
<slot name="Nav" />
<slot /> <slot />
<slot name="SideNav" />
</header> </header>

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

@ -7,6 +7,10 @@ export { default as SideNavItems } from './SideNav/SideNavItems.svelte';
export { default as SideNavLink } from './SideNav/SideNavLink.svelte'; export { default as SideNavLink } from './SideNav/SideNavLink.svelte';
export { default as SideNavMenu } from './SideNav/SideNavMenu.svelte'; export { default as SideNavMenu } from './SideNav/SideNavMenu.svelte';
export { default as SideNavMenuItem } from './SideNav/SideNavMenuItem.svelte'; export { default as SideNavMenuItem } from './SideNav/SideNavMenuItem.svelte';
export { default as UIShellNav } from './UIShellShellNav/UIShellNav.svelte'; export { default as HeaderNavl } from './GlobalHeader/HeaderNavl.svelte';
export { default as UIShellNavItem } from './UIShellShellNav/UIShellNavItem.svelte'; export { default as HeaderNavItem } from './GlobalHeader/HeaderNavItem.svelte';
export { default as UIShellNavSubMenu } from './UIShellShellNav/UIShellNavSubMenu.svelte'; export { default as HeaderNavMenu } from './GlobalHeader/HeaderNavMenu.svelte';
export { default as HeaderUtilities } from './GlobalHeader/HeaderUtilities.svelte';
export { default as HeaderAction } from './GlobalHeader/HeaderAction.svelte';
export { default as HeaderActionLink } from './GlobalHeader/HeaderActionLink.svelte';
export { default as HeaderActionSearch } from './GlobalHeader/HeaderActionSearch.svelte';

20
src/index.js
View file

@ -84,9 +84,13 @@ import UIShell, {
SideNavLink, SideNavLink,
SideNavMenu, SideNavMenu,
SideNavMenuItem, SideNavMenuItem,
UIShellNav, HeaderNav,
UIShellNavItem, HeaderNavItem,
UIShellNavSubMenu HeaderNavMenu,
HeaderUtilities,
HeaderAction,
HeaderActionLink,
HeaderActionSearch
} from './components/UIShell'; } from './components/UIShell';
import UnorderedList from './components/UnorderedList'; import UnorderedList from './components/UnorderedList';
@ -208,8 +212,12 @@ export {
SideNavLink, SideNavLink,
SideNavMenu, SideNavMenu,
SideNavMenuItem, SideNavMenuItem,
UIShellNav, HeaderNav,
UIShellNavItem, HeaderNavItem,
UIShellNavSubMenu, HeaderNavMenu,
HeaderUtilities,
HeaderAction,
HeaderActionLink,
HeaderActionSearch,
UnorderedList UnorderedList
}; };