Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
taggify - npm Package Compare versions
Comparing version 1.0.0 to 1.1.0
| { | ||
| "name": "taggify", | ||
| "version": "1.0.0", | ||
| "version": "1.1.0", | ||
| "description": "Create tags by typing", | ||
@@ -5,0 +5,0 @@ "repository": { |
@@ -34,2 +34,5 @@ # taggify | ||
| ### containerNode {HTMLElement} | ||
| Container node to initialize taggify element. Will be used instead of `containerSelector`, if defined. | ||
| ### autocomplete {Boolean} | ||
@@ -58,1 +61,16 @@ Indicator whether to use autocomplete callback. By default: `false` | ||
| By default: `[13, 188]` | ||
| ### displayLabel {Boolean} | ||
| Flag indicating whether an input label should be displayed | ||
| ## Methods | ||
| ### updateTags | ||
| The method allows to create tags based on provided array of strings | ||
| ```javascript | ||
| const tags = ['a','b','c']; | ||
| taggify.updateTags(tags); | ||
| ``` |
@@ -22,2 +22,10 @@ var Taggify = function (params) { | ||
| /** | ||
| * Container node to load taggify | ||
| * | ||
| * @property containerNode | ||
| * @type {HTMLElement} | ||
| * @default null | ||
| */ | ||
| containerNode: null, | ||
| /** | ||
| * Container selector to find HTML node to initialize taggify element | ||
@@ -83,3 +91,19 @@ * | ||
| */ | ||
| hotKeys: [KEY_COMMA, KEY_ENTER] | ||
| hotKeys: [KEY_COMMA, KEY_ENTER], | ||
| /** | ||
| * Should display input label? | ||
| * | ||
| * @property displayLabel | ||
| * @type {Boolean} | ||
| * @default true | ||
| */ | ||
| displayLabel: true, | ||
| /** | ||
| * Should display input values? | ||
| * | ||
| * @property displayInputValues | ||
| * @type {Boolean} | ||
| * @default true | ||
| */ | ||
| displayInputValues: true | ||
| }, | ||
@@ -96,3 +120,11 @@ taggifyId = CLASS_TAGGIFY + '-' + Date.now(), | ||
| hasCustomEventConstructor = window.hasOwnProperty('CustomEvent'), | ||
| _fire = function (eventName) { | ||
| /** | ||
| * Fires a custom event on the Taggify container node | ||
| * | ||
| * @method _fire | ||
| * @private | ||
| * @param {String} eventName | ||
| * @param {Object} props | ||
| */ | ||
| _fire = function (eventName, props) { | ||
| var event, | ||
@@ -107,2 +139,6 @@ eventConfig; | ||
| if (props && Object.keys(props).length) { | ||
| eventConfig.detail = props; | ||
| } | ||
| event = new CustomEvent(eventName, eventConfig); | ||
@@ -127,8 +163,8 @@ } else { | ||
| var tagsMap = {}; | ||
| var inputTags = value.split(','); | ||
| return value | ||
| .split(',') | ||
| .map(function (tag, index) { | ||
| return inputTags | ||
| .map(function (tag) { | ||
| return { | ||
| id: index, | ||
| id: Math.floor((1 + Math.random()) * 0x10000).toString(16), | ||
| label: tag.trim() | ||
@@ -163,4 +199,4 @@ }; | ||
| var isHotKeyUsed = finalParams.hotKeys.some(function (key) { | ||
| return (event.keyCode || event.which) === key; | ||
| }), | ||
| return (event.keyCode || event.which) === key; | ||
| }), | ||
| tags; | ||
@@ -171,2 +207,6 @@ | ||
| if (!finalParams.displayInputValues) { | ||
| tags = createdTags.concat(tags); | ||
| } | ||
| _createTags(tags); | ||
@@ -251,3 +291,8 @@ } | ||
| taggifyTags.innerHTML = ''; | ||
| taggifyInput.value = tags.map(function (tag) { return tag.label; }).join(TAG_DELIMITER) + TAG_DELIMITER; | ||
| if (finalParams.displayInputValues) { | ||
| taggifyInput.value = tags.map(function (tag) { return tag.label; }).join(TAG_DELIMITER) + TAG_DELIMITER; | ||
| } else { | ||
| taggifyInput.value = ''; | ||
| } | ||
| } else { | ||
@@ -259,3 +304,3 @@ taggifyInput.value = ''; | ||
| _fire(EVENT_TAGS_CREATED); | ||
| _fire(EVENT_TAGS_CREATED, { tags: createdTags }); | ||
| }, | ||
@@ -325,7 +370,9 @@ /** | ||
| taggifyInput.value = inputText; | ||
| if (finalParams.displayInputValues) { | ||
| taggifyInput.value = inputText; | ||
| } | ||
| this.removeChild(tag); | ||
| _fire(EVENT_TAG_REMOVED); | ||
| _fire(EVENT_TAG_REMOVED, {tags: createdTags}); | ||
| } else { | ||
@@ -343,3 +390,5 @@ _fire(EVENT_TAG_NOT_REMOVED); | ||
| taggifyContainer = document.querySelector(finalParams.containerSelector); | ||
| taggifyContainer = finalParams.containerNode ? | ||
| finalParams.containerNode : | ||
| document.querySelector(finalParams.containerSelector); | ||
| taggifyContainer.innerHTML = ''; | ||
@@ -349,8 +398,2 @@ | ||
| taggifyLabel.for = taggifyId; | ||
| taggifyLabel.innerHTML = finalParams.inputLabel; | ||
| taggifyLabel.setAttribute('for', taggifyId); | ||
| taggifyLabel.classList.add(CLASS_TAGGIFY_LABEL); | ||
| taggifyInput.id = taggifyId; | ||
@@ -365,3 +408,11 @@ taggifyInput.type = 'text'; | ||
| taggifyInputWrapper.appendChild(taggifyLabel); | ||
| if (finalParams.displayLabel) { | ||
| taggifyLabel.for = taggifyId; | ||
| taggifyLabel.innerHTML = finalParams.inputLabel; | ||
| taggifyLabel.setAttribute('for', taggifyId); | ||
| taggifyLabel.classList.add(CLASS_TAGGIFY_LABEL); | ||
| taggifyInputWrapper.appendChild(taggifyLabel); | ||
| } | ||
| taggifyInputWrapper.appendChild(taggifyInput); | ||
@@ -371,2 +422,23 @@ | ||
| taggifyTags.addEventListener('click', _removeTag, false); | ||
| return { | ||
| /** | ||
| * Updates list of tags | ||
| * | ||
| * @method updateTags | ||
| * @param {Array} tags each tag is an object with a following structure: `{label: <String>, id: <String>}` | ||
| * @returns {Taggify} | ||
| */ | ||
| updateTags: function (tags) { | ||
| if (finalParams.displayInputValues) { | ||
| taggifyInput.value = tags.map(function (tag) { | ||
| return tag.label; | ||
| }).join(', '); | ||
| } | ||
| _createTags(tags); | ||
| return this; | ||
| } | ||
| } | ||
| }; |
@@ -13,3 +13,3 @@ /*@preserve | ||
| */ | ||
| //jshint ignore:line | ||
| var Taggify = function (params) { | ||
@@ -36,2 +36,10 @@ var SUFFIX_LABEL = '__label', | ||
| /** | ||
| * Container node to load taggify | ||
| * | ||
| * @property containerNode | ||
| * @type {HTMLElement} | ||
| * @default null | ||
| */ | ||
| containerNode: null, | ||
| /** | ||
| * Container selector to find HTML node to initialize taggify element | ||
@@ -97,3 +105,19 @@ * | ||
| */ | ||
| hotKeys: [KEY_COMMA, KEY_ENTER] | ||
| hotKeys: [KEY_COMMA, KEY_ENTER], | ||
| /** | ||
| * Should display input label? | ||
| * | ||
| * @property displayLabel | ||
| * @type {Boolean} | ||
| * @default true | ||
| */ | ||
| displayLabel: true, | ||
| /** | ||
| * Should display input values? | ||
| * | ||
| * @property displayInputValues | ||
| * @type {Boolean} | ||
| * @default true | ||
| */ | ||
| displayInputValues: true | ||
| }, | ||
@@ -110,3 +134,11 @@ taggifyId = CLASS_TAGGIFY + '-' + Date.now(), | ||
| hasCustomEventConstructor = window.hasOwnProperty('CustomEvent'), | ||
| _fire = function (eventName) { | ||
| /** | ||
| * Fires a custom event on the Taggify container node | ||
| * | ||
| * @method _fire | ||
| * @private | ||
| * @param {String} eventName | ||
| * @param {Object} props | ||
| */ | ||
| _fire = function (eventName, props) { | ||
| var event, | ||
@@ -121,2 +153,6 @@ eventConfig; | ||
| if (props && Object.keys(props).length) { | ||
| eventConfig.detail = props; | ||
| } | ||
| event = new CustomEvent(eventName, eventConfig); | ||
@@ -141,8 +177,8 @@ } else { | ||
| var tagsMap = {}; | ||
| var inputTags = value.split(','); | ||
| return value | ||
| .split(',') | ||
| .map(function (tag, index) { | ||
| return inputTags | ||
| .map(function (tag) { | ||
| return { | ||
| id: index, | ||
| id: Math.floor((1 + Math.random()) * 0x10000).toString(16), | ||
| label: tag.trim() | ||
@@ -177,4 +213,4 @@ }; | ||
| var isHotKeyUsed = finalParams.hotKeys.some(function (key) { | ||
| return (event.keyCode || event.which) === key; | ||
| }), | ||
| return (event.keyCode || event.which) === key; | ||
| }), | ||
| tags; | ||
@@ -185,2 +221,6 @@ | ||
| if (!finalParams.displayInputValues) { | ||
| tags = createdTags.concat(tags); | ||
| } | ||
| _createTags(tags); | ||
@@ -265,3 +305,8 @@ } | ||
| taggifyTags.innerHTML = ''; | ||
| taggifyInput.value = tags.map(function (tag) { return tag.label; }).join(TAG_DELIMITER) + TAG_DELIMITER; | ||
| if (finalParams.displayInputValues) { | ||
| taggifyInput.value = tags.map(function (tag) { return tag.label; }).join(TAG_DELIMITER) + TAG_DELIMITER; | ||
| } else { | ||
| taggifyInput.value = ''; | ||
| } | ||
| } else { | ||
@@ -273,3 +318,3 @@ taggifyInput.value = ''; | ||
| _fire(EVENT_TAGS_CREATED); | ||
| _fire(EVENT_TAGS_CREATED, { tags: createdTags }); | ||
| }, | ||
@@ -339,7 +384,9 @@ /** | ||
| taggifyInput.value = inputText; | ||
| if (finalParams.displayInputValues) { | ||
| taggifyInput.value = inputText; | ||
| } | ||
| this.removeChild(tag); | ||
| _fire(EVENT_TAG_REMOVED); | ||
| _fire(EVENT_TAG_REMOVED, {tags: createdTags}); | ||
| } else { | ||
@@ -357,3 +404,5 @@ _fire(EVENT_TAG_NOT_REMOVED); | ||
| taggifyContainer = document.querySelector(finalParams.containerSelector); | ||
| taggifyContainer = finalParams.containerNode ? | ||
| finalParams.containerNode : | ||
| document.querySelector(finalParams.containerSelector); | ||
| taggifyContainer.innerHTML = ''; | ||
@@ -363,8 +412,2 @@ | ||
| taggifyLabel.for = taggifyId; | ||
| taggifyLabel.innerHTML = finalParams.inputLabel; | ||
| taggifyLabel.setAttribute('for', taggifyId); | ||
| taggifyLabel.classList.add(CLASS_TAGGIFY_LABEL); | ||
| taggifyInput.id = taggifyId; | ||
@@ -379,3 +422,11 @@ taggifyInput.type = 'text'; | ||
| taggifyInputWrapper.appendChild(taggifyLabel); | ||
| if (finalParams.displayLabel) { | ||
| taggifyLabel.for = taggifyId; | ||
| taggifyLabel.innerHTML = finalParams.inputLabel; | ||
| taggifyLabel.setAttribute('for', taggifyId); | ||
| taggifyLabel.classList.add(CLASS_TAGGIFY_LABEL); | ||
| taggifyInputWrapper.appendChild(taggifyLabel); | ||
| } | ||
| taggifyInputWrapper.appendChild(taggifyInput); | ||
@@ -385,5 +436,26 @@ | ||
| taggifyTags.addEventListener('click', _removeTag, false); | ||
| return { | ||
| /** | ||
| * Updates list of tags | ||
| * | ||
| * @method updateTags | ||
| * @param {Array} tags each tag is an object with a following structure: `{label: <String>, id: <String>}` | ||
| * @returns {Taggify} | ||
| */ | ||
| updateTags: function (tags) { | ||
| if (finalParams.displayInputValues) { | ||
| taggifyInput.value = tags.map(function (tag) { | ||
| return tag.label; | ||
| }).join(', '); | ||
| } | ||
| _createTags(tags); | ||
| return this; | ||
| } | ||
| } | ||
| }; | ||
| //jshint ignore:line | ||
| export default Taggify; |
@@ -13,3 +13,3 @@ /*@preserve | ||
| */ | ||
| //jshint ignore:line | ||
| ;(function (root, moduleName, factory) { | ||
@@ -28,3 +28,3 @@ 'use strict'; | ||
| var Taggify = function (params) { | ||
| var Taggify = function (params) { | ||
| var SUFFIX_LABEL = '__label', | ||
@@ -50,2 +50,10 @@ CLASS_TAGGIFY = 'taggify', | ||
| /** | ||
| * Container node to load taggify | ||
| * | ||
| * @property containerNode | ||
| * @type {HTMLElement} | ||
| * @default null | ||
| */ | ||
| containerNode: null, | ||
| /** | ||
| * Container selector to find HTML node to initialize taggify element | ||
@@ -111,3 +119,19 @@ * | ||
| */ | ||
| hotKeys: [KEY_COMMA, KEY_ENTER] | ||
| hotKeys: [KEY_COMMA, KEY_ENTER], | ||
| /** | ||
| * Should display input label? | ||
| * | ||
| * @property displayLabel | ||
| * @type {Boolean} | ||
| * @default true | ||
| */ | ||
| displayLabel: true, | ||
| /** | ||
| * Should display input values? | ||
| * | ||
| * @property displayInputValues | ||
| * @type {Boolean} | ||
| * @default true | ||
| */ | ||
| displayInputValues: true | ||
| }, | ||
@@ -124,3 +148,11 @@ taggifyId = CLASS_TAGGIFY + '-' + Date.now(), | ||
| hasCustomEventConstructor = window.hasOwnProperty('CustomEvent'), | ||
| _fire = function (eventName) { | ||
| /** | ||
| * Fires a custom event on the Taggify container node | ||
| * | ||
| * @method _fire | ||
| * @private | ||
| * @param {String} eventName | ||
| * @param {Object} props | ||
| */ | ||
| _fire = function (eventName, props) { | ||
| var event, | ||
@@ -135,2 +167,6 @@ eventConfig; | ||
| if (props && Object.keys(props).length) { | ||
| eventConfig.detail = props; | ||
| } | ||
| event = new CustomEvent(eventName, eventConfig); | ||
@@ -155,8 +191,8 @@ } else { | ||
| var tagsMap = {}; | ||
| var inputTags = value.split(','); | ||
| return value | ||
| .split(',') | ||
| .map(function (tag, index) { | ||
| return inputTags | ||
| .map(function (tag) { | ||
| return { | ||
| id: index, | ||
| id: Math.floor((1 + Math.random()) * 0x10000).toString(16), | ||
| label: tag.trim() | ||
@@ -191,4 +227,4 @@ }; | ||
| var isHotKeyUsed = finalParams.hotKeys.some(function (key) { | ||
| return (event.keyCode || event.which) === key; | ||
| }), | ||
| return (event.keyCode || event.which) === key; | ||
| }), | ||
| tags; | ||
@@ -199,2 +235,6 @@ | ||
| if (!finalParams.displayInputValues) { | ||
| tags = createdTags.concat(tags); | ||
| } | ||
| _createTags(tags); | ||
@@ -279,3 +319,8 @@ } | ||
| taggifyTags.innerHTML = ''; | ||
| taggifyInput.value = tags.map(function (tag) { return tag.label; }).join(TAG_DELIMITER) + TAG_DELIMITER; | ||
| if (finalParams.displayInputValues) { | ||
| taggifyInput.value = tags.map(function (tag) { return tag.label; }).join(TAG_DELIMITER) + TAG_DELIMITER; | ||
| } else { | ||
| taggifyInput.value = ''; | ||
| } | ||
| } else { | ||
@@ -287,3 +332,3 @@ taggifyInput.value = ''; | ||
| _fire(EVENT_TAGS_CREATED); | ||
| _fire(EVENT_TAGS_CREATED, { tags: createdTags }); | ||
| }, | ||
@@ -353,7 +398,9 @@ /** | ||
| taggifyInput.value = inputText; | ||
| if (finalParams.displayInputValues) { | ||
| taggifyInput.value = inputText; | ||
| } | ||
| this.removeChild(tag); | ||
| _fire(EVENT_TAG_REMOVED); | ||
| _fire(EVENT_TAG_REMOVED, {tags: createdTags}); | ||
| } else { | ||
@@ -371,3 +418,5 @@ _fire(EVENT_TAG_NOT_REMOVED); | ||
| taggifyContainer = document.querySelector(finalParams.containerSelector); | ||
| taggifyContainer = finalParams.containerNode ? | ||
| finalParams.containerNode : | ||
| document.querySelector(finalParams.containerSelector); | ||
| taggifyContainer.innerHTML = ''; | ||
@@ -377,8 +426,2 @@ | ||
| taggifyLabel.for = taggifyId; | ||
| taggifyLabel.innerHTML = finalParams.inputLabel; | ||
| taggifyLabel.setAttribute('for', taggifyId); | ||
| taggifyLabel.classList.add(CLASS_TAGGIFY_LABEL); | ||
| taggifyInput.id = taggifyId; | ||
@@ -393,3 +436,11 @@ taggifyInput.type = 'text'; | ||
| taggifyInputWrapper.appendChild(taggifyLabel); | ||
| if (finalParams.displayLabel) { | ||
| taggifyLabel.for = taggifyId; | ||
| taggifyLabel.innerHTML = finalParams.inputLabel; | ||
| taggifyLabel.setAttribute('for', taggifyId); | ||
| taggifyLabel.classList.add(CLASS_TAGGIFY_LABEL); | ||
| taggifyInputWrapper.appendChild(taggifyLabel); | ||
| } | ||
| taggifyInputWrapper.appendChild(taggifyInput); | ||
@@ -399,2 +450,23 @@ | ||
| taggifyTags.addEventListener('click', _removeTag, false); | ||
| return { | ||
| /** | ||
| * Updates list of tags | ||
| * | ||
| * @method updateTags | ||
| * @param {Array} tags each tag is an object with a following structure: `{label: <String>, id: <String>}` | ||
| * @returns {Taggify} | ||
| */ | ||
| updateTags: function (tags) { | ||
| if (finalParams.displayInputValues) { | ||
| taggifyInput.value = tags.map(function (tag) { | ||
| return tag.label; | ||
| }).join(', '); | ||
| } | ||
| _createTags(tags); | ||
| return this; | ||
| } | ||
| } | ||
| }; | ||
@@ -401,0 +473,0 @@ |
@@ -13,2 +13,2 @@ /*@preserve | ||
| */ | ||
| !function(t,e,n){"use strict";"function"==typeof define&&define.amd?define("Taggify",n):"object"==typeof exports?exports=module.exports=n():t.Taggify=n()}(this,0,function(){"use strict";return function(t){var e,n,a,i=function(t,e){e(g(t))},l={containerSelector:".taggify",autocomplete:!1,autocompleteCallback:i,inputDelay:100,inputLabel:"Start typing ...",allowDuplicates:!1,hotKeys:[188,13]},o="taggify-"+Date.now(),r=document.createElement("input"),c=document.createElement("label"),u=document.createElement("div"),d=document.createElement("div"),s=[],p=window.hasOwnProperty("CustomEvent"),f=function(t){var e,a;p?(a={bubbles:!0,cancelable:!1},e=new CustomEvent(t,a)):(e=document.createEvent("CustomEvent"),e.initEvent(t,!1,!0)),n.dispatchEvent(e)},g=function(t){var e={};return t.split(",").map(function(t,e){return{id:e,label:t.trim()}}).filter(function(t){return l.allowDuplicates?!!t.label.length:!(!t.label.length||e[t.label])&&(e[t.label]=!0,t)})},m=function(t){var e,n=l.hotKeys.some(function(e){return(t.keyCode||t.which)===e});n&&(e=g(t.target.value),y(e))},v=function(t){window.clearTimeout(a),a=window.setTimeout(function(){l.autocomplete?l.autocompleteCallback(t.target.value,y):m(t)},l.inputDelay)},y=function(t){var e=document.createDocumentFragment(),n={};Array.isArray(t)&&(s.length&&(t=s.concat(t)),l.allowDuplicates||(t=t.filter(function(t){return!n[t.label]&&(n[t.label]=!0,!0)})),t.forEach(function(t){var n=document.createElement("div"),a=document.createElement("span"),i=document.createElement("button");a.classList.add("taggify__tag-label"),a.innerHTML=t.label,i.classList.add("taggify__btn--remove"),i.innerHTML="x",n.classList.add("taggify__tag"),n.dataset.tagText=t.label,n.dataset.tagId=t.id,n.appendChild(a),n.appendChild(i),e.appendChild(n)}),s=t,l.autocomplete?r.value="":(u.innerHTML="",r.value=t.map(function(t){return t.label}).join(", ")+", "),u.appendChild(e),f("tagsCreated"))},b=function(t,e){var n=t.parentNode;if(n)return e(t)?t:e(n)?n:b(n,e)},h=function(t){return t.classList&&t.classList.contains("taggify__tag")},L=function(t){return t.classList&&t.classList.contains("taggify__btn--remove")},_=function(t){var e,n=b(t.target,L),a="";n?(e=b(t.target,h),s=s.filter(function(t){return""+t.id!=""+e.dataset.tagId}),l.autocomplete||(a=s.map(function(t){return t.label}).join(", "),a=a.trim().length?a+", ":""),r.value=a,this.removeChild(e),f("tagRemoved")):f("tagNotRemoved")};for(e in t)t.hasOwnProperty(e)&&(l[e]=t[e]);n=document.querySelector(l.containerSelector),n.innerHTML="",d.classList.add("taggify__wrapper"),c.for=o,c.innerHTML=l.inputLabel,c.setAttribute("for",o),c.classList.add("taggify__label"),r.id=o,r.type="text",r.classList.add("taggify__input"),u.classList.add("taggify__tags"),n.appendChild(d),n.appendChild(u),d.appendChild(c),d.appendChild(r),r.addEventListener("keyup",v,!1),u.addEventListener("click",_,!1)}}); | ||
| !function(t,e,a){"use strict";"function"==typeof define&&define.amd?define("Taggify",a):"object"==typeof exports?exports=module.exports=a():t.Taggify=a()}(this,0,function(){"use strict";return function(t){var e,a,n,i=function(t,e){e(g(t))},l={containerNode:null,containerSelector:".taggify",autocomplete:!1,autocompleteCallback:i,inputDelay:100,inputLabel:"Start typing ...",allowDuplicates:!1,hotKeys:[188,13],displayLabel:!0,displayInputValues:!0},o="taggify-"+Date.now(),r=document.createElement("input"),u=document.createElement("label"),c=document.createElement("div"),s=document.createElement("div"),d=[],p=window.hasOwnProperty("CustomEvent"),f=function(t,e){var n,i;p?(i={bubbles:!0,cancelable:!1},e&&Object.keys(e).length&&(i.detail=e),n=new CustomEvent(t,i)):(n=document.createEvent("CustomEvent"),n.initEvent(t,!1,!0)),a.dispatchEvent(n)},g=function(t){var e={};return t.split(",").map(function(t){return{id:Math.floor(65536*(1+Math.random())).toString(16),label:t.trim()}}).filter(function(t){return l.allowDuplicates?!!t.label.length:!(!t.label.length||e[t.label])&&(e[t.label]=!0,t)})},m=function(t){var e,a=l.hotKeys.some(function(e){return(t.keyCode||t.which)===e});a&&(e=g(t.target.value),l.displayInputValues||(e=d.concat(e)),b(e))},y=function(t){window.clearTimeout(n),n=window.setTimeout(function(){l.autocomplete?l.autocompleteCallback(t.target.value,b):m(t)},l.inputDelay)},b=function(t){var e=document.createDocumentFragment(),a={};Array.isArray(t)&&(d.length&&(t=d.concat(t)),l.allowDuplicates||(t=t.filter(function(t){return!a[t.label]&&(a[t.label]=!0,!0)})),t.forEach(function(t){var a=document.createElement("div"),n=document.createElement("span"),i=document.createElement("button");n.classList.add("taggify__tag-label"),n.innerHTML=t.label,i.classList.add("taggify__btn--remove"),i.innerHTML="x",a.classList.add("taggify__tag"),a.dataset.tagText=t.label,a.dataset.tagId=t.id,a.appendChild(n),a.appendChild(i),e.appendChild(a)}),d=t,l.autocomplete?r.value="":(c.innerHTML="",l.displayInputValues?r.value=t.map(function(t){return t.label}).join(", ")+", ":r.value=""),c.appendChild(e),f("tagsCreated",{tags:d}))},v=function(t,e){var a=t.parentNode;if(a)return e(t)?t:e(a)?a:v(a,e)},h=function(t){return t.classList&&t.classList.contains("taggify__tag")},L=function(t){return t.classList&&t.classList.contains("taggify__btn--remove")},_=function(t){var e,a=v(t.target,L),n="";a?(e=v(t.target,h),d=d.filter(function(t){return""+t.id!=""+e.dataset.tagId}),l.autocomplete||(n=d.map(function(t){return t.label}).join(", "),n=n.trim().length?n+", ":""),l.displayInputValues&&(r.value=n),this.removeChild(e),f("tagRemoved",{tags:d})):f("tagNotRemoved")};for(e in t)t.hasOwnProperty(e)&&(l[e]=t[e]);return a=l.containerNode?l.containerNode:document.querySelector(l.containerSelector),a.innerHTML="",s.classList.add("taggify__wrapper"),r.id=o,r.type="text",r.classList.add("taggify__input"),c.classList.add("taggify__tags"),a.appendChild(s),a.appendChild(c),l.displayLabel&&(u.for=o,u.innerHTML=l.inputLabel,u.setAttribute("for",o),u.classList.add("taggify__label"),s.appendChild(u)),s.appendChild(r),r.addEventListener("keyup",y,!1),c.addEventListener("click",_,!1),{updateTags:function(t){return l.displayInputValues&&(r.value=t.map(function(t){return t.label}).join(", ")),b(t),this}}}}); |
@@ -1,2 +0,2 @@ | ||
| [COMMENT] //jshint ignore:line | ||
| [COMMENT] | ||
| ;(function (root, moduleName, factory) { | ||
@@ -15,5 +15,5 @@ 'use strict'; | ||
| [TAGGIFY] | ||
| [TAGGIFY] | ||
| return Taggify; | ||
| }); |
@@ -1,4 +0,4 @@ | ||
| [COMMENT] //jshint ignore:line | ||
| [TAGGIFY] //jshint ignore:line | ||
| [COMMENT] | ||
| [TAGGIFY] | ||
| export default Taggify; |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by12.01%
76212
- Number of package files
- increased by4.76%
22
- Lines of code
- increased by15.59%
1698
- Number of lines in readme file
- increased by31.58%
75
No dependency changes