react-edit-inline - npm Package Compare versions

Comparing version 1.0.2 to 1.0.3

index.js

@@ -1,21 +0,25 @@
-"use strict";
+'use strict';
 
-Object.defineProperty(exports, "__esModule", {
+Object.defineProperty(exports, '__esModule', {
     value: true
 });
 
-var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
+var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
 
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
 
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) subClass.__proto__ = superClass; }
+function _inherits(subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
 
-var _react = require("react");
+var _react = require('react');
 
 var _react2 = _interopRequireDefault(_react);
 
+var _reactDom = require('react-dom');
+
+var _reactDom2 = _interopRequireDefault(_reactDom);
+
 function SelectInputText(element) {
@@ -26,6 +30,8 @@ element.setSelectionRange(0, element.value.length);
 var InlineEdit = (function (_React$Component) {
+    _inherits(InlineEdit, _React$Component);
+
     function InlineEdit(props) {
         _classCallCheck(this, InlineEdit);
 
-        _get(Object.getPrototypeOf(InlineEdit.prototype), "constructor", this).call(this, props);
+        _get(Object.getPrototypeOf(InlineEdit.prototype), 'constructor', this).call(this, props);
         this.startEditing = this.startEditing.bind(this);
@@ -47,6 +53,4 @@ this.finishEditing = this.finishEditing.bind(this);
 
-    _inherits(InlineEdit, _React$Component);
-
     _createClass(InlineEdit, [{
-        key: "startEditing",
+        key: 'startEditing',
         value: function startEditing() {
@@ -56,3 +60,3 @@ this.setState({ editing: true, text: this.props.text });
     }, {
-        key: "finishEditing",
+        key: 'finishEditing',
         value: function finishEditing() {
@@ -66,3 +70,3 @@ if (this.isInputValid(this.state.text) && this.props.text != this.state.text) {
     }, {
-        key: "cancelEditing",
+        key: 'cancelEditing',
         value: function cancelEditing() {
@@ -72,3 +76,3 @@ this.setState({ editing: false, text: this.props.text });
     }, {
-        key: "commitEditing",
+        key: 'commitEditing',
         value: function commitEditing() {
@@ -81,3 +85,3 @@ this.setState({ editing: false, text: this.state.text });
     }, {
-        key: "isInputValid",
+        key: 'isInputValid',
         value: function isInputValid(text) {
@@ -87,3 +91,3 @@ return text.length >= this.state.minLength && text.length <= this.state.maxLength;
     }, {
-        key: "keyDown",
+        key: 'keyDown',
         value: function keyDown(event) {
@@ -97,3 +101,3 @@ if (event.keyCode === 13) {
     }, {
-        key: "textChanged",
+        key: 'textChanged',
         value: function textChanged(event) {
@@ -105,5 +109,5 @@ this.setState({
     }, {
-        key: "componentDidUpdate",
+        key: 'componentDidUpdate',
         value: function componentDidUpdate(prevProps, prevState) {
-            var inputElem = _react2["default"].findDOMNode(this.refs.input);
+            var inputElem = _reactDom2['default'].findDOMNode(this.refs.input);
             if (this.state.editing && !prevState.editing) {
@@ -117,12 +121,13 @@ inputElem.focus();
     }, {
-        key: "render",
+        key: 'render',
         value: function render() {
             if (!this.state.editing) {
-                return _react2["default"].createElement(
-                    "span",
+                return _react2['default'].createElement(
+                    'span',
                     { className: this.props.className, onClick: this.startEditing },
-                    this.props.text
+                    this.state.text || this.props.placeholder
                 );
             } else {
-                return _react2["default"].createElement("input", { className: this.props.activeClassName, onKeyDown: this.keyDown, onBlur: this.finishEditing, ref: "input", defaultValue: this.state.text, onChange: this.textChanged, onReturn: this.finishEditing });
+                var _Element = this.props.element || 'input';
+                return _react2['default'].createElement(_Element, { className: this.props.activeClassName, onKeyDown: this.keyDown, onBlur: this.finishEditing, ref: 'input', placeholder: this.props.placeholder, defaultValue: this.state.text, onChange: this.textChanged, onReturn: this.finishEditing });
             }
@@ -133,15 +138,17 @@ }
     return InlineEdit;
-})(_react2["default"].Component);
+})(_react2['default'].Component);
 
 InlineEdit.propTypes = {
-    text: _react2["default"].PropTypes.string.isRequired,
-    paramName: _react2["default"].PropTypes.string.isRequired,
-    change: _react2["default"].PropTypes.func.isRequired,
-    activeClassName: _react2["default"].PropTypes.string,
-    minLength: _react2["default"].PropTypes.number,
-    maxLength: _react2["default"].PropTypes.number,
-    validate: _react2["default"].PropTypes.func
+    text: _react2['default'].PropTypes.string.isRequired,
+    paramName: _react2['default'].PropTypes.string.isRequired,
+    change: _react2['default'].PropTypes.func.isRequired,
+    placeholder: _react2['default'].PropTypes.string,
+    activeClassName: _react2['default'].PropTypes.string,
+    minLength: _react2['default'].PropTypes.number,
+    maxLength: _react2['default'].PropTypes.number,
+    validate: _react2['default'].PropTypes.func,
+    element: _react2['default'].PropTypes.string
 };
 
-exports["default"] = InlineEdit;
-module.exports = exports["default"];
+exports['default'] = InlineEdit;
+module.exports = exports['default'];

index.jsx

 import React from 'react';
+import ReactDOM from 'react-dom';
 
@@ -68,3 +69,3 @@ function SelectInputText(element) {
     componentDidUpdate(prevProps, prevState) {
-        var inputElem = React.findDOMNode(this.refs.input);
+        var inputElem = ReactDOM.findDOMNode(this.refs.input);
         if (this.state.editing && !prevState.editing) {
@@ -80,5 +81,6 @@ inputElem.focus();
         if(!this.state.editing) {
-            return <span className={this.props.className} onClick={this.startEditing}>{this.props.text}</span>
+            return <span className={this.props.className} onClick={this.startEditing}>{this.state.text || this.props.placeholder}</span>
         } else {
-            return <input className={this.props.activeClassName} onKeyDown={this.keyDown} onBlur={this.finishEditing} ref="input" defaultValue={this.state.text} onChange={this.textChanged} onReturn={this.finishEditing} />
+            const Element = this.props.element || 'input';
+            return <Element className={this.props.activeClassName} onKeyDown={this.keyDown} onBlur={this.finishEditing} ref="input" placeholder={this.props.placeholder} defaultValue={this.state.text} onChange={this.textChanged} onReturn={this.finishEditing} />
         }
@@ -92,8 +94,10 @@ }
     change: React.PropTypes.func.isRequired,
+    placeholder: React.PropTypes.string,
     activeClassName: React.PropTypes.string,
     minLength: React.PropTypes.number,
     maxLength: React.PropTypes.number,
-    validate: React.PropTypes.func
+    validate: React.PropTypes.func,
+    element: React.PropTypes.string
 };
 
 export default InlineEdit;

package.json

 {
   "name": "react-edit-inline",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "description": "A simple inline text editor for React with ECMAScript 6 + JSX Harmony syntax",
   "main": "index.js",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "build": "rm -f index.js; babel --stage 0 index.jsx --out-file index.js",
+    "prepublish": "npm run build"
   },
@@ -27,5 +29,5 @@ "repository": {
   "homepage": "https://github.com/kaivi/ReactInlineEdit#readme",
-  "dependencies": {
-    "react": "^0.13.3"
+  "peerDependencies": {
+    "react": ">=0.13.3 || 0.14.0-rc1"
   }
 }

No alert changes

Improved metrics

Total package byte prevSize

31510

increased by2.66%

Lines of code

217

increased by4.83%

Dependency changes

• - Removedreact@^0.13.3

• - Removedacorn@5.7.4(transitive)

• - Removedamdefine@1.0.1(transitive)

• - Removedast-types@0.9.6(transitive)

• - Removedbalanced-match@1.0.2(transitive)

• - Removedbase62@1.2.8(transitive)

• - Removedbrace-expansion@1.1.11(transitive)

• - Removedcommander@2.20.3(transitive)

• - Removedcommoner@0.10.8(transitive)

• - Removedconcat-map@0.0.1(transitive)

• - Removeddefined@1.0.1(transitive)

• - Removeddetective@4.7.1(transitive)

• - Removedenvify@3.4.1(transitive)

• - Removedesprima@3.1.3(transitive)

• - Removedesprima-fb@15001.1.0-dev-harmony-fb(transitive)

• - Removedglob@5.0.15(transitive)

• - Removedgraceful-fs@4.2.11(transitive)

• - Removediconv-lite@0.4.24(transitive)

• - Removedinflight@1.0.6(transitive)

• - Removedinherits@2.0.4(transitive)

• - Removedjstransform@11.0.3(transitive)

• - Removedminimatch@3.1.2(transitive)

• - Removedminimist@1.2.8(transitive)

• - Removedmkdirp@0.5.6(transitive)

• - Removedobject-assign@2.1.1(transitive)

• - Removedonce@1.4.0(transitive)

• - Removedpath-is-absolute@1.0.1(transitive)

• - Removedprivate@0.1.8(transitive)

• - Removedq@1.5.1(transitive)

• - Removedreact@0.13.3(transitive)

• - Removedrecast@0.11.23(transitive)

• - Removedsafer-buffer@2.1.2(transitive)

• - Removedsource-map@0.4.40.5.7(transitive)

• - Removedthrough@2.3.8(transitive)

• - Removedwrappy@1.0.2(transitive)