Merge pull request JedWatson#19 from timnew/master

JedWatson · JedWatson · commit 0ae4841de45b · 2015-10-28T23:56:30.000+11:00
Update React to 0.14 and add className property
diff --git a/dist/react-codemirror.js b/dist/react-codemirror.js
@@ -1,4 +1,54 @@
 (function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.Codemirror = f()}})(function(){var define,module,exports;return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
+/*!
+ Copyright (c) 2015 Jed Watson.
+ Licensed under the MIT License (MIT), see
+ http://jedwatson.github.io/classnames
+*/
+/* global define */
+
+(function (){
+	'use strict';
+
+	var hasOwn ={}.hasOwnProperty;
+
+	function classNames (){
+		var classes = '';
+
+		for (var i = 0; i < arguments.length; i++){
+			var arg = arguments[i];
+			if (!arg) continue;
+
+			var argType = typeof arg;
+
+			if (argType === 'string' || argType === 'number'){
+				classes += ' ' + arg;
+			} else if (Array.isArray(arg)){
+				classes += ' ' + classNames.apply(null, arg);
+			} else if (argType === 'object'){
+				for (var key in arg){
+					if (hasOwn.call(arg, key) && arg[key]){
+						classes += ' ' + key;
+					}
+				}
+			}
+		}
+
+		return classes.substr(1);
+	}
+
+	if (typeof module !== 'undefined' && module.exports){
+		module.exports = classNames;
+	} else if (typeof define === 'function' && typeof define.amd === 'object' && define.amd){
+		// register as 'classnames', consistent with npm package name
+		define('classnames', function (){
+			return classNames;
+		});
+	} else{
+		window.classNames = classNames;
+	}
+}());
+
+},{}],2:[function(require,module,exports){
 // CodeMirror, copyright (c) by Marijn Haverbeke and others
 // Distributed under an MIT license: http://codemirror.net/LICENSE
 
@@ -8856,12 +8906,13 @@
 return CodeMirror;
 });
 
-},{}],2:[function(require,module,exports){
+},{}],3:[function(require,module,exports){
 (function (global){
 'use strict';
 
 var CM = require('codemirror');
 var React = (typeof window !== "undefined" ? window['React'] : typeof global !== "undefined" ? global['React'] : null);
+var className = require('classnames');
 
 var CodeMirror = React.createClass({
 	displayName: 'CodeMirror',
@@ -8871,7 +8922,8 @@ var CodeMirror = React.createClass({
 		onFocusChange: React.PropTypes.func,
 		options: React.PropTypes.object,
 		path: React.PropTypes.string,
-		value: React.PropTypes.string
+		value: React.PropTypes.string,
+		className: React.PropTypes.any
 	},
 
 	getInitialState: function getInitialState(){
@@ -8881,7 +8933,7 @@ var CodeMirror = React.createClass({
 	},
 
 	componentDidMount: function componentDidMount(){
-		var textareaNode = React.findDOMNode(this.refs.textarea);
+		var textareaNode = this.refs.textarea;
 		this.codeMirror = CM.fromTextArea(textareaNode, this.props.options);
 		this.codeMirror.on('change', this.codemirrorValueChanged);
 		this.codeMirror.on('focus', this.focusChanged.bind(this, true));
@@ -8934,13 +8986,11 @@ var CodeMirror = React.createClass({
 	},
 
 	render: function render(){
-		var className = 'ReactCodeMirror';
-		if (this.state.isFocused){
-			className += ' ReactCodeMirror--focused';
-		}
+		var editorClassName = className('ReactCodeMirror', this.state.isFocused ? 'ReactCodeMirror--focused' : null, this.props.className);
+
 		return React.createElement(
 			'div',
-			{className: className },
+			{className: editorClassName },
 			React.createElement('textarea',{ref: 'textarea', name: this.props.path, defaultValue: '', autoComplete: 'off' })
 		);
 	}
@@ -8950,5 +9000,5 @@ var CodeMirror = React.createClass({
 module.exports = CodeMirror;
 
 }).call(this,typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window :{})
-},{"codemirror":1}]},{},[2])(2)
+},{"classnames":1,"codemirror":2}]},{},[3])(3)
 });
diff --git a/dist/react-codemirror.min.js b/dist/react-codemirror.min.js
diff --git a/lib/Codemirror.js b/lib/Codemirror.js
@@ -2,6 +2,7 @@
 
 var CM = require('codemirror');
 var React = require('react');
+var className = require('classnames');
 
 var CodeMirror = React.createClass({
 	displayName: 'CodeMirror',
@@ -11,7 +12,8 @@ var CodeMirror = React.createClass({
 		onFocusChange: React.PropTypes.func,
 		options: React.PropTypes.object,
 		path: React.PropTypes.string,
-		value: React.PropTypes.string
+		value: React.PropTypes.string,
+		className: React.PropTypes.any
 	},
 
 	getInitialState: function getInitialState(){
@@ -21,7 +23,7 @@ var CodeMirror = React.createClass({
 	},
 
 	componentDidMount: function componentDidMount(){
-		var textareaNode = React.findDOMNode(this.refs.textarea);
+		var textareaNode = this.refs.textarea;
 		this.codeMirror = CM.fromTextArea(textareaNode, this.props.options);
 		this.codeMirror.on('change', this.codemirrorValueChanged);
 		this.codeMirror.on('focus', this.focusChanged.bind(this, true));
@@ -74,13 +76,11 @@ var CodeMirror = React.createClass({
 	},
 
 	render: function render(){
-		var className = 'ReactCodeMirror';
-		if (this.state.isFocused){
-			className += ' ReactCodeMirror--focused';
-		}
+		var editorClassName = className('ReactCodeMirror', this.state.isFocused ? 'ReactCodeMirror--focused' : null, this.props.className);
+
 		return React.createElement(
 			'div',
-			{className: className },
+			{className: editorClassName },
 			React.createElement('textarea',{ref: 'textarea', name: this.props.path, defaultValue: '', autoComplete: 'off' })
 		);
 	}
diff --git a/package.json b/package.json
@@ -14,17 +14,17 @@
 "url": "https://github.com/JedWatson/react-codemirror/issues"
 },
 "dependencies":{
- "classnames": "^2.1.5",
+ "classnames": "^2.2.0",
 "codemirror": "^5.7.0"
 },
 "devDependencies":{
 "gulp": "^3.9.0",
 "happiness": "^1.0.7",
- "react": "^0.13.3",
+ "react": "^0.14.0",
 "react-component-gulp-tasks": "^0.7.6"
 },
 "peerDependencies":{
- "react": "^0.13 || ^0.14.0-beta"
+ "react": "^0.14.0"
 },
 "browserify-shim":{
 "react": "global:React"
diff --git a/src/Codemirror.js b/src/Codemirror.js
@@ -1,5 +1,6 @@
 var CM = require('codemirror');
 var React = require('react');
+var className = require('classnames');
 
 var CodeMirror = React.createClass({
 
@@ -8,7 +9,8 @@ var CodeMirror = React.createClass({
 		onFocusChange: React.PropTypes.func,
 		options: React.PropTypes.object,
 		path: React.PropTypes.string,
-		value: React.PropTypes.string
+		value: React.PropTypes.string,
+		className: React.PropTypes.any,
 	},
 
 	getInitialState (){
@@ -18,7 +20,7 @@ var CodeMirror = React.createClass({
 	},
 
 	componentDidMount (){
-		var textareaNode = React.findDOMNode(this.refs.textarea);
+		var textareaNode = this.refs.textarea;
 		this.codeMirror = CM.fromTextArea(textareaNode, this.props.options);
 		this.codeMirror.on('change', this.codemirrorValueChanged);
 		this.codeMirror.on('focus', this.focusChanged.bind(this, true));
@@ -71,12 +73,14 @@ var CodeMirror = React.createClass({
 	},
 
 	render (){
-		var className = 'ReactCodeMirror';
-		if (this.state.isFocused){
-			className += ' ReactCodeMirror--focused';
-		}
+		var editorClassName = className(
+			'ReactCodeMirror',
+			this.state.isFocused ? 'ReactCodeMirror--focused' : null,
+			this.props.className
+		);
+
 		return (
-			<div className={className}>
+			<div className={editorClassName}>
 				<textarea ref="textarea" name={this.props.path} defaultValue={''} autoComplete="off" />
 			</div>
 		);

-Original file line number
+Diff line change
@@ @@ -1,4 +1,54 @@ @@
 (function(f){if(typeofexports==="object"&&typeofmodule!=="undefined"){module.exports=f()}elseif(typeofdefine==="function"&&define.amd){define([],f)}else{varg;if(typeofwindow!=="undefined"){g=window}elseif(typeofglobal!=="undefined"){g=global}elseif(typeofself!=="undefined"){g=self}else{g=this}g.Codemirror=f()}})(function(){vardefine,module,exports;return(functione(t,n,r){functions(o,u){if(!n[o]){if(!t[o]){vara=typeofrequire=="function"&&require;if(!u&&a)returna(o,!0);if(i)returni(o,!0);varf=newError("Cannot find module '"+o+"'");throwf.code="MODULE_NOT_FOUND",f}varl=n[o]={exports:{}};t[o][0].call(l.exports,function(e){varn=t[o][1][e];returns(n?n:e)},l,l.exports,e,t,n,r)}returnn[o].exports}vari=typeofrequire=="function"&&require;for(varo=0;o<r.length;o++)s(r[o]);returns})({1:[function(require,module,exports){
 +/*!
 + Copyright (c) 2015 Jed Watson.
 + Licensed under the MIT License (MIT), see
 + http://jedwatson.github.io/classnames
 +*/
 +/* global define */
++
 +(function(){
 +'use strict';
++
 +varhasOwn={}.hasOwnProperty;
++
 +functionclassNames(){
 +varclasses='';
++
 +for(vari=0;i<arguments.length;i++){
 +vararg=arguments[i];
 +if(!arg)continue;
++
 +varargType=typeofarg;
++
 +if(argType==='string'||argType==='number'){
 +classes+=' '+arg;
 +}elseif(Array.isArray(arg)){
 +classes+=' '+classNames.apply(null,arg);
 +}elseif(argType==='object'){
 +for(varkeyinarg){
 +if(hasOwn.call(arg,key)&&arg[key]){
 +classes+=' '+key;
 +}
 +}
 +}
 +}
++
 +returnclasses.substr(1);
 +}
++
 +if(typeofmodule!=='undefined'&&module.exports){
 +module.exports=classNames;
 +}elseif(typeofdefine==='function'&&typeofdefine.amd==='object'&&define.amd){
 +// register as 'classnames', consistent with npm package name
 +define('classnames',function(){
 +returnclassNames;
 +});
 +}else{
 +window.classNames=classNames;
 +}
 +}());
++
 +},{}],2:[function(require,module,exports){
 // CodeMirror, copyright (c) by Marijn Haverbeke and others
 // Distributed under an MIT license: http://codemirror.net/LICENSE
 returnCodeMirror;
 });
 -},{}],2:[function(require,module,exports){
 +},{}],3:[function(require,module,exports){
 (function(global){
 'use strict';
 varCM=require('codemirror');
 varReact=(typeofwindow!=="undefined" ? window['React'] : typeofglobal!=="undefined" ? global['React'] : null);
 +varclassName=require('classnames');
 varCodeMirror=React.createClass({
 displayName: 'CodeMirror',
 onFocusChange: React.PropTypes.func,
 options: React.PropTypes.object,
 path: React.PropTypes.string,
 -value: React.PropTypes.string
 +value: React.PropTypes.string,
 +className: React.PropTypes.any
 },
 getInitialState: functiongetInitialState(){
 },
 componentDidMount: functioncomponentDidMount(){
 -vartextareaNode=React.findDOMNode(this.refs.textarea);
 +vartextareaNode=this.refs.textarea;
 this.codeMirror=CM.fromTextArea(textareaNode,this.props.options);
 this.codeMirror.on('change',this.codemirrorValueChanged);
 this.codeMirror.on('focus',this.focusChanged.bind(this,true));
 },
 render: functionrender(){
 -varclassName='ReactCodeMirror';
 -if(this.state.isFocused){
 -className+=' ReactCodeMirror--focused';
 -}
 +vareditorClassName=className('ReactCodeMirror',this.state.isFocused ? 'ReactCodeMirror--focused' : null,this.props.className);
++
 returnReact.createElement(
 'div',
 -{className: className},
 +{className: editorClassName},
 React.createElement('textarea',{ref: 'textarea',name: this.props.path,defaultValue: '',autoComplete: 'off'})
 );
+}
 module.exports=CodeMirror;
 }).call(this,typeofglobal!=="undefined" ? global : typeofself!=="undefined" ? self : typeofwindow!=="undefined" ? window : {})
 -},{"codemirror":1}]},{},[2])(2)
 +},{"classnames":1,"codemirror":2}]},{},[3])(3)
 });