├── .editorconfig ├── .eslintignore ├── .gitattributes ├── .gitignore ├── .jshintrc ├── .mailmap ├── .travis.yml ├── AUTHORS ├── CHANGELOG.md ├── CONTRIBUTING.md ├── Gruntfile.js ├── LICENSE ├── LICENSE-docs ├── LICENSE-examples ├── PATENTS ├── README.md ├── bin ├── jsx └── jsx-internal ├── docs ├── 404.md ├── Gemfile ├── Gemfile.lock ├── README.md ├── Rakefile ├── _config.yml ├── _css │ ├── _solarized.scss │ ├── _typography.scss │ ├── _variables.scss │ └── bourbon │ │ ├── _bourbon-deprecated-upcoming.scss │ │ ├── _bourbon.scss │ │ ├── addons │ │ ├── _button.scss │ │ ├── _clearfix.scss │ │ ├── _directional-values.scss │ │ ├── _ellipsis.scss │ │ ├── _font-family.scss │ │ ├── _hide-text.scss │ │ ├── _html5-input-types.scss │ │ ├── _position.scss │ │ ├── _prefixer.scss │ │ ├── _retina-image.scss │ │ ├── _size.scss │ │ ├── _timing-functions.scss │ │ ├── _triangle.scss │ │ └── _word-wrap.scss │ │ ├── css3 │ │ ├── _animation.scss │ │ ├── _appearance.scss │ │ ├── _backface-visibility.scss │ │ ├── _background-image.scss │ │ ├── _background.scss │ │ ├── _border-image.scss │ │ ├── _border-radius.scss │ │ ├── _box-sizing.scss │ │ ├── _calc.scss │ │ ├── _columns.scss │ │ ├── _filter.scss │ │ ├── _flex-box.scss │ │ ├── _font-face.scss │ │ ├── _font-feature-settings.scss │ │ ├── _hidpi-media-query.scss │ │ ├── _hyphens.scss │ │ ├── _image-rendering.scss │ │ ├── _keyframes.scss │ │ ├── _linear-gradient.scss │ │ ├── _perspective.scss │ │ ├── _placeholder.scss │ │ ├── _radial-gradient.scss │ │ ├── _transform.scss │ │ ├── _transition.scss │ │ └── _user-select.scss │ │ ├── functions │ │ ├── _assign.scss │ │ ├── _color-lightness.scss │ │ ├── _flex-grid.scss │ │ ├── _golden-ratio.scss │ │ ├── _grid-width.scss │ │ ├── _modular-scale.scss │ │ ├── _px-to-em.scss │ │ ├── _px-to-rem.scss │ │ ├── _strip-units.scss │ │ ├── _tint-shade.scss │ │ ├── _transition-property-name.scss │ │ └── _unpack.scss │ │ ├── helpers │ │ ├── _convert-units.scss │ │ ├── _gradient-positions-parser.scss │ │ ├── _is-num.scss │ │ ├── _linear-angle-parser.scss │ │ ├── _linear-gradient-parser.scss │ │ ├── _linear-positions-parser.scss │ │ ├── _linear-side-corner-parser.scss │ │ ├── _radial-arg-parser.scss │ │ ├── _radial-gradient-parser.scss │ │ ├── _radial-positions-parser.scss │ │ ├── _render-gradients.scss │ │ ├── _shape-size-stripper.scss │ │ └── _str-to-num.scss │ │ └── settings │ │ ├── _asset-pipeline.scss │ │ ├── _prefixer.scss │ │ └── _px-to-em.scss ├── _data │ ├── acknowledgements.yml │ ├── nav_docs.yml │ └── nav_tips.yml ├── _includes │ ├── blog_post.html │ ├── nav_blog.html │ └── nav_docs.html ├── _js │ ├── es5-sham.min.js │ ├── es5-shim.min.js │ ├── examples │ │ ├── hello.js │ │ ├── markdown.js │ │ ├── timer.js │ │ └── todo.js │ ├── html-jsx-lib.js │ ├── html-jsx.js │ ├── html5shiv.min.js │ ├── jsfiddle-integration.js │ ├── jsx-compiler.js │ └── live_editor.js ├── _layouts │ ├── default.html │ ├── docs.html │ ├── page.html │ ├── post.html │ ├── single.html │ └── tips.html ├── _plugins │ ├── header_links.rb │ ├── highlight_lines.rb │ └── sidebar_item.rb ├── _posts │ ├── 2013-06-02-jsfiddle-integration.md │ ├── 2013-06-05-why-react.md │ ├── 2013-06-12-community-roundup.md │ ├── 2013-06-19-community-roundup-2.md │ ├── 2013-06-21-react-v0-3-3.md │ ├── 2013-06-27-community-roundup-3.md │ ├── 2013-07-02-react-v0-4-autobind-by-default.md │ ├── 2013-07-03-community-roundup-4.md │ ├── 2013-07-11-react-v0-4-prop-validation-and-default-values.md │ ├── 2013-07-17-react-v0-4-0.md │ ├── 2013-07-23-community-roundup-5.md │ ├── 2013-07-26-react-v0-4-1.md │ ├── 2013-07-30-use-react-and-jsx-in-ruby-on-rails.md │ ├── 2013-08-05-community-roundup-6.md │ ├── 2013-08-19-use-react-and-jsx-in-python-applications.md │ ├── 2013-08-26-community-roundup-7.md │ ├── 2013-09-24-community-roundup-8.md │ ├── 2013-10-16-react-v0.5.0.md │ ├── 2013-10-29-react-v0-5-1.md │ ├── 2013-10-3-community-roundup-9.md │ ├── 2013-11-05-thinking-in-react.md │ ├── 2013-11-06-community-roundup-10.md │ ├── 2013-11-18-community-roundup-11.md │ ├── 2013-12-18-react-v0.5.2-v0.4.2.md │ ├── 2013-12-19-react-v0.8.0.md │ ├── 2013-12-23-community-roundup-12.md │ ├── 2013-12-30-community-roundup-13.md │ ├── 2014-01-02-react-chrome-developer-tools.md │ ├── 2014-01-06-community-roundup-14.md │ ├── 2014-02-05-community-roundup-15.md │ ├── 2014-02-15-community-roundup-16.md │ ├── 2014-02-16-react-v0.9-rc1.md │ ├── 2014-02-20-react-v0.9.md │ ├── 2014-02-24-community-roundup-17.md │ ├── 2014-03-14-community-roundup-18.md │ ├── 2014-03-19-react-v0.10-rc1.md │ ├── 2014-03-21-react-v0.10.md │ ├── 2014-03-28-the-road-to-1.0.md │ ├── 2014-04-04-reactnet.md │ ├── 2014-05-06-flux.md │ ├── 2014-05-29-one-year-of-open-source-react.md │ ├── 2014-06-27-community-roundup-19.md │ ├── 2014-07-13-react-v0.11-rc1.md │ ├── 2014-07-17-react-v0.11.md │ ├── 2014-07-25-react-v0.11.1.md │ ├── 2014-07-28-community-roundup-20.md │ ├── 2014-07-30-flux-actions-and-the-dispatcher.md │ ├── 2014-08-03-community-roundup-21.md │ ├── 2014-09-03-introducing-the-jsx-specification.md │ ├── 2014-09-12-community-round-up-22.md │ ├── 2014-09-16-react-v0.11.2.md │ ├── 2014-09-24-testing-flux-applications.md │ ├── 2014-10-14-introducing-react-elements.md │ ├── 2014-10-16-react-v0.12-rc1.md │ ├── 2014-10-17-community-roundup-23.md │ ├── 2014-10-27-react-js-conf.md │ ├── 2014-10-28-react-v0.12.md │ ├── 2014-11-24-react-js-conf-updates.md │ ├── 2014-11-25-community-roundup-24.md │ ├── 2014-12-18-react-v0.12.2.md │ ├── 2014-12-19-react-js-conf-diversity-scholarship.md │ └── 2015-01-27-react-v0.13.0-beta-1.md ├── acknowledgements.md ├── blog │ ├── all.html │ └── index.html ├── css │ ├── codemirror.css │ ├── main.css │ ├── react.scss │ └── syntax.css ├── docs │ ├── 01-why-react.md │ ├── 01-why-react.zh-CN.md │ ├── 02-displaying-data.md │ ├── 02-displaying-data.zh-CN.md │ ├── 02.1-jsx-in-depth.md │ ├── 02.1-jsx-in-depth.zh-CN.md │ ├── 02.2-jsx-spread.md │ ├── 02.2-jsx-spread.zh-CN.md │ ├── 02.3-jsx-gotchas.md │ ├── 02.3-jsx-gotchas.zh-CN.md │ ├── 03-interactivity-and-dynamic-uis.md │ ├── 03-interactivity-and-dynamic-uis.zh-CN.md │ ├── 04-multiple-components.md │ ├── 04-multiple-components.zh-CN.md │ ├── 05-reusable-components.md │ ├── 05-reusable-components.zh-CN.md │ ├── 06-transferring-props.md │ ├── 06-transferring-props.zh-CN.md │ ├── 07-forms.md │ ├── 07-forms.zh-CN.md │ ├── 08-working-with-the-browser.md │ ├── 08.1-more-about-refs.md │ ├── 09-tooling-integration.md │ ├── 10-addons.md │ ├── 10.1-animation.md │ ├── 10.2-form-input-binding-sugar.md │ ├── 10.3-class-name-manipulation.md │ ├── 10.4-test-utils.md │ ├── 10.5-clone-with-props.md │ ├── 10.6-update.md │ ├── 10.7-pure-render-mixin.md │ ├── 10.8-perf.md │ ├── complementary-tools.md │ ├── complementary-tools.zh-CN.md │ ├── examples.md │ ├── examples.zh-CN.md │ ├── flux-overview.md │ ├── flux-overview.zh-CN.md │ ├── flux-todo-list.md │ ├── flux-todo-list.zh-CN.md │ ├── getting-started.md │ ├── getting-started.zh-CN.md │ ├── ref-01-top-level-api.md │ ├── ref-02-component-api.md │ ├── ref-03-component-specs.md │ ├── ref-04-tags-and-attributes.md │ ├── ref-05-events.md │ ├── ref-05-events.zh-CN.md │ ├── ref-06-dom-differences.md │ ├── ref-07-special-non-dom-attributes.md │ ├── ref-08-reconciliation.md │ ├── ref-09-glossary.md │ ├── thinking-in-react.md │ ├── tutorial.md │ └── videos.md ├── downloads.md ├── downloads │ ├── react-0.10.0-rc1.zip │ ├── react-0.10.0.zip │ ├── react-0.11.0-rc1.zip │ ├── react-0.11.0.zip │ ├── react-0.11.1.zip │ ├── react-0.11.2.zip │ ├── react-0.12.0-rc1.zip │ ├── react-0.12.0.zip │ ├── react-0.12.1.zip │ ├── react-0.12.2.zip │ ├── react-0.3.0.zip │ ├── react-0.3.1.zip │ ├── react-0.3.2.zip │ ├── react-0.3.3.zip │ ├── react-0.4.0.zip │ ├── react-0.4.1.zip │ ├── react-0.4.2.zip │ ├── react-0.5.0.zip │ ├── react-0.5.1.zip │ ├── react-0.5.2.zip │ ├── react-0.8.0.zip │ └── react-0.9.0-rc1.zip ├── extractCode.js ├── favicon.ico ├── feed.xml ├── html-jsx.md ├── img │ ├── blog │ │ ├── animal-sounds.jpg │ │ ├── chatapp.png │ │ ├── dog-tutorial.png │ │ ├── first-look.png │ │ ├── flux-chart.png │ │ ├── flux-diagram.png │ │ ├── genesis_skeleton.png │ │ ├── guess_filter.jpg │ │ ├── jsx-compiler.png │ │ ├── kendoui.png │ │ ├── khan-academy-editor.png │ │ ├── landoflisp.png │ │ ├── lights-out.png │ │ ├── makona-editor.png │ │ ├── markdown_refactor.png │ │ ├── monkeys.gif │ │ ├── ngreact.png │ │ ├── om-backbone.png │ │ ├── propeller-logo.png │ │ ├── quiztime.png │ │ ├── react-browserify-gulp.jpg │ │ ├── react-dev-tools.jpg │ │ ├── react-diff-tree.png │ │ ├── react-draggable.png │ │ ├── react-hackathon.jpg │ │ ├── react-page.png │ │ ├── react-php.png │ │ ├── react-svg-fbp.png │ │ ├── reactive-bookmarklet.png │ │ ├── reflux-flux.png │ │ ├── resistance-calculator.png │ │ ├── skills-matter.png │ │ ├── snake.png │ │ ├── steve_reverse.gif │ │ ├── sweet-jsx.png │ │ ├── thinking-in-react-components.png │ │ ├── thinking-in-react-mock.png │ │ ├── todomvc.png │ │ ├── turboreact.png │ │ ├── tutsplus.png │ │ ├── unite.png │ │ ├── weather.png │ │ ├── wolfenstein_react.png │ │ ├── xoxo2013.png │ │ └── xreact.png │ ├── docs │ │ ├── codewinds-004.png │ │ ├── javascript-jabber.png │ │ ├── perf-dom.png │ │ ├── perf-exclusive.png │ │ ├── perf-inclusive.png │ │ ├── perf-wasted.png │ │ └── thinking-in-react-tagtree.png │ ├── logo.svg │ ├── logo_og.png │ ├── logo_small.png │ ├── logo_small_2x.png │ └── noise.png ├── index.md ├── js │ ├── codemirror.js │ ├── javascript.js │ └── showdown.js ├── jsx-compiler.md ├── support.md └── tips │ ├── 01-introduction.md │ ├── 02-inline-styles.md │ ├── 03-if-else-in-JSX.md │ ├── 04-self-closing-tag.md │ ├── 05-maximum-number-of-jsx-root-nodes.md │ ├── 06-style-props-value-px.md │ ├── 07-children-props-type.md │ ├── 08-controlled-input-null-value.md │ ├── 09-componentWillReceiveProps-not-triggered-after-mounting.md │ ├── 10-props-in-getInitialState-as-anti-pattern.md │ ├── 11-dom-event-listeners.md │ ├── 12-initial-ajax.md │ ├── 13-false-in-jsx.md │ ├── 14-communicate-between-components.md │ ├── 15-expose-component-functions.md │ ├── 16-references-to-components.md │ ├── 17-children-undefined.md │ ├── 18-use-react-with-other-libraries.md │ └── 19--dangerouslySetInnerHTML.md ├── examples ├── README.md ├── ballmer-peak │ ├── ballmer_peak.png │ ├── example.js │ └── index.html ├── basic-commonjs │ ├── README.md │ ├── index.html │ ├── index.js │ └── package.json ├── basic-jsx-external │ ├── example.js │ └── index.html ├── basic-jsx-harmony │ └── index.html ├── basic-jsx-precompile │ ├── example.js │ └── index.html ├── basic-jsx │ └── index.html ├── basic │ └── index.html ├── jquery-bootstrap │ ├── css │ │ └── example.css │ ├── index.html │ ├── js │ │ └── app.js │ └── thirdparty │ │ ├── bootstrap.min.css │ │ └── bootstrap.min.js ├── jquery-mobile │ ├── README.md │ ├── index.html │ └── js │ │ └── app.js ├── server-rendering │ ├── README.md │ ├── jsapp │ │ ├── package.json │ │ └── src │ │ │ └── App.js │ ├── reactserver │ │ ├── package.json │ │ └── server.js │ └── webapp │ │ ├── index.php │ │ └── static │ │ └── NOTHING_HERE_YET ├── shared │ ├── css │ │ └── base.css │ └── thirdparty │ │ ├── console-polyfill.js │ │ ├── es5-sham.min.js │ │ ├── es5-shim.min.js │ │ └── jquery.min.js └── transitions │ ├── index.html │ └── transition.css ├── gem-react-source ├── lib │ └── react │ │ └── source.rb └── react-source.gemspec ├── grunt ├── config │ ├── browserify.js │ ├── compare_size.js │ ├── compress.js │ ├── copy.js │ ├── jshint.js │ ├── jsx.js │ ├── npm.js │ ├── populist.js │ ├── server.js │ ├── webdriver-all.js │ ├── webdriver-jasmine.js │ └── webdriver-perf.js └── tasks │ ├── browserify.js │ ├── coverage-parse.js │ ├── download-previous-version.js │ ├── gem-react-source.js │ ├── jsx.js │ ├── npm-react-tools.js │ ├── npm-react.js │ ├── npm.js │ ├── populist.js │ ├── release.js │ ├── sauce-tunnel.js │ ├── version-check.js │ ├── webdriver-all.js │ ├── webdriver-jasmine.js │ ├── webdriver-perf.js │ └── webdriver-phantomjs.js ├── jest ├── environment.js ├── jest.d.ts ├── preprocessor.js └── ts-preprocessor.js ├── main.js ├── npm-jsx_orphaned_brackets_transformer ├── .gitignore ├── README.md ├── package.json ├── run.js └── transforms │ └── react.js ├── npm-react-tools └── README.md ├── npm-react ├── README.md ├── addons.js ├── package.json └── react.js ├── package.json ├── perf ├── index.html ├── lib │ ├── BrowserPerfRunnerApp.react.js │ ├── BrowserPerfRunnerContext.react.js │ ├── perf-test-runner.browser.js │ ├── todolist.browser.js │ └── todolist.html ├── runner.html └── tests │ ├── basic-div.js │ ├── basic-unmount.js │ ├── propTypes.js │ ├── renderComponent-basic.js │ ├── sanity.js │ ├── setState-callback-5.js │ ├── setState-callback.js │ ├── shouldComponentUpdate.js │ ├── todolist-add.js │ ├── todolist-do-stuff.js │ ├── todolist-edit.js │ └── todolist-mount.js ├── scripts └── authors ├── src ├── .eslintrc ├── .jshintrc ├── addons │ ├── ReactComponentWithPureRenderMixin.js │ ├── ReactRAFBatchingStrategy.js │ ├── __tests__ │ │ └── update-test.js │ ├── link │ │ ├── LinkedStateMixin.js │ │ ├── ReactLink.js │ │ └── __tests__ │ │ │ ├── LinkedStateMixin-test.js │ │ │ └── ReactLinkPropTypes-test.js │ ├── transitions │ │ ├── ReactCSSTransitionGroup.js │ │ ├── ReactCSSTransitionGroupChild.js │ │ ├── ReactTransitionChildMapping.js │ │ ├── ReactTransitionEvents.js │ │ ├── ReactTransitionGroup.js │ │ └── __tests__ │ │ │ ├── ReactCSSTransitionGroup-test.js │ │ │ ├── ReactTransitionChildMapping-test.js │ │ │ └── ReactTransitionGroup-test.js │ └── update.js ├── browser │ ├── ClientReactRootIndex.js │ ├── ReactBrowserEventEmitter.js │ ├── ReactDOM.js │ ├── ReactPutListenerQueue.js │ ├── ReactReconcileTransaction.js │ ├── ReactWithAddons.js │ ├── __tests__ │ │ ├── ReactBrowserEventEmitter-test.js │ │ ├── ReactDOM-test.js │ │ ├── ReactWebWorker-test.js │ │ └── findDOMNode-test.js │ ├── eventPlugins │ │ ├── AnalyticsEventPluginFactory.js │ │ ├── BeforeInputEventPlugin.js │ │ ├── ChangeEventPlugin.js │ │ ├── DefaultEventPluginOrder.js │ │ ├── EnterLeaveEventPlugin.js │ │ ├── FallbackCompositionState.js │ │ ├── MobileSafariClickEventPlugin.js │ │ ├── ResponderEventPlugin.js │ │ ├── SelectEventPlugin.js │ │ ├── SimpleEventPlugin.js │ │ ├── TapEventPlugin.js │ │ └── __tests__ │ │ │ ├── AnalyticsEventPlugin-test.js │ │ │ ├── EnterLeaveEventPlugin-test.js │ │ │ ├── FallbackCompositionState-test.js │ │ │ └── ResponderEventPlugin-test.js │ ├── findDOMNode.js │ ├── server │ │ ├── ReactMarkupChecksum.js │ │ ├── ReactServerRendering.js │ │ ├── ReactServerRenderingTransaction.js │ │ ├── ServerReactRootIndex.js │ │ └── __tests__ │ │ │ └── ReactServerRendering-test.js │ ├── syntheticEvents │ │ ├── SyntheticClipboardEvent.js │ │ ├── SyntheticCompositionEvent.js │ │ ├── SyntheticDragEvent.js │ │ ├── SyntheticEvent.js │ │ ├── SyntheticFocusEvent.js │ │ ├── SyntheticInputEvent.js │ │ ├── SyntheticKeyboardEvent.js │ │ ├── SyntheticMouseEvent.js │ │ ├── SyntheticTouchEvent.js │ │ ├── SyntheticUIEvent.js │ │ ├── SyntheticWheelEvent.js │ │ └── __tests__ │ │ │ ├── SyntheticEvent-test.js │ │ │ └── SyntheticWheelEvent-test.js │ └── ui │ │ ├── React.js │ │ ├── ReactBrowserComponentMixin.js │ │ ├── ReactComponentBrowserEnvironment.js │ │ ├── ReactDOMComponent.js │ │ ├── ReactDOMIDOperations.js │ │ ├── ReactDOMSelection.js │ │ ├── ReactDOMTextComponent.js │ │ ├── ReactDefaultInjection.js │ │ ├── ReactEventListener.js │ │ ├── ReactInjection.js │ │ ├── ReactInputSelection.js │ │ ├── ReactMount.js │ │ ├── __tests__ │ │ ├── ReactDOMComponent-test.js │ │ ├── ReactDOMIDOperations-test.js │ │ ├── ReactDOMTextComponent-test.js │ │ ├── ReactEventListener-test.js │ │ ├── ReactMount-test.js │ │ ├── ReactMountDestruction-test.js │ │ └── ReactRenderDocument-test.js │ │ ├── dom │ │ ├── CSSProperty.js │ │ ├── CSSPropertyOperations.js │ │ ├── DOMChildrenOperations.js │ │ ├── DOMProperty.js │ │ ├── DOMPropertyOperations.js │ │ ├── Danger.js │ │ ├── HTMLDOMPropertyConfig.js │ │ ├── SVGDOMPropertyConfig.js │ │ ├── ViewportMetrics.js │ │ ├── __tests__ │ │ │ ├── CSSProperty-test.js │ │ │ ├── CSSPropertyOperations-test.js │ │ │ ├── DOMPropertyOperations-test.js │ │ │ ├── Danger-test.js │ │ │ └── getNodeForCharacterOffset-test.js │ │ ├── components │ │ │ ├── AutoFocusMixin.js │ │ │ ├── LinkedValueUtils.js │ │ │ ├── LocalEventTrapMixin.js │ │ │ ├── ReactDOMButton.js │ │ │ ├── ReactDOMForm.js │ │ │ ├── ReactDOMImg.js │ │ │ ├── ReactDOMInput.js │ │ │ ├── ReactDOMOption.js │ │ │ ├── ReactDOMSelect.js │ │ │ ├── ReactDOMTextarea.js │ │ │ ├── __tests__ │ │ │ │ ├── LocalEventTrapMixin-test.js │ │ │ │ ├── ReactDOMButton-test.js │ │ │ │ ├── ReactDOMInput-test.js │ │ │ │ ├── ReactDOMSelect-test.js │ │ │ │ └── ReactDOMTextarea-test.js │ │ │ └── createFullPageComponent.js │ │ ├── dangerousStyleValue.js │ │ ├── getEventCharCode.js │ │ ├── getEventKey.js │ │ ├── getEventModifierState.js │ │ ├── getEventTarget.js │ │ ├── getNodeForCharacterOffset.js │ │ ├── getTextContentAccessor.js │ │ ├── isEventSupported.js │ │ ├── setInnerHTML.js │ │ └── setTextContent.js │ │ └── getReactRootElementInContainer.js ├── classic │ ├── __tests__ │ │ └── ReactContextValidator-test.js │ ├── class │ │ ├── ReactClass.js │ │ ├── ReactDoNotBindDeprecated.js │ │ └── __tests__ │ │ │ ├── ReactBind-test.js │ │ │ ├── ReactClass-test.js │ │ │ └── ReactClassMixin-test.js │ ├── element │ │ ├── ReactElement.js │ │ ├── ReactElementValidator.js │ │ └── __tests__ │ │ │ ├── ReactElement-test.js │ │ │ └── ReactElementValidator-test.js │ └── types │ │ ├── ReactPropTypeLocationNames.js │ │ ├── ReactPropTypeLocations.js │ │ ├── ReactPropTypes.js │ │ └── __tests__ │ │ └── ReactPropTypes-test.js ├── core │ ├── ReactChildReconciler.js │ ├── ReactComponentEnvironment.js │ ├── ReactCompositeComponent.js │ ├── ReactContext.js │ ├── ReactCurrentOwner.js │ ├── ReactDefaultBatchingStrategy.js │ ├── ReactEmptyComponent.js │ ├── ReactEventEmitterMixin.js │ ├── ReactInstanceHandles.js │ ├── ReactInstanceMap.js │ ├── ReactLifeCycle.js │ ├── ReactMultiChild.js │ ├── ReactMultiChildUpdateTypes.js │ ├── ReactNativeComponent.js │ ├── ReactOwner.js │ ├── ReactPropTransferer.js │ ├── ReactReconciler.js │ ├── ReactRef.js │ ├── ReactRootIndex.js │ ├── ReactStateSetters.js │ ├── ReactUpdateQueue.js │ ├── ReactUpdates.js │ ├── __tests__ │ │ ├── ReactComponent-test.js │ │ ├── ReactComponentLifeCycle-test.js │ │ ├── ReactCompositeComponent-test.js │ │ ├── ReactCompositeComponentDOMMinimalism-test.js │ │ ├── ReactCompositeComponentError-test.js │ │ ├── ReactCompositeComponentState-test.js │ │ ├── ReactEmptyComponent-test.js │ │ ├── ReactIdentity-test.js │ │ ├── ReactInstanceHandles-test.js │ │ ├── ReactMockedComponent-test.js │ │ ├── ReactMultiChild-test.js │ │ ├── ReactMultiChildReconcile-test.js │ │ ├── ReactMultiChildText-test.js │ │ ├── ReactStateSetters-test.js │ │ ├── ReactUpdates-test.js │ │ ├── refs-destruction-test.js │ │ └── refs-test.js │ ├── instantiateReactComponent.js │ └── shouldUpdateReactComponent.js ├── event │ ├── EventConstants.js │ ├── EventPluginHub.js │ ├── EventPluginRegistry.js │ ├── EventPluginUtils.js │ ├── EventPropagators.js │ └── __tests__ │ │ ├── EventPluginHub-test.js │ │ └── EventPluginRegistry-test.js ├── modern │ ├── class │ │ ├── React.d.ts │ │ ├── ReactComponent.js │ │ └── __tests__ │ │ │ ├── ReactClassEquivalence-test.js │ │ │ ├── ReactCoffeeScriptClass-test.coffee │ │ │ ├── ReactES6Class-test.js │ │ │ └── ReactTypeScriptClass-test.ts │ ├── element │ │ └── __tests__ │ │ │ ├── ReactJSXElement-test.js │ │ │ └── ReactJSXElementValidator-test.js │ └── types │ │ └── __tests__ │ │ ├── ReactFlowPropTypes-test.js │ │ └── ReactTypeScriptPropTypes-test.js ├── package.json ├── stubs │ └── Object.assign.js ├── test │ ├── MetaMatchers.js │ ├── ReactDefaultPerf.js │ ├── ReactDefaultPerfAnalysis.js │ ├── ReactPerf.js │ ├── ReactTestUtils.js │ ├── __tests__ │ │ ├── MetaMatchers-test.js │ │ ├── ReactTestUtils-test.js │ │ └── reactComponentExpect-test.js │ ├── all.js │ ├── createHierarchyRenderer.js │ ├── getTestDocument.js │ ├── mock-modules.js │ ├── mock-timers.js │ ├── mocks.js │ ├── phantomjs-shims.js │ ├── reactComponentExpect.js │ └── worker.js ├── utils │ ├── CallbackQueue.js │ ├── OrderedMap.js │ ├── PooledClass.js │ ├── ReactChildren.js │ ├── Transaction.js │ ├── __tests__ │ │ ├── OrderedMap-test.js │ │ ├── PooledClass-test.js │ │ ├── ReactChildren-test.js │ │ ├── Transaction-test.js │ │ ├── accumulateInto-test.js │ │ ├── cloneWithProps-test.js │ │ ├── escapeTextForBrowser-test.js │ │ ├── joinClasses-test.js │ │ ├── keyMirror-test.js │ │ ├── memoizeStringOnly-test.js │ │ ├── onlyChild-test.js │ │ ├── sliceChildren-test.js │ │ └── traverseAllChildren-test.js │ ├── accumulate.js │ ├── accumulateInto.js │ ├── adler32.js │ ├── cloneWithProps.js │ ├── deprecated.js │ ├── escapeTextForBrowser.js │ ├── flattenChildren.js │ ├── forEachAccumulated.js │ ├── getIteratorFn.js │ ├── isTextInputElement.js │ ├── joinClasses.js │ ├── keyMirror.js │ ├── memoizeStringOnly.js │ ├── onlyChild.js │ ├── shallowEqual.js │ ├── sliceChildren.js │ └── traverseAllChildren.js ├── vendor │ ├── README.md │ ├── core │ │ ├── CSSCore.js │ │ ├── ExecutionEnvironment.js │ │ ├── TouchEventUtils.js │ │ ├── camelize.js │ │ ├── camelizeStyleName.js │ │ ├── createArrayFrom.js │ │ ├── createNodesFromMarkup.js │ │ ├── dom │ │ │ ├── containsNode.js │ │ │ ├── focusNode.js │ │ │ ├── getActiveElement.js │ │ │ ├── getUnboundedScrollPosition.js │ │ │ ├── isNode.js │ │ │ └── isTextNode.js │ │ ├── emptyFunction.js │ │ ├── emptyObject.js │ │ ├── getMarkupWrap.js │ │ ├── hyphenate.js │ │ ├── hyphenateStyleName.js │ │ ├── invariant.js │ │ ├── keyOf.js │ │ ├── mapObject.js │ │ ├── mergeDeep.js │ │ ├── mergeDeepInto.js │ │ ├── mergeHelpers.js │ │ ├── monitorCodeUse.js │ │ ├── nativeRequestAnimationFrame.js │ │ ├── requestAnimationFrame.js │ │ ├── toArray.js │ │ └── warning.js │ ├── immutable │ │ ├── Immutable.js │ │ └── ImmutableObject.js │ ├── performance │ │ ├── performance.js │ │ └── performanceNow.js │ └── stubs │ │ ├── EventListener.js │ │ ├── ReactErrorUtils.js │ │ └── cx.js └── vendor_deprecated │ ├── README.md │ └── core │ ├── copyProperties.js │ ├── merge.js │ └── mergeInto.js ├── starter └── README.md ├── test ├── index.html └── lib │ ├── jasmine-execute.js │ ├── postDataToURL.browser.js │ └── reportTestResults.browser.js └── vendor ├── browser-transforms.js ├── constants.js ├── fbtransform ├── syntax.js ├── transforms │ ├── __tests__ │ │ ├── react-displayName-test.js │ │ └── react-test.js │ ├── react.js │ ├── reactDisplayName.js │ └── xjs.js └── visitors.js ├── jasmine-jsreporter └── jasmine-jsreporter.js └── jasmine ├── HtmlReporter.js ├── PrintReporter.js ├── ReporterView.js ├── SpecView.js ├── SuiteView.js ├── all.js ├── console.js ├── diff.js ├── jasmine-html.js ├── jasmine-support.js ├── jasmine.css ├── jasmine.js └── phantom.js /.editorconfig: -------------------------------------------------------------------------------- 1 | # http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | end_of_line = lf 7 | indent_size = 2 8 | indent_style = space 9 | max_line_length = 80 10 | trim_trailing_whitespace = true 11 | 12 | [*.md] 13 | max_line_length = 0 14 | trim_trailing_whitespace = false 15 | 16 | [COMMIT_EDITMSG] 17 | max_line_length = 0 18 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | # We can probably lint these later but not important at this point 2 | src/vendor 3 | src/vendor_deprecated 4 | # estraverse stumbles on XJSSpreadAttribute so just ignore tests for now 5 | src/**/__tests__/** 6 | # This should be enabled but that folder has too much in it that doesn't belong 7 | src/test 8 | -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | * text=auto 2 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_STORE 2 | node_modules 3 | *~ 4 | *.pyc 5 | static 6 | .grunt 7 | _SpecRunner.html 8 | __benchmarks__ 9 | build/ 10 | .module-cache 11 | *.gem 12 | docs/code 13 | docs/_site 14 | docs/.sass-cache 15 | docs/js/* 16 | docs/downloads 17 | examples/shared/*.js 18 | test/the-files-to-test.generated.js 19 | *.log* 20 | chrome-user-data 21 | -------------------------------------------------------------------------------- /.jshintrc: -------------------------------------------------------------------------------- 1 | { 2 | "node": true, 3 | 4 | "boss": true, 5 | "curly": true, 6 | "devel": true, 7 | "eqnull": true, 8 | "expr": true, 9 | "funcscope": true, 10 | "globalstrict": true, 11 | "loopfunc": true, 12 | "newcap": false, 13 | "noempty": true, 14 | "nonstandard": true, 15 | "sub": true, 16 | "undef": true, 17 | "unused": "vars" 18 | } 19 | -------------------------------------------------------------------------------- /LICENSE-examples: -------------------------------------------------------------------------------- 1 | The examples provided by Facebook are for non-commercial testing and evaluation 2 | purposes only. Facebook reserves all rights not expressly granted. 3 | 4 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 5 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 6 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL 7 | FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN 8 | ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION 9 | WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. 10 | -------------------------------------------------------------------------------- /bin/jsx: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env node 2 | // -*- mode: js -*- 3 | "use strict"; 4 | 5 | var transform = require('../main').transform; 6 | 7 | require('commoner').version( 8 | require('../package.json').version 9 | ).resolve(function(id) { 10 | return this.readModuleP(id); 11 | }).option( 12 | '--harmony', 13 | 'Turns on JS transformations such as ES6 Classes etc.' 14 | ).option( 15 | '--strip-types', 16 | 'Strips out type annotations.' 17 | ).option( 18 | '--source-map-inline', 19 | 'Embed inline sourcemap in transformed source' 20 | ).process(function(id, source) { 21 | // This is where JSX, ES6, etc. desugaring happens. 22 | var options = { 23 | harmony: this.options.harmony, 24 | sourceMap: this.options.sourceMapInline, 25 | stripTypes: this.options.stripTypes 26 | }; 27 | return transform(source, options); 28 | }); 29 | -------------------------------------------------------------------------------- /docs/404.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: single 3 | title: Page Not Found 4 | --- 5 | 6 | We couldn't find what you were looking for. 7 | 8 | Please contact the owner of the site that linked you to the original URL and let them know their link is broken. 9 | -------------------------------------------------------------------------------- /docs/Gemfile: -------------------------------------------------------------------------------- 1 | source 'https://rubygems.org' 2 | 3 | gem 'rake' 4 | 5 | # jekyll, which builds it all 6 | # 2.0 includes sass processing 7 | gem 'jekyll', '~>2.0' 8 | 9 | # Auto redirect pages 10 | gem 'jekyll-redirect-from' 11 | 12 | # JSON 13 | gem 'json' 14 | 15 | # For `rake watch` 16 | gem 'rb-fsevent' 17 | 18 | # For markdown header cleanup 19 | gem 'sanitize', '~>2.0' 20 | -------------------------------------------------------------------------------- /docs/_config.yml: -------------------------------------------------------------------------------- 1 | --- 2 | name: React 3 | description: A JavaScript library for building user interfaces 4 | url: http://facebook.github.io 5 | baseurl: "/react" 6 | permalink: "/blog/:year/:month/:day/:title.html" 7 | paginate_path: "/blog/page:num/" 8 | relative_permalinks: true 9 | paginate: 5 10 | timezone: America/Los_Angeles 11 | highlighter: pygments 12 | defaults: 13 | - scope: 14 | path: '' 15 | type: post 16 | values: 17 | layout: post 18 | - scope: 19 | path: docs 20 | type: page 21 | values: 22 | layout: docs 23 | exclude: 24 | - Gemfile 25 | - Gemfile.lock 26 | - README.md 27 | - Rakefile 28 | markdown: redcarpet 29 | redcarpet: 30 | extensions: 31 | - fenced_code_blocks 32 | sass: 33 | style: :compressed 34 | sass_dir: _css 35 | gems: 36 | - jekyll-redirect-from 37 | react_version: 0.11.2 38 | -------------------------------------------------------------------------------- /docs/_css/_variables.scss: -------------------------------------------------------------------------------- 1 | $primary: #cc7a6f; 2 | $linkColor: darken($primary, 9%); 3 | $linkInteract: darken($linkColor, 9%); 4 | $pageBg: #f9f9f9; 5 | 6 | $lightColor: #e9e9e9; 7 | $mediumestColor: #666; 8 | $mediumColor: #484848; 9 | $darkColor: #2d2d2d; 10 | $darkestColor: #222222; 11 | $blueColor: #61dafb; 12 | $orangeColor: complement($blueColor); 13 | 14 | $lightTextColor: #fafafa; 15 | $mediumTextColor: #aaa; 16 | $darkTextColor: $mediumColor; 17 | 18 | $buttonBlueTop: #77a3d2; 19 | $buttonBlueBottom: #4783c2; 20 | $buttonGreyTop: #9a9a9a; 21 | $buttonGreyBottom: #646464; 22 | 23 | -------------------------------------------------------------------------------- /docs/_css/bourbon/_bourbon-deprecated-upcoming.scss: -------------------------------------------------------------------------------- 1 | //************************************************************************// 2 | // These mixins/functions are deprecated 3 | // They will be removed in the next MAJOR version release 4 | //************************************************************************// 5 | @mixin inline-block { 6 | display: inline-block; 7 | @warn "inline-block mixin is deprecated and will be removed in the next major version release"; 8 | } 9 | -------------------------------------------------------------------------------- /docs/_css/bourbon/addons/_clearfix.scss: -------------------------------------------------------------------------------- 1 | // Modern micro clearfix provides an easy way to contain floats without adding additional markup. 2 | // 3 | // Example usage: 4 | // 5 | // // Contain all floats within .wrapper 6 | // .wrapper { 7 | // @include clearfix; 8 | // .content, 9 | // .sidebar { 10 | // float : left; 11 | // } 12 | // } 13 | 14 | @mixin clearfix { 15 | &:after { 16 | content:""; 17 | display:table; 18 | clear:both; 19 | } 20 | } 21 | 22 | // Acknowledgements 23 | // Beat *that* clearfix: [Thierry Koblentz](http://www.css-101.org/articles/clearfix/latest-new-clearfix-so-far.php) 24 | -------------------------------------------------------------------------------- /docs/_css/bourbon/addons/_ellipsis.scss: -------------------------------------------------------------------------------- 1 | @mixin ellipsis($width: 100%) { 2 | display: inline-block; 3 | max-width: $width; 4 | overflow: hidden; 5 | text-overflow: ellipsis; 6 | white-space: nowrap; 7 | } 8 | -------------------------------------------------------------------------------- /docs/_css/bourbon/addons/_font-family.scss: -------------------------------------------------------------------------------- 1 | $georgia: Georgia, Cambria, "Times New Roman", Times, serif; 2 | $helvetica: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; 3 | $lucida-grande: "Lucida Grande", Tahoma, Verdana, Arial, sans-serif; 4 | $monospace: "Bitstream Vera Sans Mono", Consolas, Courier, monospace; 5 | $verdana: Verdana, Geneva, sans-serif; 6 | -------------------------------------------------------------------------------- /docs/_css/bourbon/addons/_hide-text.scss: -------------------------------------------------------------------------------- 1 | @mixin hide-text { 2 | overflow: hidden; 3 | 4 | &:before { 5 | content: ""; 6 | display: block; 7 | width: 0; 8 | height: 100%; 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /docs/_css/bourbon/addons/_position.scss: -------------------------------------------------------------------------------- 1 | @mixin position ($position: relative, $coordinates: null null null null) { 2 | 3 | @if type-of($position) == list { 4 | $coordinates: $position; 5 | $position: relative; 6 | } 7 | 8 | $coordinates: unpack($coordinates); 9 | 10 | $top: nth($coordinates, 1); 11 | $right: nth($coordinates, 2); 12 | $bottom: nth($coordinates, 3); 13 | $left: nth($coordinates, 4); 14 | 15 | position: $position; 16 | 17 | @if ($top and $top == auto) or (type-of($top) == number) { 18 | top: $top; 19 | } 20 | 21 | @if ($right and $right == auto) or (type-of($right) == number) { 22 | right: $right; 23 | } 24 | 25 | @if ($bottom and $bottom == auto) or (type-of($bottom) == number) { 26 | bottom: $bottom; 27 | } 28 | 29 | @if ($left and $left == auto) or (type-of($left) == number) { 30 | left: $left; 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /docs/_css/bourbon/addons/_retina-image.scss: -------------------------------------------------------------------------------- 1 | @mixin retina-image($filename, $background-size, $extension: png, $retina-filename: null, $retina-suffix: _2x, $asset-pipeline: $asset-pipeline) { 2 | @if $asset-pipeline { 3 | background-image: image-url("#{$filename}.#{$extension}"); 4 | } 5 | @else { 6 | background-image: url("#{$filename}.#{$extension}"); 7 | } 8 | 9 | @include hidpi { 10 | @if $asset-pipeline { 11 | @if $retina-filename { 12 | background-image: image-url("#{$retina-filename}.#{$extension}"); 13 | } 14 | @else { 15 | background-image: image-url("#{$filename}#{$retina-suffix}.#{$extension}"); 16 | } 17 | } 18 | 19 | @else { 20 | @if $retina-filename { 21 | background-image: url("#{$retina-filename}.#{$extension}"); 22 | } 23 | @else { 24 | background-image: url("#{$filename}#{$retina-suffix}.#{$extension}"); 25 | } 26 | } 27 | 28 | background-size: $background-size; 29 | 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /docs/_css/bourbon/addons/_size.scss: -------------------------------------------------------------------------------- 1 | @mixin size($size) { 2 | $height: nth($size, 1); 3 | $width: $height; 4 | 5 | @if length($size) > 1 { 6 | $height: nth($size, 2); 7 | } 8 | 9 | @if $height == auto or (type-of($height) == number and not unitless($height)) { 10 | height: $height; 11 | } 12 | 13 | @if $width == auto or (type-of($width) == number and not unitless($width)) { 14 | width: $width; 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /docs/_css/bourbon/addons/_word-wrap.scss: -------------------------------------------------------------------------------- 1 | @mixin word-wrap($wrap: break-word) { 2 | word-wrap: $wrap; 3 | 4 | @if $wrap == break-word { 5 | overflow-wrap: break-word; 6 | word-break: break-all; 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /docs/_css/bourbon/css3/_appearance.scss: -------------------------------------------------------------------------------- 1 | @mixin appearance ($value) { 2 | @include prefixer(appearance, $value, webkit moz ms o spec); 3 | } 4 | -------------------------------------------------------------------------------- /docs/_css/bourbon/css3/_backface-visibility.scss: -------------------------------------------------------------------------------- 1 | //************************************************************************// 2 | // Backface-visibility mixin 3 | //************************************************************************// 4 | @mixin backface-visibility($visibility) { 5 | @include prefixer(backface-visibility, $visibility, webkit spec); 6 | } 7 | -------------------------------------------------------------------------------- /docs/_css/bourbon/css3/_border-radius.scss: -------------------------------------------------------------------------------- 1 | //************************************************************************// 2 | // Shorthand Border-radius mixins 3 | //************************************************************************// 4 | @mixin border-top-radius($radii) { 5 | @include prefixer(border-top-left-radius, $radii, spec); 6 | @include prefixer(border-top-right-radius, $radii, spec); 7 | } 8 | 9 | @mixin border-bottom-radius($radii) { 10 | @include prefixer(border-bottom-left-radius, $radii, spec); 11 | @include prefixer(border-bottom-right-radius, $radii, spec); 12 | } 13 | 14 | @mixin border-left-radius($radii) { 15 | @include prefixer(border-top-left-radius, $radii, spec); 16 | @include prefixer(border-bottom-left-radius, $radii, spec); 17 | } 18 | 19 | @mixin border-right-radius($radii) { 20 | @include prefixer(border-top-right-radius, $radii, spec); 21 | @include prefixer(border-bottom-right-radius, $radii, spec); 22 | } 23 | -------------------------------------------------------------------------------- /docs/_css/bourbon/css3/_box-sizing.scss: -------------------------------------------------------------------------------- 1 | @mixin box-sizing ($box) { 2 | // content-box | border-box | inherit 3 | @include prefixer(box-sizing, $box, webkit moz spec); 4 | } 5 | -------------------------------------------------------------------------------- /docs/_css/bourbon/css3/_calc.scss: -------------------------------------------------------------------------------- 1 | @mixin calc($property, $value) { 2 | #{$property}: -webkit-calc(#{$value}); 3 | #{$property}: calc(#{$value}); 4 | } 5 | -------------------------------------------------------------------------------- /docs/_css/bourbon/css3/_filter.scss: -------------------------------------------------------------------------------- 1 | @mixin filter($function: none) { 2 | // [ 3 | @include prefixer(perspective, $depth, webkit moz spec); 4 | } 5 | 6 | @mixin perspective-origin($value: 50% 50%) { 7 | @include prefixer(perspective-origin, $value, webkit moz spec); 8 | } 9 | -------------------------------------------------------------------------------- /docs/_css/bourbon/css3/_placeholder.scss: -------------------------------------------------------------------------------- 1 | @mixin placeholder { 2 | $placeholders: ":-webkit-input" ":-moz" "-moz" "-ms-input"; 3 | @each $placeholder in $placeholders { 4 | &:#{$placeholder}-placeholder { 5 | @content; 6 | } 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /docs/_css/bourbon/css3/_transform.scss: -------------------------------------------------------------------------------- 1 | @mixin transform($property: none) { 2 | // none | 3 | @include prefixer(transform, $property, webkit moz ms o spec); 4 | } 5 | 6 | @mixin transform-origin($axes: 50%) { 7 | // x-axis - left | center | right | length | % 8 | // y-axis - top | center | bottom | length | % 9 | // z-axis - length 10 | @include prefixer(transform-origin, $axes, webkit moz ms o spec); 11 | } 12 | 13 | @mixin transform-style ($style: flat) { 14 | @include prefixer(transform-style, $style, webkit moz ms o spec); 15 | } 16 | -------------------------------------------------------------------------------- /docs/_css/bourbon/css3/_user-select.scss: -------------------------------------------------------------------------------- 1 | @mixin user-select($arg: none) { 2 | @include prefixer(user-select, $arg, webkit moz ms spec); 3 | } 4 | -------------------------------------------------------------------------------- /docs/_css/bourbon/functions/_assign.scss: -------------------------------------------------------------------------------- 1 | @function assign-inputs($inputs, $pseudo: null) { 2 | $list : (); 3 | 4 | @each $input in $inputs { 5 | $input: unquote($input); 6 | $input: if($pseudo, $input + ":" + $pseudo, $input); 7 | $list: append($list, $input, comma); 8 | } 9 | 10 | @return $list; 11 | } -------------------------------------------------------------------------------- /docs/_css/bourbon/functions/_color-lightness.scss: -------------------------------------------------------------------------------- 1 | // Programatically determines whether a color is light or dark 2 | // Returns a boolean 3 | // More details here http://robots.thoughtbot.com/closer-look-color-lightness 4 | 5 | @function is-light($hex-color) { 6 | $-local-red: red(rgba($hex-color, 1.0)); 7 | $-local-green: green(rgba($hex-color, 1.0)); 8 | $-local-blue: blue(rgba($hex-color, 1.0)); 9 | 10 | $-local-lightness: ($-local-red * 0.2126 + $-local-green * 0.7152 + $-local-blue * 0.0722) / 255; 11 | 12 | @return $-local-lightness > .6; 13 | } 14 | -------------------------------------------------------------------------------- /docs/_css/bourbon/functions/_golden-ratio.scss: -------------------------------------------------------------------------------- 1 | @function golden-ratio($value, $increment) { 2 | @return modular-scale($value, $increment, $golden) 3 | } 4 | -------------------------------------------------------------------------------- /docs/_css/bourbon/functions/_grid-width.scss: -------------------------------------------------------------------------------- 1 | @function grid-width($n) { 2 | @return $n * $gw-column + ($n - 1) * $gw-gutter; 3 | } 4 | 5 | // The $gw-column and $gw-gutter variables must be defined in your base stylesheet to properly use the grid-width function. 6 | // 7 | // $gw-column: 100px; // Column Width 8 | // $gw-gutter: 40px; // Gutter Width 9 | // 10 | // div { 11 | // width: grid-width(4); // returns 520px; 12 | // margin-left: $gw-gutter; // returns 40px; 13 | // } 14 | -------------------------------------------------------------------------------- /docs/_css/bourbon/functions/_px-to-em.scss: -------------------------------------------------------------------------------- 1 | // Convert pixels to ems 2 | // eg. for a relational value of 12px write em(12) when the parent is 16px 3 | // if the parent is another value say 24px write em(12, 24) 4 | 5 | @function em($pxval, $base: $em-base) { 6 | @if not unitless($pxval) { 7 | $pxval: strip-units($pxval); 8 | } 9 | @if not unitless($base) { 10 | $base: strip-units($base); 11 | } 12 | @return ($pxval / $base) * 1em; 13 | } 14 | -------------------------------------------------------------------------------- /docs/_css/bourbon/functions/_px-to-rem.scss: -------------------------------------------------------------------------------- 1 | // Convert pixels to rems 2 | // eg. for a relational value of 12px write rem(12) 3 | // Assumes $em-base is the font-size of 4 | 5 | @function rem($pxval) { 6 | @if not unitless($pxval) { 7 | $pxval: strip-units($pxval); 8 | } 9 | 10 | $base: $em-base; 11 | @if not unitless($base) { 12 | $base: strip-units($base); 13 | } 14 | @return ($pxval / $base) * 1rem; 15 | } 16 | -------------------------------------------------------------------------------- /docs/_css/bourbon/functions/_strip-units.scss: -------------------------------------------------------------------------------- 1 | // Srtips the units from a value. e.g. 12px -> 12 2 | 3 | @function strip-units($val) { 4 | @return ($val / ($val * 0 + 1)); 5 | } 6 | -------------------------------------------------------------------------------- /docs/_css/bourbon/functions/_tint-shade.scss: -------------------------------------------------------------------------------- 1 | // Add percentage of white to a color 2 | @function tint($color, $percent){ 3 | @return mix(white, $color, $percent); 4 | } 5 | 6 | // Add percentage of black to a color 7 | @function shade($color, $percent){ 8 | @return mix(black, $color, $percent); 9 | } 10 | -------------------------------------------------------------------------------- /docs/_css/bourbon/functions/_transition-property-name.scss: -------------------------------------------------------------------------------- 1 | // Return vendor-prefixed property names if appropriate 2 | // Example: transition-property-names((transform, color, background), moz) -> -moz-transform, color, background 3 | //************************************************************************// 4 | @function transition-property-names($props, $vendor: false) { 5 | $new-props: (); 6 | 7 | @each $prop in $props { 8 | $new-props: append($new-props, transition-property-name($prop, $vendor), comma); 9 | } 10 | 11 | @return $new-props; 12 | } 13 | 14 | @function transition-property-name($prop, $vendor: false) { 15 | // put other properties that need to be prefixed here aswell 16 | @if $vendor and $prop == transform { 17 | @return unquote('-'+$vendor+'-'+$prop); 18 | } 19 | @else { 20 | @return $prop; 21 | } 22 | } -------------------------------------------------------------------------------- /docs/_css/bourbon/functions/_unpack.scss: -------------------------------------------------------------------------------- 1 | // Convert shorthand to the 4-value syntax 2 | 3 | @function unpack($shorthand) { 4 | @if length($shorthand) == 1 { 5 | @return nth($shorthand, 1) nth($shorthand, 1) nth($shorthand, 1) nth($shorthand, 1); 6 | } 7 | @else if length($shorthand) == 2 { 8 | @return nth($shorthand, 1) nth($shorthand, 2) nth($shorthand, 1) nth($shorthand, 2); 9 | } 10 | @else if length($shorthand) == 3 { 11 | @return nth($shorthand, 1) nth($shorthand, 2) nth($shorthand, 3) nth($shorthand, 2); 12 | } 13 | @else { 14 | @return $shorthand; 15 | } 16 | } 17 | 18 | -------------------------------------------------------------------------------- /docs/_css/bourbon/helpers/_convert-units.scss: -------------------------------------------------------------------------------- 1 | //************************************************************************// 2 | // Helper function for str-to-num fn. 3 | // Source: http://sassmeister.com/gist/9647408 4 | //************************************************************************// 5 | @function _convert-units($number, $unit) { 6 | $strings: 'px' 'cm' 'mm' '%' 'ch' 'pica' 'in' 'em' 'rem' 'pt' 'pc' 'ex' 'vw' 'vh' 'vmin' 'vmax', 'deg', 'rad', 'grad', 'turn'; 7 | $units: 1px 1cm 1mm 1% 1ch 1pica 1in 1em 1rem 1pt 1pc 1ex 1vw 1vh 1vmin 1vmax, 1deg, 1rad, 1grad, 1turn; 8 | $index: index($strings, $unit); 9 | 10 | @if not $index { 11 | @warn "Unknown unit `#{$unit}`."; 12 | @return false; 13 | } 14 | @return $number * nth($units, $index); 15 | } 16 | -------------------------------------------------------------------------------- /docs/_css/bourbon/helpers/_gradient-positions-parser.scss: -------------------------------------------------------------------------------- 1 | @function _gradient-positions-parser($gradient-type, $gradient-positions) { 2 | @if $gradient-positions 3 | and ($gradient-type == linear) 4 | and (type-of($gradient-positions) != color) { 5 | $gradient-positions: _linear-positions-parser($gradient-positions); 6 | } 7 | @else if $gradient-positions 8 | and ($gradient-type == radial) 9 | and (type-of($gradient-positions) != color) { 10 | $gradient-positions: _radial-positions-parser($gradient-positions); 11 | } 12 | @return $gradient-positions; 13 | } 14 | -------------------------------------------------------------------------------- /docs/_css/bourbon/helpers/_is-num.scss: -------------------------------------------------------------------------------- 1 | //************************************************************************// 2 | // Helper for linear-gradient-parser 3 | //************************************************************************// 4 | @function _is-num($char) { 5 | $values: '0' '1' '2' '3' '4' '5' '6' '7' '8' '9' 0 1 2 3 4 5 6 7 8 9; 6 | $index: index($values, $char); 7 | @return if($index, true, false); 8 | } 9 | -------------------------------------------------------------------------------- /docs/_css/bourbon/helpers/_linear-angle-parser.scss: -------------------------------------------------------------------------------- 1 | // Private function for linear-gradient-parser 2 | @function _linear-angle-parser($image, $first-val, $prefix, $suffix) { 3 | $offset: null; 4 | $unit-short: str-slice($first-val, str-length($first-val) - 2, str-length($first-val)); 5 | $unit-long: str-slice($first-val, str-length($first-val) - 3, str-length($first-val)); 6 | 7 | @if ($unit-long == "grad") or 8 | ($unit-long == "turn") { 9 | $offset: if($unit-long == "grad", -100grad * 3, -0.75turn); 10 | } 11 | 12 | @else if ($unit-short == "deg") or 13 | ($unit-short == "rad") { 14 | $offset: if($unit-short == "deg", -90 * 3, 1.6rad); 15 | } 16 | 17 | @if $offset { 18 | $num: _str-to-num($first-val); 19 | 20 | @return ( 21 | webkit-image: -webkit- + $prefix + ($offset - $num) + $suffix, 22 | spec-image: $image 23 | ); 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /docs/_css/bourbon/helpers/_linear-gradient-parser.scss: -------------------------------------------------------------------------------- 1 | @function _linear-gradient-parser($image) { 2 | $image: unquote($image); 3 | $gradients: (); 4 | $start: str-index($image, "("); 5 | $end: str-index($image, ","); 6 | $first-val: str-slice($image, $start + 1, $end - 1); 7 | 8 | $prefix: str-slice($image, 0, $start); 9 | $suffix: str-slice($image, $end, str-length($image)); 10 | 11 | $has-multiple-vals: str-index($first-val, " "); 12 | $has-single-position: unquote(_position-flipper($first-val) + ""); 13 | $has-angle: _is-num(str-slice($first-val, 0, 0)); 14 | 15 | @if $has-multiple-vals { 16 | $gradients: _linear-side-corner-parser($image, $first-val, $prefix, $suffix, $has-multiple-vals); 17 | } 18 | 19 | @else if $has-single-position != "" { 20 | $pos: unquote($has-single-position + ""); 21 | 22 | $gradients: ( 23 | webkit-image: -webkit- + $image, 24 | spec-image: $prefix + "to " + $pos + $suffix 25 | ); 26 | } 27 | 28 | @else if $has-angle { 29 | // Rotate degree for webkit 30 | $gradients: _linear-angle-parser($image, $first-val, $prefix, $suffix); 31 | } 32 | 33 | @else { 34 | $gradients: ( 35 | webkit-image: -webkit- + $image, 36 | spec-image: $image 37 | ); 38 | } 39 | 40 | @return $gradients; 41 | } 42 | -------------------------------------------------------------------------------- /docs/_css/bourbon/helpers/_linear-side-corner-parser.scss: -------------------------------------------------------------------------------- 1 | // Private function for linear-gradient-parser 2 | @function _linear-side-corner-parser($image, $first-val, $prefix, $suffix, $has-multiple-vals) { 3 | $val-1: str-slice($first-val, 0, $has-multiple-vals - 1 ); 4 | $val-2: str-slice($first-val, $has-multiple-vals + 1, str-length($first-val)); 5 | $val-3: null; 6 | $has-val-3: str-index($val-2, " "); 7 | 8 | @if $has-val-3 { 9 | $val-3: str-slice($val-2, $has-val-3 + 1, str-length($val-2)); 10 | $val-2: str-slice($val-2, 0, $has-val-3 - 1); 11 | } 12 | 13 | $pos: _position-flipper($val-1) _position-flipper($val-2) _position-flipper($val-3); 14 | $pos: unquote($pos + ""); 15 | 16 | // Use old spec for webkit 17 | @if $val-1 == "to" { 18 | @return ( 19 | webkit-image: -webkit- + $prefix + $pos + $suffix, 20 | spec-image: $image 21 | ); 22 | } 23 | 24 | // Bring the code up to spec 25 | @else { 26 | @return ( 27 | webkit-image: -webkit- + $image, 28 | spec-image: $prefix + "to " + $pos + $suffix 29 | ); 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /docs/_css/bourbon/helpers/_radial-positions-parser.scss: -------------------------------------------------------------------------------- 1 | @function _radial-positions-parser($gradient-pos) { 2 | $shape-size: nth($gradient-pos, 1); 3 | $pos: nth($gradient-pos, 2); 4 | $shape-size-spec: _shape-size-stripper($shape-size); 5 | 6 | $pre-spec: unquote(if($pos, "#{$pos}, ", null)) 7 | unquote(if($shape-size, "#{$shape-size},", null)); 8 | $pos-spec: if($pos, "at #{$pos}", null); 9 | 10 | $spec: "#{$shape-size-spec} #{$pos-spec}"; 11 | 12 | // Add comma 13 | @if ($spec != ' ') { 14 | $spec: "#{$spec}," 15 | } 16 | 17 | @return $pre-spec $spec; 18 | } 19 | -------------------------------------------------------------------------------- /docs/_css/bourbon/helpers/_render-gradients.scss: -------------------------------------------------------------------------------- 1 | // User for linear and radial gradients within background-image or border-image properties 2 | 3 | @function _render-gradients($gradient-positions, $gradients, $gradient-type, $vendor: false) { 4 | $pre-spec: null; 5 | $spec: null; 6 | $vendor-gradients: null; 7 | @if $gradient-type == linear { 8 | @if $gradient-positions { 9 | $pre-spec: nth($gradient-positions, 1); 10 | $spec: nth($gradient-positions, 2); 11 | } 12 | } 13 | @else if $gradient-type == radial { 14 | $pre-spec: nth($gradient-positions, 1); 15 | $spec: nth($gradient-positions, 2); 16 | } 17 | 18 | @if $vendor { 19 | $vendor-gradients: -#{$vendor}-#{$gradient-type}-gradient(#{$pre-spec} $gradients); 20 | } 21 | @else if $vendor == false { 22 | $vendor-gradients: "#{$gradient-type}-gradient(#{$spec} #{$gradients})"; 23 | $vendor-gradients: unquote($vendor-gradients); 24 | } 25 | @return $vendor-gradients; 26 | } 27 | -------------------------------------------------------------------------------- /docs/_css/bourbon/helpers/_shape-size-stripper.scss: -------------------------------------------------------------------------------- 1 | @function _shape-size-stripper($shape-size) { 2 | $shape-size-spec: null; 3 | @each $value in $shape-size { 4 | @if ($value == "cover") or ($value == "contain") { 5 | $value: null; 6 | } 7 | $shape-size-spec: "#{$shape-size-spec} #{$value}"; 8 | } 9 | @return $shape-size-spec; 10 | } 11 | -------------------------------------------------------------------------------- /docs/_css/bourbon/settings/_asset-pipeline.scss: -------------------------------------------------------------------------------- 1 | $asset-pipeline: false !default; 2 | -------------------------------------------------------------------------------- /docs/_css/bourbon/settings/_prefixer.scss: -------------------------------------------------------------------------------- 1 | // Variable settings for /addons/prefixer.scss 2 | $prefix-for-webkit: true !default; 3 | $prefix-for-mozilla: true !default; 4 | $prefix-for-microsoft: true !default; 5 | $prefix-for-opera: true !default; 6 | $prefix-for-spec: true !default; // required for keyframe mixin 7 | -------------------------------------------------------------------------------- /docs/_css/bourbon/settings/_px-to-em.scss: -------------------------------------------------------------------------------- 1 | $em-base: 16px !default; 2 | -------------------------------------------------------------------------------- /docs/_includes/blog_post.html: -------------------------------------------------------------------------------- 1 |

{{ page.title }}

2 |

{{ page.date | date_to_string }} by {{ page.author }}

3 | 4 |
5 | {% if content != '' %} 6 | {{ page.excerpt }} 7 | {% else %} 8 | {{ page.content }} 9 | {% endif %} 10 |
11 | -------------------------------------------------------------------------------- /docs/_includes/nav_blog.html: -------------------------------------------------------------------------------- 1 | 12 | -------------------------------------------------------------------------------- /docs/_includes/nav_docs.html: -------------------------------------------------------------------------------- 1 | 39 | -------------------------------------------------------------------------------- /docs/_js/examples/hello.js: -------------------------------------------------------------------------------- 1 | var HELLO_COMPONENT = ` 2 | var HelloMessage = React.createClass({ 3 | render: function() { 4 | return
Hello {this.props.name}
; 5 | } 6 | }); 7 | 8 | React.render(, mountNode); 9 | `; 10 | 11 | React.render( 12 | , 13 | document.getElementById('helloExample') 14 | ); 15 | -------------------------------------------------------------------------------- /docs/_js/examples/markdown.js: -------------------------------------------------------------------------------- 1 | var MARKDOWN_COMPONENT = ` 2 | var converter = new Showdown.converter(); 3 | 4 | var MarkdownEditor = React.createClass({ 5 | getInitialState: function() { 6 | return {value: 'Type some *markdown* here!'}; 7 | }, 8 | handleChange: function() { 9 | this.setState({value: this.refs.textarea.getDOMNode().value}); 10 | }, 11 | render: function() { 12 | return ( 13 |
14 |

Input

15 |