@propellerads/header

![size](https://img.shields.io/bundlephobia/min/@propellerads/header.svg) ![](https://img.shields.io/npm/v/@propellerads/header.svg?style=flat-square)

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
@propellerads/header
4.2.1a year ago3 years agoMinified + gzip package size for @propellerads/header in KB

Readme

Header
size
NPM | Github

Installation

  • yarn add @propellerads/header or npm install @propellerads/header -S

How to use

  • import Header from '@propellerads/header';
  • And render
<Header
    theme={themes[theme]}
    logo={logo}
    sidebarButton={SidebarButton}
>
    <Header.HeaderBalance
        balance={123456789.99}
        dailyEarned={newDailyEarned}
    />

    <Header.HeaderItem
        onClick={() => alert('Single notification has been shown')}
        component={customComponent}
    />

    <Header.HeaderDivider />

    <Header.HeaderItem icon={<Case size={SIZE.MEDIUM_SMALL} color={COLOR.GRAY}/>}>
        <Header.HeaderDropdown>
            {customDropDownContent}
        </Header.HeaderDropdown>
    </Header.HeaderItem>

    <Header.HeaderDivider />

    <Header.HeaderItem
        isRightDropdown
        title="Some text"
        icon={<User size={SIZE.MEDIUM_SMALL} color={COLOR.GRAY}/>}
    >
        <Header.HeaderDropdown>
            <Header.HeaderDropdownList items={userMenu} />
        </Header.HeaderDropdown>
    </Header.HeaderItem>
</Header>