diff --git a/demo.cjsx b/demo.cjsx
index bfab290..609593f 100644
--- a/demo.cjsx
+++ b/demo.cjsx
@@ -1,4 +1,5 @@
React = require 'react'
+ReactDOM = require 'react-dom'
Demo = require './src/components/demo'
{startMathJax} = require './src/helpers/mathjax'
@@ -10,7 +11,7 @@ loadApp = ->
mainDiv = document.createElement('div')
mainDiv.id = 'react-root-container'
document.body.appendChild(mainDiv)
- React.render(, mainDiv)
+ ReactDOM.render(, mainDiv)
true
loadApp() or document.addEventListener('readystatechange', loadApp)
diff --git a/package.json b/package.json
index f72e5dd..134ebab 100644
--- a/package.json
+++ b/package.json
@@ -21,7 +21,7 @@
},
"homepage": "https://github.com/openstax/react-components",
"dependencies": {
- "bootstrap": "3.3.5",
+ "bootstrap": "3.3.6",
"camelcase": "1.2.1",
"classnames": "2.1.5",
"eventemitter2": "0.4.14",
@@ -49,7 +49,7 @@
"extract-text-webpack-plugin": "0.8.2",
"file-exists": "0.1.1",
"file-loader": "0.8.4",
- "fixed-data-table": "0.4.1",
+ "fixed-data-table": "0.6.0",
"gulp": "3.9.0",
"gulp-coffeelint": "0.4.0",
"gulp-env": "0.2.0",
@@ -77,8 +77,10 @@
"lodash": "3.10.1",
"mocha": "2.2.5",
"phantomjs": "1.9.18",
- "react": "0.13.1",
- "react-bootstrap": ">=0.23.0 <=0.26.2",
+ "react": "0.14.8",
+ "react-dom": "0.14.8",
+ "react-addons-test-utils": "0.14.8",
+ "react-bootstrap": "0.28.2",
"react-hot-loader": "1.3.0",
"react-scroll-components": "0.2.2",
"selenium-webdriver": "2.47.0",
@@ -92,11 +94,6 @@
"webpack-umd-external": "1.0.2",
"when": "3.7.3"
},
- "peerDependencies": {
- "react": "^0.13.1",
- "react-bootstrap": ">=0.23.0 <=0.26.2",
- "react-scroll-components": "^0.2.2"
- },
"config": {
"blanket": {
"pattern": "src"
diff --git a/resources/styles/globals/openstax-bootstrap.less b/resources/styles/globals/openstax-bootstrap.less
index 0b535c8..ded8e78 100644
--- a/resources/styles/globals/openstax-bootstrap.less
+++ b/resources/styles/globals/openstax-bootstrap.less
@@ -21,22 +21,22 @@
@import "@{bootstrap-path}/dropdowns";
@import "@{bootstrap-path}/button-groups";
@import "@{bootstrap-path}/input-groups";
-// @import "@{bootstrap-path}/navs";
-// @import "@{bootstrap-path}/navbar";
+@import "@{bootstrap-path}/navs";
+@import "@{bootstrap-path}/navbar";
// @import "@{bootstrap-path}/breadcrumbs";
// @import "@{bootstrap-path}/pagination";
// @import "@{bootstrap-path}/pager";
-// @import "@{bootstrap-path}/labels";
-// @import "@{bootstrap-path}/badges";
+@import "@{bootstrap-path}/labels";
+@import "@{bootstrap-path}/badges";
// @import "@{bootstrap-path}/jumbotron";
-// @import "@{bootstrap-path}/thumbnails";
+@import "@{bootstrap-path}/thumbnails";
@import "@{bootstrap-path}/alerts";
@import "@{bootstrap-path}/progress-bars";
-// @import "@{bootstrap-path}/media";
+@import "@{bootstrap-path}/media";
@import "@{bootstrap-path}/list-group";
@import "@{bootstrap-path}/panels";
@import "@{bootstrap-path}/responsive-embed";
-// @import "@{bootstrap-path}/wells";
+@import "@{bootstrap-path}/wells";
@import "@{bootstrap-path}/close";
// Components w/ JavaScript
diff --git a/src/components/exercise/mode.cjsx b/src/components/exercise/mode.cjsx
index f06dc07..4f626f2 100644
--- a/src/components/exercise/mode.cjsx
+++ b/src/components/exercise/mode.cjsx
@@ -1,4 +1,5 @@
React = require 'react'
+ReactDOM = require 'react-dom'
_ = require 'underscore'
ArbitraryHtmlAndMath = require '../html'
@@ -45,10 +46,10 @@ ExMode = React.createClass
focusBox: ->
{focus, mode} = @props
- @refs.freeResponse?.getDOMNode?().focus?() if focus and mode is 'free-response'
+ ReactDOM.findDOMNode(@refs.freeResponse)?.focus?() if focus and mode is 'free-response'
onFreeResponseChange: ->
- freeResponse = @refs.freeResponse?.getDOMNode()?.value
+ freeResponse = ReactDOM.findDOMNode(@refs.freeResponse)?.value
if freeResponse.length <= RESPONSE_CHAR_LIMIT
@setState({freeResponse})
@props.onFreeResponseChange?(freeResponse)
diff --git a/src/components/exercise/step-card.cjsx b/src/components/exercise/step-card.cjsx
index fd4b49e..25911c0 100644
--- a/src/components/exercise/step-card.cjsx
+++ b/src/components/exercise/step-card.cjsx
@@ -1,4 +1,4 @@
-React = require 'react/addons'
+React = require 'react'
_ = require 'underscore'
classnames = require 'classnames'
@@ -135,7 +135,7 @@ ExerciseStepCard = React.createClass
footerProps = _.pick(@props, props.StepFooter)
footerProps.controlButtons = controlButtons or
- footer = React.addons.cloneWithProps(footer, footerProps)
+ footer = React.cloneElement(footer, footerProps)
cardClasses = classnames 'task-step', 'openstax-exercise-card', className
diff --git a/src/components/html.cjsx b/src/components/html.cjsx
index d197d69..4d5d441 100644
--- a/src/components/html.cjsx
+++ b/src/components/html.cjsx
@@ -1,4 +1,5 @@
React = require 'react'
+ReactDOM = require 'react-dom'
_ = require 'underscore'
classnames = require 'classnames'
@@ -54,7 +55,7 @@ module.exports = React.createClass
# Perform manipulation on HTML contained inside the components node.
updateDOMNode: ->
# External links should open in a new window
- root = @getDOMNode()
+ root = ReactDOM.findDOMNode(@)
links = root.querySelectorAll('a')
_.each links, (link) ->
link.setAttribute('target', '_blank') unless link.getAttribute('href')?[0] is '#'
diff --git a/src/components/pinned-header-footer-card/index.cjsx b/src/components/pinned-header-footer-card/index.cjsx
index 409aa31..d63492b 100644
--- a/src/components/pinned-header-footer-card/index.cjsx
+++ b/src/components/pinned-header-footer-card/index.cjsx
@@ -1,4 +1,5 @@
React = require 'react'
+ReactDOM = require 'react-dom'
_ = require 'underscore'
{ScrollListenerMixin} = require 'react-scroll-components'
@@ -46,7 +47,7 @@ module.exports = React.createClass
if @props.fixedOffset?
offset = @props.fixedOffset
else if @refs.header?
- offset = @getTopPosition(@refs.header.getDOMNode())
+ offset = @getTopPosition(ReactDOM.findDOMNode(@refs.header))
offset
@@ -116,18 +117,18 @@ module.exports = React.createClass
@setState(shouldBeShy: true)
getHeaderHeight: ->
- header = @refs.header?.getDOMNode()
+ header = ReactDOM.findDOMNode(@refs.header)
headerHeight = header?.offsetHeight or 0
setOriginalContainerMargin: ->
- container = @refs.container?.getDOMNode()
+ container = ReactDOM.findDOMNode(@refs.container)
return unless container
@setState(containerMarginTop: window.getComputedStyle(container).marginTop) if window.getComputedStyle?
setContainerMargin: ->
headerHeight = @getHeaderHeight()
- container = @refs.container?.getDOMNode()
+ container = ReactDOM.findDOMNode(@refs.container)
return unless container
@setState(headerHeight: headerHeight)
diff --git a/src/components/resize-listener-mixin.cjsx b/src/components/resize-listener-mixin.cjsx
index 6527638..f26701d 100644
--- a/src/components/resize-listener-mixin.cjsx
+++ b/src/components/resize-listener-mixin.cjsx
@@ -1,4 +1,5 @@
React = require 'react'
+ReactDOM = require 'react-dom'
_ = require 'underscore'
module.exports =
@@ -41,7 +42,7 @@ module.exports =
_getComponentSize: ->
return {height: 0, width: 0} unless @isMounted()
- componentNode = @getDOMNode()
+ componentNode = ReactDOM.findDOMNode(@)
width: componentNode.offsetWidth
height: componentNode.offsetHeight
diff --git a/src/components/smart-overflow.cjsx b/src/components/smart-overflow.cjsx
index 0b232fa..be7c4ba 100644
--- a/src/components/smart-overflow.cjsx
+++ b/src/components/smart-overflow.cjsx
@@ -1,4 +1,5 @@
React = require 'react'
+ReactDOM = require 'react-dom'
_ = require 'underscore'
classnames = require 'classnames'
@@ -21,7 +22,7 @@ SmartOverflow = React.createClass
mixins: [ResizeListenerMixin]
getOffset: ->
- componentNode = @getDOMNode()
+ componentNode = ReactDOM.findDOMNode(@)
topOffset = componentNode.getBoundingClientRect().top
getTriggerHeight: ->
diff --git a/test/helpers/index.coffee b/test/helpers/index.coffee
index 1b28dc9..17ad7bc 100644
--- a/test/helpers/index.coffee
+++ b/test/helpers/index.coffee
@@ -1,7 +1,8 @@
_ = require 'underscore'
expect = chai.expect
-React = require 'react/addons'
-ReactTestUtils = React.addons.TestUtils
+React = require 'react'
+ReactDOM = require 'react-dom'
+ReactTestUtils = require 'react-addons-test-utils'
{Promise} = require 'es6-promise'
{commonActions} = require './utilities'
sandbox = null
@@ -23,7 +24,7 @@ Testing = {
promise = new Promise( (resolve, reject) ->
props = _.clone(options.props)
props._wrapped_component = component
- wrapper = React.render( React.createElement(Wrapper, props), root )
+ wrapper = ReactDOM.render( React.createElement(Wrapper, props), root )
resolve({
root,
wrapper,
@@ -34,7 +35,7 @@ Testing = {
# defer adding the then callback so it'll be called after whatever is attached after the return
_.defer -> promise.then ->
_.delay( ->
- React.unmountComponentAtNode(root)
+ ReactDOM.unmountComponentAtNode(root)
, unmountAfter )
return arguments
promise