UNPKG

@blueprintjs/select

Version:

Components related to selecting items from a list

1 lines 30.6 kB
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("@blueprintjs/core"),require("@blueprintjs/icons"),require("classnames"),require("react"),require("tslib")):"function"==typeof define&&define.amd?define(["@blueprintjs/core","@blueprintjs/icons","classnames","react","tslib"],t):"object"==typeof exports?exports.Blueprint=t(require("@blueprintjs/core"),require("@blueprintjs/icons"),require("classnames"),require("react"),require("tslib")):(e.Blueprint=e.Blueprint||{},e.Blueprint.Select=t(e.Blueprint.Core,e.Blueprint.Icons,e.classNames,e.React,e.window))}(self,(function(e,t,n,r,o){return function(){"use strict";var i={762:function(t){t.exports=e},634:function(e){e.exports=t},905:function(e){e.exports=n},359:function(e){e.exports=r},532:function(e){e.exports=o}},s={};function l(e){var t=s[e];if(void 0!==t)return t.exports;var n=s[e]={exports:{}};return i[e](n,n.exports,l),n.exports}l.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return l.d(t,{a:t}),t},l.d=function(e,t){for(var n in t)l.o(t,n)&&!l.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},l.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},l.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var a={};return function(){l.r(a),l.d(a,{Classes:function(){return e},MultiSelect:function(){return S},MultiSelect2:function(){return S},Omnibar:function(){return A},QueryList:function(){return C},Select:function(){return N},Select2:function(){return N},Suggest:function(){return T},Suggest2:function(){return T},executeItemsEqual:function(){return v},getActiveItem:function(){return h},getCreateNewItem:function(){return m},isCreateNewItem:function(){return f},renderFilteredItems:function(){return c}});var e={};l.r(e),l.d(e,{MULTISELECT:function(){return r},MULTISELECT_POPOVER:function(){return o},MULTISELECT_TAG_INPUT_INPUT:function(){return i},OMNIBAR:function(){return s},OMNIBAR_OVERLAY:function(){return p},SELECT_POPOVER:function(){return u},SUGGEST_POPOVER:function(){return d}});var t=l(762),n=t.Classes.getClassNamespace(),r="".concat(n,"-multi-select"),o="".concat(r,"-popover"),i="".concat(r,"-tag-input-input"),s="".concat(n,"-omnibar"),p="".concat(s,"-overlay"),u="".concat(n,"-select-popover"),d="".concat(n,"-suggest-popover");function c(e,t,n){if(0===e.query.length&&void 0!==n)return n;var r=e.filteredItems.map(e.renderItem).filter((function(e){return null!=e}));return r.length>0?r:t}function v(e,n,r){return void 0===e||null==n||null==r?n===r:t.Utils.isFunction(e)?e(n,r):n[e]===r[e]}function m(){return{__blueprintCreateNewItemBrand:"blueprint-create-new-item"}}function f(e){if(null==e)return!1;var t=Object.keys(e);return 1===t.length&&"__blueprintCreateNewItemBrand"===t[0]&&"blueprint-create-new-item"===e.__blueprintCreateNewItemBrand}function h(e){return null==e||f(e)?null:e}var I=l(532),y=l(905),g=l.n(y),P=l(359),_=l(634),C=function(e){function n(n){var r,o,i=this;(i=e.call(this,n)||this).itemRefs=new Map,i.refHandlers={itemsParent:function(e){return i.itemsParentRef=e}},i.shouldCheckActiveItemInViewport=!1,i.expectedNextActiveItem=null,i.isEnterKeyPressed=!1,i.renderItemList=function(e){var n=i.props,r=n.initialContent,o=n.noResults,s=e.renderCreateItem(),l=c(e,null!=s?null:o,r);if(null==l&&null==s)return null;var a=i.isCreateItemFirst();return P.createElement(t.Menu,(0,I.__assign)({role:"listbox"},e.menuProps,{ulRef:e.itemsParentRef}),a&&s,l,!a&&s)},i.renderItem=function(e,t){if(!0!==i.props.disabled){var n=i.state,r=n.activeItem,o=n.query,s=n.filteredItems,l={active:v(i.props.itemsEqual,h(r),e),disabled:w(e,t,i.props.itemDisabled),matchesPredicate:s.indexOf(e)>=0};return i.props.itemRenderer(e,{handleClick:function(t){return i.handleItemSelect(e,t)},handleFocus:function(){return i.setActiveItem(e)},index:t,modifiers:l,query:o,ref:function(e){e?i.itemRefs.set(t,e):i.itemRefs.delete(t)}})}return null},i.renderCreateItemMenuItem=function(){if(i.isCreateItemRendered(i.state.createNewItem)){var e=i.state,t=e.activeItem,n=e.query.trim(),r=f(t);return i.props.createNewItemRenderer(n,r,(function(e){i.handleItemCreate(n,e)}))}return null},i.handleItemCreate=function(e,t){var n,r,o,s,l=null===(r=(n=i.props).createNewItemFromQuery)||void 0===r?void 0:r.call(n,e);if(null!=l){for(var a=0,p=Array.isArray(l)?l:[l];a<p.length;a++){var u=p[a];null===(s=(o=i.props).onItemSelect)||void 0===s||s.call(o,u,t)}i.maybeResetQuery()}},i.handleItemSelect=function(e,t){var n,r;i.setActiveItem(e),null===(r=(n=i.props).onItemSelect)||void 0===r||r.call(n,e,t),i.maybeResetQuery()},i.handlePaste=function(e){for(var t,n=i.props,r=n.createNewItemFromQuery,o=n.onItemsPaste,s=[],l=[],a=0,p=e;a<p.length;a++){var u=p[a],d=b(u,i.props);if(void 0!==d)t=d,l.push(d);else if(i.canCreateItems()){var c=null==r?void 0:r(u);if(void 0!==c){var v=Array.isArray(c)?c:[c];l.push.apply(l,v)}}else s.push(u)}i.setQuery(s.join(", "),!1),void 0!==t&&i.setActiveItem(t),null==o||o(l)},i.handleKeyDown=function(e){var t,n,r=e.key;if("ArrowUp"===r||"ArrowDown"===r){e.preventDefault();var o=i.getNextActiveItem("ArrowUp"===r?-1:1);null!=o&&i.setActiveItem(o)}else"Enter"===r&&(i.isEnterKeyPressed=!0);null===(n=(t=i.props).onKeyDown)||void 0===n||n.call(t,e)},i.handleKeyUp=function(e){var t=i.props.onKeyUp,n=i.state.activeItem;"Enter"===e.key&&i.isEnterKeyPressed&&(e.preventDefault(),null==n||f(n)?i.handleItemCreate(i.state.query,e):i.handleItemSelect(n,e),i.isEnterKeyPressed=!1),null==t||t(e)},i.handleInputQueryChange=function(e){var t,n,r=null==e?"":e.target.value;i.setQuery(r),null===(n=(t=i.props).onQueryChange)||void 0===n||n.call(t,r,e)};var s=n.query,l=void 0===s?"":s,a=null===(r=n.createNewItemFromQuery)||void 0===r?void 0:r.call(n,l),p=R(l,n);return i.state={activeItem:void 0!==n.activeItem?n.activeItem:null!==(o=n.initialActiveItem)&&void 0!==o?o:E(p,n.itemDisabled),createNewItem:a,filteredItems:p,query:l},i}return(0,I.__extends)(n,e),n.ofType=function(){return n},n.prototype.render=function(){var e=this.props,t=e.className,n=e.items,r=e.renderer,o=e.itemListRenderer,i=void 0===o?this.renderItemList:o,s=e.menuProps,l=this.state,a=(l.createNewItem,(0,I.__rest)(l,["createNewItem"]));return r((0,I.__assign)((0,I.__assign)({},a),{className:t,handleItemSelect:this.handleItemSelect,handleKeyDown:this.handleKeyDown,handleKeyUp:this.handleKeyUp,handlePaste:this.handlePaste,handleQueryChange:this.handleInputQueryChange,itemList:i((0,I.__assign)((0,I.__assign)({},a),{items:n,itemsParentRef:this.refHandlers.itemsParent,menuProps:s,renderCreateItem:this.renderCreateItemMenuItem,renderItem:this.renderItem}))}))},n.prototype.componentDidUpdate=function(e){var n=this;void 0!==this.props.activeItem&&this.props.activeItem!==this.state.activeItem&&(this.shouldCheckActiveItemInViewport=!0,this.setState({activeItem:this.props.activeItem})),null!=this.props.query&&this.props.query!==e.query?this.setQuery(this.props.query,this.props.resetOnQuery,this.props):t.Utils.shallowCompareKeys(this.props,e,{include:["items","itemListPredicate","itemPredicate"]})||this.setQuery(this.state.query),this.shouldCheckActiveItemInViewport&&(this.requestAnimationFrame((function(){return n.scrollActiveItemIntoView()})),this.shouldCheckActiveItemInViewport=!1)},n.prototype.scrollActiveItemIntoView=function(){var e=!1!==this.props.scrollToActiveItem,t=!v(this.props.itemsEqual,h(this.expectedNextActiveItem),h(this.props.activeItem));if(this.expectedNextActiveItem=null,e||!t){var n=this.getActiveElement();if(null!=this.itemsParentRef&&null!=n){var r=n.offsetTop,o=n.offsetHeight,i=this.itemsParentRef,s=i.offsetTop,l=i.scrollTop,a=i.clientHeight,p=this.getItemsParentPadding(),u=p.paddingTop,d=r+o+p.paddingBottom-s,c=r-u-s;d>=l+a?this.itemsParentRef.scrollTop=d+o-a:c<=l&&(this.itemsParentRef.scrollTop=c-o)}}},n.prototype.setQuery=function(e,t,n){var r;void 0===t&&(t=this.props.resetOnQuery),void 0===n&&(n=this.props);var o=n.createNewItemFromQuery;this.shouldCheckActiveItemInViewport=!0,e!==this.state.query&&(null===(r=n.onQueryChange)||void 0===r||r.call(n,e));var i=e.trim(),s=R(i,n),l=null!=o&&""!==i?o(i):void 0;this.setState({createNewItem:l,filteredItems:s,query:e});var a=this.getActiveIndex(s);(t||a<0||w(h(this.state.activeItem),a,n.itemDisabled))&&(this.isCreateItemRendered(l)&&this.isCreateItemFirst()?this.setActiveItem({__blueprintCreateNewItemBrand:"blueprint-create-new-item"}):this.setActiveItem(E(s,n.itemDisabled)))},n.prototype.setActiveItem=function(e){var t,n,r,o;this.expectedNextActiveItem=e,void 0===this.props.activeItem&&(this.shouldCheckActiveItemInViewport=!0,this.setState({activeItem:e})),f(e)?null===(n=(t=this.props).onActiveItemChange)||void 0===n||n.call(t,null,!0):null===(o=(r=this.props).onActiveItemChange)||void 0===o||o.call(r,e,!1)},n.prototype.getActiveElement=function(){var e,t=this.state.activeItem;if(null!=this.itemsParentRef){if(f(t)){var n=this.isCreateItemFirst()?0:this.state.filteredItems.length;return this.itemsParentRef.children.item(n)}var r=this.getActiveIndex();return null!==(e=this.itemRefs.get(r))&&void 0!==e?e:this.itemsParentRef.children.item(r)}},n.prototype.getActiveIndex=function(e){void 0===e&&(e=this.state.filteredItems);var t=this.state.activeItem;if(null==t||f(t))return-1;for(var n=0;n<e.length;++n)if(v(this.props.itemsEqual,e[n],t))return n;return-1},n.prototype.getItemsParentPadding=function(){var e=getComputedStyle(this.itemsParentRef),t=e.paddingTop;return{paddingBottom:O(e.paddingBottom),paddingTop:O(t)}},n.prototype.getNextActiveItem=function(e,t){if((void 0===t&&(t=this.getActiveIndex()),this.isCreateItemRendered(this.state.createNewItem))&&(0===t&&-1===e||t===this.state.filteredItems.length-1&&1===e))return{__blueprintCreateNewItemBrand:"blueprint-create-new-item"};return E(this.state.filteredItems,this.props.itemDisabled,e,t)},n.prototype.isCreateItemRendered=function(e){return this.canCreateItems()&&""!==this.state.query&&!this.wouldCreatedItemMatchSomeExistingItem(e)},n.prototype.isCreateItemFirst=function(){return"first"===this.props.createNewItemPosition},n.prototype.canCreateItems=function(){return null!=this.props.createNewItemFromQuery&&null!=this.props.createNewItemRenderer},n.prototype.wouldCreatedItemMatchSomeExistingItem=function(e){var t=this;return this.state.filteredItems.some((function(n){return(Array.isArray(e)?e:[e]).some((function(e){return v(t.props.itemsEqual,n,e)}))}))},n.prototype.maybeResetQuery=function(){this.props.resetOnSelect&&this.setQuery("",!0)},n.displayName="".concat(t.DISPLAYNAME_PREFIX,".QueryList"),n.defaultProps={disabled:!1,resetOnQuery:!0},n}(t.AbstractComponent);function O(e){return null==e?0:parseInt(e.slice(0,-2),10)}function b(e,n){var r=n.items,o=n.itemPredicate;if(t.Utils.isFunction(o))for(var i=0;i<r.length;i++){var s=r[i];if(o(e,s,i,!0))return s}}function R(e,n){var r=n.items,o=n.itemPredicate,i=n.itemListPredicate;return t.Utils.isFunction(i)?i(e,r):t.Utils.isFunction(o)?r.filter((function(t,n){return o(e,t,n)})):r}function w(e,n,r){return null!=r&&null!=e&&(t.Utils.isFunction(r)?r(e,n):!!e[r])}function E(e,t,n,r){if(void 0===n&&(n=1),void 0===r&&(r=e.length-1),0===e.length)return null;var o,i,s,l=r,a=e.length-1;do{if(s=a,!w(e[l=(o=l+n)<(i=0)?s:o>s?i:o],l,t))return e[l]}while(l!==r&&-1!==r);return null}var S=function(e){function n(){var n,s=this;return(s=e.apply(this,arguments)||this).listboxId=t.Utils.uniqueId("listbox"),s.state={isOpen:s.props.popoverProps&&s.props.popoverProps.isOpen||!1},s.input=null,s.queryList=null,s.refHandlers={input:(0,t.refHandler)(s,"input",null===(n=s.props.tagInputProps)||void 0===n?void 0:n.inputRef),popover:P.createRef(),queryList:function(e){return s.queryList=e}},s.renderQueryList=function(e){var n=s.props,r=n.disabled,i=n.popoverContentProps,l=void 0===i?{}:i,a=n.popoverProps,p=void 0===a?{}:a,u=e.handleKeyDown,d=e.handleKeyUp,c=void 0===s.props.popoverRef?s.refHandlers.popover:(0,t.mergeRefs)(s.refHandlers.popover,s.props.popoverRef);return P.createElement(t.Popover,(0,I.__assign)({autoFocus:!1,canEscapeKeyClose:!0,disabled:r,enforceFocus:!1,isOpen:s.state.isOpen,placement:p.position||p.placement?void 0:"bottom-start"},p,{className:g()(e.className,p.className),content:P.createElement("div",(0,I.__assign)({},l,{onKeyDown:u,onKeyUp:d}),e.itemList),interactionKind:"click",onInteraction:s.handlePopoverInteraction,onOpened:s.handlePopoverOpened,popoverClassName:g()(o,p.popoverClassName),popupKind:t.PopupKind.LISTBOX,ref:c,renderTarget:s.getPopoverTargetRenderer(e,s.state.isOpen)}))},s.getPopoverTargetRenderer=function(e,n){return function(o){o.isOpen;var l,a,p=o.ref,u=(0,I.__rest)(o,["isOpen","ref"]),d=s.props,c=d.disabled,v=d.fill,m=d.onClear,f=d.placeholder,h=d.popoverProps,y=void 0===h?{}:h,C=d.popoverTargetProps,O=void 0===C?{}:C,b=d.selectedItems,R=d.tagInputProps,w=void 0===R?{}:R,E=e.handleKeyDown,S=e.handleKeyUp;c&&(w.disabled=!0),v&&(w.fill=!0);var A=(0,I.__assign)((0,I.__assign)({},w.inputProps),{className:g()(null===(a=w.inputProps)||void 0===a?void 0:a.className,i)}),N=void 0!==m&&b.length>0?P.createElement(t.Button,{"aria-label":"Clear selected items",disabled:c,icon:P.createElement(_.Cross,null),minimal:!0,onClick:s.handleClearButtonClick,title:"Clear selected items"}):void 0,T=y.targetTagName,K=void 0===T?"div":T;return P.createElement(K,(0,I.__assign)((0,I.__assign)((0,I.__assign)({"aria-autocomplete":"list","aria-controls":s.listboxId},O),u),{"aria-disabled":c,"aria-expanded":n,className:g()(u.className,O.className,(l={},l[t.Classes.FILL]=v,l)),onKeyDown:s.getTagInputKeyDownHandler(E),onKeyUp:s.getTagInputKeyUpHandler(S),ref:p,role:"combobox"}),P.createElement(t.TagInput,(0,I.__assign)({placeholder:f,rightElement:N},w,{className:g()(r,w.className),inputRef:s.refHandlers.input,inputProps:A,inputValue:e.query,onAdd:s.getTagInputAddHandler(e),onInputChange:e.handleQueryChange,onRemove:s.handleTagRemove,values:b.map(s.props.tagRenderer)})))}},s.handleItemSelect=function(e,t){var n,r,o;null!=s.input&&s.input.focus(),null===(r=(n=s.props).onItemSelect)||void 0===r||r.call(n,e,t),null===(o=s.refHandlers.popover.current)||void 0===o||o.reposition()},s.handleQueryChange=function(e,t){var n,r;s.setState({isOpen:e.length>0||!s.props.openOnKeyDown}),null===(r=(n=s.props).onQueryChange)||void 0===r||r.call(n,e,t)},s.handlePopoverInteraction=function(e,n){return s.requestAnimationFrame((function(){var r,o,i=s.input===t.Utils.getActiveElement(s.input);null==s.input||i?s.props.openOnKeyDown||s.setState({isOpen:!0}):s.setState({isOpen:!1}),null===(o=null===(r=s.props.popoverProps)||void 0===r?void 0:r.onInteraction)||void 0===o||o.call(r,e,n)}))},s.handlePopoverOpened=function(e){var t,n;null!=s.queryList&&s.queryList.scrollActiveItemIntoView(),null===(n=null===(t=s.props.popoverProps)||void 0===t?void 0:t.onOpened)||void 0===n||n.call(t,e)},s.handleTagRemove=function(e,t){var n,r,o=s.props,i=o.selectedItems,l=o.onRemove,a=o.tagInputProps;null==l||l(i[t],t),null===(n=null==a?void 0:a.onRemove)||void 0===n||n.call(a,e,t),null===(r=s.refHandlers.popover.current)||void 0===r||r.reposition()},s.getTagInputAddHandler=function(e){return function(t,n){"paste"===n&&e.handlePaste(t)}},s.getTagInputKeyDownHandler=function(e){return function(n){var r,o;"Escape"===n.key||"Tab"===n.key?(null!=s.input&&s.input.blur(),s.setState({isOpen:!1})):"Backspace"!==n.key&&"ArrowLeft"!==n.key&&"ArrowRight"!==n.key&&s.setState({isOpen:!0});var i=null!=n.target.closest(".".concat(t.Classes.TAG_REMOVE));s.state.isOpen&&!i&&(null==e||e(n)),null===(o=null===(r=s.props.popoverTargetProps)||void 0===r?void 0:r.onKeyDown)||void 0===o||o.call(r,n)}},s.getTagInputKeyUpHandler=function(e){return function(t){var n,r,o=t.target.classList.contains(i);s.state.isOpen&&o&&(null==e||e(t)),null===(r=null===(n=s.props.popoverTargetProps)||void 0===n?void 0:n.onKeyDown)||void 0===r||r.call(n,t)}},s.handleClearButtonClick=function(){var e,t,n;null===(t=(e=s.props).onClear)||void 0===t||t.call(e),null===(n=s.refHandlers.popover.current)||void 0===n||n.reposition()},s}return(0,I.__extends)(n,e),n.ofType=function(){return n},n.prototype.componentDidUpdate=function(e){var n,r,o,i,s;(null===(n=e.tagInputProps)||void 0===n?void 0:n.inputRef)!==(null===(r=this.props.tagInputProps)||void 0===r?void 0:r.inputRef)&&((0,t.setRef)(null===(o=e.tagInputProps)||void 0===o?void 0:o.inputRef,null),this.refHandlers.input=(0,t.refHandler)(this,"input",null===(i=this.props.tagInputProps)||void 0===i?void 0:i.inputRef),(0,t.setRef)(null===(s=this.props.tagInputProps)||void 0===s?void 0:s.inputRef,this.input)),(void 0===e.onClear&&void 0!==this.props.onClear||void 0!==e.onClear&&void 0===this.props.onClear)&&this.forceUpdate()},n.prototype.render=function(){var e=this.props,t=e.menuProps,n=(e.openOnKeyDown,e.popoverProps,e.tagInputProps,(0,I.__rest)(e,["menuProps","openOnKeyDown","popoverProps","tagInputProps"]));return P.createElement(C,(0,I.__assign)({},n,{menuProps:(0,I.__assign)((0,I.__assign)({"aria-label":"selectable options"},t),{"aria-multiselectable":!0,id:this.listboxId}),onItemSelect:this.handleItemSelect,onQueryChange:this.handleQueryChange,ref:this.refHandlers.queryList,renderer:this.renderQueryList}))},n.displayName="".concat(t.DISPLAYNAME_PREFIX,".MultiSelect"),n.defaultProps={disabled:!1,fill:!1,placeholder:"Search..."},n}(t.AbstractPureComponent),A=function(e){function n(){var n=null!==e&&e.apply(this,arguments)||this;return n.renderQueryList=function(e){var r=n.props,o=r.inputProps,i=void 0===o?{}:o,l=r.isOpen,a=r.overlayProps,u=void 0===a?{}:a,d=e.handleKeyDown,c=e.handleKeyUp,v=l?{onKeyDown:d,onKeyUp:c}:{};return P.createElement(t.Overlay,(0,I.__assign)({hasBackdrop:!0},u,{isOpen:l,className:g()(p,u.className),onClose:n.handleOverlayClose}),P.createElement("div",(0,I.__assign)({className:g()(s,e.className)},v),P.createElement(t.InputGroup,(0,I.__assign)({autoFocus:!0,large:!0,leftIcon:P.createElement(_.Search,null),placeholder:"Search..."},i,{onChange:e.handleQueryChange,value:e.query})),e.itemList))},n.handleOverlayClose=function(e){var t,r,o,i;null===(r=null===(t=n.props.overlayProps)||void 0===t?void 0:t.onClose)||void 0===r||r.call(t,e),null===(i=(o=n.props).onClose)||void 0===i||i.call(o,e)},n}return(0,I.__extends)(n,e),n.ofType=function(){return n},n.prototype.render=function(){var e=this.props,t=(e.isOpen,e.inputProps,e.overlayProps,(0,I.__rest)(e,["isOpen","inputProps","overlayProps"])),n="initialContent"in this.props?this.props.initialContent:null;return P.createElement(C,(0,I.__assign)({},t,{menuProps:{role:"menu"},initialContent:n,renderer:this.renderQueryList}))},n.displayName="".concat(t.DISPLAYNAME_PREFIX,".Omnibar"),n}(P.PureComponent),N=function(e){function n(){var n,r=this;return(r=e.apply(this,arguments)||this).state={isOpen:!1},r.inputElement=null,r.queryList=null,r.handleInputRef=(0,t.refHandler)(r,"inputElement",null===(n=r.props.inputProps)||void 0===n?void 0:n.inputRef),r.handleQueryListRef=function(e){return r.queryList=e},r.listboxId=t.Utils.uniqueId("listbox"),r.renderQueryList=function(e){var n=r.props,o=n.filterable,i=void 0===o||o,s=n.disabled,l=void 0!==s&&s,a=n.inputProps,p=void 0===a?{}:a,d=n.popoverContentProps,c=void 0===d?{}:d,v=n.popoverProps,m=void 0===v?{}:v,f=n.popoverRef,h=P.createElement(t.InputGroup,(0,I.__assign)({"aria-autocomplete":"list",leftIcon:P.createElement(_.Search,null),placeholder:"Filter...",rightElement:r.maybeRenderClearButton(e.query)},p,{inputRef:r.handleInputRef,onChange:e.handleQueryChange,value:e.query})),y=e.handleKeyDown,C=e.handleKeyUp;return P.createElement(t.Popover,(0,I.__assign)({autoFocus:!1,enforceFocus:!1,isOpen:r.state.isOpen,disabled:l,placement:m.position||m.placement?void 0:"bottom-start"},m,{className:g()(e.className,m.className),content:P.createElement("div",(0,I.__assign)({},c,{onKeyDown:y,onKeyUp:C}),i?h:void 0,e.itemList),onClosing:r.handlePopoverClosing,onInteraction:r.handlePopoverInteraction,onOpened:r.handlePopoverOpened,onOpening:r.handlePopoverOpening,popoverClassName:g()(u,m.popoverClassName),popupKind:t.PopupKind.LISTBOX,ref:f,renderTarget:r.getPopoverTargetRenderer(e,r.state.isOpen)}))},r.getPopoverTargetRenderer=function(e,n){return function(o){o.isOpen;var i,s=o.ref,l=(0,I.__rest)(o,["isOpen","ref"]),a=r.props,p=a.disabled,u=a.popoverProps,d=void 0===u?{}:u,c=a.popoverTargetProps,v=e.handleKeyDown,m=e.handleKeyUp,f=d.targetTagName,h=void 0===f?"div":f;return P.createElement(h,(0,I.__assign)((0,I.__assign)((0,I.__assign)({"aria-controls":r.listboxId},c),l),{"aria-disabled":p,"aria-expanded":n,className:g()(l.className,null==c?void 0:c.className,(i={},i[t.Classes.FILL]=r.props.fill,i)),onKeyDown:r.withPopoverTargetPropsHandler("keydown",n?v:r.handleTargetKeyDown),onKeyUp:r.withPopoverTargetPropsHandler("keyup",n?m:void 0),ref:s,role:"combobox"}),r.props.children)}},r.withPopoverTargetPropsHandler=function(e,t){switch(e){case"keydown":return function(e){var n,o;null==t||t(e),null===(o=null===(n=r.props.popoverTargetProps)||void 0===n?void 0:n.onKeyDown)||void 0===o||o.call(n,e)};case"keyup":return function(e){var n,o;null==t||t(e),null===(o=null===(n=r.props.popoverTargetProps)||void 0===n?void 0:n.onKeyUp)||void 0===o||o.call(n,e)}}},r.handleTargetKeyDown=function(e){"ArrowUp"===e.key||"ArrowDown"===e.key?(e.preventDefault(),r.setState({isOpen:!0})):t.Utils.isKeyboardClick(e)&&r.setState({isOpen:!0})},r.handleItemSelect=function(e,n){var o,i,s=null==n?void 0:n.target,l=null==s?void 0:s.closest(".".concat(t.Classes.MENU_ITEM)),a=null==l?void 0:l.matches(".".concat(t.Classes.POPOVER_DISMISS)),p=null==a||a;r.setState({isOpen:!p}),null===(i=(o=r.props).onItemSelect)||void 0===i||i.call(o,e,n)},r.handlePopoverInteraction=function(e,t){var n,o;r.setState({isOpen:e}),null===(o=null===(n=r.props.popoverProps)||void 0===n?void 0:n.onInteraction)||void 0===o||o.call(n,e,t)},r.handlePopoverOpening=function(e){var n,o,i;r.previousFocusedElement=null!==(n=t.Utils.getActiveElement(r.inputElement))&&void 0!==n?n:void 0,r.props.resetOnClose&&r.resetQuery(),null===(i=null===(o=r.props.popoverProps)||void 0===o?void 0:o.onOpening)||void 0===i||i.call(o,e)},r.handlePopoverOpened=function(e){var t,n;null!=r.queryList&&r.queryList.scrollActiveItemIntoView(),r.requestAnimationFrame((function(){var e,t=r.props.inputProps;!1!==(void 0===t?{}:t).autoFocus&&(null===(e=r.inputElement)||void 0===e||e.focus())})),null===(n=null===(t=r.props.popoverProps)||void 0===t?void 0:t.onOpened)||void 0===n||n.call(t,e)},r.handlePopoverClosing=function(e){var t,n;r.requestAnimationFrame((function(){void 0!==r.previousFocusedElement&&(r.previousFocusedElement.focus(),r.previousFocusedElement=void 0)})),null===(n=null===(t=r.props.popoverProps)||void 0===t?void 0:t.onClosing)||void 0===n||n.call(t,e)},r.resetQuery=function(){return r.queryList&&r.queryList.setQuery("",!0)},r}return(0,I.__extends)(n,e),n.ofType=function(){return n},n.prototype.render=function(){var e=this.props,t=(e.filterable,e.inputProps,e.menuProps),n=(e.popoverProps,(0,I.__rest)(e,["filterable","inputProps","menuProps","popoverProps"]));return P.createElement(C,(0,I.__assign)({},n,{menuProps:(0,I.__assign)((0,I.__assign)({"aria-label":"selectable options"},t),{id:this.listboxId}),onItemSelect:this.handleItemSelect,ref:this.handleQueryListRef,renderer:this.renderQueryList}))},n.prototype.componentDidUpdate=function(e,n){var r,o,i,s,l;(null===(r=e.inputProps)||void 0===r?void 0:r.inputRef)!==(null===(o=this.props.inputProps)||void 0===o?void 0:o.inputRef)&&((0,t.setRef)(null===(i=e.inputProps)||void 0===i?void 0:i.inputRef,null),this.handleInputRef=(0,t.refHandler)(this,"inputElement",null===(s=this.props.inputProps)||void 0===s?void 0:s.inputRef),(0,t.setRef)(null===(l=this.props.inputProps)||void 0===l?void 0:l.inputRef,this.inputElement)),this.state.isOpen&&!n.isOpen&&null!=this.queryList&&this.queryList.scrollActiveItemIntoView()},n.prototype.maybeRenderClearButton=function(e){return e.length>0?P.createElement(t.Button,{"aria-label":"Clear filter query",icon:P.createElement(_.Cross,null),minimal:!0,onClick:this.resetQuery,title:"Clear filter query"}):void 0},n.displayName="".concat(t.DISPLAYNAME_PREFIX,".Select"),n}(t.AbstractPureComponent),T=function(e){function n(){var n,r=this;return(r=e.apply(this,arguments)||this).state={isOpen:null!=r.props.popoverProps&&r.props.popoverProps.isOpen||!1,selectedItem:r.getInitialSelectedItem()},r.inputElement=null,r.queryList=null,r.handleInputRef=(0,t.refHandler)(r,"inputElement",null===(n=r.props.inputProps)||void 0===n?void 0:n.inputRef),r.handleQueryListRef=function(e){return r.queryList=e},r.listboxId=t.Utils.uniqueId("listbox"),r.renderQueryList=function(e){var n=r.props,o=n.popoverContentProps,i=void 0===o?{}:o,s=n.popoverProps,l=void 0===s?{}:s,a=n.popoverRef,p=r.state.isOpen,u=e.handleKeyDown,c=e.handleKeyUp;return P.createElement(t.Popover,(0,I.__assign)({autoFocus:!1,enforceFocus:!1,isOpen:p,placement:l.position||l.placement?void 0:"bottom-start"},l,{className:g()(e.className,l.className),content:P.createElement("div",(0,I.__assign)({},i,{onKeyDown:u,onKeyUp:c}),e.itemList),interactionKind:"click",onInteraction:r.handlePopoverInteraction,onOpened:r.handlePopoverOpened,onOpening:r.handlePopoverOpening,popoverClassName:g()(d,l.popoverClassName),popupKind:t.PopupKind.LISTBOX,ref:a,renderTarget:r.getPopoverTargetRenderer(e,p)}))},r.getPopoverTargetRenderer=function(e,n){return function(o){o.isOpen;var i=o.ref,s=(0,I.__rest)(o,["isOpen","ref"]),l=r.props,a=l.disabled,p=l.fill,u=l.inputProps,d=void 0===u?{}:u,c=l.inputValueRenderer,v=l.popoverProps,m=void 0===v?{}:v,f=l.resetOnClose,h=r.state.selectedItem,y=e.handleKeyDown,_=e.handleKeyUp,C=null==h?"":c(h),O=d.autoComplete,b=void 0===O?"off":O,R=d.placeholder,w=n&&C?C:void 0===R?"Search...":R,E=n?e.query:""===C?f?"":e.query:C;return P.createElement(t.InputGroup,(0,I.__assign)({"aria-controls":r.listboxId,autoComplete:b,disabled:a,tagName:m.targetTagName},s,d,{"aria-autocomplete":"list","aria-expanded":n,className:g()(s.className,d.className),fill:p,inputRef:(0,t.mergeRefs)(r.handleInputRef,i),onChange:e.handleQueryChange,onFocus:r.handleInputFocus,onKeyDown:r.getTargetKeyDownHandler(y),onKeyUp:r.getTargetKeyUpHandler(_),placeholder:w,role:"combobox",value:E}))}},r.selectText=function(){r.requestAnimationFrame((function(){var e;null===(e=r.inputElement)||void 0===e||e.setSelectionRange(0,r.inputElement.value.length)}))},r.handleInputFocus=function(e){var t,n;r.selectText(),r.props.openOnKeyDown||r.setState({isOpen:!0}),null===(n=null===(t=r.props.inputProps)||void 0===t?void 0:t.onFocus)||void 0===n||n.call(t,e)},r.handleItemSelect=function(e,t){var n,o,i,s,l;r.props.closeOnSelect?(null===(o=r.inputElement)||void 0===o||o.blur(),l=!1):(null===(n=r.inputElement)||void 0===n||n.focus(),r.selectText(),l=!0),void 0===r.props.selectedItem?r.setState({isOpen:l,selectedItem:e}):r.setState({isOpen:l}),null===(s=(i=r.props).onItemSelect)||void 0===s||s.call(i,e,t)},r.handlePopoverInteraction=function(e,n){return r.requestAnimationFrame((function(){var o,i,s=r.inputElement===t.Utils.getActiveElement(r.inputElement);null==r.inputElement||s||r.setState({isOpen:!1}),null===(i=null===(o=r.props.popoverProps)||void 0===o?void 0:o.onInteraction)||void 0===i||i.call(o,e,n)}))},r.handlePopoverOpening=function(e){var t,n;r.props.resetOnClose&&r.queryList&&r.queryList.setQuery("",!0),null===(n=null===(t=r.props.popoverProps)||void 0===t?void 0:t.onOpening)||void 0===n||n.call(t,e)},r.handlePopoverOpened=function(e){var t,n;null!=r.queryList&&r.queryList.scrollActiveItemIntoView(),null===(n=null===(t=r.props.popoverProps)||void 0===t?void 0:t.onOpened)||void 0===n||n.call(t,e)},r.getTargetKeyDownHandler=function(e){return function(t){var n,o,i;"Escape"===t.key||"Tab"===t.key?(null===(n=r.inputElement)||void 0===n||n.blur(),r.setState({isOpen:!1})):r.props.openOnKeyDown&&"Backspace"!==t.key&&"ArrowLeft"!==t.key&&"ArrowRight"!==t.key&&r.setState({isOpen:!0}),r.state.isOpen&&(null==e||e(t)),null===(i=null===(o=r.props.inputProps)||void 0===o?void 0:o.onKeyDown)||void 0===i||i.call(o,t)}},r.getTargetKeyUpHandler=function(e){return function(t){var n,o;r.state.isOpen&&(null==e||e(t)),null===(o=null===(n=r.props.inputProps)||void 0===n?void 0:n.onKeyUp)||void 0===o||o.call(n,t)}},r}return(0,I.__extends)(n,e),n.ofType=function(){return n},n.prototype.render=function(){var e,t=this.props,n=(t.disabled,t.inputProps,t.menuProps),r=(t.popoverProps,(0,I.__rest)(t,["disabled","inputProps","menuProps","popoverProps"]));return P.createElement(C,(0,I.__assign)({},r,{menuProps:(0,I.__assign)((0,I.__assign)({"aria-label":"selectable options"},n),{id:this.listboxId}),initialActiveItem:null!==(e=this.props.selectedItem)&&void 0!==e?e:void 0,onItemSelect:this.handleItemSelect,ref:this.handleQueryListRef,renderer:this.renderQueryList}))},n.prototype.componentDidUpdate=function(e,n){var r,o,i,s,l,a,p,u=this;if((null===(r=e.inputProps)||void 0===r?void 0:r.inputRef)!==(null===(o=this.props.inputProps)||void 0===o?void 0:o.inputRef)&&((0,t.setRef)(null===(i=e.inputProps)||void 0===i?void 0:i.inputRef,null),this.handleInputRef=(0,t.refHandler)(this,"inputElement",null===(s=this.props.inputProps)||void 0===s?void 0:s.inputRef),(0,t.setRef)(null===(l=this.props.inputProps)||void 0===l?void 0:l.inputRef,this.inputElement)),void 0!==this.props.selectedItem&&this.props.selectedItem!==this.state.selectedItem&&this.setState({selectedItem:this.props.selectedItem}),!1===this.state.isOpen&&!0===n.isOpen){var d=null!==(p=null===(a=this.props.popoverProps)||void 0===a?void 0:a.transitionDuration)&&void 0!==p?p:t.Popover.defaultProps.transitionDuration;setTimeout((function(){return u.maybeResetActiveItemToSelectedItem()}),d)}this.state.isOpen&&!n.isOpen&&null!=this.queryList&&this.queryList.scrollActiveItemIntoView()},n.prototype.getInitialSelectedItem=function(){return void 0!==this.props.selectedItem?this.props.selectedItem:void 0!==this.props.defaultSelectedItem?this.props.defaultSelectedItem:null},n.prototype.maybeResetActiveItemToSelectedItem=function(){var e,t=void 0===this.props.activeItem&&null!==this.state.selectedItem&&!this.props.resetOnSelect;null!==this.queryList&&t&&this.queryList.setActiveItem(null!==(e=this.props.selectedItem)&&void 0!==e?e:this.state.selectedItem)},n.displayName="".concat(t.DISPLAYNAME_PREFIX,".Suggest"),n.defaultProps={closeOnSelect:!0,fill:!1,openOnKeyDown:!1,resetOnClose:!1},n}(t.AbstractPureComponent)}(),a}()}));