-
-
Notifications
You must be signed in to change notification settings - Fork 1.3k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
d3fcd8d
commit 5e2ba03
Showing
9 changed files
with
388 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,57 @@ | ||
import React, { PropTypes } from 'react'; | ||
import classNames from 'classnames'; | ||
|
||
const propTypes = { | ||
inline: PropTypes.bool, | ||
disabled: PropTypes.bool, | ||
tabs: PropTypes.bool, | ||
pills: PropTypes.bool, | ||
stacked: PropTypes.bool, | ||
navbar: PropTypes.bool, | ||
tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]) | ||
}; | ||
|
||
const defaultProps = { | ||
tag: 'ul' | ||
}; | ||
|
||
class Nav extends React.Component { | ||
constructor(props) { | ||
super(props); | ||
} | ||
|
||
render() { | ||
const { | ||
className, | ||
tabs, | ||
pills, | ||
inline, | ||
stacked, | ||
navbar, | ||
tag: Tag, | ||
...attributes | ||
} = this.props; | ||
|
||
const classes = classNames( | ||
className, | ||
'nav', | ||
{ | ||
'navbar-nav': navbar, | ||
'nav-tabs': tabs, | ||
'nav-pills': pills, | ||
'nav-inline': inline, | ||
'nav-stacked': stacked, | ||
'disabled': attributes.disabled | ||
} | ||
); | ||
|
||
return ( | ||
<Tag {...attributes} className={classes}/> | ||
); | ||
} | ||
} | ||
|
||
Nav.propTypes = propTypes; | ||
Nav.defaultProps = defaultProps; | ||
|
||
export default Nav; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,40 @@ | ||
import React, { PropTypes } from 'react'; | ||
import classNames from 'classnames'; | ||
import Dropdown from './Dropdown'; | ||
|
||
const propTypes = { | ||
children: PropTypes.node, | ||
tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]) | ||
}; | ||
|
||
const defaultProps = { | ||
tag: 'li' | ||
}; | ||
|
||
class NavDropdown extends React.Component { | ||
constructor(props) { | ||
super(props); | ||
} | ||
|
||
render() { | ||
const { | ||
className, | ||
tag: Tag, | ||
...attributes | ||
} = this.props; | ||
|
||
const classes = classNames( | ||
className, | ||
'nav-item' | ||
); | ||
|
||
return ( | ||
<Dropdown {...attributes} tag={Tag} className={classes} /> | ||
); | ||
} | ||
} | ||
|
||
NavDropdown.propTypes = propTypes; | ||
NavDropdown.defaultProps = defaultProps; | ||
|
||
export default NavDropdown; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,34 @@ | ||
import React, { PropTypes } from 'react'; | ||
import classNames from 'classnames'; | ||
|
||
const propTypes = { | ||
tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]) | ||
}; | ||
|
||
const defaultProps = { | ||
tag: 'li' | ||
}; | ||
|
||
class NavItem extends React.Component { | ||
render() { | ||
const { | ||
className, | ||
tag: Tag, | ||
...attributes | ||
} = this.props; | ||
|
||
const classes = classNames( | ||
className, | ||
'nav-item' | ||
); | ||
|
||
return ( | ||
<Tag {...attributes} className={classes}/> | ||
); | ||
} | ||
} | ||
|
||
NavItem.propTypes = propTypes; | ||
NavItem.defaultProps = defaultProps; | ||
|
||
export default NavItem; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,61 @@ | ||
import React, { PropTypes } from 'react'; | ||
import classNames from 'classnames'; | ||
|
||
const propTypes = { | ||
tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), | ||
disabled: PropTypes.bool, | ||
active: PropTypes.bool | ||
}; | ||
|
||
const defaultProps = { | ||
tag: 'a' | ||
}; | ||
|
||
class NavLink extends React.Component { | ||
constructor(props) { | ||
super(props); | ||
|
||
this.onClick = this.onClick.bind(this); | ||
} | ||
|
||
onClick(e) { | ||
if (this.props.disabled) { | ||
return e.preventDefault(); | ||
} | ||
|
||
if (this.props.href === '#') { | ||
e.preventDefault(); | ||
} | ||
|
||
if (this.props.onClick) { | ||
this.props.onClick(e); | ||
} | ||
} | ||
|
||
render() { | ||
let { | ||
className, | ||
active, | ||
tag: Tag, | ||
...attributes | ||
} = this.props; | ||
|
||
const classes = classNames( | ||
className, | ||
'nav-link', | ||
{ | ||
'disabled': attributes.disabled, | ||
'active': active | ||
} | ||
); | ||
|
||
return ( | ||
<Tag {...attributes} onClick={this.onClick} className={classes} /> | ||
); | ||
} | ||
} | ||
|
||
NavLink.propTypes = propTypes; | ||
NavLink.defaultProps = defaultProps; | ||
|
||
export default NavLink; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,31 @@ | ||
/* eslint react/no-multi-comp: 0, react/prop-types: 0 */ | ||
import React from 'react'; | ||
import { shallow } from 'enzyme'; | ||
import { Nav } from 'reactstrap';; | ||
|
||
describe('Nav', () => { | ||
it('should render .nav markup', () => { | ||
const wrapper = shallow(<Nav/>); | ||
|
||
expect(wrapper.html()).toBe('<ul class="nav"></ul>'); | ||
}); | ||
|
||
it('should render custom tag', () => { | ||
const wrapper = shallow(<Nav tag="nav"/>); | ||
|
||
expect(wrapper.html()).toBe('<nav class="nav"></nav>'); | ||
}); | ||
|
||
it('should render children', () => { | ||
const wrapper = shallow(<Nav>Children</Nav>); | ||
|
||
expect(wrapper.html()).toBe('<ul class="nav">Children</ul>'); | ||
}); | ||
|
||
it('should pass additional classNames', () => { | ||
const wrapper = shallow(<Nav className="extra"/>); | ||
|
||
expect(wrapper.hasClass('extra')).toBe(true); | ||
expect(wrapper.hasClass('nav')).toBe(true); | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,39 @@ | ||
/* eslint react/no-multi-comp: 0, react/prop-types: 0 */ | ||
import React from 'react'; | ||
import { mount } from 'enzyme'; | ||
import { NavDropdown, DropdownToggle, DropdownMenu, DropdownItem } from 'reactstrap';; | ||
|
||
|
||
describe('NavDropdown', () => { | ||
let isOpen; | ||
let toggle; | ||
|
||
beforeEach(() => { | ||
isOpen = false; | ||
toggle = () => isOpen = !isOpen; | ||
}); | ||
|
||
it('should render a single child', () => { | ||
const wrapper = mount(<NavDropdown isOpen={isOpen} toggle={toggle}>Ello world</NavDropdown>); | ||
|
||
expect(wrapper.text()).toBe('Ello world'); | ||
expect(wrapper.find('.nav-item').length).toBe(1); | ||
}); | ||
|
||
it('should render multiple children when isOpen', () => { | ||
isOpen = true; | ||
const wrapper = mount( | ||
<NavDropdown isOpen={isOpen} toggle={toggle}> | ||
<DropdownToggle>Toggle</DropdownToggle> | ||
<DropdownMenu> | ||
<DropdownItem>Test</DropdownItem> | ||
</DropdownMenu> | ||
</NavDropdown> | ||
); | ||
|
||
expect(wrapper.find('.btn').text()).toBe('Toggle'); | ||
expect(wrapper.find('.nav-item').length).toBe(1); | ||
expect(wrapper.find('.dropdown-item').length).toBe(1); | ||
expect(wrapper.children().length).toBe(2); | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,31 @@ | ||
/* eslint react/no-multi-comp: 0, react/prop-types: 0 */ | ||
import React from 'react'; | ||
import { shallow } from 'enzyme'; | ||
import { NavItem } from 'reactstrap';; | ||
|
||
describe('NavItem', () => { | ||
it('should render .nav-item markup', () => { | ||
const wrapper = shallow(<NavItem/>); | ||
|
||
expect(wrapper.html()).toBe('<li class="nav-item"></li>'); | ||
}); | ||
|
||
it('should render custom tag', () => { | ||
const wrapper = shallow(<NavItem tag="div"/>); | ||
|
||
expect(wrapper.html()).toBe('<div class="nav-item"></div>'); | ||
}); | ||
|
||
it('sholid render children', () => { | ||
const wrapper = shallow(<NavItem>Children</NavItem>); | ||
|
||
expect(wrapper.html()).toBe('<li class="nav-item">Children</li>'); | ||
}); | ||
|
||
it('should pass additional classNames', () => { | ||
const wrapper = shallow(<NavItem className="extra"/>); | ||
|
||
expect(wrapper.hasClass('extra')).toBe(true); | ||
expect(wrapper.hasClass('nav-item')).toBe(true); | ||
}); | ||
}); |
Oops, something went wrong.