@yaireo/tagify - npm Package Compare versions

Comparing version 2.31.3 to 2.31.4

dist/react.tagify.js

@@ -1,53 +0,63 @@
-import React from 'react';
-import Tagify from './tagify.js'
-import './tagify.css'
+import React from "react";
+import Tagify from "./tagify.js";
+import "./tagify.scss";
 
-class Tags extends React.Component{
-    constructor( props ){
-        super(props);
-        this._handleRef = this._handleRef.bind(this);
-    }
+class Tags extends React.Component {
+  constructor(props) {
+    super(props);
+    this._handleRef = this._handleRef.bind(this);
+  }
 
-    componentDidMount(){
-        this.tagify = new Tagify(this.component, this.props.settings || {});
+  componentDidMount() {
+    this.tagify = new Tagify(this.component, this.props.settings || {});
+  }
+
+  shouldComponentUpdate(nextProps, nextState) {
+    // check if value has changed
+    if (nextProps.value && nextProps.value.join() != this.props.value.join()) {
+      this.tagify.loadOriginalValues(nextProps.value);
+      // this.tagify.addTags(nextProps.value, true, true)
     }
 
-    shouldComponentUpdate(nextProps, nextState){
-        // check if value has changed
-        if( nextProps.value && nextProps.value.join() != this.props.value.join() ){
-            this.tagify.loadOriginalValues(nextProps.value);
-            // this.tagify.addTags(nextProps.value, true, true)
-        }
+    this.tagify.settings.whitelist = nextProps.settings.whitelist;
 
-        this.tagify.settings.whitelist = nextProps.settings.whitelist;
+    if (nextProps.showDropdown)
+      this.tagify.dropdown.show.call(this.tagify, nextProps.showDropdown);
 
-        if( nextProps.showDropdown )
-            this.tagify.dropdown.show.call(this.tagify, nextProps.showDropdown);
+    // do not allow react to re-render since the component is modifying its own HTML
+    return false;
+  }
 
-        // do not allow react to re-render since the component is modifying its own HTML
-        return false;
-    }
+  _handleRef(component) {
+    this.component = component;
+  }
 
-    _handleRef(component){
-        this.component = component;
-    }
+  render() {
+    const attrs = {
+      ref: this._handleRef,
+      name: this.props.name,
+      className: this.props.className,
+      placeholder: this.props.class,
+      autoFocus: this.props.autofocus,
+      value: this.props.children
+    };
 
-    render(){
-        const attrs = {
-            ref         : this._handleRef,
-            name        : this.props.name,
-            className   : this.props.className,
-            placeholder : this.props.class,
-            autoFocus   : this.props.autofocus
-        }
+    const { className } = this.props;
 
-        return React.createElement(this.props.mode, Object.assign({}, attrs, {defaultValue: this.props.initialValue}))
-    }
+    return React.createElement(
+      "div",
+      { className },
+      React.createElement(
+        this.props.mode,
+        Object.assign({}, attrs, { defaultValue: this.props.initialValue })
+      )
+    );
+  }
 }
 
 Tags.defaultProps = {
-    value: [],
-    mode: "input"
-}
+  value: [],
+  mode: "input"
+};
 
 export default Tags;

package.json

 {
     "name": "@yaireo/tagify",
-    "version": "2.31.3",
+    "version": "2.31.4",
     "homepage": "https://github.com/yairEO/tagify",
@@ -5,0 +5,0 @@ "description": "lightweight, efficient Tags input component in Vanilla JS / React / Angular [super customizable, tiny size & top performance]",

No alert changes

Improved metrics

Total package byte prevSize

475503

increased by0.01%

Lines of code

3425

increased by0.26%

No dependency changes