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);
+ });
});