@blueprintjs/select - npm Package Compare versions

Comparing version 3.14.3 to 3.15.0

dist/select.bundle.js

@@ -1,1 +0,1 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("@blueprintjs/core"),require("tslib"),require("react"),require("classnames")):"function"==typeof define&&define.amd?define(["@blueprintjs/core","tslib","react","classnames"],t):"object"==typeof exports?exports.Select=t(require("@blueprintjs/core"),require("tslib"),require("react"),require("classnames")):(e.Blueprint=e.Blueprint||{},e.Blueprint.Select=t(e.Blueprint.Core,e.window,e.React,e.classNames))}(window,(function(e,t,n,r){return function(e){var t={};function n(r){if(t[r])return t[r].exports;var i=t[r]={i:r,l:!1,exports:{}};return e[r].call(i.exports,i,i.exports,n),i.l=!0,i.exports}return n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var i in e)n.d(r,i,function(t){return e[t]}.bind(null,i));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=6)}([function(t,n){t.exports=e},function(e,n){e.exports=t},function(e,t){e.exports=n},function(e,t){e.exports=r},,,function(e,t,n){e.exports=n(7)},function(e,t,n){"use strict";n.r(t),n.d(t,"Classes",(function(){return r})),n.d(t,"renderFilteredItems",(function(){return v})),n.d(t,"executeItemsEqual",(function(){return m})),n.d(t,"getCreateNewItem",(function(){return f})),n.d(t,"isCreateNewItem",(function(){return h})),n.d(t,"getActiveItem",(function(){return y})),n.d(t,"Omnibar",(function(){return R})),n.d(t,"QueryList",(function(){return E})),n.d(t,"getFirstEnabledItem",(function(){return L})),n.d(t,"MultiSelect",(function(){return A})),n.d(t,"Select",(function(){return S})),n.d(t,"Suggest",(function(){return K}));var r={};n.r(r),n.d(r,"MULTISELECT",(function(){return s})),n.d(r,"MULTISELECT_POPOVER",(function(){return l})),n.d(r,"MULTISELECT_TAG_INPUT_INPUT",(function(){return p})),n.d(r,"OMNIBAR",(function(){return u})),n.d(r,"OMNIBAR_OVERLAY",(function(){return a})),n.d(r,"SELECT",(function(){return c})),n.d(r,"SELECT_POPOVER",(function(){return d}));var i=n(0),o=i.Classes.getClassNamespace(),s=o+"-multi-select",l=s+"-popover",p=s+"-tag-input-input",u=o+"-omnibar",a=u+"-overlay",c=o+"-select",d=c+"-popover";function v(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 m(e,t,n){return void 0===e||null==t||null==n?t===n:i.Utils.isFunction(e)?e(t,n):t[e]===n[e]}function f(){return{__blueprintCreateNewItemBrand:"blueprint-create-new-item"}}function h(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 y(e){return null==e||h(e)?null:e}var I=n(1),O=n(3),P=n.n(O),g=n(2),E=function(e){function t(t,n){var r,o,s=e.call(this,t,n)||this;s.refHandlers={itemsParent:function(e){return s.itemsParentRef=e}},s.shouldCheckActiveItemInViewport=!1,s.expectedNextActiveItem=null,s.isEnterKeyPressed=!1,s.renderItemList=function(e){var t=s.props,n=t.initialContent,r=t.noResults,o=e.renderCreateItem(),l=v(e,null!=o?null:r,n);return null==l&&null==o?null:g.createElement(i.Menu,{ulRef:e.itemsParentRef},l,o)},s.renderItem=function(e,t){if(!0!==s.props.disabled){var n=s.state,r=n.activeItem,i=n.query,o=s.state.filteredItems.indexOf(e)>=0,l={active:m(s.props.itemsEqual,y(r),e),disabled:T(e,t,s.props.itemDisabled),matchesPredicate:o};return s.props.itemRenderer(e,{handleClick:function(t){return s.handleItemSelect(e,t)},index:t,modifiers:l,query:i})}return null},s.renderCreateItemMenuItem=function(){if(s.isCreateItemRendered()){var e=s.state,t=e.activeItem,n=e.query.trim(),r=h(t);return s.props.createNewItemRenderer(n,r,(function(e){s.handleItemCreate(n,e)}))}return null},s.handleItemCreate=function(e,t){var n,r,i,o,l=null===(r=(n=s.props).createNewItemFromQuery)||void 0===r?void 0:r.call(n,e);null!=l&&(null===(o=(i=s.props).onItemSelect)||void 0===o||o.call(i,l,t),s.maybeResetQuery())},s.handleItemSelect=function(e,t){var n,r;s.setActiveItem(e),null===(r=(n=s.props).onItemSelect)||void 0===r||r.call(n,e,t),s.maybeResetQuery()},s.handlePaste=function(e){for(var t,n=s.props,r=n.createNewItemFromQuery,i=n.onItemsPaste,o=[],l=[],p=0,u=e;p<u.length;p++){var a=u[p],c=_(a,s.props);if(void 0!==c)t=c,l.push(c);else if(s.canCreateItems()){var d=null==r?void 0:r(a);void 0!==d&&l.push(d)}else o.push(a)}s.setQuery(o.join(", "),!1),void 0!==t&&s.setActiveItem(t),null==i||i(l)},s.handleKeyDown=function(e){var t,n,r=e.keyCode;if(r===i.Keys.ARROW_UP||r===i.Keys.ARROW_DOWN){e.preventDefault();var o=s.getNextActiveItem(r===i.Keys.ARROW_UP?-1:1);null!=o&&s.setActiveItem(o)}else r===i.Keys.ENTER&&(s.isEnterKeyPressed=!0);null===(n=(t=s.props).onKeyDown)||void 0===n||n.call(t,e)},s.handleKeyUp=function(e){var t=s.props.onKeyUp,n=s.state.activeItem;e.keyCode===i.Keys.ENTER&&s.isEnterKeyPressed&&(e.preventDefault(),null==n||h(n)?s.handleItemCreate(s.state.query,e):s.handleItemSelect(n,e),s.isEnterKeyPressed=!1),null==t||t(e)},s.handleInputQueryChange=function(e){var t,n,r=null==e?"":e.target.value;s.setQuery(r),null===(n=(t=s.props).onQueryChange)||void 0===n||n.call(t,r,e)};var l=t.query,p=void 0===l?"":l,u=null===(r=t.createNewItemFromQuery)||void 0===r?void 0:r.call(t,p),a=b(p,t);return s.state={activeItem:void 0!==t.activeItem?t.activeItem:null!==(o=t.initialActiveItem)&&void 0!==o?o:L(a,t.itemDisabled),createNewItem:u,filteredItems:a,query:p},s}return Object(I.__extends)(t,e),t.ofType=function(){return t},t.prototype.render=function(){var e=this.props,t=e.className,n=e.items,r=e.renderer,i=e.itemListRenderer,o=void 0===i?this.renderItemList:i,s=this.state,l=(s.createNewItem,Object(I.__rest)(s,["createNewItem"]));return r(Object(I.__assign)(Object(I.__assign)({},l),{className:t,handleItemSelect:this.handleItemSelect,handleKeyDown:this.handleKeyDown,handleKeyUp:this.handleKeyUp,handlePaste:this.handlePaste,handleQueryChange:this.handleInputQueryChange,itemList:o(Object(I.__assign)(Object(I.__assign)({},l),{items:n,itemsParentRef:this.refHandlers.itemsParent,renderCreateItem:this.renderCreateItemMenuItem,renderItem:this.renderItem}))}))},t.prototype.componentDidUpdate=function(e){var t=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):i.Utils.shallowCompareKeys(this.props,e,{include:["items","itemListPredicate","itemPredicate"]})||this.setQuery(this.state.query),this.shouldCheckActiveItemInViewport&&(this.requestAnimationFrame((function(){return t.scrollActiveItemIntoView()})),this.shouldCheckActiveItemInViewport=!1)},t.prototype.scrollActiveItemIntoView=function(){var e=!1!==this.props.scrollToActiveItem,t=!m(this.props.itemsEqual,y(this.expectedNextActiveItem),y(this.props.activeItem));if(this.expectedNextActiveItem=null,e||!t){var n=this.getActiveElement();if(null!=this.itemsParentRef&&null!=n){var r=n.offsetTop,i=n.offsetHeight,o=this.itemsParentRef,s=o.offsetTop,l=o.scrollTop,p=o.clientHeight,u=this.getItemsParentPadding(),a=u.paddingTop,c=r+i+u.paddingBottom-s,d=r-a-s;c>=l+p?this.itemsParentRef.scrollTop=c+i-p:d<=l&&(this.itemsParentRef.scrollTop=d-i)}}},t.prototype.setQuery=function(e,t,n){var r;void 0===t&&(t=this.props.resetOnQuery),void 0===n&&(n=this.props);var i=n.createNewItemFromQuery;this.shouldCheckActiveItemInViewport=!0,e!==this.state.query&&(null===(r=n.onQueryChange)||void 0===r||r.call(n,e));var o=e.trim(),s=b(o,n),l=null!=i&&""!==o?i(o):void 0;this.setState({createNewItem:l,filteredItems:s,query:e});var p=this.getActiveIndex(s);(t||p<0||T(y(this.state.activeItem),p,n.itemDisabled))&&this.setActiveItem(L(s,n.itemDisabled))},t.prototype.setActiveItem=function(e){var t,n,r,i;this.expectedNextActiveItem=e,void 0===this.props.activeItem&&(this.shouldCheckActiveItemInViewport=!0,this.setState({activeItem:e})),h(e)?null===(n=(t=this.props).onActiveItemChange)||void 0===n||n.call(t,null,!0):null===(i=(r=this.props).onActiveItemChange)||void 0===i||i.call(r,e,!1)},t.prototype.getActiveElement=function(){var e=this.state.activeItem;if(null!=this.itemsParentRef){if(h(e))return this.itemsParentRef.children.item(this.state.filteredItems.length);var t=this.getActiveIndex();return this.itemsParentRef.children.item(t)}},t.prototype.getActiveIndex=function(e){void 0===e&&(e=this.state.filteredItems);var t=this.state.activeItem;if(null==t||h(t))return-1;for(var n=0;n<e.length;++n)if(m(this.props.itemsEqual,e[n],t))return n;return-1},t.prototype.getItemsParentPadding=function(){var e=getComputedStyle(this.itemsParentRef),t=e.paddingTop;return{paddingBottom:C(e.paddingBottom),paddingTop:C(t)}},t.prototype.getNextActiveItem=function(e,t){if((void 0===t&&(t=this.getActiveIndex()),this.isCreateItemRendered())&&(0===t&&-1===e||t===this.state.filteredItems.length-1&&1===e))return{__blueprintCreateNewItemBrand:"blueprint-create-new-item"};return L(this.state.filteredItems,this.props.itemDisabled,e,t)},t.prototype.isCreateItemRendered=function(){return this.canCreateItems()&&""!==this.state.query&&!this.wouldCreatedItemMatchSomeExistingItem()},t.prototype.canCreateItems=function(){return null!=this.props.createNewItemFromQuery&&null!=this.props.createNewItemRenderer},t.prototype.wouldCreatedItemMatchSomeExistingItem=function(){var e=this;return this.state.filteredItems.some((function(t){return m(e.props.itemsEqual,t,e.state.createNewItem)}))},t.prototype.maybeResetQuery=function(){this.props.resetOnSelect&&this.setQuery("",!0)},t.displayName=i.DISPLAYNAME_PREFIX+".QueryList",t.defaultProps={disabled:!1,resetOnQuery:!0},t}(i.AbstractComponent2);function C(e){return null==e?0:parseInt(e.slice(0,-2),10)}function _(e,t){var n=t.items,r=t.itemPredicate;if(i.Utils.isFunction(r))for(var o=0;o<n.length;o++){var s=n[o];if(r(e,s,o,!0))return s}}function b(e,t){var n=t.items,r=t.itemPredicate,o=t.itemListPredicate;return i.Utils.isFunction(o)?o(e,n):i.Utils.isFunction(r)?n.filter((function(t,n){return r(e,t,n)})):n}function T(e,t,n){return null!=n&&null!=e&&(i.Utils.isFunction(n)?n(e,t):!!e[n])}function L(e,t,n,r){if(void 0===n&&(n=1),void 0===r&&(r=e.length-1),0===e.length)return null;var i,o,s,l=r,p=e.length-1;do{if(s=p,!T(e[l=(i=l+n)<(o=0)?s:i>s?o:i],l,t))return e[l]}while(l!==r&&-1!==r);return null}var R=function(e){function t(){var t=null!==e&&e.apply(this,arguments)||this;return t.TypedQueryList=E.ofType(),t.renderQueryList=function(e){var n=t.props,o=n.inputProps,s=void 0===o?{}:o,l=n.isOpen,p=n.overlayProps,u=void 0===p?{}:p,a=e.handleKeyDown,c=e.handleKeyUp,d=l?{onKeyDown:a,onKeyUp:c}:{};return g.createElement(i.Overlay,Object(I.__assign)({hasBackdrop:!0},u,{isOpen:l,className:P()(r.OMNIBAR_OVERLAY,u.className),onClose:t.handleOverlayClose}),g.createElement("div",Object(I.__assign)({className:P()(r.OMNIBAR,e.className)},d),g.createElement(i.InputGroup,Object(I.__assign)({autoFocus:!0,large:!0,leftIcon:"search",placeholder:"Search..."},s,{onChange:e.handleQueryChange,value:e.query})),e.itemList))},t.handleOverlayClose=function(e){var n,r,i,o;null===(r=null===(n=t.props.overlayProps)||void 0===n?void 0:n.onClose)||void 0===r||r.call(n,e),null===(o=(i=t.props).onClose)||void 0===o||o.call(i,e)},t}return Object(I.__extends)(t,e),t.ofType=function(){return t},t.prototype.render=function(){var e=this.props,t=e.initialContent,n=void 0===t?null:t,r=(e.isOpen,e.inputProps,e.overlayProps,Object(I.__rest)(e,["initialContent","isOpen","inputProps","overlayProps"]));return g.createElement(this.TypedQueryList,Object(I.__assign)({},r,{initialContent:n,renderer:this.renderQueryList}))},t.displayName=i.DISPLAYNAME_PREFIX+".Omnibar",t}(g.PureComponent),A=function(e){function t(){var t=null!==e&&e.apply(this,arguments)||this;return t.state={isOpen:t.props.popoverProps&&t.props.popoverProps.isOpen||!1},t.TypedQueryList=E.ofType(),t.input=null,t.queryList=null,t.refHandlers={input:function(e){var n,r;t.input=e,null===(r=null===(n=t.props.tagInputProps)||void 0===n?void 0:n.inputRef)||void 0===r||r.call(n,e)},queryList:function(e){return t.queryList=e}},t.renderQueryList=function(e){var n,o=t.props,s=o.fill,l=o.tagInputProps,p=void 0===l?{}:l,u=o.popoverProps,a=void 0===u?{}:u,c=o.selectedItems,d=void 0===c?[]:c,v=o.placeholder,m=e.handlePaste,f=e.handleKeyDown,h=e.handleKeyUp;s&&(a.fill=!0,p.fill=!0);var y=Object(I.__assign)(Object(I.__assign)({},p.inputProps),{className:P()(null===(n=p.inputProps)||void 0===n?void 0:n.className,r.MULTISELECT_TAG_INPUT_INPUT)});return g.createElement(i.Popover,Object(I.__assign)({autoFocus:!1,canEscapeKeyClose:!0,enforceFocus:!1,isOpen:t.state.isOpen,position:i.Position.BOTTOM_LEFT},a,{className:P()(e.className,a.className),interactionKind:i.PopoverInteractionKind.CLICK,onInteraction:t.handlePopoverInteraction,popoverClassName:P()(r.MULTISELECT_POPOVER,a.popoverClassName),onOpened:t.handlePopoverOpened}),g.createElement("div",{onKeyDown:t.getTagInputKeyDownHandler(f),onKeyUp:t.getTagInputKeyUpHandler(h)},g.createElement(i.TagInput,Object(I.__assign)({placeholder:v},p,{className:P()(r.MULTISELECT,p.className),inputRef:t.refHandlers.input,inputProps:y,inputValue:e.query,onAdd:function(e,t){"paste"===t&&m(e)},onInputChange:e.handleQueryChange,values:d.map(t.props.tagRenderer)}))),g.createElement("div",{onKeyDown:f,onKeyUp:h},e.itemList))},t.handleItemSelect=function(e,n){var r,i;null!=t.input&&t.input.focus(),null===(i=(r=t.props).onItemSelect)||void 0===i||i.call(r,e,n)},t.handleQueryChange=function(e,n){var r,i;t.setState({isOpen:e.length>0||!t.props.openOnKeyDown}),null===(i=(r=t.props).onQueryChange)||void 0===i||i.call(r,e,n)},t.handlePopoverInteraction=function(e){return t.requestAnimationFrame((function(){var n,r,i=t.input===document.activeElement;null==t.input||i?t.props.openOnKeyDown||t.setState({isOpen:!0}):t.setState({isOpen:!1}),null===(r=null===(n=t.props.popoverProps)||void 0===n?void 0:n.onInteraction)||void 0===r||r.call(n,e)}))},t.handlePopoverOpened=function(e){var n,r;null!=t.queryList&&t.queryList.scrollActiveItemIntoView(),null===(r=null===(n=t.props.popoverProps)||void 0===n?void 0:n.onOpened)||void 0===r||r.call(n,e)},t.getTagInputKeyDownHandler=function(e){return function(n){var r=n.which;r===i.Keys.ESCAPE||r===i.Keys.TAB?(null!=t.input&&t.input.blur(),t.setState({isOpen:!1})):r!==i.Keys.BACKSPACE&&r!==i.Keys.ARROW_LEFT&&r!==i.Keys.ARROW_RIGHT&&t.setState({isOpen:!0});var o=null!=n.target.closest("."+i.Classes.TAG_REMOVE);t.state.isOpen&&!o&&(null==e||e(n))}},t.getTagInputKeyUpHandler=function(e){return function(n){var i=n.target.classList.contains(r.MULTISELECT_TAG_INPUT_INPUT);t.state.isOpen&&i&&(null==e||e(n))}},t}return Object(I.__extends)(t,e),t.ofType=function(){return t},t.prototype.render=function(){var e=this.props,t=(e.openOnKeyDown,e.popoverProps,e.tagInputProps,Object(I.__rest)(e,["openOnKeyDown","popoverProps","tagInputProps"]));return g.createElement(this.TypedQueryList,Object(I.__assign)({},t,{onItemSelect:this.handleItemSelect,onQueryChange:this.handleQueryChange,ref:this.refHandlers.queryList,renderer:this.renderQueryList}))},t.displayName=i.DISPLAYNAME_PREFIX+".MultiSelect",t.defaultProps={fill:!1,placeholder:"Search..."},t}(i.AbstractPureComponent2),S=function(e){function t(){var t,n=e.apply(this,arguments)||this;return n.state={isOpen:!1},n.TypedQueryList=E.ofType(),n.inputEl=null,n.queryList=null,n.refHandlers={input:Object(i.isRefObject)(null===(t=n.props.inputProps)||void 0===t?void 0:t.inputRef)?n.inputEl=n.props.inputProps.inputRef:function(e){var t,r;n.inputEl=e,null===(r=null===(t=n.props.inputProps)||void 0===t?void 0:t.inputRef)||void 0===r||r(e)},queryList:function(e){return n.queryList=e}},n.renderQueryList=function(e){var t=n.props,o=t.filterable,s=void 0===o||o,l=t.disabled,p=void 0!==l&&l,u=t.inputProps,a=void 0===u?{}:u,c=t.popoverProps,d=void 0===c?{}:c,v=g.createElement(i.InputGroup,Object(I.__assign)({leftIcon:"search",placeholder:"Filter...",rightElement:n.maybeRenderClearButton(e.query)},a,{inputRef:n.refHandlers.input,onChange:e.handleQueryChange,value:e.query})),m=e.handleKeyDown,f=e.handleKeyUp;return g.createElement(i.Popover,Object(I.__assign)({autoFocus:!1,enforceFocus:!1,isOpen:n.state.isOpen,disabled:p,position:i.Position.BOTTOM_LEFT},d,{className:P()(e.className,d.className),onInteraction:n.handlePopoverInteraction,popoverClassName:P()(r.SELECT_POPOVER,d.popoverClassName),onOpening:n.handlePopoverOpening,onOpened:n.handlePopoverOpened,onClosing:n.handlePopoverClosing}),g.createElement("div",{onKeyDown:n.state.isOpen?m:n.handleTargetKeyDown,onKeyUp:n.state.isOpen?f:void 0},n.props.children),g.createElement("div",{onKeyDown:m,onKeyUp:f},s?v:void 0,e.itemList))},n.handleTargetKeyDown=function(e){e.which!==i.Keys.ARROW_UP&&e.which!==i.Keys.ARROW_DOWN||(e.preventDefault(),n.setState({isOpen:!0}))},n.handleItemSelect=function(e,t){var r,i;n.setState({isOpen:!1}),null===(i=(r=n.props).onItemSelect)||void 0===i||i.call(r,e,t)},n.handlePopoverInteraction=function(e){var t,r;n.setState({isOpen:e}),null===(r=null===(t=n.props.popoverProps)||void 0===t?void 0:t.onInteraction)||void 0===r||r.call(t,e)},n.handlePopoverOpening=function(e){var t,r;n.previousFocusedElement=document.activeElement,n.props.resetOnClose&&n.resetQuery(),null===(r=null===(t=n.props.popoverProps)||void 0===t?void 0:t.onOpening)||void 0===r||r.call(t,e)},n.handlePopoverOpened=function(e){var t,r;null!=n.queryList&&n.queryList.scrollActiveItemIntoView(),n.requestAnimationFrame((function(){var e,t=n.props.inputProps;!1!==(void 0===t?{}:t).autoFocus&&(null===(e=Object(i.getRef)(n.inputEl))||void 0===e||e.focus())})),null===(r=null===(t=n.props.popoverProps)||void 0===t?void 0:t.onOpened)||void 0===r||r.call(t,e)},n.handlePopoverClosing=function(e){var t,r;n.requestAnimationFrame((function(){void 0!==n.previousFocusedElement&&(n.previousFocusedElement.focus(),n.previousFocusedElement=void 0)})),null===(r=null===(t=n.props.popoverProps)||void 0===t?void 0:t.onClosing)||void 0===r||r.call(t,e)},n.resetQuery=function(){return n.queryList&&n.queryList.setQuery("",!0)},n}return Object(I.__extends)(t,e),t.ofType=function(){return t},t.prototype.render=function(){var e=this.props,t=(e.filterable,e.inputProps,e.popoverProps,Object(I.__rest)(e,["filterable","inputProps","popoverProps"]));return g.createElement(this.TypedQueryList,Object(I.__assign)({},t,{onItemSelect:this.handleItemSelect,ref:this.refHandlers.queryList,renderer:this.renderQueryList}))},t.prototype.componentDidUpdate=function(e,t){this.state.isOpen&&!t.isOpen&&null!=this.queryList&&this.queryList.scrollActiveItemIntoView()},t.prototype.maybeRenderClearButton=function(e){return e.length>0?g.createElement(i.Button,{icon:"cross",minimal:!0,onClick:this.resetQuery}):void 0},t.displayName=i.DISPLAYNAME_PREFIX+".Select",t}(i.AbstractPureComponent2),K=function(e){function t(){var t,n=e.apply(this,arguments)||this;return n.state={isOpen:null!=n.props.popoverProps&&n.props.popoverProps.isOpen||!1,selectedItem:n.getInitialSelectedItem()},n.TypedQueryList=E.ofType(),n.inputEl=null,n.queryList=null,n.refHandlers={input:Object(i.isRefObject)(null===(t=n.props.inputProps)||void 0===t?void 0:t.inputRef)?n.inputEl=n.props.inputProps.inputRef:function(e){var t,r;n.inputEl=e,null===(r=null===(t=n.props.inputProps)||void 0===t?void 0:t.inputRef)||void 0===r||r(e)},queryList:function(e){return n.queryList=e}},n.renderQueryList=function(e){var t=n.props,o=t.fill,s=t.inputProps,l=void 0===s?{}:s,p=t.popoverProps,u=void 0===p?{}:p,a=n.state,c=a.isOpen,d=a.selectedItem,v=e.handleKeyDown,m=e.handleKeyUp,f=l.autoComplete,h=void 0===f?"off":f,y=l.placeholder,O=void 0===y?"Search...":y,E=d?n.props.inputValueRenderer(d):"",C=c&&E?E:O,_=c?e.query:E||(n.props.resetOnClose?"":e.query);return o&&(u.fill=!0,l.fill=!0),g.createElement(i.Popover,Object(I.__assign)({autoFocus:!1,enforceFocus:!1,isOpen:c,position:i.Position.BOTTOM_LEFT},u,{className:P()(e.className,u.className),interactionKind:i.PopoverInteractionKind.CLICK,onInteraction:n.handlePopoverInteraction,popoverClassName:P()(r.SELECT_POPOVER,u.popoverClassName),onOpening:n.handlePopoverOpening,onOpened:n.handlePopoverOpened}),g.createElement(i.InputGroup,Object(I.__assign)({autoComplete:h,disabled:n.props.disabled},l,{inputRef:n.refHandlers.input,onChange:e.handleQueryChange,onFocus:n.handleInputFocus,onKeyDown:n.getTargetKeyDownHandler(v),onKeyUp:n.getTargetKeyUpHandler(m),placeholder:C,value:_})),g.createElement("div",{onKeyDown:v,onKeyUp:m},e.itemList))},n.selectText=function(){n.requestAnimationFrame((function(){var e=Object(i.getRef)(n.inputEl);null==e||e.setSelectionRange(0,e.value.length)}))},n.handleInputFocus=function(e){var t,r;n.selectText(),n.props.openOnKeyDown||n.setState({isOpen:!0}),null===(r=null===(t=n.props.inputProps)||void 0===t?void 0:t.onFocus)||void 0===r||r.call(t,e)},n.handleItemSelect=function(e,t){var r,o,s,l,p;n.props.closeOnSelect?(null===(o=Object(i.getRef)(n.inputEl))||void 0===o||o.blur(),p=!1):(null===(r=Object(i.getRef)(n.inputEl))||void 0===r||r.focus(),n.selectText(),p=!0),void 0===n.props.selectedItem?n.setState({isOpen:p,selectedItem:e}):n.setState({isOpen:p}),null===(l=(s=n.props).onItemSelect)||void 0===l||l.call(s,e,t)},n.handlePopoverInteraction=function(e){return n.requestAnimationFrame((function(){var t,r,o=Object(i.getRef)(n.inputEl)===document.activeElement;null==n.inputEl||o||n.setState({isOpen:!1}),null===(r=null===(t=n.props.popoverProps)||void 0===t?void 0:t.onInteraction)||void 0===r||r.call(t,e)}))},n.handlePopoverOpening=function(e){var t,r;n.props.resetOnClose&&n.queryList&&n.queryList.setQuery("",!0),null===(r=null===(t=n.props.popoverProps)||void 0===t?void 0:t.onOpening)||void 0===r||r.call(t,e)},n.handlePopoverOpened=function(e){var t,r;null!=n.queryList&&n.queryList.scrollActiveItemIntoView(),null===(r=null===(t=n.props.popoverProps)||void 0===t?void 0:t.onOpened)||void 0===r||r.call(t,e)},n.getTargetKeyDownHandler=function(e){return function(t){var r,o,s,l=t.which;l===i.Keys.ESCAPE||l===i.Keys.TAB?(null===(r=Object(i.getRef)(n.inputEl))||void 0===r||r.blur(),n.setState({isOpen:!1})):n.props.openOnKeyDown&&l!==i.Keys.BACKSPACE&&l!==i.Keys.ARROW_LEFT&&l!==i.Keys.ARROW_RIGHT&&n.setState({isOpen:!0}),n.state.isOpen&&(null==e||e(t)),null===(s=null===(o=n.props.inputProps)||void 0===o?void 0:o.onKeyDown)||void 0===s||s.call(o,t)}},n.getTargetKeyUpHandler=function(e){return function(t){var r,i;n.state.isOpen&&(null==e||e(t)),null===(i=null===(r=n.props.inputProps)||void 0===r?void 0:r.onKeyUp)||void 0===i||i.call(r,t)}},n}return Object(I.__extends)(t,e),t.ofType=function(){return t},t.prototype.render=function(){var e,t=this.props,n=(t.disabled,t.inputProps,t.popoverProps,Object(I.__rest)(t,["disabled","inputProps","popoverProps"]));return g.createElement(this.TypedQueryList,Object(I.__assign)({},n,{initialActiveItem:null!==(e=this.props.selectedItem)&&void 0!==e?e:void 0,onItemSelect:this.handleItemSelect,ref:this.refHandlers.queryList,renderer:this.renderQueryList}))},t.prototype.componentDidUpdate=function(e,t){var n,r,o=this;void 0!==this.props.selectedItem&&this.props.selectedItem!==this.state.selectedItem&&this.setState({selectedItem:this.props.selectedItem}),!1===this.state.isOpen&&!0===t.isOpen&&setTimeout((function(){o.maybeResetActiveItemToSelectedItem()}),null!==(r=null===(n=this.props.popoverProps)||void 0===n?void 0:n.transitionDuration)&&void 0!==r?r:i.Popover.defaultProps.transitionDuration),this.state.isOpen&&!t.isOpen&&null!=this.queryList&&this.queryList.scrollActiveItemIntoView()},t.prototype.getInitialSelectedItem=function(){return void 0!==this.props.selectedItem?this.props.selectedItem:void 0!==this.props.defaultSelectedItem?this.props.defaultSelectedItem:null},t.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)},t.displayName=i.DISPLAYNAME_PREFIX+".Suggest",t.defaultProps={closeOnSelect:!0,fill:!1,openOnKeyDown:!1,resetOnClose:!1},t}(i.AbstractPureComponent2)}])}));
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("@blueprintjs/core"),require("tslib"),require("react"),require("classnames")):"function"==typeof define&&define.amd?define(["@blueprintjs/core","tslib","react","classnames"],t):"object"==typeof exports?exports.Select=t(require("@blueprintjs/core"),require("tslib"),require("react"),require("classnames")):(e.Blueprint=e.Blueprint||{},e.Blueprint.Select=t(e.Blueprint.Core,e.window,e.React,e.classNames))}(window,(function(e,t,n,r){return function(e){var t={};function n(r){if(t[r])return t[r].exports;var i=t[r]={i:r,l:!1,exports:{}};return e[r].call(i.exports,i,i.exports,n),i.l=!0,i.exports}return n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var i in e)n.d(r,i,function(t){return e[t]}.bind(null,i));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=6)}([function(t,n){t.exports=e},function(e,n){e.exports=t},function(e,t){e.exports=n},function(e,t){e.exports=r},,,function(e,t,n){e.exports=n(7)},function(e,t,n){"use strict";n.r(t),n.d(t,"Classes",(function(){return r})),n.d(t,"renderFilteredItems",(function(){return v})),n.d(t,"executeItemsEqual",(function(){return m})),n.d(t,"getCreateNewItem",(function(){return f})),n.d(t,"isCreateNewItem",(function(){return h})),n.d(t,"getActiveItem",(function(){return y})),n.d(t,"Omnibar",(function(){return L})),n.d(t,"QueryList",(function(){return C})),n.d(t,"getFirstEnabledItem",(function(){return T})),n.d(t,"MultiSelect",(function(){return A})),n.d(t,"Select",(function(){return S})),n.d(t,"Suggest",(function(){return K}));var r={};n.r(r),n.d(r,"MULTISELECT",(function(){return s})),n.d(r,"MULTISELECT_POPOVER",(function(){return l})),n.d(r,"MULTISELECT_TAG_INPUT_INPUT",(function(){return p})),n.d(r,"OMNIBAR",(function(){return u})),n.d(r,"OMNIBAR_OVERLAY",(function(){return a})),n.d(r,"SELECT",(function(){return c})),n.d(r,"SELECT_POPOVER",(function(){return d}));var i=n(0),o=i.Classes.getClassNamespace(),s=o+"-multi-select",l=s+"-popover",p=s+"-tag-input-input",u=o+"-omnibar",a=u+"-overlay",c=o+"-select",d=c+"-popover";function v(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 m(e,t,n){return void 0===e||null==t||null==n?t===n:i.Utils.isFunction(e)?e(t,n):t[e]===n[e]}function f(){return{__blueprintCreateNewItemBrand:"blueprint-create-new-item"}}function h(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 y(e){return null==e||h(e)?null:e}var I=n(1),O=n(3),P=n.n(O),g=n(2),C=function(e){function t(t,n){var r,o,s=e.call(this,t,n)||this;s.refHandlers={itemsParent:function(e){return s.itemsParentRef=e}},s.shouldCheckActiveItemInViewport=!1,s.expectedNextActiveItem=null,s.isEnterKeyPressed=!1,s.renderItemList=function(e){var t=s.props,n=t.initialContent,r=t.noResults,o=e.renderCreateItem(),l=v(e,null!=o?null:r,n);if(null==l&&null==o)return null;var p=s.isCreateItemFirst();return g.createElement(i.Menu,{ulRef:e.itemsParentRef},p&&o,l,!p&&o)},s.renderItem=function(e,t){if(!0!==s.props.disabled){var n=s.state,r=n.activeItem,i=n.query,o=s.state.filteredItems.indexOf(e)>=0,l={active:m(s.props.itemsEqual,y(r),e),disabled:R(e,t,s.props.itemDisabled),matchesPredicate:o};return s.props.itemRenderer(e,{handleClick:function(t){return s.handleItemSelect(e,t)},index:t,modifiers:l,query:i})}return null},s.renderCreateItemMenuItem=function(){if(s.isCreateItemRendered()){var e=s.state,t=e.activeItem,n=e.query.trim(),r=h(t);return s.props.createNewItemRenderer(n,r,(function(e){s.handleItemCreate(n,e)}))}return null},s.handleItemCreate=function(e,t){var n,r,i,o,l=null===(r=(n=s.props).createNewItemFromQuery)||void 0===r?void 0:r.call(n,e);null!=l&&(null===(o=(i=s.props).onItemSelect)||void 0===o||o.call(i,l,t),s.maybeResetQuery())},s.handleItemSelect=function(e,t){var n,r;s.setActiveItem(e),null===(r=(n=s.props).onItemSelect)||void 0===r||r.call(n,e,t),s.maybeResetQuery()},s.handlePaste=function(e){for(var t,n=s.props,r=n.createNewItemFromQuery,i=n.onItemsPaste,o=[],l=[],p=0,u=e;p<u.length;p++){var a=u[p],c=_(a,s.props);if(void 0!==c)t=c,l.push(c);else if(s.canCreateItems()){var d=null==r?void 0:r(a);void 0!==d&&l.push(d)}else o.push(a)}s.setQuery(o.join(", "),!1),void 0!==t&&s.setActiveItem(t),null==i||i(l)},s.handleKeyDown=function(e){var t,n,r=e.keyCode;if(r===i.Keys.ARROW_UP||r===i.Keys.ARROW_DOWN){e.preventDefault();var o=s.getNextActiveItem(r===i.Keys.ARROW_UP?-1:1);null!=o&&s.setActiveItem(o)}else r===i.Keys.ENTER&&(s.isEnterKeyPressed=!0);null===(n=(t=s.props).onKeyDown)||void 0===n||n.call(t,e)},s.handleKeyUp=function(e){var t=s.props.onKeyUp,n=s.state.activeItem;e.keyCode===i.Keys.ENTER&&s.isEnterKeyPressed&&(e.preventDefault(),null==n||h(n)?s.handleItemCreate(s.state.query,e):s.handleItemSelect(n,e),s.isEnterKeyPressed=!1),null==t||t(e)},s.handleInputQueryChange=function(e){var t,n,r=null==e?"":e.target.value;s.setQuery(r),null===(n=(t=s.props).onQueryChange)||void 0===n||n.call(t,r,e)};var l=t.query,p=void 0===l?"":l,u=null===(r=t.createNewItemFromQuery)||void 0===r?void 0:r.call(t,p),a=b(p,t);return s.state={activeItem:void 0!==t.activeItem?t.activeItem:null!==(o=t.initialActiveItem)&&void 0!==o?o:T(a,t.itemDisabled),createNewItem:u,filteredItems:a,query:p},s}return Object(I.__extends)(t,e),t.ofType=function(){return t},t.prototype.render=function(){var e=this.props,t=e.className,n=e.items,r=e.renderer,i=e.itemListRenderer,o=void 0===i?this.renderItemList:i,s=this.state,l=(s.createNewItem,Object(I.__rest)(s,["createNewItem"]));return r(Object(I.__assign)(Object(I.__assign)({},l),{className:t,handleItemSelect:this.handleItemSelect,handleKeyDown:this.handleKeyDown,handleKeyUp:this.handleKeyUp,handlePaste:this.handlePaste,handleQueryChange:this.handleInputQueryChange,itemList:o(Object(I.__assign)(Object(I.__assign)({},l),{items:n,itemsParentRef:this.refHandlers.itemsParent,renderCreateItem:this.renderCreateItemMenuItem,renderItem:this.renderItem}))}))},t.prototype.componentDidUpdate=function(e){var t=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):i.Utils.shallowCompareKeys(this.props,e,{include:["items","itemListPredicate","itemPredicate"]})||this.setQuery(this.state.query),this.shouldCheckActiveItemInViewport&&(this.requestAnimationFrame((function(){return t.scrollActiveItemIntoView()})),this.shouldCheckActiveItemInViewport=!1)},t.prototype.scrollActiveItemIntoView=function(){var e=!1!==this.props.scrollToActiveItem,t=!m(this.props.itemsEqual,y(this.expectedNextActiveItem),y(this.props.activeItem));if(this.expectedNextActiveItem=null,e||!t){var n=this.getActiveElement();if(null!=this.itemsParentRef&&null!=n){var r=n.offsetTop,i=n.offsetHeight,o=this.itemsParentRef,s=o.offsetTop,l=o.scrollTop,p=o.clientHeight,u=this.getItemsParentPadding(),a=u.paddingTop,c=r+i+u.paddingBottom-s,d=r-a-s;c>=l+p?this.itemsParentRef.scrollTop=c+i-p:d<=l&&(this.itemsParentRef.scrollTop=d-i)}}},t.prototype.setQuery=function(e,t,n){var r;void 0===t&&(t=this.props.resetOnQuery),void 0===n&&(n=this.props);var i=n.createNewItemFromQuery;this.shouldCheckActiveItemInViewport=!0,e!==this.state.query&&(null===(r=n.onQueryChange)||void 0===r||r.call(n,e));var o=e.trim(),s=b(o,n),l=null!=i&&""!==o?i(o):void 0;this.setState({createNewItem:l,filteredItems:s,query:e});var p=this.getActiveIndex(s);(t||p<0||R(y(this.state.activeItem),p,n.itemDisabled))&&(this.isCreateItemRendered()&&this.isCreateItemFirst()?this.setActiveItem({__blueprintCreateNewItemBrand:"blueprint-create-new-item"}):this.setActiveItem(T(s,n.itemDisabled)))},t.prototype.setActiveItem=function(e){var t,n,r,i;this.expectedNextActiveItem=e,void 0===this.props.activeItem&&(this.shouldCheckActiveItemInViewport=!0,this.setState({activeItem:e})),h(e)?null===(n=(t=this.props).onActiveItemChange)||void 0===n||n.call(t,null,!0):null===(i=(r=this.props).onActiveItemChange)||void 0===i||i.call(r,e,!1)},t.prototype.getActiveElement=function(){var e=this.state.activeItem;if(null!=this.itemsParentRef){if(h(e)){var t=this.isCreateItemFirst()?0:this.state.filteredItems.length;return this.itemsParentRef.children.item(t)}var n=this.getActiveIndex();return this.itemsParentRef.children.item(n)}},t.prototype.getActiveIndex=function(e){void 0===e&&(e=this.state.filteredItems);var t=this.state.activeItem;if(null==t||h(t))return-1;for(var n=0;n<e.length;++n)if(m(this.props.itemsEqual,e[n],t))return n;return-1},t.prototype.getItemsParentPadding=function(){var e=getComputedStyle(this.itemsParentRef),t=e.paddingTop;return{paddingBottom:E(e.paddingBottom),paddingTop:E(t)}},t.prototype.getNextActiveItem=function(e,t){if((void 0===t&&(t=this.getActiveIndex()),this.isCreateItemRendered())&&(0===t&&-1===e||t===this.state.filteredItems.length-1&&1===e))return{__blueprintCreateNewItemBrand:"blueprint-create-new-item"};return T(this.state.filteredItems,this.props.itemDisabled,e,t)},t.prototype.isCreateItemRendered=function(){return this.canCreateItems()&&""!==this.state.query&&!this.wouldCreatedItemMatchSomeExistingItem()},t.prototype.isCreateItemFirst=function(){return"first"===this.props.createNewItemPosition},t.prototype.canCreateItems=function(){return null!=this.props.createNewItemFromQuery&&null!=this.props.createNewItemRenderer},t.prototype.wouldCreatedItemMatchSomeExistingItem=function(){var e=this;return this.state.filteredItems.some((function(t){return m(e.props.itemsEqual,t,e.state.createNewItem)}))},t.prototype.maybeResetQuery=function(){this.props.resetOnSelect&&this.setQuery("",!0)},t.displayName=i.DISPLAYNAME_PREFIX+".QueryList",t.defaultProps={disabled:!1,resetOnQuery:!0},t}(i.AbstractComponent2);function E(e){return null==e?0:parseInt(e.slice(0,-2),10)}function _(e,t){var n=t.items,r=t.itemPredicate;if(i.Utils.isFunction(r))for(var o=0;o<n.length;o++){var s=n[o];if(r(e,s,o,!0))return s}}function b(e,t){var n=t.items,r=t.itemPredicate,o=t.itemListPredicate;return i.Utils.isFunction(o)?o(e,n):i.Utils.isFunction(r)?n.filter((function(t,n){return r(e,t,n)})):n}function R(e,t,n){return null!=n&&null!=e&&(i.Utils.isFunction(n)?n(e,t):!!e[n])}function T(e,t,n,r){if(void 0===n&&(n=1),void 0===r&&(r=e.length-1),0===e.length)return null;var i,o,s,l=r,p=e.length-1;do{if(s=p,!R(e[l=(i=l+n)<(o=0)?s:i>s?o:i],l,t))return e[l]}while(l!==r&&-1!==r);return null}var L=function(e){function t(){var t=null!==e&&e.apply(this,arguments)||this;return t.TypedQueryList=C.ofType(),t.renderQueryList=function(e){var n=t.props,o=n.inputProps,s=void 0===o?{}:o,l=n.isOpen,p=n.overlayProps,u=void 0===p?{}:p,a=e.handleKeyDown,c=e.handleKeyUp,d=l?{onKeyDown:a,onKeyUp:c}:{};return g.createElement(i.Overlay,Object(I.__assign)({hasBackdrop:!0},u,{isOpen:l,className:P()(r.OMNIBAR_OVERLAY,u.className),onClose:t.handleOverlayClose}),g.createElement("div",Object(I.__assign)({className:P()(r.OMNIBAR,e.className)},d),g.createElement(i.InputGroup,Object(I.__assign)({autoFocus:!0,large:!0,leftIcon:"search",placeholder:"Search..."},s,{onChange:e.handleQueryChange,value:e.query})),e.itemList))},t.handleOverlayClose=function(e){var n,r,i,o;null===(r=null===(n=t.props.overlayProps)||void 0===n?void 0:n.onClose)||void 0===r||r.call(n,e),null===(o=(i=t.props).onClose)||void 0===o||o.call(i,e)},t}return Object(I.__extends)(t,e),t.ofType=function(){return t},t.prototype.render=function(){var e=this.props,t=(e.isOpen,e.inputProps,e.overlayProps,Object(I.__rest)(e,["isOpen","inputProps","overlayProps"])),n="initialContent"in this.props?this.props.initialContent:null;return g.createElement(this.TypedQueryList,Object(I.__assign)({},t,{initialContent:n,renderer:this.renderQueryList}))},t.displayName=i.DISPLAYNAME_PREFIX+".Omnibar",t}(g.PureComponent),A=function(e){function t(){var t=null!==e&&e.apply(this,arguments)||this;return t.state={isOpen:t.props.popoverProps&&t.props.popoverProps.isOpen||!1},t.TypedQueryList=C.ofType(),t.input=null,t.queryList=null,t.refHandlers={input:function(e){var n,r;t.input=e,null===(r=null===(n=t.props.tagInputProps)||void 0===n?void 0:n.inputRef)||void 0===r||r.call(n,e)},queryList:function(e){return t.queryList=e}},t.renderQueryList=function(e){var n,o=t.props,s=o.fill,l=o.tagInputProps,p=void 0===l?{}:l,u=o.popoverProps,a=void 0===u?{}:u,c=o.selectedItems,d=void 0===c?[]:c,v=o.placeholder,m=e.handlePaste,f=e.handleKeyDown,h=e.handleKeyUp;s&&(a.fill=!0,p.fill=!0);var y=Object(I.__assign)(Object(I.__assign)({},p.inputProps),{className:P()(null===(n=p.inputProps)||void 0===n?void 0:n.className,r.MULTISELECT_TAG_INPUT_INPUT)});return g.createElement(i.Popover,Object(I.__assign)({autoFocus:!1,canEscapeKeyClose:!0,enforceFocus:!1,isOpen:t.state.isOpen,position:i.Position.BOTTOM_LEFT},a,{className:P()(e.className,a.className),interactionKind:i.PopoverInteractionKind.CLICK,onInteraction:t.handlePopoverInteraction,popoverClassName:P()(r.MULTISELECT_POPOVER,a.popoverClassName),onOpened:t.handlePopoverOpened}),g.createElement("div",{onKeyDown:t.getTagInputKeyDownHandler(f),onKeyUp:t.getTagInputKeyUpHandler(h)},g.createElement(i.TagInput,Object(I.__assign)({placeholder:v},p,{className:P()(r.MULTISELECT,p.className),inputRef:t.refHandlers.input,inputProps:y,inputValue:e.query,onAdd:function(e,t){"paste"===t&&m(e)},onInputChange:e.handleQueryChange,onRemove:t.handleTagRemove,values:d.map(t.props.tagRenderer)}))),g.createElement("div",{onKeyDown:f,onKeyUp:h},e.itemList))},t.handleItemSelect=function(e,n){var r,i;null!=t.input&&t.input.focus(),null===(i=(r=t.props).onItemSelect)||void 0===i||i.call(r,e,n)},t.handleQueryChange=function(e,n){var r,i;t.setState({isOpen:e.length>0||!t.props.openOnKeyDown}),null===(i=(r=t.props).onQueryChange)||void 0===i||i.call(r,e,n)},t.handlePopoverInteraction=function(e){return t.requestAnimationFrame((function(){var n,r,i=t.input===document.activeElement;null==t.input||i?t.props.openOnKeyDown||t.setState({isOpen:!0}):t.setState({isOpen:!1}),null===(r=null===(n=t.props.popoverProps)||void 0===n?void 0:n.onInteraction)||void 0===r||r.call(n,e)}))},t.handlePopoverOpened=function(e){var n,r;null!=t.queryList&&t.queryList.scrollActiveItemIntoView(),null===(r=null===(n=t.props.popoverProps)||void 0===n?void 0:n.onOpened)||void 0===r||r.call(n,e)},t.handleTagRemove=function(e,n){var r,i=t.props,o=i.selectedItems,s=void 0===o?[]:o,l=i.onRemove,p=i.tagInputProps;null==l||l(s[n],n),null===(r=null==p?void 0:p.onRemove)||void 0===r||r.call(p,e,n)},t.getTagInputKeyDownHandler=function(e){return function(n){var r=n.which;r===i.Keys.ESCAPE||r===i.Keys.TAB?(null!=t.input&&t.input.blur(),t.setState({isOpen:!1})):r!==i.Keys.BACKSPACE&&r!==i.Keys.ARROW_LEFT&&r!==i.Keys.ARROW_RIGHT&&t.setState({isOpen:!0});var o=null!=n.target.closest("."+i.Classes.TAG_REMOVE);t.state.isOpen&&!o&&(null==e||e(n))}},t.getTagInputKeyUpHandler=function(e){return function(n){var i=n.target.classList.contains(r.MULTISELECT_TAG_INPUT_INPUT);t.state.isOpen&&i&&(null==e||e(n))}},t}return Object(I.__extends)(t,e),t.ofType=function(){return t},t.prototype.render=function(){var e=this.props,t=(e.openOnKeyDown,e.popoverProps,e.tagInputProps,Object(I.__rest)(e,["openOnKeyDown","popoverProps","tagInputProps"]));return g.createElement(this.TypedQueryList,Object(I.__assign)({},t,{onItemSelect:this.handleItemSelect,onQueryChange:this.handleQueryChange,ref:this.refHandlers.queryList,renderer:this.renderQueryList}))},t.displayName=i.DISPLAYNAME_PREFIX+".MultiSelect",t.defaultProps={fill:!1,placeholder:"Search..."},t}(i.AbstractPureComponent2),S=function(e){function t(){var t,n=e.apply(this,arguments)||this;return n.state={isOpen:!1},n.TypedQueryList=C.ofType(),n.inputEl=null,n.queryList=null,n.refHandlers={input:Object(i.isRefObject)(null===(t=n.props.inputProps)||void 0===t?void 0:t.inputRef)?n.inputEl=n.props.inputProps.inputRef:function(e){var t,r;n.inputEl=e,null===(r=null===(t=n.props.inputProps)||void 0===t?void 0:t.inputRef)||void 0===r||r(e)},queryList:function(e){return n.queryList=e}},n.renderQueryList=function(e){var t=n.props,o=t.filterable,s=void 0===o||o,l=t.disabled,p=void 0!==l&&l,u=t.inputProps,a=void 0===u?{}:u,c=t.popoverProps,d=void 0===c?{}:c,v=g.createElement(i.InputGroup,Object(I.__assign)({leftIcon:"search",placeholder:"Filter...",rightElement:n.maybeRenderClearButton(e.query)},a,{inputRef:n.refHandlers.input,onChange:e.handleQueryChange,value:e.query})),m=e.handleKeyDown,f=e.handleKeyUp;return g.createElement(i.Popover,Object(I.__assign)({autoFocus:!1,enforceFocus:!1,isOpen:n.state.isOpen,disabled:p,position:i.Position.BOTTOM_LEFT},d,{className:P()(e.className,d.className),onInteraction:n.handlePopoverInteraction,popoverClassName:P()(r.SELECT_POPOVER,d.popoverClassName),onOpening:n.handlePopoverOpening,onOpened:n.handlePopoverOpened,onClosing:n.handlePopoverClosing}),g.createElement("div",{onKeyDown:n.state.isOpen?m:n.handleTargetKeyDown,onKeyUp:n.state.isOpen?f:void 0},n.props.children),g.createElement("div",{onKeyDown:m,onKeyUp:f},s?v:void 0,e.itemList))},n.handleTargetKeyDown=function(e){e.which!==i.Keys.ARROW_UP&&e.which!==i.Keys.ARROW_DOWN||(e.preventDefault(),n.setState({isOpen:!0}))},n.handleItemSelect=function(e,t){var r,i;n.setState({isOpen:!1}),null===(i=(r=n.props).onItemSelect)||void 0===i||i.call(r,e,t)},n.handlePopoverInteraction=function(e){var t,r;n.setState({isOpen:e}),null===(r=null===(t=n.props.popoverProps)||void 0===t?void 0:t.onInteraction)||void 0===r||r.call(t,e)},n.handlePopoverOpening=function(e){var t,r;n.previousFocusedElement=document.activeElement,n.props.resetOnClose&&n.resetQuery(),null===(r=null===(t=n.props.popoverProps)||void 0===t?void 0:t.onOpening)||void 0===r||r.call(t,e)},n.handlePopoverOpened=function(e){var t,r;null!=n.queryList&&n.queryList.scrollActiveItemIntoView(),n.requestAnimationFrame((function(){var e,t=n.props.inputProps;!1!==(void 0===t?{}:t).autoFocus&&(null===(e=Object(i.getRef)(n.inputEl))||void 0===e||e.focus())})),null===(r=null===(t=n.props.popoverProps)||void 0===t?void 0:t.onOpened)||void 0===r||r.call(t,e)},n.handlePopoverClosing=function(e){var t,r;n.requestAnimationFrame((function(){void 0!==n.previousFocusedElement&&(n.previousFocusedElement.focus(),n.previousFocusedElement=void 0)})),null===(r=null===(t=n.props.popoverProps)||void 0===t?void 0:t.onClosing)||void 0===r||r.call(t,e)},n.resetQuery=function(){return n.queryList&&n.queryList.setQuery("",!0)},n}return Object(I.__extends)(t,e),t.ofType=function(){return t},t.prototype.render=function(){var e=this.props,t=(e.filterable,e.inputProps,e.popoverProps,Object(I.__rest)(e,["filterable","inputProps","popoverProps"]));return g.createElement(this.TypedQueryList,Object(I.__assign)({},t,{onItemSelect:this.handleItemSelect,ref:this.refHandlers.queryList,renderer:this.renderQueryList}))},t.prototype.componentDidUpdate=function(e,t){this.state.isOpen&&!t.isOpen&&null!=this.queryList&&this.queryList.scrollActiveItemIntoView()},t.prototype.maybeRenderClearButton=function(e){return e.length>0?g.createElement(i.Button,{icon:"cross",minimal:!0,onClick:this.resetQuery}):void 0},t.displayName=i.DISPLAYNAME_PREFIX+".Select",t}(i.AbstractPureComponent2),K=function(e){function t(){var t,n=e.apply(this,arguments)||this;return n.state={isOpen:null!=n.props.popoverProps&&n.props.popoverProps.isOpen||!1,selectedItem:n.getInitialSelectedItem()},n.TypedQueryList=C.ofType(),n.inputEl=null,n.queryList=null,n.refHandlers={input:Object(i.isRefObject)(null===(t=n.props.inputProps)||void 0===t?void 0:t.inputRef)?n.inputEl=n.props.inputProps.inputRef:function(e){var t,r;n.inputEl=e,null===(r=null===(t=n.props.inputProps)||void 0===t?void 0:t.inputRef)||void 0===r||r(e)},queryList:function(e){return n.queryList=e}},n.renderQueryList=function(e){var t=n.props,o=t.fill,s=t.inputProps,l=void 0===s?{}:s,p=t.popoverProps,u=void 0===p?{}:p,a=n.state,c=a.isOpen,d=a.selectedItem,v=e.handleKeyDown,m=e.handleKeyUp,f=l.autoComplete,h=void 0===f?"off":f,y=l.placeholder,O=void 0===y?"Search...":y,C=d?n.props.inputValueRenderer(d):"",E=c&&C?C:O,_=c?e.query:C||(n.props.resetOnClose?"":e.query);return o&&(u.fill=!0,l.fill=!0),g.createElement(i.Popover,Object(I.__assign)({autoFocus:!1,enforceFocus:!1,isOpen:c,position:i.Position.BOTTOM_LEFT},u,{className:P()(e.className,u.className),interactionKind:i.PopoverInteractionKind.CLICK,onInteraction:n.handlePopoverInteraction,popoverClassName:P()(r.SELECT_POPOVER,u.popoverClassName),onOpening:n.handlePopoverOpening,onOpened:n.handlePopoverOpened}),g.createElement(i.InputGroup,Object(I.__assign)({autoComplete:h,disabled:n.props.disabled},l,{inputRef:n.refHandlers.input,onChange:e.handleQueryChange,onFocus:n.handleInputFocus,onKeyDown:n.getTargetKeyDownHandler(v),onKeyUp:n.getTargetKeyUpHandler(m),placeholder:E,value:_})),g.createElement("div",{onKeyDown:v,onKeyUp:m},e.itemList))},n.selectText=function(){n.requestAnimationFrame((function(){var e=Object(i.getRef)(n.inputEl);null==e||e.setSelectionRange(0,e.value.length)}))},n.handleInputFocus=function(e){var t,r;n.selectText(),n.props.openOnKeyDown||n.setState({isOpen:!0}),null===(r=null===(t=n.props.inputProps)||void 0===t?void 0:t.onFocus)||void 0===r||r.call(t,e)},n.handleItemSelect=function(e,t){var r,o,s,l,p;n.props.closeOnSelect?(null===(o=Object(i.getRef)(n.inputEl))||void 0===o||o.blur(),p=!1):(null===(r=Object(i.getRef)(n.inputEl))||void 0===r||r.focus(),n.selectText(),p=!0),void 0===n.props.selectedItem?n.setState({isOpen:p,selectedItem:e}):n.setState({isOpen:p}),null===(l=(s=n.props).onItemSelect)||void 0===l||l.call(s,e,t)},n.handlePopoverInteraction=function(e){return n.requestAnimationFrame((function(){var t,r,o=Object(i.getRef)(n.inputEl)===document.activeElement;null==n.inputEl||o||n.setState({isOpen:!1}),null===(r=null===(t=n.props.popoverProps)||void 0===t?void 0:t.onInteraction)||void 0===r||r.call(t,e)}))},n.handlePopoverOpening=function(e){var t,r;n.props.resetOnClose&&n.queryList&&n.queryList.setQuery("",!0),null===(r=null===(t=n.props.popoverProps)||void 0===t?void 0:t.onOpening)||void 0===r||r.call(t,e)},n.handlePopoverOpened=function(e){var t,r;null!=n.queryList&&n.queryList.scrollActiveItemIntoView(),null===(r=null===(t=n.props.popoverProps)||void 0===t?void 0:t.onOpened)||void 0===r||r.call(t,e)},n.getTargetKeyDownHandler=function(e){return function(t){var r,o,s,l=t.which;l===i.Keys.ESCAPE||l===i.Keys.TAB?(null===(r=Object(i.getRef)(n.inputEl))||void 0===r||r.blur(),n.setState({isOpen:!1})):n.props.openOnKeyDown&&l!==i.Keys.BACKSPACE&&l!==i.Keys.ARROW_LEFT&&l!==i.Keys.ARROW_RIGHT&&n.setState({isOpen:!0}),n.state.isOpen&&(null==e||e(t)),null===(s=null===(o=n.props.inputProps)||void 0===o?void 0:o.onKeyDown)||void 0===s||s.call(o,t)}},n.getTargetKeyUpHandler=function(e){return function(t){var r,i;n.state.isOpen&&(null==e||e(t)),null===(i=null===(r=n.props.inputProps)||void 0===r?void 0:r.onKeyUp)||void 0===i||i.call(r,t)}},n}return Object(I.__extends)(t,e),t.ofType=function(){return t},t.prototype.render=function(){var e,t=this.props,n=(t.disabled,t.inputProps,t.popoverProps,Object(I.__rest)(t,["disabled","inputProps","popoverProps"]));return g.createElement(this.TypedQueryList,Object(I.__assign)({},n,{initialActiveItem:null!==(e=this.props.selectedItem)&&void 0!==e?e:void 0,onItemSelect:this.handleItemSelect,ref:this.refHandlers.queryList,renderer:this.renderQueryList}))},t.prototype.componentDidUpdate=function(e,t){var n,r,o=this;void 0!==this.props.selectedItem&&this.props.selectedItem!==this.state.selectedItem&&this.setState({selectedItem:this.props.selectedItem}),!1===this.state.isOpen&&!0===t.isOpen&&setTimeout((function(){o.maybeResetActiveItemToSelectedItem()}),null!==(r=null===(n=this.props.popoverProps)||void 0===n?void 0:n.transitionDuration)&&void 0!==r?r:i.Popover.defaultProps.transitionDuration),this.state.isOpen&&!t.isOpen&&null!=this.queryList&&this.queryList.scrollActiveItemIntoView()},t.prototype.getInitialSelectedItem=function(){return void 0!==this.props.selectedItem?this.props.selectedItem:void 0!==this.props.defaultSelectedItem?this.props.defaultSelectedItem:null},t.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)},t.displayName=i.DISPLAYNAME_PREFIX+".Suggest",t.defaultProps={closeOnSelect:!0,fill:!1,openOnKeyDown:!1,resetOnClose:!1},t}(i.AbstractPureComponent2)}])}));

lib/cjs/common/listItemsProps.d.ts

@@ -146,2 +146,8 @@ /// <reference types="react" />
     /**
+     * Determines the position of the `createNewItem` within the list: first or
+     * last. Only relevant when `createNewItemRenderer` is defined.
+     * @default 'last'
+     */
+    createNewItemPosition?: "first" | "last";
+    /**
      * Whether the active item should be reset to the first matching item _every
@@ -148,0 +154,0 @@ * time the query changes_ (via prop or by user input).

lib/cjs/components/omnibar/omnibar.js

@@ -51,3 +51,4 @@ "use strict";
         // omit props specific to this component, spread the rest.
-        var _a = this.props, _b = _a.initialContent, initialContent = _b === void 0 ? null : _b, isOpen = _a.isOpen, inputProps = _a.inputProps, overlayProps = _a.overlayProps, restProps = tslib_1.__rest(_a, ["initialContent", "isOpen", "inputProps", "overlayProps"]);
+        var _a = this.props, isOpen = _a.isOpen, inputProps = _a.inputProps, overlayProps = _a.overlayProps, restProps = tslib_1.__rest(_a, ["isOpen", "inputProps", "overlayProps"]);
+        var initialContent = "initialContent" in this.props ? this.props.initialContent : null;
         return React.createElement(this.TypedQueryList, tslib_1.__assign({}, restProps, { initialContent: initialContent, renderer: this.renderQueryList }));
@@ -54,0 +55,0 @@ };

lib/cjs/components/query-list/queryList.d.ts

@@ -159,2 +159,3 @@ import * as React from "react";
     private isCreateItemRendered;
+    private isCreateItemFirst;
     private canCreateItems;
@@ -161,0 +162,0 @@ private wouldCreatedItemMatchSomeExistingItem;

lib/cjs/components/query-list/queryList.js

@@ -67,5 +67,7 @@ "use strict";
             }
+            var createFirst = _this.isCreateItemFirst();
             return (React.createElement(core_1.Menu, { ulRef: listProps.itemsParentRef },
+                createFirst && createItemView,
                 menuContent,
-                createItemView));
+                !createFirst && createItemView));
         };
@@ -292,3 +294,9 @@ /** wrapper around `itemRenderer` to inject props */
         if (shouldUpdateActiveItem) {
-            this.setActiveItem(getFirstEnabledItem(filteredItems, props.itemDisabled));
+            // if the `createNewItem` is first, that should be the first active item.
+            if (this.isCreateItemRendered() && this.isCreateItemFirst()) {
+                this.setActiveItem(common_1.getCreateNewItem());
+            }
+            else {
+                this.setActiveItem(getFirstEnabledItem(filteredItems, props.itemDisabled));
+            }
         }
@@ -315,3 +323,4 @@ };
             if (common_1.isCreateNewItem(activeItem)) {
-                return this.itemsParentRef.children.item(this.state.filteredItems.length);
+                var index = this.isCreateItemFirst() ? 0 : this.state.filteredItems.length;
+                return this.itemsParentRef.children.item(index);
             }
@@ -372,2 +381,5 @@ else {
     };
+    QueryList.prototype.isCreateItemFirst = function () {
+        return this.props.createNewItemPosition === "first";
+    };
     QueryList.prototype.canCreateItems = function () {
@@ -374,0 +386,0 @@ return this.props.createNewItemFromQuery != null && this.props.createNewItemRenderer != null;

lib/cjs/components/select/multiSelect.d.ts

@@ -11,2 +11,11 @@ import * as React from "react";
     /**
+     * Callback invoked when an item is removed from the selection by
+     * removing its tag in the TagInput. This is generally more useful than
+     * `tagInputProps.onRemove`  because it receives the removed value instead of
+     * the value's rendered `ReactNode` tag.
+     *
+     * It is not recommended to supply _both_ this prop and `tagInputProps.onRemove`.
+     */
+    onRemove?: (value: T, index: number) => void;
+    /**
      * If true, the component waits until a keydown event in the TagInput
@@ -59,4 +68,5 @@ * before opening its popover.
     private handlePopoverOpened;
+    private handleTagRemove;
     private getTagInputKeyDownHandler;
     private getTagInputKeyUpHandler;
 }

lib/cjs/components/select/multiSelect.js

@@ -59,3 +59,3 @@ "use strict";
                 React.createElement("div", { onKeyDown: _this.getTagInputKeyDownHandler(handleKeyDown), onKeyUp: _this.getTagInputKeyUpHandler(handleKeyUp) },
-                    React.createElement(core_1.TagInput, tslib_1.__assign({ placeholder: placeholder }, tagInputProps, { className: classnames_1.default(common_1.Classes.MULTISELECT, tagInputProps.className), inputRef: _this.refHandlers.input, inputProps: inputProps, inputValue: listProps.query, onAdd: handleTagInputAdd, onInputChange: listProps.handleQueryChange, values: selectedItems.map(_this.props.tagRenderer) }))),
+                    React.createElement(core_1.TagInput, tslib_1.__assign({ placeholder: placeholder }, tagInputProps, { className: classnames_1.default(common_1.Classes.MULTISELECT, tagInputProps.className), inputRef: _this.refHandlers.input, inputProps: inputProps, inputValue: listProps.query, onAdd: handleTagInputAdd, onInputChange: listProps.handleQueryChange, onRemove: _this.handleTagRemove, values: selectedItems.map(_this.props.tagRenderer) }))),
                 React.createElement("div", { onKeyDown: handleKeyDown, onKeyUp: handleKeyUp }, listProps.itemList)));
@@ -100,2 +100,8 @@ };
         };
+        _this.handleTagRemove = function (tag, index) {
+            var _a;
+            var _b = _this.props, _c = _b.selectedItems, selectedItems = _c === void 0 ? [] : _c, onRemove = _b.onRemove, tagInputProps = _b.tagInputProps;
+            onRemove === null || onRemove === void 0 ? void 0 : onRemove(selectedItems[index], index);
+            (_a = tagInputProps === null || tagInputProps === void 0 ? void 0 : tagInputProps.onRemove) === null || _a === void 0 ? void 0 : _a.call(tagInputProps, tag, index);
+        };
         _this.getTagInputKeyDownHandler = function (handleQueryListKeyDown) {
@@ -102,0 +108,0 @@ return function (e) {

lib/esm/common/listItemsProps.d.ts

@@ -146,2 +146,8 @@ /// <reference types="react" />
     /**
+     * Determines the position of the `createNewItem` within the list: first or
+     * last. Only relevant when `createNewItemRenderer` is defined.
+     * @default 'last'
+     */
+    createNewItemPosition?: "first" | "last";
+    /**
      * Whether the active item should be reset to the first matching item _every
@@ -148,0 +154,0 @@ * time the query changes_ (via prop or by user input).

lib/esm/components/omnibar/omnibar.js

@@ -48,3 +48,4 @@ /*
         // omit props specific to this component, spread the rest.
-        var _a = this.props, _b = _a.initialContent, initialContent = _b === void 0 ? null : _b, isOpen = _a.isOpen, inputProps = _a.inputProps, overlayProps = _a.overlayProps, restProps = __rest(_a, ["initialContent", "isOpen", "inputProps", "overlayProps"]);
+        var _a = this.props, isOpen = _a.isOpen, inputProps = _a.inputProps, overlayProps = _a.overlayProps, restProps = __rest(_a, ["isOpen", "inputProps", "overlayProps"]);
+        var initialContent = "initialContent" in this.props ? this.props.initialContent : null;
         return React.createElement(this.TypedQueryList, __assign({}, restProps, { initialContent: initialContent, renderer: this.renderQueryList }));
@@ -51,0 +52,0 @@ };

lib/esm/components/query-list/queryList.d.ts

@@ -159,2 +159,3 @@ import * as React from "react";
     private isCreateItemRendered;
+    private isCreateItemFirst;
     private canCreateItems;
@@ -161,0 +162,0 @@ private wouldCreatedItemMatchSomeExistingItem;

lib/esm/components/query-list/queryList.js

@@ -64,5 +64,7 @@ /*
             }
+            var createFirst = _this.isCreateItemFirst();
             return (React.createElement(Menu, { ulRef: listProps.itemsParentRef },
+                createFirst && createItemView,
                 menuContent,
-                createItemView));
+                !createFirst && createItemView));
         };
@@ -289,3 +291,9 @@ /** wrapper around `itemRenderer` to inject props */
         if (shouldUpdateActiveItem) {
-            this.setActiveItem(getFirstEnabledItem(filteredItems, props.itemDisabled));
+            // if the `createNewItem` is first, that should be the first active item.
+            if (this.isCreateItemRendered() && this.isCreateItemFirst()) {
+                this.setActiveItem(getCreateNewItem());
+            }
+            else {
+                this.setActiveItem(getFirstEnabledItem(filteredItems, props.itemDisabled));
+            }
         }
@@ -312,3 +320,4 @@ };
             if (isCreateNewItem(activeItem)) {
-                return this.itemsParentRef.children.item(this.state.filteredItems.length);
+                var index = this.isCreateItemFirst() ? 0 : this.state.filteredItems.length;
+                return this.itemsParentRef.children.item(index);
             }
@@ -369,2 +378,5 @@ else {
     };
+    QueryList.prototype.isCreateItemFirst = function () {
+        return this.props.createNewItemPosition === "first";
+    };
     QueryList.prototype.canCreateItems = function () {
@@ -371,0 +383,0 @@ return this.props.createNewItemFromQuery != null && this.props.createNewItemRenderer != null;

lib/esm/components/select/multiSelect.d.ts

@@ -11,2 +11,11 @@ import * as React from "react";
     /**
+     * Callback invoked when an item is removed from the selection by
+     * removing its tag in the TagInput. This is generally more useful than
+     * `tagInputProps.onRemove`  because it receives the removed value instead of
+     * the value's rendered `ReactNode` tag.
+     *
+     * It is not recommended to supply _both_ this prop and `tagInputProps.onRemove`.
+     */
+    onRemove?: (value: T, index: number) => void;
+    /**
      * If true, the component waits until a keydown event in the TagInput
@@ -59,4 +68,5 @@ * before opening its popover.
     private handlePopoverOpened;
+    private handleTagRemove;
     private getTagInputKeyDownHandler;
     private getTagInputKeyUpHandler;
 }

lib/esm/components/select/multiSelect.js

@@ -56,3 +56,3 @@ /*
                 React.createElement("div", { onKeyDown: _this.getTagInputKeyDownHandler(handleKeyDown), onKeyUp: _this.getTagInputKeyUpHandler(handleKeyUp) },
-                    React.createElement(TagInput, __assign({ placeholder: placeholder }, tagInputProps, { className: classNames(Classes.MULTISELECT, tagInputProps.className), inputRef: _this.refHandlers.input, inputProps: inputProps, inputValue: listProps.query, onAdd: handleTagInputAdd, onInputChange: listProps.handleQueryChange, values: selectedItems.map(_this.props.tagRenderer) }))),
+                    React.createElement(TagInput, __assign({ placeholder: placeholder }, tagInputProps, { className: classNames(Classes.MULTISELECT, tagInputProps.className), inputRef: _this.refHandlers.input, inputProps: inputProps, inputValue: listProps.query, onAdd: handleTagInputAdd, onInputChange: listProps.handleQueryChange, onRemove: _this.handleTagRemove, values: selectedItems.map(_this.props.tagRenderer) }))),
                 React.createElement("div", { onKeyDown: handleKeyDown, onKeyUp: handleKeyUp }, listProps.itemList)));
@@ -97,2 +97,8 @@ };
         };
+        _this.handleTagRemove = function (tag, index) {
+            var _a;
+            var _b = _this.props, _c = _b.selectedItems, selectedItems = _c === void 0 ? [] : _c, onRemove = _b.onRemove, tagInputProps = _b.tagInputProps;
+            onRemove === null || onRemove === void 0 ? void 0 : onRemove(selectedItems[index], index);
+            (_a = tagInputProps === null || tagInputProps === void 0 ? void 0 : tagInputProps.onRemove) === null || _a === void 0 ? void 0 : _a.call(tagInputProps, tag, index);
+        };
         _this.getTagInputKeyDownHandler = function (handleQueryListKeyDown) {
@@ -99,0 +105,0 @@ return function (e) {

lib/esnext/common/listItemsProps.d.ts

@@ -146,2 +146,8 @@ /// <reference types="react" />
     /**
+     * Determines the position of the `createNewItem` within the list: first or
+     * last. Only relevant when `createNewItemRenderer` is defined.
+     * @default 'last'
+     */
+    createNewItemPosition?: "first" | "last";
+    /**
      * Whether the active item should be reset to the first matching item _every
@@ -148,0 +154,0 @@ * time the query changes_ (via prop or by user input).

lib/esnext/components/omnibar/omnibar.js

@@ -44,3 +44,4 @@ /*
         // omit props specific to this component, spread the rest.
-        const { initialContent = null, isOpen, inputProps, overlayProps, ...restProps } = this.props;
+        const { isOpen, inputProps, overlayProps, ...restProps } = this.props;
+        const initialContent = "initialContent" in this.props ? this.props.initialContent : null;
         return React.createElement(this.TypedQueryList, Object.assign({}, restProps, { initialContent: initialContent, renderer: this.renderQueryList }));
@@ -47,0 +48,0 @@ }

lib/esnext/components/query-list/queryList.d.ts

@@ -159,2 +159,3 @@ import * as React from "react";
     private isCreateItemRendered;
+    private isCreateItemFirst;
     private canCreateItems;
@@ -161,0 +162,0 @@ private wouldCreatedItemMatchSomeExistingItem;

lib/esnext/components/query-list/queryList.js

@@ -61,5 +61,7 @@ /*
             }
+            const createFirst = this.isCreateItemFirst();
             return (React.createElement(Menu, { ulRef: listProps.itemsParentRef },
+                createFirst && createItemView,
                 menuContent,
-                createItemView));
+                !createFirst && createItemView));
         };
@@ -291,3 +293,9 @@ /** wrapper around `itemRenderer` to inject props */
         if (shouldUpdateActiveItem) {
-            this.setActiveItem(getFirstEnabledItem(filteredItems, props.itemDisabled));
+            // if the `createNewItem` is first, that should be the first active item.
+            if (this.isCreateItemRendered() && this.isCreateItemFirst()) {
+                this.setActiveItem(getCreateNewItem());
+            }
+            else {
+                this.setActiveItem(getFirstEnabledItem(filteredItems, props.itemDisabled));
+            }
         }
@@ -313,3 +321,4 @@ }
             if (isCreateNewItem(activeItem)) {
-                return this.itemsParentRef.children.item(this.state.filteredItems.length);
+                const index = this.isCreateItemFirst() ? 0 : this.state.filteredItems.length;
+                return this.itemsParentRef.children.item(index);
             }
@@ -368,2 +377,5 @@ else {
     }
+    isCreateItemFirst() {
+        return this.props.createNewItemPosition === "first";
+    }
     canCreateItems() {
@@ -370,0 +382,0 @@ return this.props.createNewItemFromQuery != null && this.props.createNewItemRenderer != null;

lib/esnext/components/select/multiSelect.d.ts

@@ -11,2 +11,11 @@ import * as React from "react";
     /**
+     * Callback invoked when an item is removed from the selection by
+     * removing its tag in the TagInput. This is generally more useful than
+     * `tagInputProps.onRemove`  because it receives the removed value instead of
+     * the value's rendered `ReactNode` tag.
+     *
+     * It is not recommended to supply _both_ this prop and `tagInputProps.onRemove`.
+     */
+    onRemove?: (value: T, index: number) => void;
+    /**
      * If true, the component waits until a keydown event in the TagInput
@@ -59,4 +68,5 @@ * before opening its popover.
     private handlePopoverOpened;
+    private handleTagRemove;
     private getTagInputKeyDownHandler;
     private getTagInputKeyUpHandler;
 }

lib/esnext/components/select/multiSelect.js

@@ -55,3 +55,3 @@ /*
                 React.createElement("div", { onKeyDown: this.getTagInputKeyDownHandler(handleKeyDown), onKeyUp: this.getTagInputKeyUpHandler(handleKeyUp) },
-                    React.createElement(TagInput, Object.assign({ placeholder: placeholder }, tagInputProps, { className: classNames(Classes.MULTISELECT, tagInputProps.className), inputRef: this.refHandlers.input, inputProps: inputProps, inputValue: listProps.query, onAdd: handleTagInputAdd, onInputChange: listProps.handleQueryChange, values: selectedItems.map(this.props.tagRenderer) }))),
+                    React.createElement(TagInput, Object.assign({ placeholder: placeholder }, tagInputProps, { className: classNames(Classes.MULTISELECT, tagInputProps.className), inputRef: this.refHandlers.input, inputProps: inputProps, inputValue: listProps.query, onAdd: handleTagInputAdd, onInputChange: listProps.handleQueryChange, onRemove: this.handleTagRemove, values: selectedItems.map(this.props.tagRenderer) }))),
                 React.createElement("div", { onKeyDown: handleKeyDown, onKeyUp: handleKeyUp }, listProps.itemList)));
@@ -90,2 +90,7 @@ };
         };
+        this.handleTagRemove = (tag, index) => {
+            const { selectedItems = [], onRemove, tagInputProps } = this.props;
+            onRemove?.(selectedItems[index], index);
+            tagInputProps?.onRemove?.(tag, index);
+        };
         this.getTagInputKeyDownHandler = (handleQueryListKeyDown) => {
@@ -92,0 +97,0 @@ return (e) => {

package.json

 {
     "name": "@blueprintjs/select",
-    "version": "3.14.3",
+    "version": "3.15.0",
     "description": "Components related to selecting items from a list",
@@ -38,3 +38,3 @@ "main": "lib/cjs/index.js",
     "dependencies": {
-        "@blueprintjs/core": "^3.34.0",
+        "@blueprintjs/core": "^3.36.0",
         "classnames": "^2.2",
@@ -44,4 +44,4 @@ "tslib": "~1.13.0"
     "peerDependencies": {
-        "react": "^15.3.0 || 16",
-        "react-dom": "^15.3.0 || 16"
+        "react": "^15.3.0 || 16 || 17",
+        "react-dom": "^15.3.0 || 16 || 17"
     },
@@ -48,0 +48,0 @@ "devDependencies": {

src/common/listItemsProps.ts

@@ -184,2 +184,9 @@ /*
     /**
+     * Determines the position of the `createNewItem` within the list: first or
+     * last. Only relevant when `createNewItemRenderer` is defined.
+     * @default 'last'
+     */
+    createNewItemPosition?: "first" | "last";
+
+    /**
      * Whether the active item should be reset to the first matching item _every
@@ -186,0 +193,0 @@ * time the query changes_ (via prop or by user input).

src/components/select/multi-select.md

 @# MultiSelect
 
-Use `MultiSelect<T>` for choosing multiple items in a list. The component renders a [`TagInput`](#core/components/tag-input) wrapped in a `Popover`. Similarly to [`Select`](#select/select-component), you can pass in a predicate to customize the filtering algorithm. Selection of a `MultiSelect<T>` is controlled: listen to changes with `onItemSelect`.
+Use `MultiSelect<T>` for choosing multiple items in a list. The component renders a [`TagInput`](#core/components/tag-input) wrapped in a `Popover`. Similarly to [`Select`](#select/select-component), you can pass in a predicate to customize the filtering algorithm.
 
+Selection state of a `MultiSelect<T>` is controlled with the `selectedItems` prop. React to user interactions with `onItemSelect` and `onRemove`.
+
 <div class="@ns-callout @ns-intent-primary @ns-icon-info-sign">
@@ -6,0 +8,0 @@ <h4 class="@ns-heading">Generic components and custom filtering</h4>

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

Improved metrics

Total package byte prevSize

552834

increased by1.87%

Lines of code

8004

increased by1.79%

Dependency changes

• + Addedreact@17.0.2(transitive)

• + Addedreact-dom@17.0.2(transitive)

• + Addedscheduler@0.20.2(transitive)

• - Removedreact@16.14.0(transitive)

• - Removedreact-dom@16.14.0(transitive)

• - Removedscheduler@0.19.1(transitive)

• Updated@blueprintjs/core@^3.36.0