reprism/es/__tests__/snippets/javascript.js

Modular Syntax highlighting for the web

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = "class TodoApp extends React.Component {\n  constructor(props) {\n    super(props);\n    this.state = { items: [], text: \"\" };\n    this.handleChange = this.handleChange.bind(this);\n    this.handleSubmit = this.handleSubmit.bind(this);\n  }\n\n  render() {\n    return (\n      <div>\n        <h3>TODO</h3>\n        <TodoList items={this.state.items} />\n        <form onSubmit={this.handleSubmit}>\n          <label htmlFor=\"new-todo\">What needs to be done?</label>\n          <input\n            id=\"new-todo\"\n            onChange={this.handleChange}\n            value={this.state.text}\n          />\n          <button>Add #{this.state.items.length + 1}</button>\n        </form>\n      </div>\n    );\n  }\n\n  handleChange(e) {\n    this.setState({ text: e.target.value });\n  }\n\n  handleSubmit(e) {\n    e.preventDefault();\n    if (!this.state.text.length) {\n      return;\n    }\n    const newItem = {\n      text: this.state.text,\n      id: Date.now()\n    };\n    this.setState(prevState => ({\n      items: prevState.items.concat(newItem),\n      text: \"\"\n    }));\n  }\n}\n\nclass TodoList extends React.Component {\n  render() {\n    return (\n      <ul>\n        {this.props.items.map(item => <li key={item.id}>{item.text}</li>)}\n      </ul>\n    );\n  }\n}\n\nReactDOM.render(<TodoApp />, mountNode);";