react-customize-token-input - npm Package Compare versions

Comparing version 1.4.1 to 1.4.2

lib/index.js

 /*! For license information please see index.js.LICENSE.txt */
-!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("react"));else if("function"==typeof define&&define.amd)define(["react"],t);else{var n="object"==typeof exports?t(require("react")):t(e.React);for(var r in n)("object"==typeof exports?exports:e)[r]=n[r]}}(self,(function(e){return(()=>{var t={184:(e,t)=>{var n;!function(){"use strict";var r={}.hasOwnProperty;function o(){for(var e=[],t=0;t<arguments.length;t++){var n=arguments[t];if(n){var a=typeof n;if("string"===a||"number"===a)e.push(n);else if(Array.isArray(n)){if(n.length){var i=o.apply(null,n);i&&e.push(i)}}else if("object"===a)if(n.toString===Object.prototype.toString)for(var u in n)r.call(n,u)&&n[u]&&e.push(u);else e.push(n.toString())}}return e.join(" ")}e.exports?(o.default=o,e.exports=o):void 0===(n=function(){return o}.apply(t,[]))||(e.exports=n)}()},703:(e,t,n)=>{"use strict";var r=n(414);function o(){}function a(){}a.resetWarningCache=o,e.exports=function(){function e(e,t,n,o,a,i){if(i!==r){var u=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw u.name="Invariant Violation",u}}function t(){return e}e.isRequired=e;var n={array:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,elementType:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t,checkPropTypes:a,resetWarningCache:o};return n.PropTypes=n,n}},697:(e,t,n)=>{e.exports=n(703)()},414:e=>{"use strict";e.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},639:(e,t,n)=>{"use strict";var r=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},o=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),a=n(698),i=l(a),u=l(n(697));function l(e){return e&&e.__esModule?e:{default:e}}var s={position:"absolute",top:0,left:0,visibility:"hidden",height:0,overflow:"scroll",whiteSpace:"pre"},c=["extraWidth","injectStyles","inputClassName","inputRef","inputStyle","minWidth","onAutosize","placeholderIsMinWidth"],f=function(e,t){t.style.fontSize=e.fontSize,t.style.fontFamily=e.fontFamily,t.style.fontWeight=e.fontWeight,t.style.fontStyle=e.fontStyle,t.style.letterSpacing=e.letterSpacing,t.style.textTransform=e.textTransform},p=!("undefined"==typeof window||!window.navigator)&&/MSIE |Trident\/|Edge\//.test(window.navigator.userAgent),d=function(){return p?"_"+Math.random().toString(36).substr(2,12):void 0},y=function(e){function t(e){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t);var n=function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));return n.inputRef=function(e){n.input=e,"function"==typeof n.props.inputRef&&n.props.inputRef(e)},n.placeHolderSizerRef=function(e){n.placeHolderSizer=e},n.sizerRef=function(e){n.sizer=e},n.state={inputWidth:e.minWidth,inputId:e.id||d(),prevId:e.id},n}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(t,e),o(t,null,[{key:"getDerivedStateFromProps",value:function(e,t){var n=e.id;return n!==t.prevId?{inputId:n||d(),prevId:n}:null}}]),o(t,[{key:"componentDidMount",value:function(){this.mounted=!0,this.copyInputStyles(),this.updateInputWidth()}},{key:"componentDidUpdate",value:function(e,t){t.inputWidth!==this.state.inputWidth&&"function"==typeof this.props.onAutosize&&this.props.onAutosize(this.state.inputWidth),this.updateInputWidth()}},{key:"componentWillUnmount",value:function(){this.mounted=!1}},{key:"copyInputStyles",value:function(){if(this.mounted&&window.getComputedStyle){var e=this.input&&window.getComputedStyle(this.input);e&&(f(e,this.sizer),this.placeHolderSizer&&f(e,this.placeHolderSizer))}}},{key:"updateInputWidth",value:function(){if(this.mounted&&this.sizer&&void 0!==this.sizer.scrollWidth){var e=void 0;e=this.props.placeholder&&(!this.props.value||this.props.value&&this.props.placeholderIsMinWidth)?Math.max(this.sizer.scrollWidth,this.placeHolderSizer.scrollWidth)+2:this.sizer.scrollWidth+2,(e+="number"===this.props.type&&void 0===this.props.extraWidth?16:parseInt(this.props.extraWidth)||0)<this.props.minWidth&&(e=this.props.minWidth),e!==this.state.inputWidth&&this.setState({inputWidth:e})}}},{key:"getInput",value:function(){return this.input}},{key:"focus",value:function(){this.input.focus()}},{key:"blur",value:function(){this.input.blur()}},{key:"select",value:function(){this.input.select()}},{key:"renderStyles",value:function(){var e=this.props.injectStyles;return p&&e?i.default.createElement("style",{dangerouslySetInnerHTML:{__html:"input#"+this.state.inputId+"::-ms-clear {display: none;}"}}):null}},{key:"render",value:function(){var e=[this.props.defaultValue,this.props.value,""].reduce((function(e,t){return null!=e?e:t})),t=r({},this.props.style);t.display||(t.display="inline-block");var n=r({boxSizing:"content-box",width:this.state.inputWidth+"px"},this.props.inputStyle),o=function(e,t){var n={};for(var r in e)t.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}(this.props,[]);return function(e){c.forEach((function(t){return delete e[t]}))}(o),o.className=this.props.inputClassName,o.id=this.state.inputId,o.style=n,i.default.createElement("div",{className:this.props.className,style:t},this.renderStyles(),i.default.createElement("input",r({},o,{ref:this.inputRef})),i.default.createElement("div",{ref:this.sizerRef,style:s},e),this.props.placeholder?i.default.createElement("div",{ref:this.placeHolderSizerRef,style:s},this.props.placeholder):null)}}]),t}(a.Component);y.propTypes={className:u.default.string,defaultValue:u.default.any,extraWidth:u.default.oneOfType([u.default.number,u.default.string]),id:u.default.string,injectStyles:u.default.bool,inputClassName:u.default.string,inputRef:u.default.func,inputStyle:u.default.object,minWidth:u.default.oneOfType([u.default.number,u.default.string]),onAutosize:u.default.func,onChange:u.default.func,placeholder:u.default.string,placeholderIsMinWidth:u.default.bool,style:u.default.object,value:u.default.any},y.defaultProps={minWidth:1,injectStyles:!0},t.Z=y},698:t=>{"use strict";t.exports=e}},n={};function r(e){var o=n[e];if(void 0!==o)return o.exports;var a=n[e]={exports:{}};return t[e](a,a.exports,r),a.exports}r.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return r.d(t,{a:t}),t},r.d=(e,t)=>{for(var n in t)r.o(t,n)&&!r.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var o={};return(()=>{"use strict";r.r(o),r.d(o,{JS__TOKEN__DELETE_BUTTON__CLASS_NAME:()=>p,default:()=>X});var e=r(698),t=r.n(e),n=r(697),a=r.n(n),i=r(184),u=r.n(i),l=r(639);var s=function(){};const c=function(e,t){var n=t.onBackspace,r=void 0===n?s:n,o=t.onTab,a=void 0===o?s:o,i=t.onEnter,u=void 0===i?s:i,l=t.onEscape,c=void 0===l?s:l;switch(function(e){var t=e.key,n=e.keyCode,r=t;return n&&229===n&&(r="Process"),{key:r}}(e).key){case"Backspace":r(e);break;case"Tab":a(e);break;case"Enter":u(e);break;case"Escape":c(e)}};var f={onBackspace:1,onTab:0,onEnter:1,onEscape:1},p="js__token__delete-button";function d(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function y(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?d(Object(n),!0).forEach((function(t){h(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):d(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function h(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var b=function(e){var t=e.keyDownEvent,n=e.onKey,r=e.predefinedHandler;switch(!0){case 1===n:r(t)}};const v=function(t){var n=t.specialKeyDown,r=t.inputInitValue,o=t.inputValue,a=t.onLastTokenDelete,i=t.handleInputValueUpdate,u=t.handleTokensCreate,l=y(y({},f),n),s=l.onBackspace,c=l.onTab,p=l.onEnter,d=l.onEscape;return{handleBackspaceKeyDown:(0,e.useCallback)((function(e){b({keyDownEvent:e,onKey:s,predefinedHandler:function(){0===o.length&&a()}})}),[s,o,a]),handleTabKeyDown:(0,e.useCallback)((function(e){b({keyDownEvent:e,onKey:c,predefinedHandler:function(e){e.preventDefault(),u(o)}})}),[c,o,u]),handleEnterKeyDown:(0,e.useCallback)((function(e){b({keyDownEvent:e,onKey:p,predefinedHandler:function(){u(o)}})}),[p,o,u]),handleEscapeKeyDown:(0,e.useCallback)((function(e){b({keyDownEvent:e,onKey:d,predefinedHandler:function(){i(r)}})}),[d,r,i])}},m="token-input-token",k="token-input-autosized-wrapper";function g(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var T=(0,e.forwardRef)((function(n,r){var o,a,i=n.placeholder,u=n.autoFocus,s=n.onFocus,f=n.onBlur,p=n.separators,d=n.specialKeyDown,y=n.onInputValueChange,h=n.onPreprocess,b=n.onBuildTokenValue,m=n.onNewTokenValuesAppend,T=n.onLastTokenDelete,w=(o=(0,e.useState)(""),a=2,function(e){if(Array.isArray(e))return e}(o)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,a=[],i=!0,u=!1;try{for(n=n.call(e);!(i=(r=n.next()).done)&&(a.push(r.value),!t||a.length!==t);i=!0);}catch(e){u=!0,o=e}finally{try{i||null==n.return||n.return()}finally{if(u)throw o}}return a}}(o,a)||function(e,t){if(e){if("string"==typeof e)return g(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?g(e,t):void 0}}(o,a)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),S=w[0],E=w[1],C=(0,e.useMemo)((function(){return new RegExp(p.join("|"))}),[p]),O=(0,e.useCallback)((function(e){E(e),y(e,S)}),[y,S,E]),j=(0,e.useCallback)((function(e){if(0!==e.trim().length){var t=e.split(C).filter((function(e){return e.trim().length>0})),n=h(t).map((function(e){return b(e)}));m(n),O("")}}),[C,h,b,m,O]),A=(0,e.useCallback)((function(e){var t=e.target.value,n=t.substring(t.length-1);!0!==C.test(n)?O(t):j(S)}),[C,j,S,O]),I=v({specialKeyDown:d,inputInitValue:"",inputValue:S,onLastTokenDelete:T,handleInputValueUpdate:O,handleTokensCreate:j}),V=I.handleBackspaceKeyDown,D=I.handleTabKeyDown,R=I.handleEnterKeyDown,_=I.handleEscapeKeyDown,P=(0,e.useCallback)((function(e){c(e,{onBackspace:V,onTab:D,onEnter:R,onEscape:_})}),[V,D,R,_]),M=(0,e.useCallback)((function(e){j(S),f(e)}),[j,S,f]),x=(0,e.useCallback)((function(e){e.preventDefault();var t=e.clipboardData.getData("text");j(t)}),[j]);return t().createElement("div",{className:k},t().createElement(l.Z,{ref:r,autoFocus:u,placeholder:i,value:S,onChange:A,onKeyDown:P,onPaste:x,onFocus:s,onBlur:M}))}));T.displayName="TokenCreator",T.propTypes={placeholder:a().string.isRequired,autoFocus:a().bool.isRequired,onFocus:a().func.isRequired,onBlur:a().func.isRequired,separators:a().array.isRequired,specialKeyDown:a().object.isRequired,onInputValueChange:a().func.isRequired,onPreprocess:a().func.isRequired,onBuildTokenValue:a().func.isRequired,onNewTokenValuesAppend:a().func.isRequired,onLastTokenDelete:a().func.isRequired};const w=T,S=function(){return t().createElement("div",{role:"img",className:"token-input-token__delete-button__close-icon","aria-hidden":"true","data-component-name":"CloseIcon"})};var E=function(e){var n=e.onRenderContent,r="function"==typeof n;return t().createElement("span",{role:"button",className:u()(p,"token-input-token__delete-button"),"aria-hidden":"true","data-component-name":"DeleteButton"},r&&n(),!r&&t().createElement(S,null))};E.propTypes={onRenderContent:a().func};const C=E;function O(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function j(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var A=function(e){e.stopPropagation()},I=function(n){var r,o,a=n.readOnly,i=n.tokenValue,s=n.tokenMeta,f=n.onGetClassName,d=n.onGetDisplayLabel,y=n.onRenderDeleteButtonContent,h=n.onGetEditableValue,b=n.onGetErrorMessage,v=n.onBuildTokenValue,g=n.onEditStart,T=n.onEditEnd,w=n.onDelete,S=(0,e.useRef)(null),E=(r=(0,e.useState)(""),o=2,function(e){if(Array.isArray(e))return e}(r)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,a=[],i=!0,u=!1;try{for(n=n.call(e);!(i=(r=n.next()).done)&&(a.push(r.value),!t||a.length!==t);i=!0);}catch(e){u=!0,o=e}finally{try{i||null==n.return||n.return()}finally{if(u)throw o}}return a}}(r,o)||function(e,t){if(e){if("string"==typeof e)return j(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?j(e,t):void 0}}(r,o)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),I=E[0],V=E[1],D=s.activated,R=s.error,_=(0,e.useCallback)((function(){var e=h(i,s);V(e),g()}),[V,i,s,h,g]);(0,e.useEffect)((function(){D&&S.current&&S.current.focus()}),[D]);var P=(0,e.useCallback)((function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},t=e.reset,n=void 0!==t&&t,r=0===I.length;if(n||r)T();else{var o=v(I);T(o)}}),[I,v,T]),M=(0,e.useCallback)((function(e){e.stopPropagation(),a||(e.target.closest(".".concat(m," .").concat(p))?w():_())}),[a,w,_]),x=(0,e.useCallback)((function(e){var t=e.target.value;V(t)}),[V]),B=(0,e.useCallback)((function(e){c(e,{onEscape:function(){return P({reset:!0})},onEnter:function(){return P()}})}),[P]),N=(0,e.useCallback)((function(){P()}),[P]),W=(0,e.useMemo)((function(){var e;return u()(f(i,s),m,(O(e={},"token-input-token--active",D),O(e,"token-input-token--error",R&&!D),O(e,"token-input-token--read-only",a),e))}),[a,R,D,f,i,s]),G=(0,e.useMemo)((function(){return b(i,s)}),[b,i,s]);return D?t().createElement("div",{role:"presentation",className:W,onClick:A},t().createElement("div",{className:k},t().createElement(l.Z,{ref:S,value:I,onChange:x,onKeyDown:B,onBlur:N}))):t().createElement("div",{role:"presentation",className:W,onClick:M,title:G,"data-component-name":"Token"},t().createElement("div",{className:"token-input-token__label-wrapper"},d(i,s)),!a&&t().createElement(C,{onRenderContent:y}))};I.propTypes={readOnly:a().bool.isRequired,tokenValue:a().any.isRequired,tokenMeta:a().object.isRequired,onGetClassName:a().func.isRequired,onGetDisplayLabel:a().func.isRequired,onRenderDeleteButtonContent:a().func,onGetEditableValue:a().func.isRequired,onGetErrorMessage:a().func.isRequired,onBuildTokenValue:a().func.isRequired,onEditStart:a().func.isRequired,onEditEnd:a().func.isRequired,onDelete:a().func.isRequired};const V=I;function D(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}const R=function(){var t,n,r=(t=(0,e.useState)(!1),n=2,function(e){if(Array.isArray(e))return e}(t)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,a=[],i=!0,u=!1;try{for(n=n.call(e);!(i=(r=n.next()).done)&&(a.push(r.value),!t||a.length!==t);i=!0);}catch(e){u=!0,o=e}finally{try{i||null==n.return||n.return()}finally{if(u)throw o}}return a}}(t,n)||function(e,t){if(e){if("string"==typeof e)return D(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?D(e,t):void 0}}(t,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),o=r[0],a=r[1];return{isTokenInputFocused:o,handleTokenInputFocus:(0,e.useCallback)((function(){a(!0)}),[]),handleTokenInputBlur:(0,e.useCallback)((function(){a(!1)}),[])}},_=function(e,t,n){return{key:"".concat(JSON.stringify(t),"-").concat(Date.now(),"-").concat(n),activated:!1,error:e}};function P(e,t){if(e){if("string"==typeof e)return M(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?M(e,t):void 0}}function M(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}const x=function(){var t,n,r=(t=(0,e.useState)([]),n=2,function(e){if(Array.isArray(e))return e}(t)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,a=[],i=!0,u=!1;try{for(n=n.call(e);!(i=(r=n.next()).done)&&(a.push(r.value),!t||a.length!==t);i=!0);}catch(e){u=!0,o=e}finally{try{i||null==n.return||n.return()}finally{if(u)throw o}}return a}}(t,n)||P(t,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),o=r[0],a=r[1],i=(0,e.useCallback)((function(e,t){if(e>=o.length)throw new Error("setTokenActivated out of tokenMetas scope; targetIndex ".concat(e,"; tokenMetas.length ").concat(o.length));var n=function(e){return function(e){if(Array.isArray(e))return M(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||P(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}(o);n[e].activated=t,a(n)}),[o]);return{buildTokenMeta:_,tokenMetas:o,setTokenMetas:a,setTokenActivated:i}};function B(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,a=[],i=!0,u=!1;try{for(n=n.call(e);!(i=(r=n.next()).done)&&(a.push(r.value),!t||a.length!==t);i=!0);}catch(e){u=!0,o=e}finally{try{i||null==n.return||n.return()}finally{if(u)throw o}}return a}}(e,t)||N(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function N(e,t){if(e){if("string"==typeof e)return W(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?W(e,t):void 0}}function W(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}const G=function(t){var n=t.tokenValues,r=t.onTokenValueValidate,o=x(),a=o.buildTokenMeta,i=o.tokenMetas,u=o.setTokenMetas,l=o.setTokenActivated,s=B((0,e.useState)(!1),2),c=s[0],f=s[1],p=B((0,e.useState)([]),2),d=p[0],y=p[1];return(0,e.useLayoutEffect)((function(){var e,t=!1,o=n.map((function(e,o){var i=r(e,o,n),u=a(i,e,o);return u.error&&!u.activated&&(t=!0),u}));y(function(e){if(Array.isArray(e))return W(e)}(e=n)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||N(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),u(o),f(t)}),[n,r,u,a]),{hasInvalidToken:c,internalTokenValues:d,tokenMetas:i,setTokenActivated:l}};function q(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}const z=function(t){var n=t.tokenValues,r=t.onTokenValuesChange,o=t.setTokenActivated,a=t.handleTokenInputFocus,i=t.handleTokenInputBlur,u=t.focusTokenCreator;return{handleTokenEditStart:(0,e.useCallback)((function(e){return function(){o(e,!0),a()}}),[o,a]),handleTokenEditEnd:(0,e.useCallback)((function(e){return function(t){if(o(e,!1),i(),u(),void 0!==t){var a=function(e){if(Array.isArray(e))return q(e)}(l=n)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(l)||function(e,t){if(e){if("string"==typeof e)return q(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?q(e,t):void 0}}(l)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}();a[e]=t,r(a)}var l}}),[n,r,o,i,u])}};function K(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}const F=function(t){var n=t.tokenValues,r=t.onTokenValuesChange,o=t.focusTokenCreator,a=(0,e.useCallback)((function(e){var t,a=function(e){if(Array.isArray(e))return K(e)}(t=n)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(t)||function(e,t){if(e){if("string"==typeof e)return K(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?K(e,t):void 0}}(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}();a.splice(e,1),r(a),o()}),[n,r,o]);return{handleTokenDelete:(0,e.useCallback)((function(e){return function(){a(e)}}),[a]),handleLastTokenDelete:(0,e.useCallback)((function(){a(-1)}),[a])}},L=function(e,t){return e};var U=["className","readOnly","autoFocus","placeholder","tokenValues","onTokenValuesChange","onBuildTokenValue","customizeTokenComponent","onGetTokenClassName","onGetTokenDisplayLabel","onRenderTokenDeleteButtonContent","onGetTokenEditableValue","onGetTokenErrorMessage","separators","specialKeyDown","onPreprocess","onInputValueChange","onTokenValueValidate"];function H(){return(H=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function $(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function Z(e){return function(e){if(Array.isArray(e))return J(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||function(e,t){if(e){if("string"==typeof e)return J(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?J(e,t):void 0}}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function J(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var Y=function(n){var r,o=n.className,a=n.readOnly,i=n.autoFocus,l=n.placeholder,s=n.tokenValues,c=n.onTokenValuesChange,f=n.onBuildTokenValue,p=n.customizeTokenComponent,d=n.onGetTokenClassName,y=n.onGetTokenDisplayLabel,h=n.onRenderTokenDeleteButtonContent,b=n.onGetTokenEditableValue,v=n.onGetTokenErrorMessage,m=n.separators,k=n.specialKeyDown,g=n.onPreprocess,T=n.onInputValueChange,S=n.onTokenValueValidate,E=function(e,t){if(null==e)return{};var n,r,o=function(e,t){if(null==e)return{};var n,r,o={},a=Object.keys(e);for(r=0;r<a.length;r++)n=a[r],t.indexOf(n)>=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r<a.length;r++)n=a[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}(n,U),C=R(),O=C.isTokenInputFocused,j=C.handleTokenInputFocus,A=C.handleTokenInputBlur,I=function(){var t=(0,e.useRef)(null),n=(0,e.useCallback)((function(){t&&t.current&&t.current.focus()}),[]);return{tokenCreatorRef:t,focusTokenCreator:n}}(),D=I.tokenCreatorRef,_=I.focusTokenCreator,P=G({tokenValues:s,onTokenValueValidate:S}),M=P.hasInvalidToken,x=P.internalTokenValues,B=P.tokenMetas,N=P.setTokenActivated,W=z({tokenValues:s,onTokenValuesChange:c,setTokenActivated:N,handleTokenInputFocus:j,handleTokenInputBlur:A,focusTokenCreator:_}),q=W.handleTokenEditStart,K=W.handleTokenEditEnd,L=F({tokenValues:s,onTokenValuesChange:c,focusTokenCreator:_}),J=L.handleTokenDelete,Y=L.handleLastTokenDelete,Q=(0,e.useCallback)((function(e){if(0!==e.length){var t=[].concat(Z(s),Z(e));c(t)}}),[s,c]),X=(0,e.useCallback)((function(e){if("function"!=typeof g)return e;var t=g(e);if(!0!==Array.isArray(t))throw new Error("onPreprocess should return an array of values");return t}),[g]),ee=p||V;return t().createElement("div",H({},E,{className:u()(o,"token-input-container",(r={},$(r,"token-input-container--focused",O),$(r,"token-input-container--errors",M),r)),onClick:_,role:"presentation","data-component-name":"TokenInput"}),t().createElement("div",{className:"token-input-token-list"},x.map((function(e,n){var r=B[n],o=r.key;return t().createElement(ee,{key:o,readOnly:a,tokenValue:e,tokenMeta:r,onGetClassName:d,onGetDisplayLabel:y,onRenderDeleteButtonContent:h,onGetEditableValue:b,onGetErrorMessage:v,onBuildTokenValue:f,onEditStart:q(n),onEditEnd:K(n),onDelete:J(n)})}))),!a&&t().createElement(w,{ref:D,placeholder:l,autoFocus:i,onFocus:j,onBlur:A,separators:m,specialKeyDown:k,onInputValueChange:T,onPreprocess:X,onBuildTokenValue:f,onNewTokenValuesAppend:Q,onLastTokenDelete:Y}))};Y.propTypes={style:a().object,className:a().string,readOnly:a().bool,autoFocus:a().bool,placeholder:a().string,separators:a().array,tokenValues:a().array.isRequired,onTokenValuesChange:a().func,onPreprocess:a().func,onBuildTokenValue:a().func,onInputValueChange:a().func,onTokenValueValidate:a().func,onGetTokenClassName:a().func,onGetTokenDisplayLabel:a().func,onRenderTokenDeleteButtonContent:a().func,onGetTokenEditableValue:a().func,onGetTokenErrorMessage:a().func,customizeTokenComponent:a().func,specialKeyDown:a().object};var Q=function(){};Y.defaultProps={className:"",readOnly:!1,autoFocus:!1,placeholder:"",separators:[",",";","\n","\r","\r\n"],specialKeyDown:{onBackspace:1,onTab:0,onEnter:1,onEscape:1},onBuildTokenValue:function(e){return e.trim()},onInputValueChange:Q,onTokenValueValidate:Q,onTokenValuesChange:Q,onGetTokenClassName:Q,onGetTokenDisplayLabel:L,onGetTokenEditableValue:L,onGetTokenErrorMessage:function(e,t){if("string"==typeof t.error)return t.error}};const X=Y})(),o})()}));
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):"object"==typeof exports?exports["token-input"]=t(require("react")):e.TokenInput=t(e.React)}(self,(function(e){return(()=>{var t={184:(e,t)=>{var n;!function(){"use strict";var r={}.hasOwnProperty;function o(){for(var e=[],t=0;t<arguments.length;t++){var n=arguments[t];if(n){var a=typeof n;if("string"===a||"number"===a)e.push(n);else if(Array.isArray(n)){if(n.length){var u=o.apply(null,n);u&&e.push(u)}}else if("object"===a)if(n.toString===Object.prototype.toString)for(var i in n)r.call(n,i)&&n[i]&&e.push(i);else e.push(n.toString())}}return e.join(" ")}e.exports?(o.default=o,e.exports=o):void 0===(n=function(){return o}.apply(t,[]))||(e.exports=n)}()},703:(e,t,n)=>{"use strict";var r=n(414);function o(){}function a(){}a.resetWarningCache=o,e.exports=function(){function e(e,t,n,o,a,u){if(u!==r){var i=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw i.name="Invariant Violation",i}}function t(){return e}e.isRequired=e;var n={array:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,elementType:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t,checkPropTypes:a,resetWarningCache:o};return n.PropTypes=n,n}},697:(e,t,n)=>{e.exports=n(703)()},414:e=>{"use strict";e.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},639:(e,t,n)=>{"use strict";var r=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},o=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),a=n(698),u=l(a),i=l(n(697));function l(e){return e&&e.__esModule?e:{default:e}}var s={position:"absolute",top:0,left:0,visibility:"hidden",height:0,overflow:"scroll",whiteSpace:"pre"},c=["extraWidth","injectStyles","inputClassName","inputRef","inputStyle","minWidth","onAutosize","placeholderIsMinWidth"],f=function(e,t){t.style.fontSize=e.fontSize,t.style.fontFamily=e.fontFamily,t.style.fontWeight=e.fontWeight,t.style.fontStyle=e.fontStyle,t.style.letterSpacing=e.letterSpacing,t.style.textTransform=e.textTransform},p=!("undefined"==typeof window||!window.navigator)&&/MSIE |Trident\/|Edge\//.test(window.navigator.userAgent),d=function(){return p?"_"+Math.random().toString(36).substr(2,12):void 0},y=function(e){function t(e){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t);var n=function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));return n.inputRef=function(e){n.input=e,"function"==typeof n.props.inputRef&&n.props.inputRef(e)},n.placeHolderSizerRef=function(e){n.placeHolderSizer=e},n.sizerRef=function(e){n.sizer=e},n.state={inputWidth:e.minWidth,inputId:e.id||d(),prevId:e.id},n}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(t,e),o(t,null,[{key:"getDerivedStateFromProps",value:function(e,t){var n=e.id;return n!==t.prevId?{inputId:n||d(),prevId:n}:null}}]),o(t,[{key:"componentDidMount",value:function(){this.mounted=!0,this.copyInputStyles(),this.updateInputWidth()}},{key:"componentDidUpdate",value:function(e,t){t.inputWidth!==this.state.inputWidth&&"function"==typeof this.props.onAutosize&&this.props.onAutosize(this.state.inputWidth),this.updateInputWidth()}},{key:"componentWillUnmount",value:function(){this.mounted=!1}},{key:"copyInputStyles",value:function(){if(this.mounted&&window.getComputedStyle){var e=this.input&&window.getComputedStyle(this.input);e&&(f(e,this.sizer),this.placeHolderSizer&&f(e,this.placeHolderSizer))}}},{key:"updateInputWidth",value:function(){if(this.mounted&&this.sizer&&void 0!==this.sizer.scrollWidth){var e=void 0;e=this.props.placeholder&&(!this.props.value||this.props.value&&this.props.placeholderIsMinWidth)?Math.max(this.sizer.scrollWidth,this.placeHolderSizer.scrollWidth)+2:this.sizer.scrollWidth+2,(e+="number"===this.props.type&&void 0===this.props.extraWidth?16:parseInt(this.props.extraWidth)||0)<this.props.minWidth&&(e=this.props.minWidth),e!==this.state.inputWidth&&this.setState({inputWidth:e})}}},{key:"getInput",value:function(){return this.input}},{key:"focus",value:function(){this.input.focus()}},{key:"blur",value:function(){this.input.blur()}},{key:"select",value:function(){this.input.select()}},{key:"renderStyles",value:function(){var e=this.props.injectStyles;return p&&e?u.default.createElement("style",{dangerouslySetInnerHTML:{__html:"input#"+this.state.inputId+"::-ms-clear {display: none;}"}}):null}},{key:"render",value:function(){var e=[this.props.defaultValue,this.props.value,""].reduce((function(e,t){return null!=e?e:t})),t=r({},this.props.style);t.display||(t.display="inline-block");var n=r({boxSizing:"content-box",width:this.state.inputWidth+"px"},this.props.inputStyle),o=function(e,t){var n={};for(var r in e)t.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}(this.props,[]);return function(e){c.forEach((function(t){return delete e[t]}))}(o),o.className=this.props.inputClassName,o.id=this.state.inputId,o.style=n,u.default.createElement("div",{className:this.props.className,style:t},this.renderStyles(),u.default.createElement("input",r({},o,{ref:this.inputRef})),u.default.createElement("div",{ref:this.sizerRef,style:s},e),this.props.placeholder?u.default.createElement("div",{ref:this.placeHolderSizerRef,style:s},this.props.placeholder):null)}}]),t}(a.Component);y.propTypes={className:i.default.string,defaultValue:i.default.any,extraWidth:i.default.oneOfType([i.default.number,i.default.string]),id:i.default.string,injectStyles:i.default.bool,inputClassName:i.default.string,inputRef:i.default.func,inputStyle:i.default.object,minWidth:i.default.oneOfType([i.default.number,i.default.string]),onAutosize:i.default.func,onChange:i.default.func,placeholder:i.default.string,placeholderIsMinWidth:i.default.bool,style:i.default.object,value:i.default.any},y.defaultProps={minWidth:1,injectStyles:!0},t.Z=y},698:t=>{"use strict";t.exports=e}},n={};function r(e){var o=n[e];if(void 0!==o)return o.exports;var a=n[e]={exports:{}};return t[e](a,a.exports,r),a.exports}r.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return r.d(t,{a:t}),t},r.d=(e,t)=>{for(var n in t)r.o(t,n)&&!r.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var o={};return(()=>{"use strict";r.r(o),r.d(o,{JS__TOKEN__DELETE_BUTTON__CLASS_NAME:()=>p,default:()=>X});var e=r(698),t=r.n(e),n=r(697),a=r.n(n),u=r(184),i=r.n(u),l=r(639);var s=function(){};const c=function(e,t){var n=t.onBackspace,r=void 0===n?s:n,o=t.onTab,a=void 0===o?s:o,u=t.onEnter,i=void 0===u?s:u,l=t.onEscape,c=void 0===l?s:l;switch(function(e){var t=e.key,n=e.keyCode,r=t;return n&&229===n&&(r="Process"),{key:r}}(e).key){case"Backspace":r(e);break;case"Tab":a(e);break;case"Enter":i(e);break;case"Escape":c(e)}};var f={onBackspace:1,onTab:0,onEnter:1,onEscape:1},p="js__token__delete-button";function d(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function y(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?d(Object(n),!0).forEach((function(t){h(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):d(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function h(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var b=function(e){var t=e.keyDownEvent,n=e.onKey,r=e.predefinedHandler;switch(!0){case 1===n:r(t)}};const m=function(t){var n=t.specialKeyDown,r=t.inputInitValue,o=t.inputValue,a=t.onLastTokenDelete,u=t.handleInputValueUpdate,i=t.handleTokensCreate,l=y(y({},f),n),s=l.onBackspace,c=l.onTab,p=l.onEnter,d=l.onEscape;return{handleBackspaceKeyDown:(0,e.useCallback)((function(e){b({keyDownEvent:e,onKey:s,predefinedHandler:function(){0===o.length&&a()}})}),[s,o,a]),handleTabKeyDown:(0,e.useCallback)((function(e){b({keyDownEvent:e,onKey:c,predefinedHandler:function(e){e.preventDefault(),i(o)}})}),[c,o,i]),handleEnterKeyDown:(0,e.useCallback)((function(e){b({keyDownEvent:e,onKey:p,predefinedHandler:function(){i(o)}})}),[p,o,i]),handleEscapeKeyDown:(0,e.useCallback)((function(e){b({keyDownEvent:e,onKey:d,predefinedHandler:function(){u(r)}})}),[d,r,u])}},v="token-input-token",k="token-input-autosized-wrapper";function g(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var T=(0,e.forwardRef)((function(n,r){var o,a,u=n.placeholder,i=n.autoFocus,s=n.onFocus,f=n.onBlur,p=n.separators,d=n.specialKeyDown,y=n.onInputValueChange,h=n.onPreprocess,b=n.onBuildTokenValue,v=n.onNewTokenValuesAppend,T=n.onLastTokenDelete,w=(o=(0,e.useState)(""),a=2,function(e){if(Array.isArray(e))return e}(o)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,a=[],u=!0,i=!1;try{for(n=n.call(e);!(u=(r=n.next()).done)&&(a.push(r.value),!t||a.length!==t);u=!0);}catch(e){i=!0,o=e}finally{try{u||null==n.return||n.return()}finally{if(i)throw o}}return a}}(o,a)||function(e,t){if(e){if("string"==typeof e)return g(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?g(e,t):void 0}}(o,a)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),S=w[0],E=w[1],C=(0,e.useMemo)((function(){return new RegExp(p.join("|"))}),[p]),O=(0,e.useCallback)((function(e){E(e),y(e,S)}),[y,S,E]),j=(0,e.useCallback)((function(e){if(0!==e.trim().length){var t=e.split(C).filter((function(e){return e.trim().length>0})),n=h(t).map((function(e){return b(e)}));v(n),O("")}}),[C,h,b,v,O]),A=(0,e.useCallback)((function(e){var t=e.target.value,n=t.substring(t.length-1);!0!==C.test(n)?O(t):j(S)}),[C,j,S,O]),I=m({specialKeyDown:d,inputInitValue:"",inputValue:S,onLastTokenDelete:T,handleInputValueUpdate:O,handleTokensCreate:j}),V=I.handleBackspaceKeyDown,D=I.handleTabKeyDown,R=I.handleEnterKeyDown,_=I.handleEscapeKeyDown,P=(0,e.useCallback)((function(e){c(e,{onBackspace:V,onTab:D,onEnter:R,onEscape:_})}),[V,D,R,_]),M=(0,e.useCallback)((function(e){j(S),f(e)}),[j,S,f]),x=(0,e.useCallback)((function(e){e.preventDefault();var t=e.clipboardData.getData("text");j(t)}),[j]);return t().createElement("div",{className:k},t().createElement(l.Z,{ref:r,autoFocus:i,placeholder:u,value:S,onChange:A,onKeyDown:P,onPaste:x,onFocus:s,onBlur:M}))}));T.displayName="TokenCreator",T.propTypes={placeholder:a().string.isRequired,autoFocus:a().bool.isRequired,onFocus:a().func.isRequired,onBlur:a().func.isRequired,separators:a().array.isRequired,specialKeyDown:a().object.isRequired,onInputValueChange:a().func.isRequired,onPreprocess:a().func.isRequired,onBuildTokenValue:a().func.isRequired,onNewTokenValuesAppend:a().func.isRequired,onLastTokenDelete:a().func.isRequired};const w=T,S=function(){return t().createElement("div",{role:"img",className:"token-input-token__delete-button__close-icon","aria-hidden":"true","data-component-name":"CloseIcon"})};var E=function(e){var n=e.onRenderContent,r="function"==typeof n;return t().createElement("span",{role:"button",className:i()(p,"token-input-token__delete-button"),"aria-hidden":"true","data-component-name":"DeleteButton"},r&&n(),!r&&t().createElement(S,null))};E.propTypes={onRenderContent:a().func};const C=E;function O(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function j(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var A=function(e){e.stopPropagation()},I=function(n){var r,o,a=n.readOnly,u=n.tokenValue,s=n.tokenMeta,f=n.onGetClassName,d=n.onGetDisplayLabel,y=n.onRenderDeleteButtonContent,h=n.onGetEditableValue,b=n.onGetErrorMessage,m=n.onBuildTokenValue,g=n.onEditStart,T=n.onEditEnd,w=n.onDelete,S=(0,e.useRef)(null),E=(r=(0,e.useState)(""),o=2,function(e){if(Array.isArray(e))return e}(r)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,a=[],u=!0,i=!1;try{for(n=n.call(e);!(u=(r=n.next()).done)&&(a.push(r.value),!t||a.length!==t);u=!0);}catch(e){i=!0,o=e}finally{try{u||null==n.return||n.return()}finally{if(i)throw o}}return a}}(r,o)||function(e,t){if(e){if("string"==typeof e)return j(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?j(e,t):void 0}}(r,o)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),I=E[0],V=E[1],D=s.activated,R=s.error,_=(0,e.useCallback)((function(){var e=h(u,s);V(e),g()}),[V,u,s,h,g]);(0,e.useEffect)((function(){D&&S.current&&S.current.focus()}),[D]);var P=(0,e.useCallback)((function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},t=e.reset,n=void 0!==t&&t,r=0===I.length;if(n||r)T();else{var o=m(I);T(o)}}),[I,m,T]),M=(0,e.useCallback)((function(e){e.stopPropagation(),a||(e.target.closest(".".concat(v," .").concat(p))?w():_())}),[a,w,_]),x=(0,e.useCallback)((function(e){var t=e.target.value;V(t)}),[V]),B=(0,e.useCallback)((function(e){c(e,{onEscape:function(){return P({reset:!0})},onEnter:function(){return P()}})}),[P]),N=(0,e.useCallback)((function(){P()}),[P]),W=(0,e.useMemo)((function(){var e;return i()(f(u,s),v,(O(e={},"token-input-token--active",D),O(e,"token-input-token--error",R&&!D),O(e,"token-input-token--read-only",a),e))}),[a,R,D,f,u,s]),G=(0,e.useMemo)((function(){return b(u,s)}),[b,u,s]);return D?t().createElement("div",{role:"presentation",className:W,onClick:A},t().createElement("div",{className:k},t().createElement(l.Z,{ref:S,value:I,onChange:x,onKeyDown:B,onBlur:N}))):t().createElement("div",{role:"presentation",className:W,onClick:M,title:G,"data-component-name":"Token"},t().createElement("div",{className:"token-input-token__label-wrapper"},d(u,s)),!a&&t().createElement(C,{onRenderContent:y}))};I.propTypes={readOnly:a().bool.isRequired,tokenValue:a().any.isRequired,tokenMeta:a().object.isRequired,onGetClassName:a().func.isRequired,onGetDisplayLabel:a().func.isRequired,onRenderDeleteButtonContent:a().func,onGetEditableValue:a().func.isRequired,onGetErrorMessage:a().func.isRequired,onBuildTokenValue:a().func.isRequired,onEditStart:a().func.isRequired,onEditEnd:a().func.isRequired,onDelete:a().func.isRequired};const V=I;function D(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}const R=function(){var t,n,r=(t=(0,e.useState)(!1),n=2,function(e){if(Array.isArray(e))return e}(t)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,a=[],u=!0,i=!1;try{for(n=n.call(e);!(u=(r=n.next()).done)&&(a.push(r.value),!t||a.length!==t);u=!0);}catch(e){i=!0,o=e}finally{try{u||null==n.return||n.return()}finally{if(i)throw o}}return a}}(t,n)||function(e,t){if(e){if("string"==typeof e)return D(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?D(e,t):void 0}}(t,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),o=r[0],a=r[1];return{isTokenInputFocused:o,handleTokenInputFocus:(0,e.useCallback)((function(){a(!0)}),[]),handleTokenInputBlur:(0,e.useCallback)((function(){a(!1)}),[])}},_=function(e,t,n){return{key:"".concat(JSON.stringify(t),"-").concat(Date.now(),"-").concat(n),activated:!1,error:e}};function P(e,t){if(e){if("string"==typeof e)return M(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?M(e,t):void 0}}function M(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}const x=function(){var t,n,r=(t=(0,e.useState)([]),n=2,function(e){if(Array.isArray(e))return e}(t)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,a=[],u=!0,i=!1;try{for(n=n.call(e);!(u=(r=n.next()).done)&&(a.push(r.value),!t||a.length!==t);u=!0);}catch(e){i=!0,o=e}finally{try{u||null==n.return||n.return()}finally{if(i)throw o}}return a}}(t,n)||P(t,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),o=r[0],a=r[1],u=(0,e.useCallback)((function(e,t){if(e>=o.length)throw new Error("setTokenActivated out of tokenMetas scope; targetIndex ".concat(e,"; tokenMetas.length ").concat(o.length));var n=function(e){return function(e){if(Array.isArray(e))return M(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||P(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}(o);n[e].activated=t,a(n)}),[o]);return{buildTokenMeta:_,tokenMetas:o,setTokenMetas:a,setTokenActivated:u}};function B(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,a=[],u=!0,i=!1;try{for(n=n.call(e);!(u=(r=n.next()).done)&&(a.push(r.value),!t||a.length!==t);u=!0);}catch(e){i=!0,o=e}finally{try{u||null==n.return||n.return()}finally{if(i)throw o}}return a}}(e,t)||N(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function N(e,t){if(e){if("string"==typeof e)return W(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?W(e,t):void 0}}function W(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}const G=function(t){var n=t.tokenValues,r=t.onTokenValueValidate,o=x(),a=o.buildTokenMeta,u=o.tokenMetas,i=o.setTokenMetas,l=o.setTokenActivated,s=B((0,e.useState)(!1),2),c=s[0],f=s[1],p=B((0,e.useState)([]),2),d=p[0],y=p[1];return(0,e.useLayoutEffect)((function(){var e,t=!1,o=n.map((function(e,o){var u=r(e,o,n),i=a(u,e,o);return i.error&&!i.activated&&(t=!0),i}));y(function(e){if(Array.isArray(e))return W(e)}(e=n)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||N(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),i(o),f(t)}),[n,r,i,a]),{hasInvalidToken:c,internalTokenValues:d,tokenMetas:u,setTokenActivated:l}};function q(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}const z=function(t){var n=t.tokenValues,r=t.onTokenValuesChange,o=t.setTokenActivated,a=t.handleTokenInputFocus,u=t.handleTokenInputBlur,i=t.focusTokenCreator;return{handleTokenEditStart:(0,e.useCallback)((function(e){return function(){o(e,!0),a()}}),[o,a]),handleTokenEditEnd:(0,e.useCallback)((function(e){return function(t){if(o(e,!1),u(),i(),void 0!==t){var a=function(e){if(Array.isArray(e))return q(e)}(l=n)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(l)||function(e,t){if(e){if("string"==typeof e)return q(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?q(e,t):void 0}}(l)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}();a[e]=t,r(a)}var l}}),[n,r,o,u,i])}};function K(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}const F=function(t){var n=t.tokenValues,r=t.onTokenValuesChange,o=t.focusTokenCreator,a=(0,e.useCallback)((function(e){var t,a=function(e){if(Array.isArray(e))return K(e)}(t=n)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(t)||function(e,t){if(e){if("string"==typeof e)return K(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?K(e,t):void 0}}(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}();a.splice(e,1),r(a),o()}),[n,r,o]);return{handleTokenDelete:(0,e.useCallback)((function(e){return function(){a(e)}}),[a]),handleLastTokenDelete:(0,e.useCallback)((function(){a(-1)}),[a])}},L=function(e,t){return e};var U=["className","readOnly","autoFocus","placeholder","tokenValues","onTokenValuesChange","onBuildTokenValue","customizeTokenComponent","onGetTokenClassName","onGetTokenDisplayLabel","onRenderTokenDeleteButtonContent","onGetTokenEditableValue","onGetTokenErrorMessage","separators","specialKeyDown","onPreprocess","onInputValueChange","onTokenValueValidate"];function H(){return(H=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function $(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function Z(e){return function(e){if(Array.isArray(e))return J(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||function(e,t){if(e){if("string"==typeof e)return J(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?J(e,t):void 0}}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function J(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var Y=function(n){var r,o=n.className,a=n.readOnly,u=n.autoFocus,l=n.placeholder,s=n.tokenValues,c=n.onTokenValuesChange,f=n.onBuildTokenValue,p=n.customizeTokenComponent,d=n.onGetTokenClassName,y=n.onGetTokenDisplayLabel,h=n.onRenderTokenDeleteButtonContent,b=n.onGetTokenEditableValue,m=n.onGetTokenErrorMessage,v=n.separators,k=n.specialKeyDown,g=n.onPreprocess,T=n.onInputValueChange,S=n.onTokenValueValidate,E=function(e,t){if(null==e)return{};var n,r,o=function(e,t){if(null==e)return{};var n,r,o={},a=Object.keys(e);for(r=0;r<a.length;r++)n=a[r],t.indexOf(n)>=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r<a.length;r++)n=a[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}(n,U),C=R(),O=C.isTokenInputFocused,j=C.handleTokenInputFocus,A=C.handleTokenInputBlur,I=function(){var t=(0,e.useRef)(null),n=(0,e.useCallback)((function(){t&&t.current&&t.current.focus()}),[]);return{tokenCreatorRef:t,focusTokenCreator:n}}(),D=I.tokenCreatorRef,_=I.focusTokenCreator,P=G({tokenValues:s,onTokenValueValidate:S}),M=P.hasInvalidToken,x=P.internalTokenValues,B=P.tokenMetas,N=P.setTokenActivated,W=z({tokenValues:s,onTokenValuesChange:c,setTokenActivated:N,handleTokenInputFocus:j,handleTokenInputBlur:A,focusTokenCreator:_}),q=W.handleTokenEditStart,K=W.handleTokenEditEnd,L=F({tokenValues:s,onTokenValuesChange:c,focusTokenCreator:_}),J=L.handleTokenDelete,Y=L.handleLastTokenDelete,Q=(0,e.useCallback)((function(e){if(0!==e.length){var t=[].concat(Z(s),Z(e));c(t)}}),[s,c]),X=(0,e.useCallback)((function(e){if("function"!=typeof g)return e;var t=g(e);if(!0!==Array.isArray(t))throw new Error("onPreprocess should return an array of values");return t}),[g]),ee=p||V;return t().createElement("div",H({},E,{className:i()(o,"token-input-container",(r={},$(r,"token-input-container--focused",O),$(r,"token-input-container--errors",M),r)),onClick:_,role:"presentation","data-component-name":"TokenInput"}),t().createElement("div",{className:"token-input-token-list"},x.map((function(e,n){var r=B[n],o=r.key;return t().createElement(ee,{key:o,readOnly:a,tokenValue:e,tokenMeta:r,onGetClassName:d,onGetDisplayLabel:y,onRenderDeleteButtonContent:h,onGetEditableValue:b,onGetErrorMessage:m,onBuildTokenValue:f,onEditStart:q(n),onEditEnd:K(n),onDelete:J(n)})}))),!a&&t().createElement(w,{ref:D,placeholder:l,autoFocus:u,onFocus:j,onBlur:A,separators:v,specialKeyDown:k,onInputValueChange:T,onPreprocess:X,onBuildTokenValue:f,onNewTokenValuesAppend:Q,onLastTokenDelete:Y}))};Y.propTypes={style:a().object,className:a().string,readOnly:a().bool,autoFocus:a().bool,placeholder:a().string,separators:a().array,tokenValues:a().array.isRequired,onTokenValuesChange:a().func,onPreprocess:a().func,onBuildTokenValue:a().func,onInputValueChange:a().func,onTokenValueValidate:a().func,onGetTokenClassName:a().func,onGetTokenDisplayLabel:a().func,onRenderTokenDeleteButtonContent:a().func,onGetTokenEditableValue:a().func,onGetTokenErrorMessage:a().func,customizeTokenComponent:a().func,specialKeyDown:a().object};var Q=function(){};Y.defaultProps={className:"",readOnly:!1,autoFocus:!1,placeholder:"",separators:[",",";","\n","\r","\r\n"],specialKeyDown:{onBackspace:1,onTab:0,onEnter:1,onEscape:1},onBuildTokenValue:function(e){return e.trim()},onInputValueChange:Q,onTokenValueValidate:Q,onTokenValuesChange:Q,onGetTokenClassName:Q,onGetTokenDisplayLabel:L,onGetTokenEditableValue:L,onGetTokenErrorMessage:function(e,t){if("string"==typeof t.error)return t.error}};const X=Y})(),o})()}));
 //# sourceMappingURL=index.js.map

lib/index.js.LICENSE.txt

@@ -7,2 +7,2 @@ /*!
 
-/*! react-customize-token-input v1.4.1 | (c) 2021 Mark Lin. | MIT | https://github.com/seawind543/react-token-input */
+/*! react-customize-token-input v1.4.2 | (c) 2021 Mark Lin. | MIT | https://github.com/seawind543/react-token-input */

package.json

 {
   "name": "react-customize-token-input",
-  "version": "1.4.1",
+  "version": "1.4.2",
   "description": "A react token (tag) input component. Allow customize data structure and Look & Feel",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

README.md

@@ -295,6 +295,20 @@ # React TokenInput [![build status](https://travis-ci.org/seawind543/react-token-input.svg?branch=master)](https://travis-ci.org/seawind543/react-token-input) [![Coverage Status](https://coveralls.io/repos/github/seawind543/react-token-input/badge.svg?branch=master)](https://coveralls.io/github/seawind543/react-token-input?branch=master)
    *
-   * @ error
-   * Type: customize error
-   * Description: customize error
+   * @ tokenValue
+   * Type: any (string | number | object | customize data structure)
+   * Description: The tokenValue build by `onBuildTokenValue`
    *
+   * @ tokenMeta
+   * Description: token's meta data
+   *  {
+   *    // A private key for render
+   *    key: string,
+   *
+   *    // Specific the token is activated for `edit` or not
+   *    activated: boolean,
+   *
+   *    // Customize data structure built by `onTokenValue Validate`
+   *    // Specific the token's validate status or errorMessage
+   *    error: any,
+   *  }
+   *
    * @ return
@@ -313,3 +327,2 @@ * Type: string | any
   customizeTokenComponent: PropTypes.func,
-
 ```
@@ -382,2 +395,3 @@
       onBackspace: 1,
+      onTab: 0,
       onEnter: 1,
@@ -384,0 +398,0 @@ onEscape: 1,

New alerts

License Policy Violation

License

This 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

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

153006

increased by0.15%

Number of lines in readme file

498

increased by2.89%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes