@astralservices/react-chip
Version:
Manage a list of chips based on a strings list.
3 lines (2 loc) • 2.16 kB
JavaScript
;Object.defineProperty(exports,"__esModule",{value:!0});var e,l=require("react"),n=(e=l)&&"object"==typeof e&&"default"in e?e.default:e;exports.default=function(e){var t=e.inputClass,a=void 0===t?"":t,u=e.chipClass,i=void 0===u?"":u,o=e.labelClass,r=void 0===o?"":o,s=e.focusClass,v=void 0===s?"":s,c=e.regex,d=void 0===c?/^[0-9a-zA-Z,]+$/:c,p=e.maxChipLength,f=void 0===p?9999:p,g=e.defaultChips,m=e.defaultValue,h=void 0===m?"":m,y=e.id,C=void 0===y?"":y,x=e.name,D=void 0===x?"":x,L=e.maxLength,b=void 0===L?9999:L,k=e.onChange,E=void 0===k?function(){}:k,P=e.style,A=void 0===P?{}:P,N=l.useState(void 0===g?[]:g),S=N[0],j=N[1],O=l.useState(h),T=O[0],_=O[1];function q(e){if(!((null==S?void 0:S.length)>=b||null!=S&&S.includes(e))&&e.match(d)){var l=[].concat(S,[null==e?void 0:e.trim()]);E(l),j(l),_("")}}function w(e){if(!((null==S?void 0:S.length)<=0)){var l=null==S?void 0:S.filter((function(l){return l!==e}));E(l),j(l)}}return n.createElement("label",{className:r,id:C,style:A},Array.isArray(S)?null==S?void 0:S.map((function(e){return n.createElement("span",{className:i,key:e,onClick:function(l){return function(e,l){null==e||e.preventDefault(),null==e||e.stopPropagation(),w(l)}(l,e)}},n.createElement("input",{type:"hidden",name:D,value:e,readOnly:!0}),e)})):null,n.createElement("input",{name:D+"-input",className:a,type:"text",onChange:function(e){null==e||e.preventDefault(),null==e||e.stopPropagation();var l=e.currentTarget.value;""===l&&_(""),","===l[0]||(null==l?void 0:l.length)>f||(null!=l&&l.match(/,/g)?q(null==l?void 0:l.split(",")[0]):_(l))},onKeyDown:function(e){var l;null==e||e.stopPropagation();var n,t,a,u=e.currentTarget,i=u.value,o=u.previousSibling,r=e.key,s=e.keyCode;i||null==S||!S.length||"Backspace"!==r&&"Delete"!==r||(null==e||e.preventDefault(),null!=o&&null!=(n=o.classList)&&n.contains(v)?w(null==S?void 0:S[(null==S?void 0:S.length)-1]):null==o||null==(t=o.classList)||t.add(v)),i&&S&&null!=o&&null!=(l=o.classList)&&l.contains(v)&&(null==o||null==(a=o.classLis)||a.pxove(v)),!i||"Enter"!==r&&32!==s||(null==e||e.preventDefault(),q(i))},value:T}))};
//# sourceMappingURL=react-chip.cjs.production.min.js.map