diff --git a/src/Carousel.js b/src/Carousel.js index df3b9bf486..12f682c906 100644 --- a/src/Carousel.js +++ b/src/Carousel.js @@ -2,6 +2,7 @@ import React, { cloneElement } from 'react'; import classNames from 'classnames'; import BootstrapMixin from './BootstrapMixin'; import ValidComponentChildren from './utils/ValidComponentChildren'; +import Glyphicon from './Glyphicon'; const Carousel = React.createClass({ mixins: [BootstrapMixin], @@ -17,7 +18,9 @@ const Carousel = React.createClass({ onSlideEnd: React.PropTypes.func, activeIndex: React.PropTypes.number, defaultActiveIndex: React.PropTypes.number, - direction: React.PropTypes.oneOf(['prev', 'next']) + direction: React.PropTypes.oneOf(['prev', 'next']), + prevIcon: React.PropTypes.node.isRequired, + nextIcon: React.PropTypes.node.isRequired }, getDefaultProps() { @@ -27,7 +30,9 @@ const Carousel = React.createClass({ pauseOnHover: true, wrap: true, indicators: true, - controls: true + controls: true, + prevIcon: , + nextIcon: }; }, @@ -158,7 +163,7 @@ const Carousel = React.createClass({ renderPrev() { return ( - + {this.props.prevIcon} ); }, @@ -166,7 +171,7 @@ const Carousel = React.createClass({ renderNext() { return ( - + {this.props.nextIcon} ); }, diff --git a/test/CarouselSpec.js b/test/CarouselSpec.js index b21af0bb35..3fdc82cd8c 100644 --- a/test/CarouselSpec.js +++ b/test/CarouselSpec.js @@ -112,4 +112,22 @@ describe('Carousel', function () { assert.equal(backButtons.length, 0); assert.equal(nextButtons.length, 1); }); + + it('Should allow user to specify a previous and next icon', function () { + let instance = ReactTestUtils.renderIntoDocument( + } + nextIcon={}> + Item 1 content + Item 2 content + Item 3 content + + ); + + let backButtons = ReactTestUtils.scryRenderedDOMComponentsWithClass(instance, 'ficon-left'); + let nextButtons = ReactTestUtils.scryRenderedDOMComponentsWithClass(instance, 'ficon-right'); + + assert.equal(backButtons.length, 1); + assert.equal(nextButtons.length, 1); + }); });