react-multi-email - npm Package Compare versions

Comparing version 0.3.7 to 0.3.8

commonjs/ReactMultiEmail.d.ts

@@ -7,2 +7,4 @@ import * as React from 'react';
     getLabel: (email: string, index: number, removeEmail: (index: number) => void) => void;
+    className?: string;
+    placeholder?: string | React.ReactNode;
 }
@@ -9,0 +11,0 @@ export interface IReactMultiEmailState {

commonjs/ReactMultiEmail.js

@@ -108,7 +108,8 @@ "use strict";
         var _a = this.state, focused = _a.focused, emails = _a.emails, inputValue = _a.inputValue;
-        var _b = this.props, style = _b.style, getLabel = _b.getLabel;
+        var _b = this.props, style = _b.style, getLabel = _b.getLabel, _c = _b.className, className = _c === void 0 ? '' : _c, placeholder = _b.placeholder;
         // removeEmail
-        return (React.createElement("div", { className: 'react-multi-email ' + (focused ? 'focused' : ''), style: style, onClick: function (e) {
+        return (React.createElement("div", { className: className + " react-multi-email " + (focused ? 'focused' : '') + " " + (inputValue === '' && emails.length === 0 ? 'empty' : ''), style: style, onClick: function () {
                 _this.emailInput.focus();
             } },
+            placeholder ? React.createElement("span", { "data-placeholder": true }, placeholder) : null,
             emails.map(function (email, index) {
@@ -121,3 +122,7 @@ return getLabel(email, index, _this.removeEmail);
                     }
-                }, type: "text", value: inputValue, onFocus: function (e) { return _this.setState({ focused: true }); }, onBlur: function (e) {
+                }, type: "text", value: inputValue, onFocus: function () {
+                    return _this.setState({
+                        focused: true,
+                    });
+                }, onBlur: function (e) {
                     _this.setState({ focused: false });
@@ -124,0 +129,0 @@ _this.findEmailAddress(e.target.value, true);

es6/ReactMultiEmail.d.ts

@@ -7,2 +7,4 @@ import * as React from 'react';
     getLabel: (email: string, index: number, removeEmail: (index: number) => void) => void;
+    className?: string;
+    placeholder?: string | React.ReactNode;
 }
@@ -9,0 +11,0 @@ export interface IReactMultiEmailState {

es6/ReactMultiEmail.js

@@ -93,7 +93,8 @@ import * as React from 'react';
         const { focused, emails, inputValue } = this.state;
-        const { style, getLabel } = this.props;
+        const { style, getLabel, className = '', placeholder } = this.props;
         // removeEmail
-        return (React.createElement("div", { className: 'react-multi-email ' + (focused ? 'focused' : ''), style: style, onClick: (e) => {
+        return (React.createElement("div", { className: `${className} react-multi-email ${focused ? 'focused' : ''} ${inputValue === '' && emails.length === 0 ? 'empty' : ''}`, style: style, onClick: () => {
                 this.emailInput.focus();
             } },
+            placeholder ? React.createElement("span", { "data-placeholder": true }, placeholder) : null,
             emails.map((email, index) => getLabel(email, index, this.removeEmail)),
@@ -104,3 +105,5 @@ React.createElement("input", { ref: ref => {
                     }
-                }, type: "text", value: inputValue, onFocus: (e) => this.setState({ focused: true }), onBlur: (e) => {
+                }, type: "text", value: inputValue, onFocus: () => this.setState({
+                    focused: true,
+                }), onBlur: (e) => {
                     this.setState({ focused: false });
@@ -107,0 +110,0 @@ this.findEmailAddress(e.target.value, true);

package.json

 {
   "name": "react-multi-email",
-  "version": "0.3.7",
+  "version": "0.3.8",
   "description": "React multi email input",
   "jsnext:main": "es6/index.js",
   "main": "commonjs/index.js",
-  "repository": "https://github.com/axui/react-multi-email",
+  "repository": "https://github.com/jsdevkr/react-multi-email",
   "author": "[e-mail]",
@@ -9,0 +9,0 @@ "license": "MIT",

README.md

@@ -43,2 +43,3 @@ # react-multi-email
         <ReactMultiEmail
+          placeholder='placeholder'
           emails={emails}
@@ -45,0 +46,0 @@ onChange={(_emails: string[]) => {

New alerts

No repository

Supply chain risk

Package does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.

Found 1 instance in 1 package

Fixed alerts

No repository

Supply chain risk

Package does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

26168

increased by4.43%

Lines of code

662

increased by4.42%

Number of lines in readme file

79

increased by1.28%

No dependency changes