@corva/ui 3.1.0-rc.4 → 3.1.0-rc.5

package/components/Search/Search.js

@@ -1 +1,539 @@
-import{__rest as o,__assign as n}from'./../../ext-esm/tslib/tslib.es6.js';import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import{useState as s,useRef as r,useCallback as c,useEffect as l,useMemo as p,cloneElement as a}from"react";import u from"classnames";import{debounce as d,isEmpty as m,omit as h,noop as v}from"lodash";import{Autocomplete as f}from"@material-ui/lab";import{Popper as g,Tooltip as I,Fade as C,Chip as b,TextField as O,InputAdornment as P,CircularProgress as j,MenuItem as x,Checkbox as S}from"@material-ui/core";import{AccessTime as A}from"@material-ui/icons";import G from"./components/Listbox.js";import N from"./components/Paper.js";import"./components/RecentSearches.js";import R from"./components/Groups.js";import k from"./components/SelectAllListItem.js";import{PaperContext as y}from"./context/index.js";import{useAutocompletOptions as L}from"./effects/useAutocompleteOptions.js";import F from"./styles.js";import{DownOneIcon as T,CloseSmallIcon as z}from"../../icons/iconParkIcons.js";import"../../icons/customIcons/icons/AddMessage.js";import"../../icons/customIcons/icons/Attention.js";import"../../icons/customIcons/icons/Collapse.js";import"../../icons/customIcons/icons/Dashboard.js";import"../../icons/customIcons/icons/Expand.js";import"../../icons/customIcons/icons/FolderClosed.js";import"../../icons/customIcons/icons/FolderClosedFilled.js";import"../../icons/customIcons/icons/FolderOpened.js";import"../../icons/customIcons/icons/GreaterOrEqual.js";import"../../icons/customIcons/icons/LessOrEqual.js";import"../../icons/customIcons/icons/Search.js";import"../../icons/customIcons/icons/Wellhub.js";import"../../icons/customIcons/icons/MultiRuler.js";import"../../icons/customIcons/icons/Checkbox.js";import"../../icons/customIcons/icons/CheckboxChecked.js";import"../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../icons/customIcons/icons/Radio.js";import"../../icons/customIcons/icons/RadioChecked.js";import"../../icons/customIcons/icons/SimulFrac.js";import"../../icons/customIcons/icons/ZipperFrac.js";import"../../icons/customIcons/icons/CautionFilled.js";import"../../icons/customIcons/icons/MoreApp.js";import"../../icons/customIcons/icons/Pad.js";import"../../icons/customIcons/icons/Gap.js";import{MiddleTruncatedText as D}from"../MiddleTruncatedText/MiddleTruncatedText.js";import M from"../IconButton/index.js";var B={},E=function(R){var E=R.AutocompleteProps,_=void 0===E?{}:E,w=R.value,K=R.disableClearable,H=void 0!==K&&K,W=R.onChange,q=R.onInputChange,U=void 0===q?null:q,V=R.loading,Z=void 0!==V&&V,J=R.options,Q=void 0===J?[]:J,X=R.optionSize,Y=R.placeholder,$=void 0===Y?"Search...":Y,oo=R.onGroupChange,no=void 0===oo?function(){}:oo,eo=R.disabled,to=void 0!==eo&&eo,io=R.disableResetOnGroupChange,so=R.multiple,ro=void 0!==so&&so,co=R.groups,lo=void 0===co?[]:co,po=R.GroupsComponent,ao=void 0===po?null:po,uo=R.recentSearchesMaxCount,mo=void 0===uo?3:uo,ho=R.dataStorageKey,vo=void 0===ho?"Search:recentSearches":ho,fo=R.RecentSearchesComponent,go=void 0===fo?null:fo,Io=R.dataStorage,Co=void 0===Io?sessionStorage:Io,bo=R.onInputReset,Oo=void 0===bo?null:bo,Po=R.getOptionLabel,jo=void 0===Po?function(o){return o.label||""}:Po,xo=R.TextFieldProps,So=void 0===xo?{endAdornment:null}:xo,Ao=R.ListboxProps,Go=void 0===Ao?null:Ao,No=R.onInputChangeCallback,Ro=void 0===No?function(){}:No,ko=R.renderCustomOption,yo=void 0===ko?null:ko,Lo=R.isHiddenAllOption,Fo=void 0!==Lo&&Lo,To=R.onOpen,zo=void 0===To?v:To,Do=R.selectedGroup,Mo=void 0===Do?null:Do,Bo=R.onGroupReset,Eo=void 0===Bo?function(){}:Bo,_o=R.onClose,wo=void 0===_o?function(){}:_o,Ko=R.popperProps,Ho=void 0===Ko?B:Ko,Wo=R.paperFooter,qo=R.noOptionsText,Uo=void 0===qo?"No Options":qo,Vo=R.ListboxComponent,Zo=void 0===Vo?G:Vo,Jo=R.isPrioritizedSelectedOptions,Qo=void 0!==Jo&&Jo,Xo=R.isOpenedFromParent,Yo=void 0===Xo?void 0:Xo,$o=R.onFocus,on=void 0===$o?null:$o,nn=R.InputProps,en=void 0===nn?null:nn,tn=R.classes,sn=void 0===tn?{}:tn,rn=R.popupIcon;void 0===rn&&e(T,{theme:"filled",fill:"#BDBDBD",size:16});var cn=R.shouldResetInputOnAutocompleteChange,ln=o(R,["AutocompleteProps","value","disableClearable","onChange","onInputChange","loading","options","optionSize","placeholder","onGroupChange","disabled","disableResetOnGroupChange","multiple","groups","GroupsComponent","recentSearchesMaxCount","dataStorageKey","RecentSearchesComponent","dataStorage","onInputReset","getOptionLabel","TextFieldProps","ListboxProps","onInputChangeCallback","renderCustomOption","isHiddenAllOption","onOpen","selectedGroup","onGroupReset","onClose","popperProps","paperFooter","noOptionsText","ListboxComponent","isPrioritizedSelectedOptions","isOpenedFromParent","onFocus","InputProps","classes","popupIcon","shouldResetInputOnAutocompleteChange"]),pn=s(""),an=pn[0],un=pn[1],dn=s(""),mn=dn[0],hn=dn[1],vn=s(!1),fn=vn[0],gn=vn[1],In=s(!1),Cn=In[0],bn=In[1],On=r(),Pn=r(),jn=L({options:Q,value:w,groups:lo,selectedGroup:Mo,isPrioritizedSelectedOptions:Qo}),xn=jn.autocompleteOptions,Sn=jn.isGrouped,An=jn.handleAutocompleOptionsUpdate,Gn=F(),Nn=sn.popper,Rn=sn.listbox,kn=sn.popupIndicator,yn=sn.popupIndicatorOpen,Ln=sn.groupChip,Fn=o(sn,["popper","listbox","popupIndicator","popupIndicatorOpen","groupChip"]),Tn=n({popper:u(Gn.popper,Nn),listbox:u(Gn.listbox,Rn),popupIndicator:u(Gn.popupIndicator,kn),popupIndicatorOpen:u(Gn.popupIndicatorOpen,yn)},Fn),zn=function(){un(""),null==Oo||Oo()},Dn=c(d((function(o){return hn(o)}),500),[]),Mn=function(o){var n=lo.find((function(n){return n.id===o}));io||zn(),no(n)},Bn=function(o){an.length||ro&&"ArrowLeft"===o.code&&o.stopPropagation()};l((function(){fn&&(On.current.focus(),On.current.setSelectionRange(an.length,an.length))}));var En=ro&&Array.isArray(w)?w.length:null,_n=ro&&(null==xn?void 0:xn.length)===En,wn=ro&&!!En&&!_n,Kn=function(){return zn(),_.getOptionDisabled&&_n?W(null,[Q[Q.length-1]]):W(null,_n||wn?[]:xn)};l((function(){Dn(an),U&&U(an)}),[an]);var Hn=function(o,n){"blur"===n&&(!o.relatedTarget||Pn.current.contains(o.relatedTarget))||(wo(),gn(!1))},Wn=function(){(null!=Yo?Yo:fn)?(gn(!1),wo()):(gn(!0),zo())},qn=function(o){if(_n&&!Fo)return"All";var n=o[0].label||o[0].name||"";return 1===(null==o?void 0:o.length)?e("div",{children:e(D,{children:n})}):"".concat(null==o?void 0:o.length," Selected")},Un=m(xn),Vn=p((function(){return{onOutsideClick:Hn,isEmptyOptions:Un,loading:Z,AllSelectComponent:!Fo&&ro&&!Un&&e(k,{className:Gn.selectAllCheckbox,onClick:Kn,someSelected:wn,allSelected:_n}),RecentSearchesComponent:go&&e(go,{title:"Recent Searches",Icon:A,dataStorage:Co,dataStorageKey:vo,maxCount:mo,isHidden:!m(an),onInputChange:function(o){return un(o)},inputValue:mn}),GroupsComponent:!Mo&&Sn&&ao&&e(ao,{onGroupClick:Mn,groups:lo})}}),[Mo,Z,Sn,Un,an,Fo,ro,Un,mn,wo,Hn]),Zn=p((function(){return function(e){var i=e.children,s=e.className,r=o(e,["children","className"]);return t(N,n({},r,{className:s,inputRef:On,ref:Pn,children:[i,Wo]}))}}),[Wo]),Jn=p((function(){return function(t){var i=Ho.style,s=o(Ho,["style"]);return e(g,n({},t,{style:n(n({},t.style),i),placement:"bottom-start"},s))}}),[Ho]);return e(y.Provider,{value:Vn,children:e(f,n({},h(ln,["InputProps","isNullable","isOpenedFromParent"]),{PopperComponent:Jn,disableClearable:H,onOpen:function(o){An(),gn(!0),zo(o)},onClose:Hn,open:null!=Yo?Yo:fn,onChange:function(o,n){ro&&!cn||un(""),W(o,n)},forcePopupIcon:_.forcePopupIcon,fullWidth:!0,disabled:to,value:w,classes:Tn,renderInput:function(r){var c,l,p,d,v=s(!1),f=v[0],g=v[1],I=r.InputProps,C=r.inputProps,x=o(r,["InputProps","inputProps"]),S=(null===(d=null===(p=null===(l=I.endAdornment)||void 0===l?void 0:l.props)||void 0===p?void 0:p.children)||void 0===d?void 0:d.length)>1?a(I.endAdornment,{children:I.endAdornment.props.children.slice(1),onMouseDown:function(o){return o.stopPropagation()},onMouseUp:function(o){return o.stopPropagation()}}):I.endAdornment,A=1===En,G=f||fn||an.length>0||!m(w)||!m(null==en?void 0:en.startAdornment),N=en||{},R=N.classes,k=void 0===R?{}:R,y=k.input,L=void 0===y?"":y,F=o(k,["input"]),T=N.style,D=o(N,["classes","style"]);return e(O,n({},x,h(So,["endAdornment"]),{onBlur:function(){g(!1),A&&bn(!0)},onFocus:function(){g(!0)},onKeyDown:Bn,inputRef:On,placeholder:$,classes:{root:Gn.searchInput},inputProps:n(n({style:{padding:5}},C),ln.inputProps),InputLabelProps:{shrink:G},InputProps:n(n(n({classes:n({input:u(Cn?Gn.inputShrinked:A&&Gn.inputExpanded,L)},F),style:n({paddingRight:0,paddingBottom:0},T)},I),D),{startAdornment:t(i,{children:[null==en?void 0:en.startAdornment,Mo&&e(b,{className:Gn.selectedGroup,"data-not-migrated-muichip":!0,variant:"outlined",label:t("div",{className:Gn.selectedGroupLabel,children:[Mo.name,e(z,{size:16,id:"removeGroupIcon",className:Gn.removeIcon,onClick:Eo})]})},Mo.id),ro&&!m(w)&&e("div",{onClick:Wn,id:"selectedOptions",className:u(Gn.selectedLabel,Cn&&Gn.selectedLabelExpanded),children:qn(w)})]}),endAdornment:t(i,{children:[t(P,{className:u(Gn.endAdornment,(c={},c[Gn.removeIconWithDropdown]=_.forcePopupIcon,c)),position:"end",children:[So.endAdornment,Z&&e(j,{color:"primary",size:20}),f&&an&&!H&&e(M,{"data-testid":"".concat("AutocompleteSearch","_clear_icon"),size:"small",className:Gn.iconButton,onClick:function(){un(""),Oo&&Oo()},tooltipProps:{title:"Clear"},children:e(z,{size:20,className:Gn.closeIcon})})]}),_.forcePopupIcon&&S]})})}))},loading:Z,options:xn,renderGroup:function(o){var n=o.key,i=o.group,s=o.children;return!i||!m(Mo)&&ro?s:t("div",{className:Gn.group,children:[e(I,{title:i,placement:"right",TransitionComponent:C,TransitionProps:{timeout:500},enterDelay:500,children:e(b,{"data-not-migrated-muichip":!0,className:u(Gn.groupChip,Ln),variant:"outlined",label:i})}),s]},n)},disableCloseOnSelect:ro,multiple:ro,renderOption:yo||function(o,n){var i=o.label,s=void 0===i?"":i,r=o.id;return ro?t("div",{className:u(Gn.option,X),"data-testid":"autocompleteOption_".concat(s,"MenuItem"),children:[e(S,{size:"small",disableRipple:!0,className:Gn.checkbox,checked:n.selected}),e(D,{className:Gn.optionLabelContainer,children:s})]},r):e(x,{className:Gn.menuItem,value:r,"data-testid":"autocompleteOption_".concat(s,"MenuItem"),children:e(D,{className:Gn.optionLabelContainer,children:s})},r)},groupBy:Sn?function(o){return o.group}:null,PaperComponent:Zn,ListboxComponent:Zo,inputValue:an,getOptionLabel:jo,getOptionDisabled:null==_?void 0:_.getOptionDisabled,onInputChange:function(o,n,e){un(io?function(o){return"reset"===e?o:n}:n),Ro(n,e)},loadingText:e("div",{className:Gn.label,children:"Loading ..."}),noOptionsText:e("div",{className:Gn.label,children:Uo}),ListboxProps:Go,onFocus:function(){bn(!1),null==on||on()}}))})};E.Groups=R;export{E as Search,E as default};
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import { useState, useRef, useCallback, useEffect, useMemo, cloneElement } from 'react';
+import classNames from 'classnames';
+import { debounce, isEmpty, omit, noop } from 'lodash';
+import { Autocomplete } from '@material-ui/lab';
+import { Popper, Tooltip, Fade, Chip, TextField, InputAdornment, CircularProgress, MenuItem, Checkbox } from '@material-ui/core';
+import { AccessTime } from '@material-ui/icons';
+import Listbox from './components/Listbox.js';
+import Paper from './components/Paper.js';
+import './components/RecentSearches.js';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import Groups from './components/Groups.js';
+import SelectAllListItem from './components/SelectAllListItem.js';
+import { PaperContext } from './context/index.js';
+import { useAutocompletOptions } from './effects/useAutocompleteOptions.js';
+import useStyles from './styles.js';
+import { CloseSmallIcon } from '../../icons/iconParkIcons.js';
+import '../../icons/customIcons/icons/AddMessage.js';
+import '../../icons/customIcons/icons/Attention.js';
+import '../../icons/customIcons/icons/Collapse.js';
+import '../../icons/customIcons/icons/Dashboard.js';
+import '../../icons/customIcons/icons/Expand.js';
+import '../../icons/customIcons/icons/FolderClosed.js';
+import '../../icons/customIcons/icons/FolderClosedFilled.js';
+import '../../icons/customIcons/icons/FolderOpened.js';
+import '../../icons/customIcons/icons/GreaterOrEqual.js';
+import '../../icons/customIcons/icons/LessOrEqual.js';
+import '../../icons/customIcons/icons/Search.js';
+import '../../icons/customIcons/icons/Wellhub.js';
+import '../../icons/customIcons/icons/MultiRuler.js';
+import '../../icons/customIcons/icons/Checkbox.js';
+import '../../icons/customIcons/icons/CheckboxChecked.js';
+import '../../icons/customIcons/icons/CheckboxIndeterminate.js';
+import '../../icons/customIcons/icons/Radio.js';
+import '../../icons/customIcons/icons/RadioChecked.js';
+import '../../icons/customIcons/icons/SimulFrac.js';
+import '../../icons/customIcons/icons/ZipperFrac.js';
+import '../../icons/customIcons/icons/CautionFilled.js';
+import '../../icons/customIcons/icons/MoreApp.js';
+import '../../icons/customIcons/icons/Pad.js';
+import '../../icons/customIcons/icons/Gap.js';
+import { MiddleTruncatedText } from '../MiddleTruncatedText/MiddleTruncatedText.js';
+import IconButton from '../IconButton/index.js';
+
+var _excluded = ["AutocompleteProps", "value", "disableClearable", "onChange", "onInputChange", "loading", "options", "optionSize", "placeholder", "onGroupChange", "disabled", "disableResetOnGroupChange", "multiple", "groups", "GroupsComponent", "recentSearchesMaxCount", "dataStorageKey", "RecentSearchesComponent", "dataStorage", "onInputReset", "getOptionLabel", "TextFieldProps", "ListboxProps", "onInputChangeCallback", "renderCustomOption", "isHiddenAllOption", "onOpen", "selectedGroup", "onGroupReset", "onClose", "popperProps", "paperFooter", "noOptionsText", "ListboxComponent", "isPrioritizedSelectedOptions", "isOpenedFromParent", "onFocus", "InputProps", "classes", "popupIcon", "shouldResetInputOnAutocompleteChange"],
+  _excluded2 = ["popper", "listbox", "popupIndicator", "popupIndicatorOpen", "groupChip"],
+  _excluded3 = ["InputProps", "inputProps"],
+  _excluded4 = ["input"],
+  _excluded5 = ["classes", "style"],
+  _excluded6 = ["children", "className"],
+  _excluded7 = ["style"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var PAGE_NAME = 'AutocompleteSearch';
+var initialPopperProps = {};
+var ARROW_LEFT_KEY_CODE = 'ArrowLeft';
+var Search = function Search(_ref) {
+  var _ref$AutocompleteProp = _ref.AutocompleteProps,
+    AutocompleteProps = _ref$AutocompleteProp === void 0 ? {} : _ref$AutocompleteProp,
+    value = _ref.value,
+    _ref$disableClearable = _ref.disableClearable,
+    disableClearable = _ref$disableClearable === void 0 ? false : _ref$disableClearable,
+    onChange = _ref.onChange,
+    _ref$onInputChange = _ref.onInputChange,
+    onInputChange = _ref$onInputChange === void 0 ? null : _ref$onInputChange,
+    _ref$loading = _ref.loading,
+    loading = _ref$loading === void 0 ? false : _ref$loading,
+    _ref$options = _ref.options,
+    options = _ref$options === void 0 ? [] : _ref$options,
+    optionSize = _ref.optionSize,
+    _ref$placeholder = _ref.placeholder,
+    placeholder = _ref$placeholder === void 0 ? 'Search...' : _ref$placeholder,
+    _ref$onGroupChange = _ref.onGroupChange,
+    onGroupChange = _ref$onGroupChange === void 0 ? function () {} : _ref$onGroupChange,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    disableResetOnGroupChange = _ref.disableResetOnGroupChange,
+    _ref$multiple = _ref.multiple,
+    multiple = _ref$multiple === void 0 ? false : _ref$multiple,
+    _ref$groups = _ref.groups,
+    groups = _ref$groups === void 0 ? [] : _ref$groups,
+    _ref$GroupsComponent = _ref.GroupsComponent,
+    GroupsComponent = _ref$GroupsComponent === void 0 ? null : _ref$GroupsComponent,
+    _ref$recentSearchesMa = _ref.recentSearchesMaxCount,
+    recentSearchesMaxCount = _ref$recentSearchesMa === void 0 ? 3 : _ref$recentSearchesMa,
+    _ref$dataStorageKey = _ref.dataStorageKey,
+    dataStorageKey = _ref$dataStorageKey === void 0 ? 'Search:recentSearches' : _ref$dataStorageKey,
+    _ref$RecentSearchesCo = _ref.RecentSearchesComponent,
+    RecentSearchesComponent = _ref$RecentSearchesCo === void 0 ? null : _ref$RecentSearchesCo,
+    _ref$dataStorage = _ref.dataStorage,
+    dataStorage = _ref$dataStorage === void 0 ? sessionStorage : _ref$dataStorage,
+    _ref$onInputReset = _ref.onInputReset,
+    onInputReset = _ref$onInputReset === void 0 ? null : _ref$onInputReset,
+    _ref$getOptionLabel = _ref.getOptionLabel,
+    getOptionLabel = _ref$getOptionLabel === void 0 ? function (option) {
+      return option.label || '';
+    } : _ref$getOptionLabel,
+    _ref$TextFieldProps = _ref.TextFieldProps,
+    TextFieldProps = _ref$TextFieldProps === void 0 ? {
+      endAdornment: null
+    } : _ref$TextFieldProps,
+    _ref$ListboxProps = _ref.ListboxProps,
+    ListboxProps = _ref$ListboxProps === void 0 ? null : _ref$ListboxProps,
+    _ref$onInputChangeCal = _ref.onInputChangeCallback,
+    onInputChangeCallback = _ref$onInputChangeCal === void 0 ? function () {} : _ref$onInputChangeCal,
+    _ref$renderCustomOpti = _ref.renderCustomOption,
+    renderCustomOption = _ref$renderCustomOpti === void 0 ? null : _ref$renderCustomOpti,
+    _ref$isHiddenAllOptio = _ref.isHiddenAllOption,
+    isHiddenAllOption = _ref$isHiddenAllOptio === void 0 ? false : _ref$isHiddenAllOptio,
+    _ref$onOpen = _ref.onOpen,
+    onOpen = _ref$onOpen === void 0 ? noop : _ref$onOpen,
+    _ref$selectedGroup = _ref.selectedGroup,
+    selectedGroup = _ref$selectedGroup === void 0 ? null : _ref$selectedGroup,
+    _ref$onGroupReset = _ref.onGroupReset,
+    onGroupReset = _ref$onGroupReset === void 0 ? function () {} : _ref$onGroupReset,
+    _ref$onClose = _ref.onClose,
+    onClose = _ref$onClose === void 0 ? function () {} : _ref$onClose,
+    _ref$popperProps = _ref.popperProps,
+    popperProps = _ref$popperProps === void 0 ? initialPopperProps : _ref$popperProps,
+    paperFooter = _ref.paperFooter,
+    _ref$noOptionsText = _ref.noOptionsText,
+    noOptionsText = _ref$noOptionsText === void 0 ? 'No Options' : _ref$noOptionsText,
+    _ref$ListboxComponent = _ref.ListboxComponent,
+    ListboxComponent = _ref$ListboxComponent === void 0 ? Listbox : _ref$ListboxComponent,
+    _ref$isPrioritizedSel = _ref.isPrioritizedSelectedOptions,
+    isPrioritizedSelectedOptions = _ref$isPrioritizedSel === void 0 ? false : _ref$isPrioritizedSel,
+    _ref$isOpenedFromPare = _ref.isOpenedFromParent,
+    isOpenedFromParent = _ref$isOpenedFromPare === void 0 ? undefined : _ref$isOpenedFromPare,
+    _ref$onFocus = _ref.onFocus,
+    onFocus = _ref$onFocus === void 0 ? null : _ref$onFocus,
+    _ref$InputProps = _ref.InputProps,
+    InputProps = _ref$InputProps === void 0 ? null : _ref$InputProps,
+    _ref$classes = _ref.classes,
+    classes = _ref$classes === void 0 ? {} : _ref$classes;
+    _ref.popupIcon;
+    var shouldResetInputOnAutocompleteChange = _ref.shouldResetInputOnAutocompleteChange,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var _useState = useState(''),
+    _useState2 = _slicedToArray(_useState, 2),
+    inputValue = _useState2[0],
+    setInputValue = _useState2[1];
+  var _useState3 = useState(''),
+    _useState4 = _slicedToArray(_useState3, 2),
+    debouncedInputValue = _useState4[0],
+    setDebouncedInputValue = _useState4[1];
+  var _useState5 = useState(false),
+    _useState6 = _slicedToArray(_useState5, 2),
+    isOpened = _useState6[0],
+    setIsOpened = _useState6[1];
+  var _useState7 = useState(false),
+    _useState8 = _slicedToArray(_useState7, 2),
+    isSelectedLabelExpanded = _useState8[0],
+    setIsSelectedLabelExpanded = _useState8[1];
+  var inputRef = useRef();
+  var paperRef = useRef();
+  var _useAutocompletOption = useAutocompletOptions({
+      options: options,
+      value: value,
+      groups: groups,
+      selectedGroup: selectedGroup,
+      isPrioritizedSelectedOptions: isPrioritizedSelectedOptions
+    }),
+    autocompleteOptions = _useAutocompletOption.autocompleteOptions,
+    isGrouped = _useAutocompletOption.isGrouped,
+    handleAutocompleOptionsUpdate = _useAutocompletOption.handleAutocompleOptionsUpdate;
+  var styles = useStyles();
+  var popper = classes.popper,
+    listbox = classes.listbox,
+    popupIndicator = classes.popupIndicator,
+    popupIndicatorOpen = classes.popupIndicatorOpen,
+    groupChipClassName = classes.groupChip,
+    restClasses = _objectWithoutProperties(classes, _excluded2);
+  var autocompleteClasses = _objectSpread({
+    popper: classNames(styles.popper, popper),
+    listbox: classNames(styles.listbox, listbox),
+    popupIndicator: classNames(styles.popupIndicator, popupIndicator),
+    popupIndicatorOpen: classNames(styles.popupIndicatorOpen, popupIndicatorOpen)
+  }, restClasses);
+  var groupBy = function groupBy(_ref2) {
+    var group = _ref2.group;
+    return group;
+  };
+  var handleInputChange = function handleInputChange(event, newInputValue, reason) {
+    if (disableResetOnGroupChange) setInputValue(function (prevValue) {
+      return reason === 'reset' ? prevValue : newInputValue;
+    });else setInputValue(newInputValue);
+    onInputChangeCallback(newInputValue, reason);
+  };
+  var handleInputReset = function handleInputReset() {
+    setInputValue('');
+    onInputReset === null || onInputReset === void 0 ? void 0 : onInputReset();
+  };
+  var handleDebouncedInputChange = function handleDebouncedInputChange(inputValue) {
+    return setDebouncedInputValue(inputValue);
+  };
+  var onDebouncedInputChange = useCallback(debounce(handleDebouncedInputChange, 500), []);
+  var handleSelectedGroupChange = function handleSelectedGroupChange(selectedGroupId) {
+    var selectedGroup = groups.find(function (_ref3) {
+      var id = _ref3.id;
+      return id === selectedGroupId;
+    });
+    if (!disableResetOnGroupChange) handleInputReset();
+    onGroupChange(selectedGroup);
+  };
+  var handleKeyDown = function handleKeyDown(event) {
+    if (inputValue.length) return;
+
+    // NOTE: MUI try to focus tags for multiple Autocomplete
+    // need to stop event to prevent crash, as we render custom content in TextField
+    if (multiple && event.code === ARROW_LEFT_KEY_CODE) {
+      event.stopPropagation();
+    }
+  };
+  useEffect(function () {
+    if (isOpened) {
+      inputRef.current.focus();
+      inputRef.current.setSelectionRange(inputValue.length, inputValue.length);
+    }
+  });
+  var valueLength = multiple && Array.isArray(value) ? value.length : null;
+  var allSelected = multiple && (autocompleteOptions === null || autocompleteOptions === void 0 ? void 0 : autocompleteOptions.length) === valueLength;
+  var someSelected = multiple && !!valueLength && !allSelected;
+  var onAllSelectClick = function onAllSelectClick() {
+    handleInputReset();
+    if (AutocompleteProps.getOptionDisabled && allSelected) return onChange(null, [options[options.length - 1]]);
+    return onChange(null, allSelected || someSelected ? [] : autocompleteOptions);
+  };
+  useEffect(function () {
+    onDebouncedInputChange(inputValue);
+    if (!onInputChange) return;
+    onInputChange(inputValue);
+  }, [inputValue]);
+  var handleAutocompleteChange = function handleAutocompleteChange(event, selected) {
+    if (!multiple || shouldResetInputOnAutocompleteChange) {
+      setInputValue('');
+    }
+    onChange(event, selected);
+  };
+  var handleSearchOpen = function handleSearchOpen(e) {
+    handleAutocompleOptionsUpdate();
+    setIsOpened(true);
+    onOpen(e);
+  };
+  var handleSearchClose = function handleSearchClose(evt, reason) {
+    var focusingDropdownElement = reason === 'blur' && (!evt.relatedTarget || paperRef.current.contains(evt.relatedTarget));
+    if (!focusingDropdownElement) {
+      onClose();
+      setIsOpened(false);
+    }
+  };
+  var handleSelectedOptionClick = function handleSelectedOptionClick() {
+    if (isOpenedFromParent !== null && isOpenedFromParent !== void 0 ? isOpenedFromParent : isOpened) {
+      setIsOpened(false);
+      onClose();
+    } else {
+      setIsOpened(true);
+      onOpen();
+    }
+  };
+  var renderGroup = function renderGroup(_ref4) {
+    var key = _ref4.key,
+      group = _ref4.group,
+      children = _ref4.children;
+    if (!group || !isEmpty(selectedGroup) && multiple) {
+      return children;
+    }
+    return /*#__PURE__*/jsxs("div", {
+      className: styles.group,
+      children: [/*#__PURE__*/jsx(Tooltip, {
+        title: group,
+        placement: "right",
+        TransitionComponent: Fade,
+        TransitionProps: {
+          timeout: 500
+        },
+        enterDelay: 500,
+        children: /*#__PURE__*/jsx(Chip, {
+          "data-not-migrated-muichip": true,
+          className: classNames(styles.groupChip, groupChipClassName),
+          variant: "outlined",
+          label: group
+        })
+      }), children]
+    }, key);
+  };
+  var getSelectedLabel = function getSelectedLabel(value) {
+    if (allSelected && !isHiddenAllOption) return 'All';
+    var label = value[0].label || value[0].name || '';
+    return (value === null || value === void 0 ? void 0 : value.length) === 1 ? /*#__PURE__*/jsx("div", {
+      children: /*#__PURE__*/jsx(MiddleTruncatedText, {
+        children: label
+      })
+    }) : "".concat(value === null || value === void 0 ? void 0 : value.length, " Selected");
+  };
+  var renderInput = function renderInput(muiProps) {
+    var _mUIInputProps$endAdo, _mUIInputProps$endAdo2, _mUIInputProps$endAdo3;
+    var _useState9 = useState(false),
+      _useState10 = _slicedToArray(_useState9, 2),
+      isFocused = _useState10[0],
+      setIsFocused = _useState10[1];
+    var mUIInputProps = muiProps.InputProps,
+      mUIinputProps = muiProps.inputProps,
+      restMuiProps = _objectWithoutProperties(muiProps, _excluded3);
+    var defaultEndAdornment = ((_mUIInputProps$endAdo = mUIInputProps.endAdornment) === null || _mUIInputProps$endAdo === void 0 ? void 0 : (_mUIInputProps$endAdo2 = _mUIInputProps$endAdo.props) === null || _mUIInputProps$endAdo2 === void 0 ? void 0 : (_mUIInputProps$endAdo3 = _mUIInputProps$endAdo2.children) === null || _mUIInputProps$endAdo3 === void 0 ? void 0 : _mUIInputProps$endAdo3.length) > 1 ? cloneElement(mUIInputProps.endAdornment, {
+      // remove clear button, popupIcon is left
+      children: mUIInputProps.endAdornment.props.children.slice(1),
+      onMouseDown: function onMouseDown(e) {
+        return e.stopPropagation();
+      },
+      onMouseUp: function onMouseUp(e) {
+        return e.stopPropagation();
+      }
+    }) : mUIInputProps.endAdornment;
+    var isNeedExpandInput = valueLength === 1;
+    var isInputLabelShrink = isFocused || isOpened || inputValue.length > 0 || !isEmpty(value) || !isEmpty(InputProps === null || InputProps === void 0 ? void 0 : InputProps.startAdornment);
+    var onInputBlur = function onInputBlur() {
+      setIsFocused(false);
+      if (isNeedExpandInput) {
+        setIsSelectedLabelExpanded(true);
+      }
+    };
+    var _ref5 = InputProps || {},
+      _ref5$classes = _ref5.classes;
+    _ref5$classes = _ref5$classes === void 0 ? {} : _ref5$classes;
+    var _ref5$classes$input = _ref5$classes.input,
+      inputClasses = _ref5$classes$input === void 0 ? '' : _ref5$classes$input,
+      restInputClasses = _objectWithoutProperties(_ref5$classes, _excluded4),
+      style = _ref5.style,
+      restInputProps = _objectWithoutProperties(_ref5, _excluded5);
+    return /*#__PURE__*/jsx(TextField, _objectSpread(_objectSpread(_objectSpread({}, restMuiProps), omit(TextFieldProps, ['endAdornment'])), {}, {
+      onBlur: onInputBlur,
+      onFocus: function onFocus() {
+        setIsFocused(true);
+      },
+      onKeyDown: handleKeyDown,
+      inputRef: inputRef,
+      placeholder: placeholder,
+      classes: {
+        root: styles.searchInput
+      },
+      inputProps: _objectSpread(_objectSpread({
+        style: {
+          padding: 5
+        }
+      }, mUIinputProps), props.inputProps),
+      InputLabelProps: {
+        shrink: isInputLabelShrink
+      },
+      InputProps: _objectSpread(_objectSpread(_objectSpread({
+        classes: _objectSpread({
+          input: classNames(isSelectedLabelExpanded ? styles.inputShrinked : isNeedExpandInput && styles.inputExpanded, inputClasses)
+        }, restInputClasses),
+        style: _objectSpread({
+          paddingRight: 0,
+          paddingBottom: 0
+        }, style)
+      }, mUIInputProps), restInputProps), {}, {
+        startAdornment: /*#__PURE__*/jsxs(Fragment, {
+          children: [InputProps === null || InputProps === void 0 ? void 0 : InputProps.startAdornment, selectedGroup && /*#__PURE__*/jsx(Chip, {
+            className: styles.selectedGroup,
+            "data-not-migrated-muichip": true,
+            variant: "outlined",
+            label: /*#__PURE__*/jsxs("div", {
+              className: styles.selectedGroupLabel,
+              children: [selectedGroup.name, /*#__PURE__*/jsx(CloseSmallIcon, {
+                size: 16,
+                id: "removeGroupIcon",
+                className: styles.removeIcon,
+                onClick: onGroupReset
+              })]
+            })
+          }, selectedGroup.id), multiple && !isEmpty(value) && /*#__PURE__*/jsx("div", {
+            onClick: handleSelectedOptionClick,
+            id: "selectedOptions",
+            className: classNames(styles.selectedLabel, isSelectedLabelExpanded && styles.selectedLabelExpanded),
+            children: getSelectedLabel(value)
+          })]
+        }),
+        endAdornment: /*#__PURE__*/jsxs(Fragment, {
+          children: [/*#__PURE__*/jsxs(InputAdornment, {
+            className: classNames(styles.endAdornment, _defineProperty({}, styles.removeIconWithDropdown, AutocompleteProps.forcePopupIcon)),
+            position: "end",
+            children: [TextFieldProps.endAdornment, loading && /*#__PURE__*/jsx(CircularProgress, {
+              color: "primary",
+              size: 20
+            }), isFocused && inputValue && !disableClearable && /*#__PURE__*/jsx(IconButton, {
+              "data-testid": "".concat(PAGE_NAME, "_clear_icon"),
+              size: "small",
+              className: styles.iconButton,
+              onClick: function onClick() {
+                setInputValue('');
+                if (onInputReset) {
+                  onInputReset();
+                }
+              },
+              tooltipProps: {
+                title: 'Clear'
+              },
+              children: /*#__PURE__*/jsx(CloseSmallIcon, {
+                size: 20,
+                className: styles.closeIcon
+              })
+            })]
+          }), AutocompleteProps.forcePopupIcon && defaultEndAdornment]
+        })
+      })
+    }));
+  };
+  var renderOption = function renderOption(option, state) {
+    var _option$label = option.label,
+      label = _option$label === void 0 ? '' : _option$label,
+      id = option.id;
+    if (!multiple) return /*#__PURE__*/jsx(MenuItem, {
+      className: styles.menuItem,
+      value: id,
+      "data-testid": "autocompleteOption_".concat(label, "MenuItem"),
+      children: /*#__PURE__*/jsx(MiddleTruncatedText, {
+        className: styles.optionLabelContainer,
+        children: label
+      })
+    }, id);
+    return /*#__PURE__*/jsxs("div", {
+      className: classNames(styles.option, optionSize),
+      "data-testid": "autocompleteOption_".concat(label, "MenuItem"),
+      children: [/*#__PURE__*/jsx(Checkbox, {
+        size: "small",
+        disableRipple: true,
+        className: styles.checkbox,
+        checked: state.selected
+      }), /*#__PURE__*/jsx(MiddleTruncatedText, {
+        className: styles.optionLabelContainer,
+        children: label
+      })]
+    }, id);
+  };
+  var isEmptyOptions = isEmpty(autocompleteOptions);
+  var paperContext = useMemo(function () {
+    return {
+      onOutsideClick: handleSearchClose,
+      isEmptyOptions: isEmptyOptions,
+      loading: loading,
+      AllSelectComponent: !isHiddenAllOption && multiple && !isEmptyOptions && /*#__PURE__*/jsx(SelectAllListItem, {
+        className: styles.selectAllCheckbox,
+        onClick: onAllSelectClick,
+        someSelected: someSelected,
+        allSelected: allSelected
+      }),
+      RecentSearchesComponent: RecentSearchesComponent && /*#__PURE__*/jsx(RecentSearchesComponent, {
+        title: "Recent Searches",
+        Icon: AccessTime,
+        dataStorage: dataStorage,
+        dataStorageKey: dataStorageKey,
+        maxCount: recentSearchesMaxCount,
+        isHidden: !isEmpty(inputValue),
+        onInputChange: function onInputChange(value) {
+          return setInputValue(value);
+        },
+        inputValue: debouncedInputValue
+      }),
+      GroupsComponent: !selectedGroup && isGrouped && GroupsComponent && /*#__PURE__*/jsx(GroupsComponent, {
+        onGroupClick: handleSelectedGroupChange,
+        groups: groups
+      })
+    };
+  }, [selectedGroup, loading, isGrouped, isEmptyOptions, inputValue, isHiddenAllOption, multiple, isEmptyOptions, debouncedInputValue, onClose, handleSearchClose]);
+  var PaperComponent = useMemo(function () {
+    return function (_ref6) {
+      var children = _ref6.children,
+        className = _ref6.className,
+        paperProps = _objectWithoutProperties(_ref6, _excluded6);
+      return /*#__PURE__*/jsxs(Paper, _objectSpread(_objectSpread({}, paperProps), {}, {
+        className: className,
+        inputRef: inputRef,
+        ref: paperRef,
+        children: [children, paperFooter]
+      }));
+    };
+  }, [paperFooter]);
+  var PopperComponent = useMemo(function () {
+    return function (props) {
+      var style = popperProps.style,
+        restPopperProps = _objectWithoutProperties(popperProps, _excluded7);
+      return /*#__PURE__*/jsx(Popper, _objectSpread(_objectSpread({}, props), {}, {
+        style: _objectSpread(_objectSpread({}, props.style), style),
+        placement: "bottom-start"
+      }, restPopperProps));
+    };
+  }, [popperProps]);
+  var handleRootFocus = function handleRootFocus() {
+    setIsSelectedLabelExpanded(false);
+    onFocus === null || onFocus === void 0 ? void 0 : onFocus();
+  };
+  return /*#__PURE__*/jsx(PaperContext.Provider, {
+    value: paperContext,
+    children: /*#__PURE__*/jsx(Autocomplete, _objectSpread(_objectSpread({}, omit(props, ['InputProps', 'isNullable', 'isOpenedFromParent'])), {}, {
+      PopperComponent: PopperComponent,
+      disableClearable: disableClearable,
+      onOpen: handleSearchOpen,
+      onClose: handleSearchClose,
+      open: isOpenedFromParent !== null && isOpenedFromParent !== void 0 ? isOpenedFromParent : isOpened,
+      onChange: handleAutocompleteChange,
+      forcePopupIcon: AutocompleteProps.forcePopupIcon,
+      fullWidth: true,
+      disabled: disabled,
+      value: value,
+      classes: autocompleteClasses,
+      renderInput: renderInput,
+      loading: loading,
+      options: autocompleteOptions,
+      renderGroup: renderGroup,
+      disableCloseOnSelect: multiple,
+      multiple: multiple,
+      renderOption: renderCustomOption || renderOption,
+      groupBy: isGrouped ? groupBy : null,
+      PaperComponent: PaperComponent,
+      ListboxComponent: ListboxComponent,
+      inputValue: inputValue,
+      getOptionLabel: getOptionLabel,
+      getOptionDisabled: AutocompleteProps === null || AutocompleteProps === void 0 ? void 0 : AutocompleteProps.getOptionDisabled,
+      onInputChange: handleInputChange,
+      loadingText: /*#__PURE__*/jsx("div", {
+        className: styles.label,
+        children: "Loading ..."
+      }),
+      noOptionsText: /*#__PURE__*/jsx("div", {
+        className: styles.label,
+        children: noOptionsText
+      }),
+      ListboxProps: ListboxProps,
+      onFocus: handleRootFocus
+    }))
+  });
+};
+Search.Groups = Groups;
+
+export { Search, Search as default };
+//# sourceMappingURL=Search.js.map