apeman-react-header
apeman react package for header components.
Installation
$ npm install apeman-react-header --save
Demo
Live demo is hosted on GitHub Pages.
Usage
'use strict'
import React from 'react'
import {ApHeader, ApHeaderStyle} from 'apeman-react-header'
const ExampleComponent = React.createClass({
render () {
const s = this
let { state } = s
return (
<div>
<ApHeaderStyle/>
<ApHeader>
<ApHeaderLogo>MyLogo</ApHeaderLogo>
<ApHeaderTab>
<ApHeaderTabItem href='#Foo' onTap={ () => { s.selectTab('FOO') } }
selected={ state.tab === 'FOO'}>FOO</ApHeaderTabItem>
<ApHeaderTabItem href='#Bar' onTap={ () => { s.selectTab('BAR') } }
selected={ state.tab === 'BAR'}>BAR</ApHeaderTabItem>
<ApHeaderTabItem href='#Baz' onTap={ () => { s.selectTab('BAZ') } }
selected={ state.tab === 'BAZ'}>BAZ</ApHeaderTabItem>
</ApHeaderTab>
</ApHeader>
</div>
)
},
selectTab (tab) {
const s = this
s.setState({ tab: tab })
}
})
Components
ApHeaderDropdownItem
Props
Name | Type | Default | Description |
---|
ApHeaderDropdown
Props
Name | Type | Default | Description |
---|
ApHeaderLogo
Props
Name | Type | Default | Description |
---|---|---|---|
href | string | '/' |
ApHeaderMenuItem
Props
Name | Type | Default | Description |
---|
ApHeaderMenu
Props
Name | Type | Default | Description |
---|
ApHeaderStyle
Props
Name | Type | Default | Description |
---|
ApHeaderTabItem
Props
Name | Type | Default | Description |
---|
ApHeaderTab
Props
Name | Type | Default | Description |
---|
ApHeader
Props
Name | Type | Default | Description |
---|
License
This software is released under the MIT License.