Facebook/react
1
0
Fork 0
mirror of https://github.com/facebook/react.git synced 2025-11-01 09:12:30 +00:00
Code Issues Packages Projects Releases Wiki Activity

Rebuild website

Browse Source
This commit is contained in:
Travis CI
2016-03-08 01:55:35 +00:00
parent dfbee7f109
commit 81c8a0732d
9 changed files with 1 additions and 362 deletions
Download Patch File Download Diff File Expand all files Collapse all files
feed.xml
+1 -1
View File
@@ -8,7 +8,7 @@
<item>
<title>React v15.0 Release Candidate</title>
<description>&lt;p&gt;Sorry for the small delay in releasing this. As we said, we&amp;#39;ve been busy binge-watching House of Cards. That scene in the last episode where Francis and Claire Underwood &lt;abbr title=&quot;You didn&#39;t think we would actually spoil anything did you?&quot;&gt;████████████████████████████████████&lt;/abbr&gt;. WOW!&lt;/p&gt;
<description>&lt;p&gt;Sorry for the small delay in releasing this. As we said, we&amp;#39;ve been busy binge-watching House of Cards. That scene in the last episode where Francis and Claire Underwood &lt;abbr title=&quot;You didn't think we would actually spoil anything did you?&quot;&gt;████████████████████████████████████&lt;/abbr&gt;. WOW!&lt;/p&gt;
&lt;p&gt;But now we&amp;#39;re ready, so without further ado, we&amp;#39;re shipping a release candidate for React v15 now. As a reminder, &lt;a href=&quot;/react/blog/2016/02/19/new-versioning-scheme.html&quot;&gt;we&amp;#39;re switching to major versions&lt;/a&gt; to indicate that we have been using React in production for a long time. This 15.0 release follows our previous 0.14 version and we&amp;#39;ll continue to follow semver like we&amp;#39;ve been doing since 2013. It&amp;#39;s also worth noting that &lt;a href=&quot;/react/blog/2016/01/12/discontinuing-ie8-support.html&quot;&gt;we no longer actively support Internet Explorer 8&lt;/a&gt;. We believe React will work in its current form there but we will not be prioritizing any efforts to fix new issues that only affect IE8.&lt;/p&gt;
js/examples/hello.js
-5
View File
@@ -1,5 +0,0 @@
'use strict';
var HELLO_COMPONENT = '\nvar HelloMessage = React.createClass({\n render: function() {\n return <div>Hello {this.props.name}</div>;\n }\n});\n\nReactDOM.render(<HelloMessage name="John" />, mountNode);\n';
ReactDOM.render(React.createElement(ReactPlayground, { codeText: HELLO_COMPONENT }), document.getElementById('helloExample'));
js/examples/markdown.js
-5
View File
@@ -1,5 +0,0 @@
'use strict';
var MARKDOWN_COMPONENT = '\nvar MarkdownEditor = React.createClass({\n getInitialState: function() {\n return {value: \'Type some *markdown* here!\'};\n },\n handleChange: function() {\n this.setState({value: this.refs.textarea.value});\n },\n rawMarkup: function() {\n return { __html: marked(this.state.value, {sanitize: true}) };\n },\n render: function() {\n return (\n <div className="MarkdownEditor">\n <h3>Input</h3>\n <textarea\n onChange={this.handleChange}\n ref="textarea"\n defaultValue={this.state.value} />\n <h3>Output</h3>\n <div\n className="content"\n dangerouslySetInnerHTML={this.rawMarkup()}\n />\n </div>\n );\n }\n});\n\nReactDOM.render(<MarkdownEditor />, mountNode);\n';
ReactDOM.render(React.createElement(ReactPlayground, { codeText: MARKDOWN_COMPONENT }), document.getElementById('markdownExample'));
js/examples/timer.js
-5
View File
@@ -1,5 +0,0 @@
'use strict';
var TIMER_COMPONENT = '\nvar Timer = React.createClass({\n getInitialState: function() {\n return {secondsElapsed: 0};\n },\n tick: function() {\n this.setState({secondsElapsed: this.state.secondsElapsed + 1});\n },\n componentDidMount: function() {\n this.interval = setInterval(this.tick, 1000);\n },\n componentWillUnmount: function() {\n clearInterval(this.interval);\n },\n render: function() {\n return (\n <div>Seconds Elapsed: {this.state.secondsElapsed}</div>\n );\n }\n});\n\nReactDOM.render(<Timer />, mountNode);\n';
ReactDOM.render(React.createElement(ReactPlayground, { codeText: TIMER_COMPONENT }), document.getElementById('timerExample'));
js/examples/todo.js
-5
View File
@@ -1,5 +0,0 @@
'use strict';
var TODO_COMPONENT = '\nvar TodoList = React.createClass({\n render: function() {\n var createItem = function(item) {\n return <li key={item.id}>{item.text}</li>;\n };\n return <ul>{this.props.items.map(createItem)}</ul>;\n }\n});\nvar TodoApp = React.createClass({\n getInitialState: function() {\n return {items: [], text: \'\'};\n },\n onChange: function(e) {\n this.setState({text: e.target.value});\n },\n handleSubmit: function(e) {\n e.preventDefault();\n var nextItems = this.state.items.concat([{text: this.state.text, id: Date.now()}]);\n var nextText = \'\';\n this.setState({items: nextItems, text: nextText});\n },\n render: function() {\n return (\n <div>\n <h3>TODO</h3>\n <TodoList items={this.state.items} />\n <form onSubmit={this.handleSubmit}>\n <input onChange={this.onChange} value={this.state.text} />\n <button>{\'Add #\' + (this.state.items.length + 1)}</button>\n </form>\n </div>\n );\n }\n});\n\nReactDOM.render(<TodoApp />, mountNode);\n';
ReactDOM.render(React.createElement(ReactPlayground, { codeText: TODO_COMPONENT }), document.getElementById('todoExample'));
js/html-jsx-lib.js
-5
View File
@@ -1,5 +0,0 @@
// Ideally it would be nice to just redirect, but Github Pages is very basic and
// lacks that functionality.
'use strict';
console.warn('html-jsx-lib.js has moved to http://reactjs.github.io/react-magic/' + 'htmltojsx.min.js. If using React-Magic, you are no longer required to ' + 'link to this file. Please delete its <script> tag.');
js/html-jsx.js
-91
View File
@@ -1,91 +0,0 @@
/**
* Copyright 2013-2015, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*/
/**
* This is a web interface for the HTML to JSX converter contained in
* `html-jsx-lib.js`.
*/
"use strict";
;(function () {
var HELLO_COMPONENT = "\
<!-- Hello world -->\n\
<div class=\"awesome\" style=\"border: 1px solid red\">\n\
<label for=\"name\">Enter your name: </label>\n\
<input type=\"text\" id=\"name\" />\n\
</div>\n\
<p>Enter your HTML here</p>\
";
var HTMLtoJSXComponent = React.createClass({
displayName: "HTMLtoJSXComponent",
getInitialState: function getInitialState() {
return {
outputClassName: 'NewComponent',
createClass: true
};
},
onReactClassNameChange: function onReactClassNameChange(evt) {
this.setState({ outputClassName: evt.target.value });
},
onCreateClassChange: function onCreateClassChange(evt) {
this.setState({ createClass: evt.target.checked });
},
setInput: function setInput(input) {
this.setState({ input: input });
this.convertToJsx();
},
convertToJSX: function convertToJSX(input) {
var converter = new HTMLtoJSX({
outputClassName: this.state.outputClassName,
createClass: this.state.createClass
});
return converter.convert(input);
},
render: function render() {
return React.createElement(
"div",
null,
React.createElement(
"div",
{ id: "options" },
React.createElement(
"label",
null,
React.createElement("input", {
type: "checkbox",
checked: this.state.createClass,
onChange: this.onCreateClassChange }),
"Create class"
),
React.createElement(
"label",
{ style: { display: this.state.createClass ? '' : 'none' } },
"· Class name:",
React.createElement("input", {
type: "text",
value: this.state.outputClassName,
onChange: this.onReactClassNameChange })
)
),
React.createElement(ReactPlayground, {
codeText: HELLO_COMPONENT,
renderCode: true,
transformer: this.convertToJSX,
showCompiledJSTab: false,
editorTabTitle: "Live HTML Editor"
})
);
}
});
ReactDOM.render(React.createElement(HTMLtoJSXComponent, null), document.getElementById('jsxCompiler'));
})();
js/jsfiddle-integration.js
-10
View File
@@ -1,10 +0,0 @@
'use strict';
(function () {
var tag = document.querySelector('script[type="application/javascript;version=1.7"]');
if (!tag || tag.textContent.indexOf('window.onload=function(){') !== -1) {
alert('Bad JSFiddle configuration, please fork the original React JSFiddle');
}
tag.setAttribute('type', 'text/jsx;harmony=true');
tag.textContent = tag.textContent.replace(/^\/\/<!\[CDATA\[/, '');
})();
js/live_editor.js
-235
View File
@@ -1,235 +0,0 @@
'use strict';
var IS_MOBILE = navigator.userAgent.match(/Android/i) || navigator.userAgent.match(/webOS/i) || navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i) || navigator.userAgent.match(/iPod/i) || navigator.userAgent.match(/BlackBerry/i) || navigator.userAgent.match(/Windows Phone/i);
var CodeMirrorEditor = React.createClass({
displayName: 'CodeMirrorEditor',
propTypes: {
lineNumbers: React.PropTypes.bool,
onChange: React.PropTypes.func
},
getDefaultProps: function getDefaultProps() {
return {
lineNumbers: false
};
},
componentDidMount: function componentDidMount() {
if (IS_MOBILE) return;
this.editor = CodeMirror.fromTextArea(ReactDOM.findDOMNode(this.refs.editor), {
mode: 'javascript',
lineNumbers: this.props.lineNumbers,
lineWrapping: true,
smartIndent: false, // javascript mode does bad things with jsx indents
matchBrackets: true,
theme: 'solarized-light',
readOnly: this.props.readOnly
});
this.editor.on('change', this.handleChange);
},
componentDidUpdate: function componentDidUpdate() {
if (this.props.readOnly) {
this.editor.setValue(this.props.codeText);
}
},
handleChange: function handleChange() {
if (!this.props.readOnly) {
this.props.onChange && this.props.onChange(this.editor.getValue());
}
},
render: function render() {
// wrap in a div to fully contain CodeMirror
var editor;
if (IS_MOBILE) {
editor = React.createElement(
'pre',
{ style: { overflow: 'scroll' } },
this.props.codeText
);
} else {
editor = React.createElement('textarea', { ref: 'editor', defaultValue: this.props.codeText });
}
return React.createElement(
'div',
{ style: this.props.style, className: this.props.className },
editor
);
}
});
var selfCleaningTimeout = {
componentDidUpdate: function componentDidUpdate() {
clearTimeout(this.timeoutID);
},
setTimeout: (function (_setTimeout) {
function setTimeout() {
return _setTimeout.apply(this, arguments);
}
setTimeout.toString = function () {
return _setTimeout.toString();
};
return setTimeout;
})(function () {
clearTimeout(this.timeoutID);
this.timeoutID = setTimeout.apply(null, arguments);
})
};
var ReactPlayground = React.createClass({
displayName: 'ReactPlayground',
mixins: [selfCleaningTimeout],
MODES: { JSX: 'JSX', JS: 'JS' }, //keyMirror({JSX: true, JS: true}),
propTypes: {
codeText: React.PropTypes.string.isRequired,
transformer: React.PropTypes.func,
renderCode: React.PropTypes.bool,
showCompiledJSTab: React.PropTypes.bool,
showLineNumbers: React.PropTypes.bool,
editorTabTitle: React.PropTypes.string
},
getDefaultProps: function getDefaultProps() {
return {
transformer: function transformer(code) {
return babel.transform(code).code;
},
editorTabTitle: 'Live JSX Editor',
showCompiledJSTab: true,
showLineNumbers: false
};
},
getInitialState: function getInitialState() {
return {
mode: this.MODES.JSX,
code: this.props.codeText
};
},
handleCodeChange: function handleCodeChange(value) {
this.setState({ code: value });
this.executeCode();
},
handleCodeModeSwitch: function handleCodeModeSwitch(mode) {
this.setState({ mode: mode });
},
compileCode: function compileCode() {
return this.props.transformer(this.state.code);
},
render: function render() {
var isJS = this.state.mode === this.MODES.JS;
var compiledCode = '';
try {
compiledCode = this.compileCode();
} catch (err) {}
var JSContent = React.createElement(CodeMirrorEditor, {
key: 'js',
className: 'playgroundStage CodeMirror-readonly',
onChange: this.handleCodeChange,
codeText: compiledCode,
readOnly: true,
lineNumbers: this.props.showLineNumbers
});
var JSXContent = React.createElement(CodeMirrorEditor, {
key: 'jsx',
onChange: this.handleCodeChange,
className: 'playgroundStage',
codeText: this.state.code,
lineNumbers: this.props.showLineNumbers
});
var JSXTabClassName = 'playground-tab' + (isJS ? '' : ' playground-tab-active');
var JSTabClassName = 'playground-tab' + (isJS ? ' playground-tab-active' : '');
var JSTab = React.createElement(
'div',
{
className: JSTabClassName,
onClick: this.handleCodeModeSwitch.bind(this, this.MODES.JS) },
'Compiled JS'
);
var JSXTab = React.createElement(
'div',
{
className: JSXTabClassName,
onClick: this.handleCodeModeSwitch.bind(this, this.MODES.JSX) },
this.props.editorTabTitle
);
return React.createElement(
'div',
{ className: 'playground' },
React.createElement(
'div',
null,
JSXTab,
this.props.showCompiledJSTab && JSTab
),
React.createElement(
'div',
{ className: 'playgroundCode' },
isJS ? JSContent : JSXContent
),
React.createElement(
'div',
{ className: 'playgroundPreview' },
React.createElement('div', { ref: 'mount' })
)
);
},
componentDidMount: function componentDidMount() {
this.executeCode();
},
componentDidUpdate: function componentDidUpdate(prevProps, prevState) {
// execute code only when the state's not being updated by switching tab
// this avoids re-displaying the error, which comes after a certain delay
if (this.props.transformer !== prevProps.transformer || this.state.code !== prevState.code) {
this.executeCode();
}
},
executeCode: function executeCode() {
var mountNode = ReactDOM.findDOMNode(this.refs.mount);
try {
ReactDOM.unmountComponentAtNode(mountNode);
} catch (e) {}
try {
var compiledCode = this.compileCode();
if (this.props.renderCode) {
ReactDOM.render(React.createElement(CodeMirrorEditor, { codeText: compiledCode, readOnly: true }), mountNode);
} else {
eval(compiledCode);
}
} catch (err) {
this.setTimeout(function () {
ReactDOM.render(React.createElement(
'div',
{ className: 'playgroundError' },
err.toString()
), mountNode);
}, 500);
}
}
});