diff --git a/docs/build.js b/docs/build.js index a50c99c476..0e532bfdad 100644 --- a/docs/build.js +++ b/docs/build.js @@ -1,15 +1,20 @@ /* eslint no-console: 0 */ -import React from 'react'; +import fsp from 'fs-promise'; import path from 'path'; +import React from 'react'; +import ReactDOMServer from 'react-dom/server'; import Router from 'react-router'; -import routes from './src/Routes'; +import Location from 'react-router/lib/Location'; + import Root from './src/Root'; -import fsp from 'fs-promise'; -import { copy } from '../tools/fs-utils'; -import { exec } from '../tools/exec'; +import routes from './src/Routes'; + import metadata from './generate-metadata'; +import {copy} from '../tools/fs-utils'; +import {exec} from '../tools/exec'; + const repoRoot = path.resolve(__dirname, '../'); const docsBuilt = path.join(repoRoot, 'docs-built'); @@ -24,12 +29,14 @@ const readmeDest = path.join(docsBuilt, 'README.md'); * @return {Promise} promise * @internal */ -function generateHTML(fileName, propData) { - return new Promise((resolve, reject) => { +function generateHTML(fileName) { + return new Promise((resolve) => { const urlSlug = fileName === 'index.html' ? '/' : `/${fileName}`; - Router.run(routes, urlSlug, Handler => { - let html = React.renderToString(React.createElement(Handler, { propData })); + Router.run(routes, new Location(urlSlug), (error, initialState) => { + let html = ReactDOMServer.renderToString( + + ); html = '' + html; let write = fsp.writeFile(path.join(docsBuilt, fileName), html); resolve(write); @@ -46,8 +53,10 @@ export default function BuildDocs({dev}) { .then(() => fsp.mkdir(docsBuilt)) .then(metadata) .then(propData => { + Root.assetBaseUrl = ''; + Root.propData = propData; - let pagesGenerators = Root.getPages().map( page => generateHTML(page, propData)); + const pagesGenerators = Root.getPages().map(generateHTML); return Promise.all(pagesGenerators.concat([ exec(`webpack --config webpack.docs.js --bail ${devOption}`), diff --git a/docs/client.js b/docs/client.js index c48d2b1628..6db4d238ca 100644 --- a/docs/client.js +++ b/docs/client.js @@ -1,28 +1,36 @@ +import CodeMirror from 'codemirror'; +import 'codemirror/addon/runmode/runmode'; +import 'codemirror/mode/htmlmixed/htmlmixed'; +import 'codemirror/mode/javascript/javascript'; +import React from 'react'; +import ReactDOM from 'react-dom'; +import {Router} from 'react-router'; +import {history} from 'react-router/lib/BrowserHistory'; + +import Root from './src/Root'; +import routes from './src/Routes'; + import 'bootstrap/less/bootstrap.less'; + import './assets/docs.css'; import './assets/style.css'; +import 'codemirror/lib/codemirror.css'; +import 'codemirror/theme/solarized.css'; +import './assets/CodeMirror.css'; + import './assets/carousel.png'; import './assets/logo.png'; import './assets/favicon.ico'; import './assets/thumbnail.png'; import './assets/thumbnaildiv.png'; -import 'codemirror/mode/htmlmixed/htmlmixed'; -import 'codemirror/mode/javascript/javascript'; -import 'codemirror/theme/solarized.css'; -import 'codemirror/lib/codemirror.css'; -import './assets/CodeMirror.css'; - -import React from 'react'; -import CodeMirror from 'codemirror'; -import 'codemirror/addon/runmode/runmode'; -import Router from 'react-router'; -import routes from './src/Routes'; - global.CodeMirror = CodeMirror; -Router.run(routes, Router.RefreshLocation, Handler => { - React.render( - React.createElement(Handler, window.INITIAL_PROPS), document); -}); +Root.assetBaseUrl = window.ASSET_BASE_URL; +Root.propData = window.PROP_DATA; + +ReactDOM.render( + , + document +); diff --git a/docs/examples/.eslintrc b/docs/examples/.eslintrc index 00c22821a7..3aaeccb03b 100644 --- a/docs/examples/.eslintrc +++ b/docs/examples/.eslintrc @@ -6,6 +6,7 @@ "globals": { "mountNode", "React", + "ReactDOM", "classNames", "Accordion", "Alert", diff --git a/docs/examples/AlertAutoDismissable.js b/docs/examples/AlertAutoDismissable.js index e2c2aa6537..6bed109133 100644 --- a/docs/examples/AlertAutoDismissable.js +++ b/docs/examples/AlertAutoDismissable.js @@ -29,4 +29,4 @@ const AlertAutoDismissable = React.createClass({ } }); -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/AlertBasic.js b/docs/examples/AlertBasic.js index d760ccdf50..981604b2cf 100644 --- a/docs/examples/AlertBasic.js +++ b/docs/examples/AlertBasic.js @@ -4,4 +4,4 @@ const alertInstance = ( ); -React.render(alertInstance, mountNode); +ReactDOM.render(alertInstance, mountNode); diff --git a/docs/examples/AlertDismissable.js b/docs/examples/AlertDismissable.js index 6c8d7342c3..1bfc4a365d 100644 --- a/docs/examples/AlertDismissable.js +++ b/docs/examples/AlertDismissable.js @@ -34,4 +34,4 @@ const AlertDismissable = React.createClass({ } }); -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/Badge.js b/docs/examples/Badge.js index 5ff6bdf7ea..033236bc3c 100644 --- a/docs/examples/Badge.js +++ b/docs/examples/Badge.js @@ -2,4 +2,4 @@ const badgeInstance = (

Badges 42

); -React.render(badgeInstance, mountNode); +ReactDOM.render(badgeInstance, mountNode); diff --git a/docs/examples/ButtonActive.js b/docs/examples/ButtonActive.js index 3faf267ad3..19f96b9a4a 100644 --- a/docs/examples/ButtonActive.js +++ b/docs/examples/ButtonActive.js @@ -5,4 +5,4 @@ const buttonsInstance = ( ); -React.render(buttonsInstance, mountNode); +ReactDOM.render(buttonsInstance, mountNode); diff --git a/docs/examples/ButtonBlock.js b/docs/examples/ButtonBlock.js index 8a222c6c7b..a7d632b3c7 100644 --- a/docs/examples/ButtonBlock.js +++ b/docs/examples/ButtonBlock.js @@ -7,4 +7,4 @@ const buttonsInstance = ( ); -React.render(buttonsInstance, mountNode); +ReactDOM.render(buttonsInstance, mountNode); diff --git a/docs/examples/ButtonDisabled.js b/docs/examples/ButtonDisabled.js index b7baf70abc..25c8510aa9 100644 --- a/docs/examples/ButtonDisabled.js +++ b/docs/examples/ButtonDisabled.js @@ -5,4 +5,4 @@ const buttonsInstance = ( ); -React.render(buttonsInstance, mountNode); +ReactDOM.render(buttonsInstance, mountNode); diff --git a/docs/examples/ButtonGroupBasic.js b/docs/examples/ButtonGroupBasic.js index 68d0014637..b7214a5ced 100644 --- a/docs/examples/ButtonGroupBasic.js +++ b/docs/examples/ButtonGroupBasic.js @@ -6,4 +6,4 @@ const buttonGroupInstance = ( ); -React.render(buttonGroupInstance, mountNode); +ReactDOM.render(buttonGroupInstance, mountNode); diff --git a/docs/examples/ButtonGroupBlock.js b/docs/examples/ButtonGroupBlock.js index 5ae4feca1e..6cc6dcd486 100644 --- a/docs/examples/ButtonGroupBlock.js +++ b/docs/examples/ButtonGroupBlock.js @@ -5,4 +5,4 @@ const buttonGroupInstance = ( ); -React.render(buttonGroupInstance, mountNode); +ReactDOM.render(buttonGroupInstance, mountNode); diff --git a/docs/examples/ButtonGroupJustified.js b/docs/examples/ButtonGroupJustified.js index 989cf46ddf..36ad7dd29f 100644 --- a/docs/examples/ButtonGroupJustified.js +++ b/docs/examples/ButtonGroupJustified.js @@ -9,4 +9,4 @@ const buttonGroupInstance = ( ); -React.render(buttonGroupInstance, mountNode); +ReactDOM.render(buttonGroupInstance, mountNode); diff --git a/docs/examples/ButtonGroupNested.js b/docs/examples/ButtonGroupNested.js index e1a9e1eb9d..5db246400a 100644 --- a/docs/examples/ButtonGroupNested.js +++ b/docs/examples/ButtonGroupNested.js @@ -9,4 +9,4 @@ const buttonGroupInstance = ( ); -React.render(buttonGroupInstance, mountNode); +ReactDOM.render(buttonGroupInstance, mountNode); diff --git a/docs/examples/ButtonGroupSizes.js b/docs/examples/ButtonGroupSizes.js index 4377cb3d9c..69abd7eb4a 100644 --- a/docs/examples/ButtonGroupSizes.js +++ b/docs/examples/ButtonGroupSizes.js @@ -34,4 +34,4 @@ const buttonGroupInstance = ( ); -React.render(buttonGroupInstance, mountNode); +ReactDOM.render(buttonGroupInstance, mountNode); diff --git a/docs/examples/ButtonGroupVertical.js b/docs/examples/ButtonGroupVertical.js index 9453906974..04dcbf92ef 100644 --- a/docs/examples/ButtonGroupVertical.js +++ b/docs/examples/ButtonGroupVertical.js @@ -19,4 +19,4 @@ const buttonGroupInstance = ( ); -React.render(buttonGroupInstance, mountNode); +ReactDOM.render(buttonGroupInstance, mountNode); diff --git a/docs/examples/ButtonInput.js b/docs/examples/ButtonInput.js index e1c64bdfb2..e560d9cd56 100644 --- a/docs/examples/ButtonInput.js +++ b/docs/examples/ButtonInput.js @@ -41,4 +41,4 @@ const ButtonInputExample = React.createClass({ } }); -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/ButtonLoading.js b/docs/examples/ButtonLoading.js index ac7797b0ed..2f704f7a25 100644 --- a/docs/examples/ButtonLoading.js +++ b/docs/examples/ButtonLoading.js @@ -29,4 +29,4 @@ const LoadingButton = React.createClass({ } }); -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/ButtonSizes.js b/docs/examples/ButtonSizes.js index 41b18b0d11..2adb620dfd 100644 --- a/docs/examples/ButtonSizes.js +++ b/docs/examples/ButtonSizes.js @@ -19,4 +19,4 @@ const buttonsInstance = ( ); -React.render(buttonsInstance, mountNode); +ReactDOM.render(buttonsInstance, mountNode); diff --git a/docs/examples/ButtonTagTypes.js b/docs/examples/ButtonTagTypes.js index 8b7b4862a3..325ed3e820 100644 --- a/docs/examples/ButtonTagTypes.js +++ b/docs/examples/ButtonTagTypes.js @@ -5,4 +5,4 @@ const buttonsInstance = ( ); -React.render(buttonsInstance, mountNode); +ReactDOM.render(buttonsInstance, mountNode); diff --git a/docs/examples/ButtonToolbarBasic.js b/docs/examples/ButtonToolbarBasic.js index 8e2d828fa9..1b75de7ffa 100644 --- a/docs/examples/ButtonToolbarBasic.js +++ b/docs/examples/ButtonToolbarBasic.js @@ -19,4 +19,4 @@ const buttonGroupInstance = ( ); -React.render(buttonGroupInstance, mountNode); +ReactDOM.render(buttonGroupInstance, mountNode); diff --git a/docs/examples/ButtonTypes.js b/docs/examples/ButtonTypes.js index 84839aa31a..31c11a3e2f 100644 --- a/docs/examples/ButtonTypes.js +++ b/docs/examples/ButtonTypes.js @@ -23,4 +23,4 @@ const buttonsInstance = ( ); -React.render(buttonsInstance, mountNode); +ReactDOM.render(buttonsInstance, mountNode); diff --git a/docs/examples/CarouselControlled.js b/docs/examples/CarouselControlled.js index 2670a6de3a..326374f4bc 100644 --- a/docs/examples/CarouselControlled.js +++ b/docs/examples/CarouselControlled.js @@ -43,4 +43,4 @@ const ControlledCarousel = React.createClass({ } }); -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/CarouselUncontrolled.js b/docs/examples/CarouselUncontrolled.js index 23e5ce60d0..aa9d8660fb 100644 --- a/docs/examples/CarouselUncontrolled.js +++ b/docs/examples/CarouselUncontrolled.js @@ -24,4 +24,4 @@ const carouselInstance = ( ); -React.render(carouselInstance, mountNode); +ReactDOM.render(carouselInstance, mountNode); diff --git a/docs/examples/Collapse.js b/docs/examples/Collapse.js index c30069d8d0..25119c0e45 100644 --- a/docs/examples/Collapse.js +++ b/docs/examples/Collapse.js @@ -25,4 +25,4 @@ class Example extends React.Component { } } -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/CollapsibleNav.js b/docs/examples/CollapsibleNav.js index 2d04d65fc8..c3174b82cd 100644 --- a/docs/examples/CollapsibleNav.js +++ b/docs/examples/CollapsibleNav.js @@ -20,4 +20,4 @@ const navbarInstance = ( ); -React.render(navbarInstance, mountNode); +ReactDOM.render(navbarInstance, mountNode); diff --git a/docs/examples/DropdownButtonBasic.js b/docs/examples/DropdownButtonBasic.js index 4afc050a00..fd65b51ef1 100644 --- a/docs/examples/DropdownButtonBasic.js +++ b/docs/examples/DropdownButtonBasic.js @@ -16,4 +16,4 @@ const buttonsInstance = ( {BUTTONS.map(renderDropdownButton)} ); -React.render(buttonsInstance, mountNode); +ReactDOM.render(buttonsInstance, mountNode); diff --git a/docs/examples/DropdownButtonNoCaret.js b/docs/examples/DropdownButtonNoCaret.js index 381127b542..3606e37d0d 100644 --- a/docs/examples/DropdownButtonNoCaret.js +++ b/docs/examples/DropdownButtonNoCaret.js @@ -10,4 +10,4 @@ const buttonInstance = ( ); -React.render(buttonInstance, mountNode); +ReactDOM.render(buttonInstance, mountNode); diff --git a/docs/examples/DropdownButtonSizes.js b/docs/examples/DropdownButtonSizes.js index 9aeb15920d..16a635b1f4 100644 --- a/docs/examples/DropdownButtonSizes.js +++ b/docs/examples/DropdownButtonSizes.js @@ -32,4 +32,4 @@ const buttonsInstance = ( ); -React.render(buttonsInstance, mountNode); +ReactDOM.render(buttonsInstance, mountNode); diff --git a/docs/examples/Fade.js b/docs/examples/Fade.js index 2583412829..df5f0ec95c 100644 --- a/docs/examples/Fade.js +++ b/docs/examples/Fade.js @@ -26,4 +26,4 @@ class Example extends React.Component { } } -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/Glyphicon.js b/docs/examples/Glyphicon.js index cc0d3fa2ce..dceae99dfd 100644 --- a/docs/examples/Glyphicon.js +++ b/docs/examples/Glyphicon.js @@ -19,4 +19,4 @@ const glyphInstance = ( ); -React.render(glyphInstance, mountNode); +ReactDOM.render(glyphInstance, mountNode); diff --git a/docs/examples/GridBasic.js b/docs/examples/GridBasic.js index 6f6f063234..a50c512dc0 100644 --- a/docs/examples/GridBasic.js +++ b/docs/examples/GridBasic.js @@ -22,4 +22,4 @@ const navInstance = ( ); -React.render(navInstance, mountNode); +ReactDOM.render(navInstance, mountNode); diff --git a/docs/examples/Input.js b/docs/examples/Input.js index 980413339a..0d61f5a7f4 100644 --- a/docs/examples/Input.js +++ b/docs/examples/Input.js @@ -38,4 +38,4 @@ const ExampleInput = React.createClass({ } }); -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/InputAddons.js b/docs/examples/InputAddons.js index d2bbb6c76a..2dcc7f7228 100644 --- a/docs/examples/InputAddons.js +++ b/docs/examples/InputAddons.js @@ -21,4 +21,4 @@ const inputAddonsInstance = ( ); -React.render(inputAddonsInstance, mountNode); +ReactDOM.render(inputAddonsInstance, mountNode); diff --git a/docs/examples/InputHorizontal.js b/docs/examples/InputHorizontal.js index 80ef6627b0..26bebeb255 100644 --- a/docs/examples/InputHorizontal.js +++ b/docs/examples/InputHorizontal.js @@ -6,4 +6,4 @@ const inputHorizontalInstance = ( ); -React.render(inputHorizontalInstance, mountNode); +ReactDOM.render(inputHorizontalInstance, mountNode); diff --git a/docs/examples/InputSizes.js b/docs/examples/InputSizes.js index a36ffaedae..80a7ff6815 100644 --- a/docs/examples/InputSizes.js +++ b/docs/examples/InputSizes.js @@ -6,4 +6,4 @@ const inputSizeInstance = ( ); -React.render(inputSizeInstance, mountNode); +ReactDOM.render(inputSizeInstance, mountNode); diff --git a/docs/examples/InputTypes.js b/docs/examples/InputTypes.js index 63a418e8a7..1843110c5a 100644 --- a/docs/examples/InputTypes.js +++ b/docs/examples/InputTypes.js @@ -21,4 +21,4 @@ const inputTypeInstance = ( ); -React.render(inputTypeInstance, mountNode); +ReactDOM.render(inputTypeInstance, mountNode); diff --git a/docs/examples/InputValidation.js b/docs/examples/InputValidation.js index 9ec927ba47..4e69b02c09 100644 --- a/docs/examples/InputValidation.js +++ b/docs/examples/InputValidation.js @@ -6,4 +6,4 @@ const inputValidationInstance = ( ); -React.render(inputValidationInstance, mountNode); +ReactDOM.render(inputValidationInstance, mountNode); diff --git a/docs/examples/InputWrapper.js b/docs/examples/InputWrapper.js index ba305b2e55..ca036b88b0 100644 --- a/docs/examples/InputWrapper.js +++ b/docs/examples/InputWrapper.js @@ -11,4 +11,4 @@ const inputWrapperInstance = ( ); -React.render(inputWrapperInstance, mountNode); +ReactDOM.render(inputWrapperInstance, mountNode); diff --git a/docs/examples/Jumbotron.js b/docs/examples/Jumbotron.js index 05f74d694f..6521d041cd 100644 --- a/docs/examples/Jumbotron.js +++ b/docs/examples/Jumbotron.js @@ -6,4 +6,4 @@ const jumbotronInstance = ( ); -React.render(jumbotronInstance, mountNode); +ReactDOM.render(jumbotronInstance, mountNode); diff --git a/docs/examples/Label.js b/docs/examples/Label.js index 5828481984..af733d5769 100644 --- a/docs/examples/Label.js +++ b/docs/examples/Label.js @@ -9,4 +9,4 @@ const labelInstance = ( ); -React.render(labelInstance, mountNode); +ReactDOM.render(labelInstance, mountNode); diff --git a/docs/examples/LabelVariations.js b/docs/examples/LabelVariations.js index 5cf2b5b888..d3b1b920b8 100644 --- a/docs/examples/LabelVariations.js +++ b/docs/examples/LabelVariations.js @@ -9,4 +9,4 @@ const labelVariationInstance = ( ); -React.render(labelVariationInstance, mountNode); +ReactDOM.render(labelVariationInstance, mountNode); diff --git a/docs/examples/ListGroupActive.js b/docs/examples/ListGroupActive.js index f9442f9af6..36b95d63c2 100644 --- a/docs/examples/ListGroupActive.js +++ b/docs/examples/ListGroupActive.js @@ -6,4 +6,4 @@ const listgroupInstance = ( ); -React.render(listgroupInstance, mountNode); +ReactDOM.render(listgroupInstance, mountNode); diff --git a/docs/examples/ListGroupDefault.js b/docs/examples/ListGroupDefault.js index d4fa198608..416caba0d9 100644 --- a/docs/examples/ListGroupDefault.js +++ b/docs/examples/ListGroupDefault.js @@ -6,4 +6,4 @@ const listgroupInstance = ( ); -React.render(listgroupInstance, mountNode); +ReactDOM.render(listgroupInstance, mountNode); diff --git a/docs/examples/ListGroupHeader.js b/docs/examples/ListGroupHeader.js index fc2861a4ea..cfeb50f306 100644 --- a/docs/examples/ListGroupHeader.js +++ b/docs/examples/ListGroupHeader.js @@ -6,4 +6,4 @@ const listgroupInstance = ( ); -React.render(listgroupInstance, mountNode); +ReactDOM.render(listgroupInstance, mountNode); diff --git a/docs/examples/ListGroupLinked.js b/docs/examples/ListGroupLinked.js index 794795c0bb..0227ed9f52 100644 --- a/docs/examples/ListGroupLinked.js +++ b/docs/examples/ListGroupLinked.js @@ -6,4 +6,4 @@ const listgroupInstance = ( ); -React.render(listgroupInstance, mountNode); +ReactDOM.render(listgroupInstance, mountNode); diff --git a/docs/examples/ListGroupStyle.js b/docs/examples/ListGroupStyle.js index 4dc7351088..15f2859641 100644 --- a/docs/examples/ListGroupStyle.js +++ b/docs/examples/ListGroupStyle.js @@ -7,4 +7,4 @@ const listgroupInstance = ( ); -React.render(listgroupInstance, mountNode); +ReactDOM.render(listgroupInstance, mountNode); diff --git a/docs/examples/MenuItem.js b/docs/examples/MenuItem.js index ac71bb8dce..942d6806e8 100644 --- a/docs/examples/MenuItem.js +++ b/docs/examples/MenuItem.js @@ -23,4 +23,4 @@ const MenuItems = ( ); -React.render(MenuItems, mountNode); +ReactDOM.render(MenuItems, mountNode); diff --git a/docs/examples/Modal.js b/docs/examples/Modal.js index 4a25c06f86..070b090b6e 100644 --- a/docs/examples/Modal.js +++ b/docs/examples/Modal.js @@ -64,4 +64,4 @@ const Example = React.createClass({ } }); -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/ModalContained.js b/docs/examples/ModalContained.js index aeab199ef7..cb6cb94118 100644 --- a/docs/examples/ModalContained.js +++ b/docs/examples/ModalContained.js @@ -48,4 +48,4 @@ const Trigger = React.createClass({ } }); -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/ModalCustomSizing.js b/docs/examples/ModalCustomSizing.js index d87168bd59..f5182b0e18 100644 --- a/docs/examples/ModalCustomSizing.js +++ b/docs/examples/ModalCustomSizing.js @@ -54,4 +54,4 @@ const Example = React.createClass({ } }); -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/ModalDefaultSizing.js b/docs/examples/ModalDefaultSizing.js index 19c9ffe0d3..d7aafdc2a0 100644 --- a/docs/examples/ModalDefaultSizing.js +++ b/docs/examples/ModalDefaultSizing.js @@ -76,4 +76,4 @@ const App = React.createClass({ } }); -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/ModalStatic.js b/docs/examples/ModalStatic.js index e073616bc2..304e9b9e06 100644 --- a/docs/examples/ModalStatic.js +++ b/docs/examples/ModalStatic.js @@ -19,4 +19,4 @@ const modalInstance = ( ); -React.render(modalInstance, mountNode); +ReactDOM.render(modalInstance, mountNode); diff --git a/docs/examples/NavBasic.js b/docs/examples/NavBasic.js index 893a3c9e2c..6bc5eb4d42 100644 --- a/docs/examples/NavBasic.js +++ b/docs/examples/NavBasic.js @@ -10,4 +10,4 @@ const navInstance = ( ); -React.render(navInstance, mountNode); +ReactDOM.render(navInstance, mountNode); diff --git a/docs/examples/NavDropdown.js b/docs/examples/NavDropdown.js index 5dbd3c14ad..c5c50bbb78 100644 --- a/docs/examples/NavDropdown.js +++ b/docs/examples/NavDropdown.js @@ -21,4 +21,4 @@ const NavDropdown = React.createClass({ } }); -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/NavJustified.js b/docs/examples/NavJustified.js index a3ab43b30e..4116c81a47 100644 --- a/docs/examples/NavJustified.js +++ b/docs/examples/NavJustified.js @@ -22,4 +22,4 @@ const NavJustified = React.createClass({ } }); -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/NavStacked.js b/docs/examples/NavStacked.js index b2ad7fd793..1591109e22 100644 --- a/docs/examples/NavStacked.js +++ b/docs/examples/NavStacked.js @@ -10,4 +10,4 @@ const navInstance = ( ); -React.render(navInstance, mountNode); +ReactDOM.render(navInstance, mountNode); diff --git a/docs/examples/NavbarBasic.js b/docs/examples/NavbarBasic.js index 756b6634b7..4c65d46e19 100644 --- a/docs/examples/NavbarBasic.js +++ b/docs/examples/NavbarBasic.js @@ -14,4 +14,4 @@ const navbarInstance = ( ); -React.render(navbarInstance, mountNode); +ReactDOM.render(navbarInstance, mountNode); diff --git a/docs/examples/NavbarBrand.js b/docs/examples/NavbarBrand.js index e210c5270f..65559c6ffd 100644 --- a/docs/examples/NavbarBrand.js +++ b/docs/examples/NavbarBrand.js @@ -14,4 +14,4 @@ const navbarInstance = ( ); -React.render(navbarInstance, mountNode); +ReactDOM.render(navbarInstance, mountNode); diff --git a/docs/examples/NavbarCollapsible.js b/docs/examples/NavbarCollapsible.js index 35b9564cf1..340417a6eb 100644 --- a/docs/examples/NavbarCollapsible.js +++ b/docs/examples/NavbarCollapsible.js @@ -14,4 +14,4 @@ const navbarInstance = ( ); -React.render(navbarInstance, mountNode); +ReactDOM.render(navbarInstance, mountNode); diff --git a/docs/examples/Overlay.js b/docs/examples/Overlay.js index 4f5f1b9fde..8d28cd488e 100644 --- a/docs/examples/Overlay.js +++ b/docs/examples/Overlay.js @@ -1,4 +1,3 @@ - const Example = React.createClass({ getInitialState(){ return { show: true }; @@ -14,7 +13,7 @@ const Example = React.createClass({ const sharedProps = { show: this.state.show, container: this, - target: props => React.findDOMNode(this.refs.target) + target: props => ReactDOM.findDOMNode(this.refs.target) }; return ( @@ -40,4 +39,4 @@ const Example = React.createClass({ } }); -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/OverlayCustom.js b/docs/examples/OverlayCustom.js index 20230b56c6..9f1f8e040b 100644 --- a/docs/examples/OverlayCustom.js +++ b/docs/examples/OverlayCustom.js @@ -1,4 +1,3 @@ - const Example = React.createClass({ getInitialState(){ return { show: true }; @@ -31,7 +30,7 @@ const Example = React.createClass({ onHide={() => this.setState({ show: false })} placement="right" container={this} - target={ props => React.findDOMNode(this.refs.target)} + target={ props => ReactDOM.findDOMNode(this.refs.target)} >
Holy guacamole! Check this info. @@ -42,4 +41,4 @@ const Example = React.createClass({ } }); -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/PageHeader.js b/docs/examples/PageHeader.js index 243d829e46..23678d9718 100644 --- a/docs/examples/PageHeader.js +++ b/docs/examples/PageHeader.js @@ -2,4 +2,4 @@ const pageHeaderInstance = ( Example page header Subtext for header ); -React.render(pageHeaderInstance, mountNode); +ReactDOM.render(pageHeaderInstance, mountNode); diff --git a/docs/examples/PagerAligned.js b/docs/examples/PagerAligned.js index baac751b20..432dd0daa4 100644 --- a/docs/examples/PagerAligned.js +++ b/docs/examples/PagerAligned.js @@ -5,4 +5,4 @@ const pagerInstance = ( ); -React.render(pagerInstance, mountNode); +ReactDOM.render(pagerInstance, mountNode); diff --git a/docs/examples/PagerDefault.js b/docs/examples/PagerDefault.js index b1e1929461..514a2c9172 100644 --- a/docs/examples/PagerDefault.js +++ b/docs/examples/PagerDefault.js @@ -5,4 +5,4 @@ const pagerInstance = ( ); -React.render(pagerInstance, mountNode); +ReactDOM.render(pagerInstance, mountNode); diff --git a/docs/examples/PagerDisabled.js b/docs/examples/PagerDisabled.js index 8d9ba74085..34b8a1553b 100644 --- a/docs/examples/PagerDisabled.js +++ b/docs/examples/PagerDisabled.js @@ -5,4 +5,4 @@ const pagerInstance = ( ); -React.render(pagerInstance, mountNode); +ReactDOM.render(pagerInstance, mountNode); diff --git a/docs/examples/PaginationAdvanced.js b/docs/examples/PaginationAdvanced.js index 817641efef..beee03c080 100644 --- a/docs/examples/PaginationAdvanced.js +++ b/docs/examples/PaginationAdvanced.js @@ -27,4 +27,4 @@ const PaginationAdvanced = React.createClass({ } }); -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/PaginationBasic.js b/docs/examples/PaginationBasic.js index 852188333a..e5eb2977b1 100644 --- a/docs/examples/PaginationBasic.js +++ b/docs/examples/PaginationBasic.js @@ -38,4 +38,4 @@ const PaginationBasic = React.createClass({ } }); -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/PanelBasic.js b/docs/examples/PanelBasic.js index ec5274251a..c8dfb508ed 100644 --- a/docs/examples/PanelBasic.js +++ b/docs/examples/PanelBasic.js @@ -8,4 +8,4 @@ const panelInstance = ( ); -React.render(panelInstance, mountNode); +ReactDOM.render(panelInstance, mountNode); diff --git a/docs/examples/PanelCollapsible.js b/docs/examples/PanelCollapsible.js index 51d41a1fee..48a41aba68 100644 --- a/docs/examples/PanelCollapsible.js +++ b/docs/examples/PanelCollapsible.js @@ -21,4 +21,4 @@ class Example extends React.Component { } } -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/PanelContextual.js b/docs/examples/PanelContextual.js index f404a17836..f53e9f5869 100644 --- a/docs/examples/PanelContextual.js +++ b/docs/examples/PanelContextual.js @@ -30,4 +30,4 @@ const panelsInstance = (
); -React.render(panelsInstance, mountNode); +ReactDOM.render(panelsInstance, mountNode); diff --git a/docs/examples/PanelGroupAccordion.js b/docs/examples/PanelGroupAccordion.js index 74ecc70e84..bd7511eebf 100644 --- a/docs/examples/PanelGroupAccordion.js +++ b/docs/examples/PanelGroupAccordion.js @@ -12,4 +12,4 @@ const accordionInstance = ( ); -React.render(accordionInstance, mountNode); +ReactDOM.render(accordionInstance, mountNode); diff --git a/docs/examples/PanelGroupControlled.js b/docs/examples/PanelGroupControlled.js index 054b52176d..fc8c456217 100644 --- a/docs/examples/PanelGroupControlled.js +++ b/docs/examples/PanelGroupControlled.js @@ -19,4 +19,4 @@ const ControlledPanelGroup = React.createClass({ } }); -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/PanelGroupUncontrolled.js b/docs/examples/PanelGroupUncontrolled.js index 6513d22d33..d967df18be 100644 --- a/docs/examples/PanelGroupUncontrolled.js +++ b/docs/examples/PanelGroupUncontrolled.js @@ -5,4 +5,4 @@ const panelGroupInstance = ( ); -React.render(panelGroupInstance, mountNode); +ReactDOM.render(panelGroupInstance, mountNode); diff --git a/docs/examples/PanelListGroupFill.js b/docs/examples/PanelListGroupFill.js index fcb1c94cfc..db46a771f5 100644 --- a/docs/examples/PanelListGroupFill.js +++ b/docs/examples/PanelListGroupFill.js @@ -10,4 +10,4 @@ const panelInstance = ( ); -React.render(panelInstance, mountNode); +ReactDOM.render(panelInstance, mountNode); diff --git a/docs/examples/PanelWithFooter.js b/docs/examples/PanelWithFooter.js index 642fc991f2..183ec70927 100644 --- a/docs/examples/PanelWithFooter.js +++ b/docs/examples/PanelWithFooter.js @@ -4,4 +4,4 @@ const panelInstance = ( ); -React.render(panelInstance, mountNode); +ReactDOM.render(panelInstance, mountNode); diff --git a/docs/examples/PanelWithHeading.js b/docs/examples/PanelWithHeading.js index 62cd89fb1c..79130b69a1 100644 --- a/docs/examples/PanelWithHeading.js +++ b/docs/examples/PanelWithHeading.js @@ -13,4 +13,4 @@ const panelsInstance = ( ); -React.render(panelsInstance, mountNode); +ReactDOM.render(panelsInstance, mountNode); diff --git a/docs/examples/PopoverBasic.js b/docs/examples/PopoverBasic.js index 919f68be6f..ee1ae2f1fa 100644 --- a/docs/examples/PopoverBasic.js +++ b/docs/examples/PopoverBasic.js @@ -6,4 +6,4 @@ const popoverInstance = ( ); -React.render(popoverInstance, mountNode); +ReactDOM.render(popoverInstance, mountNode); diff --git a/docs/examples/PopoverContained.js b/docs/examples/PopoverContained.js index 0ba98b3b47..1840a088be 100644 --- a/docs/examples/PopoverContained.js +++ b/docs/examples/PopoverContained.js @@ -30,4 +30,4 @@ class Example extends React.Component { } } -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/PopoverPositioned.js b/docs/examples/PopoverPositioned.js index a7cad7571b..5094640b25 100644 --- a/docs/examples/PopoverPositioned.js +++ b/docs/examples/PopoverPositioned.js @@ -15,4 +15,4 @@ const positionerInstance = ( ); -React.render(positionerInstance, mountNode); +ReactDOM.render(positionerInstance, mountNode); diff --git a/docs/examples/PopoverPositionedScrolling.js b/docs/examples/PopoverPositionedScrolling.js index beabf48d5c..83babffe7f 100644 --- a/docs/examples/PopoverPositionedScrolling.js +++ b/docs/examples/PopoverPositionedScrolling.js @@ -15,4 +15,4 @@ const positionerInstance = ( ); -React.render(positionerInstance, mountNode); +ReactDOM.render(positionerInstance, mountNode); diff --git a/docs/examples/PopoverTriggerBehaviors.js b/docs/examples/PopoverTriggerBehaviors.js index c539ee3a81..929253507b 100644 --- a/docs/examples/PopoverTriggerBehaviors.js +++ b/docs/examples/PopoverTriggerBehaviors.js @@ -15,4 +15,4 @@ const positionerInstance = ( ); -React.render(positionerInstance, mountNode); +ReactDOM.render(positionerInstance, mountNode); diff --git a/docs/examples/ProgressBarAnimated.js b/docs/examples/ProgressBarAnimated.js index 0f37928087..510aca000d 100644 --- a/docs/examples/ProgressBarAnimated.js +++ b/docs/examples/ProgressBarAnimated.js @@ -2,4 +2,4 @@ const progressInstance = ( ); -React.render(progressInstance, mountNode); +ReactDOM.render(progressInstance, mountNode); diff --git a/docs/examples/ProgressBarBasic.js b/docs/examples/ProgressBarBasic.js index e99d1f2580..6b69a8b75d 100644 --- a/docs/examples/ProgressBarBasic.js +++ b/docs/examples/ProgressBarBasic.js @@ -2,4 +2,4 @@ const progressInstance = ( ); -React.render(progressInstance, mountNode); +ReactDOM.render(progressInstance, mountNode); diff --git a/docs/examples/ProgressBarContextual.js b/docs/examples/ProgressBarContextual.js index dd6e73f382..4ecd00b2f9 100644 --- a/docs/examples/ProgressBarContextual.js +++ b/docs/examples/ProgressBarContextual.js @@ -7,4 +7,4 @@ const progressInstance = ( ); -React.render(progressInstance, mountNode); +ReactDOM.render(progressInstance, mountNode); diff --git a/docs/examples/ProgressBarScreenreaderLabel.js b/docs/examples/ProgressBarScreenreaderLabel.js index 598cb08608..06a9be12a3 100644 --- a/docs/examples/ProgressBarScreenreaderLabel.js +++ b/docs/examples/ProgressBarScreenreaderLabel.js @@ -2,4 +2,4 @@ const progressInstance = ( ); -React.render(progressInstance, mountNode); +ReactDOM.render(progressInstance, mountNode); diff --git a/docs/examples/ProgressBarStacked.js b/docs/examples/ProgressBarStacked.js index ebcccca948..334eb3c570 100644 --- a/docs/examples/ProgressBarStacked.js +++ b/docs/examples/ProgressBarStacked.js @@ -6,4 +6,4 @@ const progressInstance = ( ); -React.render(progressInstance, mountNode); +ReactDOM.render(progressInstance, mountNode); diff --git a/docs/examples/ProgressBarStriped.js b/docs/examples/ProgressBarStriped.js index b3d93c46d8..6a11d037cb 100644 --- a/docs/examples/ProgressBarStriped.js +++ b/docs/examples/ProgressBarStriped.js @@ -7,4 +7,4 @@ const progressInstance = ( ); -React.render(progressInstance, mountNode); +ReactDOM.render(progressInstance, mountNode); diff --git a/docs/examples/ProgressBarWithLabel.js b/docs/examples/ProgressBarWithLabel.js index 65be52045f..2426146825 100644 --- a/docs/examples/ProgressBarWithLabel.js +++ b/docs/examples/ProgressBarWithLabel.js @@ -2,4 +2,4 @@ const progressInstance = ( ); -React.render(progressInstance, mountNode); +ReactDOM.render(progressInstance, mountNode); diff --git a/docs/examples/SplitButtonBasic.js b/docs/examples/SplitButtonBasic.js index 4507b39a6a..61d92d036a 100644 --- a/docs/examples/SplitButtonBasic.js +++ b/docs/examples/SplitButtonBasic.js @@ -16,4 +16,4 @@ const buttonsInstance = ( {BUTTONS.map(renderDropdownButton)} ); -React.render(buttonsInstance, mountNode); +ReactDOM.render(buttonsInstance, mountNode); diff --git a/docs/examples/SplitButtonDropup.js b/docs/examples/SplitButtonDropup.js index abfe5cfe0f..57ebb977a9 100644 --- a/docs/examples/SplitButtonDropup.js +++ b/docs/examples/SplitButtonDropup.js @@ -22,4 +22,4 @@ const buttonsInstance = ( ); -React.render(buttonsInstance, mountNode); +ReactDOM.render(buttonsInstance, mountNode); diff --git a/docs/examples/SplitButtonRight.js b/docs/examples/SplitButtonRight.js index b9254720a5..9884a5983e 100644 --- a/docs/examples/SplitButtonRight.js +++ b/docs/examples/SplitButtonRight.js @@ -8,4 +8,4 @@ const buttonsInstance = ( ); -React.render(buttonsInstance, mountNode); +ReactDOM.render(buttonsInstance, mountNode); diff --git a/docs/examples/StaticText.js b/docs/examples/StaticText.js index 1b08ab93d9..9fdec6c5b7 100644 --- a/docs/examples/StaticText.js +++ b/docs/examples/StaticText.js @@ -6,4 +6,4 @@ const staticTextExample = ( ); -React.render(staticTextExample, mountNode); +ReactDOM.render(staticTextExample, mountNode); diff --git a/docs/examples/TabbedAreaControlled.js b/docs/examples/TabbedAreaControlled.js index 9e197e496f..22bce48bba 100644 --- a/docs/examples/TabbedAreaControlled.js +++ b/docs/examples/TabbedAreaControlled.js @@ -21,4 +21,4 @@ const ControlledTabArea = React.createClass({ } }); -React.render(, mountNode); +ReactDOM.render(, mountNode); diff --git a/docs/examples/TabbedAreaNoAnimation.js b/docs/examples/TabbedAreaNoAnimation.js index be5d2b4ab2..8fc5094b9b 100644 --- a/docs/examples/TabbedAreaNoAnimation.js +++ b/docs/examples/TabbedAreaNoAnimation.js @@ -6,4 +6,4 @@ const tabbedAreaInstance = ( ); -React.render(tabbedAreaInstance, mountNode); +ReactDOM.render(tabbedAreaInstance, mountNode); diff --git a/docs/examples/TabbedAreaUncontrolled.js b/docs/examples/TabbedAreaUncontrolled.js index 4b4a7dffcf..7d1b7c52ef 100644 --- a/docs/examples/TabbedAreaUncontrolled.js +++ b/docs/examples/TabbedAreaUncontrolled.js @@ -6,4 +6,4 @@ const tabbedAreaInstance = ( ); -React.render(tabbedAreaInstance, mountNode); +ReactDOM.render(tabbedAreaInstance, mountNode); diff --git a/docs/examples/TableBasic.js b/docs/examples/TableBasic.js index e99d8fdf27..c5910ebfa6 100644 --- a/docs/examples/TableBasic.js +++ b/docs/examples/TableBasic.js @@ -30,4 +30,4 @@ const tableInstance = ( ); -React.render(tableInstance, mountNode); +ReactDOM.render(tableInstance, mountNode); diff --git a/docs/examples/TableResponsive.js b/docs/examples/TableResponsive.js index 1c2f8e33cc..669d3af0c7 100644 --- a/docs/examples/TableResponsive.js +++ b/docs/examples/TableResponsive.js @@ -43,4 +43,4 @@ const tableInstance = ( ); -React.render(tableInstance, mountNode); +ReactDOM.render(tableInstance, mountNode); diff --git a/docs/examples/ThumbnailAnchor.js b/docs/examples/ThumbnailAnchor.js index ccf1764101..1ba31ecf52 100644 --- a/docs/examples/ThumbnailAnchor.js +++ b/docs/examples/ThumbnailAnchor.js @@ -14,4 +14,4 @@ const thumbnailInstance = ( ); -React.render(thumbnailInstance, mountNode); +ReactDOM.render(thumbnailInstance, mountNode); diff --git a/docs/examples/ThumbnailDiv.js b/docs/examples/ThumbnailDiv.js index dc63bd0dfa..29703184e3 100644 --- a/docs/examples/ThumbnailDiv.js +++ b/docs/examples/ThumbnailDiv.js @@ -35,4 +35,4 @@ const thumbnailInstance = ( ); -React.render(thumbnailInstance, mountNode); +ReactDOM.render(thumbnailInstance, mountNode); diff --git a/docs/examples/TooltipBasic.js b/docs/examples/TooltipBasic.js index 25d941638c..88576e00fd 100644 --- a/docs/examples/TooltipBasic.js +++ b/docs/examples/TooltipBasic.js @@ -18,4 +18,4 @@ const tooltipInstance = ( ); -React.render(tooltipInstance, mountNode); +ReactDOM.render(tooltipInstance, mountNode); diff --git a/docs/examples/TooltipInCopy.js b/docs/examples/TooltipInCopy.js index 40c8d09ab0..3bac145c0c 100644 --- a/docs/examples/TooltipInCopy.js +++ b/docs/examples/TooltipInCopy.js @@ -22,4 +22,4 @@ const copyInstance = (

); -React.render(copyInstance, mountNode); +ReactDOM.render(copyInstance, mountNode); diff --git a/docs/examples/TooltipPositioned.js b/docs/examples/TooltipPositioned.js index 5f94bca114..5fd0d1adc3 100644 --- a/docs/examples/TooltipPositioned.js +++ b/docs/examples/TooltipPositioned.js @@ -23,4 +23,4 @@ const positionerInstance = ( ); -React.render(positionerInstance, mountNode); +ReactDOM.render(positionerInstance, mountNode); diff --git a/docs/examples/Well.js b/docs/examples/Well.js index 31caabf770..0bee8c004a 100644 --- a/docs/examples/Well.js +++ b/docs/examples/Well.js @@ -2,4 +2,4 @@ const wellInstance = ( Look I'm in a well! ); -React.render(wellInstance, mountNode); +ReactDOM.render(wellInstance, mountNode); diff --git a/docs/examples/WellSizes.js b/docs/examples/WellSizes.js index 80bb223539..514a3e8a2c 100644 --- a/docs/examples/WellSizes.js +++ b/docs/examples/WellSizes.js @@ -5,4 +5,4 @@ const wellInstance = ( ); -React.render(wellInstance, mountNode); +ReactDOM.render(wellInstance, mountNode); diff --git a/docs/server.js b/docs/server.js index ef032a28f5..cc5781a658 100644 --- a/docs/server.js +++ b/docs/server.js @@ -1,28 +1,34 @@ /* eslint no-console: 0 */ import 'colors'; -import React from 'react'; import express from 'express'; +import httpProxy from 'http-proxy'; +import ip from 'ip'; import path from 'path'; +import React from 'react'; +import ReactDOMServer from 'react-dom/server'; import Router from 'react-router'; +import Location from 'react-router/lib/Location'; + +import Root from './src/Root'; import routes from './src/Routes'; -import httpProxy from 'http-proxy'; import metadata from './generate-metadata'; -import ip from 'ip'; const development = process.env.NODE_ENV !== 'production'; const port = process.env.PORT || 4000; -let app = express(); +const app = express(); if (development) { - let proxy = httpProxy.createProxyServer(); - let webpackPort = process.env.WEBPACK_DEV_PORT; - let target = `http://${ip.address()}:${webpackPort}`; + const proxy = httpProxy.createProxyServer(); + const webpackPort = process.env.WEBPACK_DEV_PORT; + + const target = `http://${ip.address()}:${webpackPort}`; + Root.assetBaseUrl = target; app.get('/assets/*', function (req, res) { - proxy.web(req, res, { target }); + proxy.web(req, res, {target}); }); proxy.on('error', function(e) { @@ -32,20 +38,22 @@ if (development) { console.log('Prop data generation started:'.green); - metadata().then( props => { + metadata().then(props => { console.log('Prop data generation finished:'.green); + Root.propData = props; app.use(function renderApp(req, res) { res.header('Access-Control-Allow-Origin', target); res.header('Access-Control-Allow-Headers', 'X-Requested-With'); - Router.run(routes, req.url, Handler => { - let html = React.renderToString(); + Router.run(routes, new Location(req.url), (error, initialState) => { + const html = ReactDOMServer.renderToString( + + ); res.send('' + html); }); }); }); - } else { app.use(express.static(path.join(__dirname, '../docs-built'))); } diff --git a/docs/src/CodeExample.js b/docs/src/CodeExample.js index a5f4c15709..8ad6ce5578 100644 --- a/docs/src/CodeExample.js +++ b/docs/src/CodeExample.js @@ -1,4 +1,5 @@ import React from 'react'; +import ReactDOM from 'react-dom'; export default class CodeExample extends React.Component { render() { @@ -19,7 +20,7 @@ export default class CodeExample extends React.Component { CodeMirror.runMode( this.props.codeText, this.props.mode, - React.findDOMNode(this).children[0] + ReactDOM.findDOMNode(this).children[0] ); } } diff --git a/docs/src/ComponentsPage.js b/docs/src/ComponentsPage.js index d2f241e165..f5fdb87565 100644 --- a/docs/src/ComponentsPage.js +++ b/docs/src/ComponentsPage.js @@ -1,6 +1,7 @@ /* eslint react/no-did-mount-set-state: 0 */ import React from 'react'; +import ReactDOM from 'react-dom'; import Affix from '../../src/Affix'; import Nav from '../../src/Nav'; @@ -32,15 +33,15 @@ const ComponentsPage = React.createClass({ }, componentDidMount() { - let elem = React.findDOMNode(this.refs.sideNav); + let elem = ReactDOM.findDOMNode(this.refs.sideNav); let domUtils = Affix.domUtils; let sideNavOffsetTop = domUtils.getOffset(elem).top; let sideNavMarginTop = parseInt(domUtils.getComputedStyles(elem.firstChild).marginTop, 10); - let topNavHeight = React.findDOMNode(this.refs.topNav).offsetHeight; + let topNavHeight = ReactDOM.findDOMNode(this.refs.topNav).offsetHeight; this.setState({ navOffsetTop: sideNavOffsetTop - topNavHeight - sideNavMarginTop, - navOffsetBottom: React.findDOMNode(this.refs.footer).offsetHeight + navOffsetBottom: ReactDOM.findDOMNode(this.refs.footer).offsetHeight }); }, diff --git a/docs/src/NavMain.js b/docs/src/NavMain.js index 4f5763a0e1..5f1c4a2d01 100644 --- a/docs/src/NavMain.js +++ b/docs/src/NavMain.js @@ -5,19 +5,19 @@ import Nav from '../../src/Nav'; const NAV_LINKS = { 'introduction': { - link: 'introduction', + link: '/introduction.html', title: 'Introduction' }, 'getting-started': { - link: 'getting-started', + link: '/getting-started.html', title: 'Getting started' }, 'components': { - link: 'components', + link: '/components.html', title: 'Components' }, 'support': { - link: 'support', + link: '/support.html', title: 'Support' } }; @@ -28,7 +28,7 @@ const NavMain = React.createClass({ }, render() { - let brand = React-Bootstrap; + let brand = React-Bootstrap; let links = Object.keys(NAV_LINKS).map(this.renderNavItem).concat([
  • GitHub diff --git a/docs/src/ReactPlayground.js b/docs/src/ReactPlayground.js index 6020303187..6ede4cd320 100644 --- a/docs/src/ReactPlayground.js +++ b/docs/src/ReactPlayground.js @@ -4,6 +4,7 @@ /* eslint-disable */ const classNames = require('classnames'); const React = require('react'); +const ReactDOM = require('react-dom'); const Accordion = require('../../src/Accordion'); const Alert = require('../../src/Alert'); @@ -83,7 +84,7 @@ class CodeMirrorEditor extends React.Component { return; } - this.editor = CodeMirror.fromTextArea(React.findDOMNode(this.refs.editor), { + this.editor = CodeMirror.fromTextArea(this.refs.editor, { mode: 'javascript', lineNumbers: false, lineWrapping: false, @@ -170,8 +171,8 @@ const ReactPlayground = React.createClass({ // example element and render it normally. This is safe because it's code // that we supply, so we can ensure ahead of time that it won't throw an // exception while rendering. - const originalReactRender = React.render; - React.render = (element) => this._initialExample = element; + const originalRender = ReactDOM.render; + ReactDOM.render = (element) => this._initialExample = element; // Stub out mountNode for the example code. const mountNode = null; // eslint-disable-line no-unused-vars @@ -183,7 +184,7 @@ const ReactPlayground = React.createClass({ eval(compiledCode); /* eslint-enable */ } finally { - React.render = originalReactRender; + ReactDOM.render = originalRender; } }, @@ -261,9 +262,13 @@ const ReactPlayground = React.createClass({ }, clearExample() { - const mountNode = React.findDOMNode(this.refs.mount); + if (!this.state.codeChanged) { + return; + } + + const mountNode = this.refs.mount; try { - React.unmountComponentAtNode(mountNode); + ReactDOM.unmountComponentAtNode(mountNode); } catch (e) { console.error(e); // eslint-disable-line no-console } @@ -290,7 +295,7 @@ const ReactPlayground = React.createClass({ this.updateTimeout( () => { - React.render( + ReactDOM.render( {err.toString()} , diff --git a/docs/src/Root.js b/docs/src/Root.js index 449db4528e..e5c118140c 100644 --- a/docs/src/Root.js +++ b/docs/src/Root.js @@ -1,9 +1,7 @@ import React from 'react'; -import Router from 'react-router'; const Root = React.createClass({ statics: { - /** * Get the list of pages that are renderable * @@ -20,18 +18,12 @@ const Root = React.createClass({ } }, - getDefaultProps() { - return { - assetBaseUrl: '' - }; - }, - childContextTypes: { metadata: React.PropTypes.object }, getChildContext(){ - return { metadata: this.props.propData }; + return {metadata: Root.propData}; }, render() { @@ -40,7 +32,8 @@ const Root = React.createClass({ // same props as what each page was rendered with. let browserInitScriptObj = { __html: - `window.INITIAL_PROPS = ${JSON.stringify(this.props)}; + `window.ASSET_BASE_URL = ${JSON.stringify(Root.assetBaseUrl)}; + window.PROP_DATA = ${JSON.stringify(Root.propData)}; // console noop shim for IE8/9 (function (w) { var noop = function () {}; @@ -57,8 +50,8 @@ const Root = React.createClass({ __html: `React-Bootstrap - - + +