UNPKG

@webscopeio/react-textarea-autocomplete

Version:
26 lines (24 loc) 24.6 kB
/** * The MIT License (MIT) * * Copyright (c) 2017 Jakub Beneš <benes@webscope.io> * * Permission is hereby granted, free of charge, to any person obtaining a copy * of this software and associated documentation files (the "Software"), to deal * in the Software without restriction, including without limitation the rights * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell * copies of the Software, and to permit persons to whom the Software is * furnished to do so, subject to the following conditions: * * The above copyright notice and this permission notice shall be included in * all copies or substantial portions of the Software. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN * THE SOFTWARE. */ !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("react-dom"),require("react")):"function"==typeof define&&define.amd?define(["react-dom","react"],t):e.ReactTextareaAutocomplete=t(e.ReactDOM,e.React)}(this,function(c,k){"use strict";function a(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(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)}}function n(e,t,n){return t&&r(e.prototype,t),n&&r(e,n),e}function t(e){return(t="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function o(e){return(o="function"==typeof Symbol&&"symbol"===t(Symbol.iterator)?function(e){return t(e)}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":t(e)})(e)}function s(e,t){return!t||"object"!==o(t)&&"function"!=typeof t?function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e):t}function l(e){return(l=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function i(e,t){return(i=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function u(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&i(e,t)}function p(e){return function(e){if(Array.isArray(e)){for(var t=0,n=new Array(e.length);t<e.length;t++)n[t]=e[t];return n}}(e)||function(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance")}()}c=c&&c.hasOwnProperty("default")?c.default:c,k=k&&k.hasOwnProperty("default")?k.default:k;var e="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:{};var f,S=(function(e){var u,p,f;u=["direction","boxSizing","width","height","overflowX","overflowY","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","borderStyle","paddingTop","paddingRight","paddingBottom","paddingLeft","fontStyle","fontVariant","fontWeight","fontStretch","fontSize","fontSizeAdjust","lineHeight","fontFamily","textAlign","textTransform","textIndent","textDecoration","letterSpacing","wordSpacing","tabSize","MozTabSize"],p="undefined"!=typeof window,f=p&&null!=window.mozInnerScreenX,e.exports=function(e,t,n){if(!p)throw new Error("textarea-caret-position#getCaretCoordinates should only be called in a browser");var r=n&&n.debug||!1;if(r){var o=document.querySelector("#input-textarea-caret-position-mirror-div");o&&o.parentNode.removeChild(o)}var i=document.createElement("div");i.id="input-textarea-caret-position-mirror-div",document.body.appendChild(i);var a=i.style,s=window.getComputedStyle?getComputedStyle(e):e.currentStyle;a.whiteSpace="pre-wrap","INPUT"!==e.nodeName&&(a.wordWrap="break-word"),a.position="absolute",r||(a.visibility="hidden"),u.forEach(function(e){a[e]=s[e]}),f?e.scrollHeight>parseInt(s.height)&&(a.overflowY="scroll"):a.overflow="hidden",i.textContent=e.value.substring(0,t),"INPUT"===e.nodeName&&(i.textContent=i.textContent.replace(/\s/g," "));var l=document.createElement("span");l.textContent=e.value.substring(t)||".",i.appendChild(l);var c={top:l.offsetTop+parseInt(s.borderTopWidth),left:l.offsetLeft+parseInt(s.borderLeftWidth)};return r?l.style.backgroundColor="#aaa":document.body.removeChild(i),c}}(f={exports:{}},f.exports),f.exports),d=e.CustomEvent;var I=function(){try{var e=new d("cat",{detail:{foo:"bar"}});return"cat"===e.type&&"bar"===e.detail.foo}catch(e){}return!1}()?d:"undefined"!=typeof document&&"function"==typeof document.createEvent?function(e,t){var n=document.createEvent("CustomEvent");return t?n.initCustomEvent(e,t.bubbles,t.cancelable,t.detail):n.initCustomEvent(e,!1,!1,void 0),n}:function(e,t){var n=document.createEventObject();return n.type=e,n.detail=t?(n.bubbles=Boolean(t.bubbles),n.cancelable=Boolean(t.cancelable),t.detail):(n.bubbles=!1,void(n.cancelable=!1)),n},h={ESC:27,UP:38,DOWN:40,LEFT:37,RIGHT:39,ENTER:13,TAB:9},g=new function e(){var i=this;a(this,e),this.startListen=function(e){e&&e.addEventListener("keydown",i.f)},this.stopListen=function(e){e&&e.removeEventListener("keydown",i.f)},this.add=function(e,t){var n=e;return"object"!=typeof n&&(n=[n]),i.listeners[i.index]={keyCode:n,fn:t},i.index++},this.remove=function(e){delete i.listeners[e]},this.removeAll=function(){i.listeners={},i.index=1},this.index=1,this.listeners={},this.f=function(r){if(r){var o=r.keyCode||r.which;Object.values(i.listeners).forEach(function(e){var t=e.keyCode,n=e.fn;t.includes(o)&&(r.stopPropagation(),r.preventDefault(),n(r))})}}},m=function(e){function i(){var e,n;a(this,i);for(var t=arguments.length,r=new Array(t),o=0;o<t;o++)r[o]=arguments[o];return(n=s(this,(e=l(i)).call.apply(e,[this].concat(r)))).selectItem=function(){var e=n.props,t=e.item;(0,e.onSelectHandler)(t)},n}return u(i,k.Component),n(i,[{key:"shouldComponentUpdate",value:function(e){return this.props.item!==e.item||this.props.selected!==e.selected||this.props.style!==e.style||this.props.className!==e.className}},{key:"render",value:function(){var t=this,e=this.props,n=e.component,r=e.style,o=e.onClickHandler,i=e.item,a=e.selected,s=e.className,l=e.innerRef;return k.createElement("li",{className:"rta__item ".concat(!0===a?"rta__item--selected":""," ").concat(s||""),style:r},k.createElement("div",{className:"rta__entity ".concat(!0===a?"rta__entity--selected":""),role:"button",tabIndex:0,onClick:o,onFocus:this.selectItem,onMouseEnter:this.selectItem,onTouchStart:function(){t.clicked=!0,t.selectItem()},onTouchEnd:function(e){e.preventDefault(),t.clicked&&o(e)},onTouchMove:function(){t.clicked=!1},onTouchCancel:function(){t.clicked=!1},ref:l},k.createElement(n,{selected:a,entity:i})))}}]),i}(),O=function(e){function o(){var e,i;a(this,o);for(var t=arguments.length,n=new Array(t),r=0;r<t;r++)n[r]=arguments[r];return(i=s(this,(e=l(o)).call.apply(e,[this].concat(n)))).state={selectedItem:null},i.cachedIdOfItems=new Map,i.onPressEnter=function(e){void 0!==e&&e.preventDefault();var t=i.props.values;i.modifyText(t[i.getPositionInList()])},i.getPositionInList=function(){var e=i.props.values,t=i.state.selectedItem;return t?e.findIndex(function(e){return i.getId(e)===i.getId(t)}):0},i.getId=function(e){if(i.cachedIdOfItems.has(e))return i.cachedIdOfItems.get(e);var t=i.props.getTextToReplace(e),n=function(){if(t){if(t.key)return t.key;if("string"==typeof e||!e.key)return t.text}if(!e.key)throw new Error("Item ".concat(JSON.stringify(e),' has to have defined "key" property'));return e.key}();return i.cachedIdOfItems.set(e,n),n},i.listeners=[],i.itemsRef={},i.modifyText=function(e){e&&(0,i.props.onSelect)(e)},i.selectItem=function(e){var t=1<arguments.length&&void 0!==arguments[1]&&arguments[1],n=i.props.onItemHighlighted;i.state.selectedItem!==e&&i.setState({selectedItem:e},function(){n(e),t&&i.props.dropdownScroll(i.itemsRef[i.getId(e)])})},i.scroll=function(e){e.preventDefault();var t,n=i.props.values,r=e.keyCode||e.which,o=i.getPositionInList();switch(r){case h.DOWN:t=o+1;break;case h.UP:t=o-1;break;default:t=o}t=(t%n.length+n.length)%n.length,i.selectItem(n[t],[h.DOWN,h.UP].includes(r))},i.isSelected=function(e){var t=i.state.selectedItem;return!!t&&i.getId(t)===i.getId(e)},i}return u(o,k.Component),n(o,[{key:"componentDidMount",value:function(){this.listeners.push(g.add([h.DOWN,h.UP],this.scroll),g.add([h.ENTER,h.TAB],this.onPressEnter));var e=this.props.values;e&&e[0]&&this.selectItem(e[0])}},{key:"componentDidUpdate",value:function(e){var t=this,n=e.values,r=this.props.values;n.map(function(e){return t.getId(e)}).join("")!==r.map(function(e){return t.getId(e)}).join("")&&r&&r[0]&&this.selectItem(r[0])}},{key:"componentWillUnmount",value:function(){for(var e;this.listeners.length;)e=this.listeners.pop(),g.remove(e)}},{key:"render",value:function(){var n=this,e=this.props,t=e.values,r=e.component,o=e.style,i=e.itemClassName,a=e.className,s=e.itemStyle;return k.createElement("ul",{className:"rta__list ".concat(a||""),style:o},t.map(function(t){return k.createElement(m,{key:n.getId(t),innerRef:function(e){n.itemsRef[n.getId(t)]=e},selected:n.isSelected(t),item:t,className:i,style:s,onClickHandler:n.onPressEnter,onSelectHandler:n.selectItem,component:r})}))}}]),o}();var y="next",v={LEFT:"rta__autocomplete--left",RIGHT:"rta__autocomplete--right"},b={TOP:"rta__autocomplete--top",BOTTOM:"rta__autocomplete--bottom"},P=function(e){return console.error("RTA: dataProvider fails: ".concat(e,"\n \nCheck the documentation or create issue if you think it's bug. https://github.com/webscopeio/react-textarea-autocomplete/issues"))},w=[".","^","$","*","+","-","?","(",")","[","]","{","}","\\","|"],A=function(e){return p(e).map(function(e){return w.includes(e)?"\\".concat(e):e}).join("")},L=function(e){function t(){return a(this,t),s(this,l(t).apply(this,arguments))}return u(t,k.Component),n(t,[{key:"componentDidMount",value:function(){var e=this.props.boundariesElement;if("string"==typeof e){var t=document.querySelector(e);if(!t)throw new Error("RTA: Invalid prop boundariesElement: it has to be string or HTMLElement.");this.containerElem=t}else{if(!(e instanceof HTMLElement))throw new Error("RTA: Invalid prop boundariesElement: it has to be string or HTMLElement.");this.containerElem=e}if(!(this.containerElem&&this.containerElem.contains(this.ref)||"test"===process.env.NODE_ENV))throw new Error("RTA: Invalid prop boundariesElement: it has to be one of the parents of the RTA.")}},{key:"componentDidUpdate",value:function(){var e,t,n=this.props.top||0,r=this.props.left||0,o=[],i=[],a=0,s=0,l=this.containerElem.getBoundingClientRect(),c=this.ref.getBoundingClientRect(),u=this.props.textareaRef.getBoundingClientRect(),p=window.getComputedStyle(this.ref),f=parseInt(p.getPropertyValue("margin-top"),10),d=parseInt(p.getPropertyValue("margin-bottom"),10),h=parseInt(p.getPropertyValue("margin-left"),10),g=parseInt(p.getPropertyValue("margin-right"),10),m=f+d+u.top+n+c.height;h+g+u.left+r+c.width>l.right&&u.left+r>c.width?(s=r-c.width,o.push(v.LEFT),i.push(v.RIGHT)):(s=r,o.push(v.RIGHT),i.push(v.LEFT)),m>l.bottom&&u.top+n>c.height?(a=n-c.height,o.push(b.TOP),i.push(b.BOTTOM)):(a=n,o.push(b.BOTTOM),i.push(b.TOP)),this.props.renderToBody&&(a+=u.top,s+=u.left),this.ref.style.top="".concat(a,"px"),this.ref.style.left="".concat(s,"px"),(e=this.ref.classList).remove.apply(e,i),(t=this.ref.classList).add.apply(t,o)}},{key:"render",value:function(){var t=this,e=this.props,n=e.style,r=e.className,o=e.innerRef,i=e.children,a=e.renderToBody,s=document.body,l=k.createElement("div",{ref:function(e){t.ref=e,o(e)},className:"rta__autocomplete ".concat(r||""),style:n},i);return a&&null!==s?c.createPortal(l,s):l}}]),t}(),T=function(e){function i(e){var R;a(this,i),(R=s(this,l(i).call(this,e))).state={top:null,left:null,currentTrigger:null,actualToken:"",data:null,value:"",dataLoading:!1,selectionEnd:0,component:null,textToReplace:null},R.escListenerInit=function(){R.escListener||(R.escListener=g.add(h.ESC,R._closeAutocomplete))},R.escListenerDestroy=function(){R.escListener&&(g.remove(R.escListener),R.escListener=null)},R.getSelectionPosition=function(){return R.textareaRef?{selectionStart:R.textareaRef.selectionStart,selectionEnd:R.textareaRef.selectionEnd}:null},R.getSelectedText=function(){if(!R.textareaRef)return null;var e=R.textareaRef,t=e.selectionStart,n=e.selectionEnd;return t===n?null:R.state.value.substr(t,n-t)},R.setCaretPosition=function(){var e=0<arguments.length&&void 0!==arguments[0]?arguments[0]:0;R.textareaRef&&(R.textareaRef.focus(),R.textareaRef.setSelectionRange(e,e))},R.getCaretPosition=function(){return R.textareaRef?R.textareaRef.selectionEnd:0},R._handleCaretChange=function(e){var t=function(){var e=R.getCaretPosition()-1;R.lastTrigger=R.lastTrigger?e:0};if("keydown"!==e.type)t();else switch(e.keyCode||e.which){case h.UP:case h.DOWN:R._isAutocompleteOpen()||t();break;case h.LEFT:case h.RIGHT:t()}},R._onSelect=function(e){var t=R.state,n=t.selectionEnd,r=t.currentTrigger,o=t.value,i=R.props.onItemSelected;if(r){var a=R._getTextToReplace(r);if(a){var s=a(e);if(s){i&&i({currentTrigger:r,item:e});var l=o.slice(0,n),c=A(r),u=l.length-l.lastIndexOf(r),p=l.search(new RegExp("(?!".concat(c,")$")))-u,f="next"===s.caretPosition?"".concat(s.text," "):s.text,d=function(e,t,n){switch(e){case"start":return n;case"next":case"end":return n+t.length;default:if(!Number.isInteger(e))throw new Error('RTA: caretPosition should be "start", "next", "end" or number.');return e}}(s.caretPosition,f,p),h=l.substring(0,p)+f,g=o.replace(l,h);R.setState({value:g,dataLoading:!1},function(){var e=R.tokenRegExpEnding.exec(f),t=e?e[0].length:1;R.lastTrigger=d?d-t:d,R.textareaRef.value=g,R.textareaRef.selectionEnd=d,R._changeHandler();var n=R.textareaRef.scrollTop;R.setCaretPosition(d),window.chrome&&(R.textareaRef.scrollTop=n)})}else R._closeAutocomplete()}else R._closeAutocomplete()}},R._getTextToReplace=function(n){var e=R.props.trigger[n];if(!n||!e)return null;var r=e.output;return function(e){if("object"==typeof e&&(!r||"function"!=typeof r))throw new Error('Output functor is not defined! If you are using items as object you have to define "output" function. https://github.com/webscopeio/react-textarea-autocomplete#trigger-type');if(r){var t=r(e,n);if(void 0===t||"number"==typeof t)throw new Error('Output functor should return string or object in shape {text: string, caretPosition: string | number}.\nGot "'.concat(String(t),'". Check the implementation for trigger "').concat(n,'"\n\nSee https://github.com/webscopeio/react-textarea-autocomplete#trigger-type for more information.\n'));if(null===t)return null;if("string"==typeof t)return{text:t,caretPosition:y};if(!t.text&&"string"!=typeof t.text)throw new Error('Output "text" is not defined! Object should has shape {text: string, caretPosition: string | number}. Check the implementation for trigger "'.concat(n,'"\n'));if(!t.caretPosition)throw new Error('Output "caretPosition" is not defined! Object should has shape {text: string, caretPosition: string | number}. Check the implementation for trigger "'.concat(n,'"\n'));return t}if("string"!=typeof e)throw new Error("Output item should be string\n");return{text:"".concat(n).concat(e).concat(n),caretPosition:y}}},R._getCurrentTriggerSettings=function(){var e=R.state.currentTrigger;return e?R.props.trigger[e]:null},R._getValuesFromProvider=function(){var e=R.state,t=e.currentTrigger,n=e.actualToken,r=R._getCurrentTriggerSettings();if(t&&r){var o=r.dataProvider,i=r.component;if("function"!=typeof o)throw new Error("Trigger provider has to be a function!");R.setState({dataLoading:!0});var a=o(n);a instanceof Promise||(a=Promise.resolve(a)),a.then(function(e){if(!Array.isArray(e))throw new Error("Trigger provider has to provide an array!");if("function"!=typeof i)throw new Error("Component should be defined!");t===R.state.currentTrigger&&(e.length?R.setState({dataLoading:!1,data:e,component:i}):R._closeAutocomplete())}).catch(function(e){return P(e.message)})}},R._getSuggestions=function(){var e=R.state,t=e.currentTrigger,n=e.data;return!t||!n||n&&!n.length?null:n},R._createRegExp=function(){var e=R.props.trigger;R.tokenRegExp=new RegExp("(".concat(Object.keys(e).sort(function(e,t){return e<t?1:t<e?-1:0}).map(function(e){return A(e)}).join("|"),")((?:(?!\\1)[^\\s])*$)")),R.tokenRegExpEnding=new RegExp("(".concat(Object.keys(e).sort(function(e,t){return e<t?1:t<e?-1:0}).map(function(e){return A(e)}).join("|"),")$"))},R._closeAutocomplete=function(){var e=R.state.currentTrigger;R.escListenerDestroy(),R.setState({data:null,dataLoading:!1,currentTrigger:null},function(){e&&R._onItemHighlightedHandler(null)})},R._cleanUpProps=function(){var e=function(o){for(var e=1;e<arguments.length;e++){var i=null!=arguments[e]?arguments[e]:{},t=Object.keys(i);"function"==typeof Object.getOwnPropertySymbols&&(t=t.concat(Object.getOwnPropertySymbols(i).filter(function(e){return Object.getOwnPropertyDescriptor(i,e).enumerable}))),t.forEach(function(e){var t,n,r;t=o,r=i[n=e],n in t?Object.defineProperty(t,n,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[n]=r})}return o}({},R.props),t=["loadingComponent","boundariesElement","containerStyle","minChar","scrollToItem","ref","innerRef","onChange","onCaretPositionChange","className","value","trigger","listStyle","itemStyle","containerStyle","loaderStyle","className","containerClassName","listClassName","itemClassName","loaderClassName","dropdownStyle","dropdownClassName","movePopupAsYouType","textAreaComponent","renderToBody","onItemSelected","onItemHighlighted"];for(var n in e)t.includes(n)&&delete e[n];return e},R._changeHandler=function(e){var t=R.props,n=t.trigger,r=t.onChange,o=t.minChar,i=t.onCaretPositionChange,a=t.movePopupAsYouType,s=R.state,l=s.top,c=s.left,u=e;u||(u=new I("change",{bubbles:!0}),R.textareaRef.dispatchEvent(u));var p=u.target||R.textareaRef,f=p.selectionEnd,d=p.value;(R.lastValueBubbledEvent=d,r&&u&&(u.persist&&u.persist(),r(new Proxy(u,{get:function(e,t,n){return"target"===t?p:Reflect.get(e,t,n)}}))),i)&&i(R.getCaretPosition());R.setState({value:d});var h=function(){var e=S(p,f),t=e.top,n=e.left;R.setState({top:t-R.textareaRef.scrollTop||0,left:n})},g=function(e){R.lastTrigger=f-e,R._closeAutocomplete(),h()};if(f<=R.lastTrigger){var m=d.slice(0,f),y=R.tokenRegExp.exec(m);g(y?y[0].length:0)}var v=d.slice(R.lastTrigger,f),b=R.tokenRegExp.exec(v),w=b&&b[0],T=b&&b[1]||null,x=T?T.length-1:0,E=R.tokenRegExpEnding.exec(v);if(E?g(E[0].length):R._isAutocompleteOpen()||R._closeAutocomplete(),w&&!(w.length<=o+x)||(!R.state.currentTrigger||n[R.state.currentTrigger].allowWhitespace)&&R.state.currentTrigger)if(T&&n[T].afterWhitespace&&!/\s/.test(d[f-w.length-1])&&void 0!==d[f-w.length-1])R._closeAutocomplete();else{if(R.state.currentTrigger&&n[R.state.currentTrigger].allowWhitespace){if(b=new RegExp("".concat(A(R.state.currentTrigger),".*$")).exec(d.slice(0,f)),!(w=b&&b[0]))return void R._closeAutocomplete();T=Object.keys(n).find(function(e){return e.slice(0,x+1)===w.slice(0,x+1)})||null}var C=w.slice(1);if(T){(a||null===l&&null===c||R.state.currentTrigger!==T)&&h(),R.escListenerInit();var _=R._getTextToReplace(T);R.setState({selectionEnd:f,currentTrigger:T,textToReplace:_,actualToken:C},function(){try{R._getValuesFromProvider()}catch(e){P(e.message)}})}}else R._closeAutocomplete()},R._selectHandler=function(e){var t=R.props,n=t.onCaretPositionChange,r=t.onSelect;n&&n(R.getCaretPosition());r&&(e.persist(),r(e))},R._shouldStayOpen=function(e){var t=e.relatedTarget;return null===t&&(t=document.activeElement),!!(R.dropdownRef&&t instanceof Node&&R.dropdownRef.contains(t))},R._onClick=function(e){var t=R.props.onClick;t&&(e.persist(),t(e)),R._shouldStayOpen(e)||R._closeAutocomplete()},R._onBlur=function(e){var t=R.props.onBlur;t&&(e.persist(),t(e)),R._shouldStayOpen(e)||R._closeAutocomplete()},R._onScrollHandler=function(){R._closeAutocomplete()},R._onItemHighlightedHandler=function(e){var t=R.props.onItemHighlighted,n=R.state.currentTrigger;if(t){if("function"!=typeof t)throw new Error("`onItemHighlighted` has to be a function");t({currentTrigger:n,item:e})}},R._dropdownScroll=function(e){var t=R.props.scrollToItem;if(t){if(!0===t)return n=R.dropdownRef,r=e,o=parseInt(getComputedStyle(r).getPropertyValue("height"),10),i=parseInt(getComputedStyle(n).getPropertyValue("height"),10)-o,a=r.offsetTop,s=n.scrollTop,void(a<s+i&&s<a||(n.scrollTop=a));var n,r,o,i,a,s;if("function"!=typeof t||2!==t.length)throw new Error("`scrollToItem` has to be boolean (true for default implementation) or function with two parameters: container, item.");t(R.dropdownRef,e)}},R._isAutocompleteOpen=function(){var e=R.state,t=e.dataLoading,n=e.currentTrigger,r=R._getSuggestions();return!(!t&&!r||!n)},R._textareaRef=function(e){R.props.innerRef&&R.props.innerRef(e),R.textareaRef=e},R.lastTrigger=0,R.escListener=null;var t=R.props,n=t.loadingComponent,r=t.trigger,o=t.value;if(o&&(R.state.value=o),R._createRegExp(),!n)throw new Error("RTA: loadingComponent is not defined");if(!r)throw new Error("RTA: trigger is not defined");return R}return u(i,k.Component),n(i,[{key:"componentDidMount",value:function(){g.startListen(this.textareaRef),this.textareaRef&&this.textareaRef.addEventListener("focus",this._handleCaretChange),this.textareaRef&&this.textareaRef.addEventListener("click",this._handleCaretChange),this.textareaRef&&this.textareaRef.addEventListener("keydown",this._handleCaretChange)}},{key:"componentDidUpdate",value:function(e){var t=e.trigger,n=e.value,r=this.props,o=r.trigger,i=r.value;Object.keys(o).join("")!==Object.keys(t).join("")&&this._createRegExp(),n!==i&&this.lastValueBubbledEvent!==i&&(this.lastTrigger=0,this._changeHandler())}},{key:"componentWillUnmount",value:function(){this.escListenerDestroy(),g.stopListen(this.textareaRef),this.textareaRef&&this.textareaRef.removeEventListener("focus",this._handleCaretChange),this.textareaRef&&this.textareaRef.removeEventListener("click",this._handleCaretChange),this.textareaRef&&this.textareaRef.removeEventListener("keydown",this._handleCaretChange)}},{key:"render",value:function(){var e,t=this,n=this.props,r=n.loadingComponent,o=n.style,i=n.className,a=n.listStyle,s=n.itemStyle,l=n.boundariesElement,c=n.movePopupAsYouType,u=n.listClassName,p=n.itemClassName,f=n.dropdownClassName,d=n.dropdownStyle,h=n.containerStyle,g=n.containerClassName,m=n.loaderStyle,y=n.loaderClassName,v=n.textAreaComponent,b=n.renderToBody,w=this.state,T=w.left,x=w.top,E=w.dataLoading,C=w.component,_=w.value,R=w.textToReplace,S=this._isAutocompleteOpen(),I=this._getSuggestions(),P={};return v.component?(e=v.component,P[v.ref]=this._textareaRef):(e=v,P.ref=this._textareaRef),k.createElement("div",{className:"rta ".concat(!0===E?"rta--loading":""," ").concat(g||""),style:h},k.createElement(e,Object.assign({},this._cleanUpProps(),{className:"rta__textarea ".concat(i||""),onChange:this._changeHandler,onSelect:this._selectHandler,onScroll:this._onScrollHandler,onClick:this._onClick,onBlur:this._onBlur,value:_,style:o},P)),S&&k.createElement(L,{innerRef:function(e){t.dropdownRef=e},top:x,left:T,style:d,className:f,movePopupAsYouType:c,boundariesElement:l,textareaRef:this.textareaRef,renderToBody:b},I&&C&&R&&k.createElement(O,{values:I,component:C,style:a,className:u,itemClassName:p,itemStyle:s,getTextToReplace:R,onItemHighlighted:this._onItemHighlightedHandler,onSelect:this._onSelect,dropdownScroll:this._dropdownScroll}),E&&k.createElement("div",{className:"rta__loader ".concat(null!==I?"rta__loader--suggestion-data":"rta__loader--empty-suggestion-data"," ").concat(y||""),style:m},k.createElement(r,{data:I}))))}}],[{key:"getDerivedStateFromProps",value:function(e){var t=e.value;return null==t?null:{value:t}}}]),i}();return T.defaultProps={movePopupAsYouType:!1,value:null,minChar:1,boundariesElement:"body",scrollToItem:!0,textAreaComponent:"textarea",renderToBody:!1},T});