react-tag-autocomplete - npm Package Compare versions

Comparing version 5.0.4 to 5.1.0

CHANGELOG.md

 # Changelog
 
+## 5.1.0
+
+- Added `tagComponent` option to allow the rendering of a custom tag component
+
+## 5.0.4
+
+- Fixed cursor focus being lost when clicking a suggestion
+
 ## 5.0.3
@@ -4,0 +12,0 @@

dist-es5/ReactTags.js

@@ -148,4 +148,6 @@ 'use strict'
 
+    var TagComponent = this.props.tagComponent || Tag
+
     var tags = this.props.tags.map(function (tag, i) { return (
-      React.createElement( Tag, {
+      React.createElement( TagComponent, {
         key: i, tag: tag, classNames: this$1.state.classNames, onDelete: this$1.deleteTag.bind(this$1, i) })
@@ -184,3 +186,4 @@ ); })
   maxSuggestionsLength: 6,
-  allowNew: false
+  allowNew: false,
+  tagComponent: null
 }
@@ -200,5 +203,9 @@
   classNames: React.PropTypes.object,
-  allowNew: React.PropTypes.bool
+  allowNew: React.PropTypes.bool,
+  tagComponent: React.PropTypes.oneOfType([
+    React.PropTypes.func,
+    React.PropTypes.element
+  ])
 }
 
 module.exports = ReactTags

dist-es6/ReactTags.js

@@ -140,4 +140,6 @@ 'use strict'
 
+    const TagComponent = this.props.tagComponent || Tag
+
     const tags = this.props.tags.map((tag, i) => (
-      React.createElement( Tag, {
+      React.createElement( TagComponent, {
         key: i, tag: tag, classNames: this.state.classNames, onDelete: this.deleteTag.bind(this, i) })
@@ -174,3 +176,4 @@ ))
   maxSuggestionsLength: 6,
-  allowNew: false
+  allowNew: false,
+  tagComponent: null
 }
@@ -190,5 +193,9 @@
   classNames: React.PropTypes.object,
-  allowNew: React.PropTypes.bool
+  allowNew: React.PropTypes.bool,
+  tagComponent: React.PropTypes.oneOfType([
+    React.PropTypes.func,
+    React.PropTypes.element
+  ])
 }
 
 module.exports = ReactTags

lib/ReactTags.js

@@ -140,4 +140,6 @@ 'use strict'
 
+    const TagComponent = this.props.tagComponent || Tag
+
     const tags = this.props.tags.map((tag, i) => (
-      <Tag
+      <TagComponent
         key={i}
@@ -193,3 +195,4 @@ tag={tag}
   maxSuggestionsLength: 6,
-  allowNew: false
+  allowNew: false,
+  tagComponent: null
 }
@@ -209,5 +212,9 @@
   classNames: React.PropTypes.object,
-  allowNew: React.PropTypes.bool
+  allowNew: React.PropTypes.bool,
+  tagComponent: React.PropTypes.oneOfType([
+    React.PropTypes.func,
+    React.PropTypes.element
+  ])
 }
 
 module.exports = ReactTags

package.json

 {
   "name": "react-tag-autocomplete",
-  "version": "5.0.4",
+  "version": "5.1.0",
   "description": "React Tag Autocomplete is a simple tagging component ready to drop in your React projects.",
@@ -5,0 +5,0 @@ "main": "dist-es5/ReactTags.js",

README.md

@@ -77,2 +77,3 @@ # React Tag Autocomplete
 - [`allowNew`](#allowNew)
+- [`tagComponent`](#tagComponent)
 
@@ -196,2 +197,7 @@ <a name="tagsOption"></a>
 
+<a name="tagComponent"></a>
+#### tagComponent (optional)
+
+Provide a custom tag component to render. Default: `null`.
+
 ### Styling
@@ -210,5 +216,5 @@
 
-### Upgrading from 4.x to 5.0
+### Upgrading from 4.x to 5.x
 
-1. The `delimiters` has been removed, any references to this will now be ignored.
+1. The `delimiters` option has been removed, any references to this will now be ignored.
 2. The `classNames` option has been updated:
@@ -215,0 +221,0 @@

No alert changes

Improved metrics

Number of lines in readme file

243

increased by2.53%

Worsened metrics

Total package byte prevSize

51935

decreased by-97.22%

Number of package files

20

decreased by-23.08%

Lines of code

1120

decreased by-33.92%

No dependency changes