react-functional-select - npm Package Compare versions

Comparing version 1.2.9 to 1.2.10

dist/constants/defaults.d.ts

@@ -11,2 +11,2 @@ import { SelectedOption, FocusedOption, OptionData } from '../types';
 declare const FOCUSED_OPTION_DEFAULT: Readonly<FocusedOption>;
-export { MENU_ITEM_SIZE_DEFAULT, MENU_MAX_HEIGHT_DEFAULT, NO_OPTIONS_MSG_DEFAULT, PLACEHOLDER_DEFAULT, FOCUSED_MULTI_DEFAULT, ON_CHANGE_SINGLE_VALUE_DEFAULT, OPTIONS_DEFAULT, SELECTED_OPTION_DEFAULT, FOCUSED_OPTION_DEFAULT };
+export { OPTIONS_DEFAULT, PLACEHOLDER_DEFAULT, FOCUSED_MULTI_DEFAULT, FOCUSED_OPTION_DEFAULT, NO_OPTIONS_MSG_DEFAULT, MENU_ITEM_SIZE_DEFAULT, MENU_MAX_HEIGHT_DEFAULT, SELECTED_OPTION_DEFAULT, ON_CHANGE_SINGLE_VALUE_DEFAULT };

dist/constants/enums.d.ts

@@ -12,2 +12,2 @@ import { OptionIndex, ValueIndex } from '../types';
 }>;
-export { FilterMatchEnum, ValueIndexEnum, OptionIndexEnum };
+export { ValueIndexEnum, FilterMatchEnum, OptionIndexEnum };

dist/index-dev.umd.js

@@ -12,3 +12,3 @@ !function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react"),require("styled-components"),require("react-window")):"function"==typeof define&&define.amd?define(["exports","react","styled-components","react-window"],n):n((e=e||self).ReactFunctionalSelect={},e.React,e.StyledComponents,e.ReactWindow)}(this,(function(e,n,t,o){"use strict";var r="default"in n?n.default:n,i="default"in t?t.default:t,a=Object.freeze({color:{border:"#ced4da",danger:"#dc3545",primary:"#007bff",disabled:"#e9ecef",placeholder:"#6E7276",dangerLight:"rgba(220, 53, 69, 0.25)"},select:{},loader:{size:"0.625rem",padding:"0.375rem 0.75rem",color:"rgba(0, 123, 255, 0.42)"},icon:{color:"#cccccc",padding:"0.5rem 0.9375rem",hoverColor:"#A6A6A6",clear:{fontWeight:900,fontSize:"0.85em",transition:"color 0.15s ease-in-out",fontFamily:'"Helvetica", "Arial", sans-serif'},caret:{size:"7px",transition:"transform 0.225s ease-in-out, color 0.15s ease-in-out"}},control:{minHeight:"38px",borderWidth:"1px",borderStyle:"solid",borderRadius:"0.25rem",boxShadow:"0 0 0 0.2rem",padding:"0.375rem 0.75rem",boxShadowColor:"rgba(0, 123, 255, 0.25)",focusedBorderColor:"rgba(0, 123, 255, 0.75)",transition:"box-shadow 0.15s ease-in-out, border-color 0.15s ease-in-out"},menu:{width:"100%",margin:"0.5rem 0",padding:"0.15rem 0",borderRadius:"0.25rem",backgroundColor:"#fff",boxShadow:"0 0 0 1px rgba(0, 0, 0, 0.1), 0 4px 11px rgba(0, 0, 0, 0.1)",option:{textAlign:"left",selectedColor:"#fff",selectedBgColor:"#007bff",padding:"0.375rem 0.75rem",focusedBgColor:"rgba(0, 123, 255, 0.20)"}},noOptions:{fontSize:"1.25rem",margin:"0.25rem 0",color:"hsl(0, 0%, 60%)",padding:"0.375rem 0.75rem"},multiValue:{margin:"1px 2px",borderRadius:"0.25rem",backgroundColor:"#e7edf3",label:{fontSize:"0.825em",borderRadius:"0.25rem",padding:"1px 2px 1px 6px"},clear:{fontWeight:700,padding:"0 7px",fontSize:"0.675em",alignItems:"center",borderRadius:"0.25rem",transition:"color 0.15s ease-in-out, background-color 0.15s ease-in-out"}}});const l=t.keyframes`
   ${({theme:{noOptions:e}})=>`\n    color: ${e.color};\n    margin: ${e.margin};\n    padding: ${e.padding};\n    font-size: ${e.fontSize};\n  `}
-`,F=r.forwardRef(({width:e,itemSize:t,maxHeight:i,menuOptions:a,selectOption:l,noOptionsMsg:s,overscanCount:d,renderOptionLabel:c,focusedOptionIndex:u},p)=>{const f=n.useMemo(()=>({menuOptions:a,selectOption:l,renderOptionLabel:c,focusedOptionIndex:u}),[a,u,l,c]);return r.createElement(n.Fragment,null,r.createElement(o.FixedSizeList,{ref:p,width:e,itemSize:t,itemData:f,overscanCount:d,itemCount:a.length,height:Math.min(i,a.length*t)},z),!O(a)&&r.createElement(M,null,s))});F.displayName="Menu";const N=i.div`
+`,F=r.forwardRef(({width:e,itemSize:t,maxHeight:i,menuOptions:a,selectOption:l,noOptionsMsg:s,overscanCount:d,renderOptionLabel:c,focusedOptionIndex:u},p)=>{const f=n.useMemo(()=>({menuOptions:a,selectOption:l,renderOptionLabel:c,focusedOptionIndex:u}),[a,u,l,c]);return r.createElement(n.Fragment,null,r.createElement(o.FixedSizeList,{ref:p,width:e,itemSize:t,itemData:f,overscanCount:d,itemCount:a.length,height:Math.min(i,a.length*t)},z),!O(a)&&r.createElement(M,null,s))});F.displayName="Menu";const R=i.div`
   min-width: 0;
@@ -18,3 +18,3 @@ display: flex;
   ${({theme:{multiValue:e}})=>`\n    margin: ${e.margin};\n    border-radius: ${e.borderRadius};\n    background-color: ${e.backgroundColor};\n  `}
-`,R=i.div`
+`,D=i.div`
   overflow: hidden;
@@ -24,6 +24,6 @@ white-space: nowrap;
   ${({theme:{multiValue:{label:e}}})=>`\n    padding: ${e.padding};\n    font-size: ${e.fontSize};\n    border-radius: ${e.borderRadius};\n  `}
-`,D=i.div`
+`,N=i.div`
   display: flex;
   ${({isFocused:e,theme:{color:n,multiValue:{clear:t}}})=>`\n    padding: ${t.padding};\n    font-size: ${t.fontSize};\n    transition: ${t.transition};\n    align-items: ${t.alignItems};\n    font-weight: ${t.fontWeight};\n    border-radius: ${t.borderRadius};\n    background-color: ${e?n.dangerLight:"transparent"};\n    :hover {\n      color: ${n.danger};\n      background-color: ${n.dangerLight};\n    }\n  `}
-`,T=({data:e,value:n,isFocused:t,renderOptionLabel:o,removeSelectedOption:i})=>r.createElement(N,null,r.createElement(R,null,o(e)),r.createElement(D,{"aria-hidden":"true",isFocused:t,"data-testid":"rfs-clear-icon-mv",onTouchEnd:e=>i(n,e),onMouseDown:e=>i(n,e)},"X")),A=i.div`
+`,T=({data:e,value:n,isFocused:t,renderOptionLabel:o,removeSelectedOption:i})=>r.createElement(R,null,r.createElement(D,null,o(e)),r.createElement(N,{"aria-hidden":"true",isFocused:t,"data-testid":"rfs-clear-icon-mv",onTouchEnd:e=>i(n,e),onMouseDown:e=>i(n,e)},"X")),L=i.div`
   overflow: hidden;
@@ -35,3 +35,3 @@ position: absolute;
   max-width: calc(100% - 0.5rem);
-`,L=i.div`
+`,A=i.div`
   overflow: hidden;
@@ -43,3 +43,3 @@ position: absolute;
   color: ${({theme:e})=>e.color.placeholder};
-`,V=r.memo(({isMulti:e,inputValue:t,placeholder:o,selectedOption:i,focusedMultiValue:a,renderOptionLabel:l,removeSelectedOption:s})=>{if(t&&(!e||e&&!O(i)))return null;if(!O(i))return r.createElement(L,null,o);if(!e){const{data:e}=i[0];return r.createElement(A,null,l(e))}return r.createElement(n.Fragment,null,i.map(({data:e,value:n})=>r.createElement(T,{key:n,data:e,value:n,renderOptionLabel:l,isFocused:n===a,removeSelectedOption:s})))});V.displayName="Value";const B={display:"inline-block"},j={type:"text",spellCheck:!1,autoCorrect:"off",autoComplete:"off",autoCapitalize:"none","aria-autocomplete":"list","data-testid":"rfs-autosize-input"},P=i.div`
+`,V=r.memo(({isMulti:e,inputValue:t,placeholder:o,selectedOption:i,focusedMultiValue:a,renderOptionLabel:l,removeSelectedOption:s})=>{if(t&&(!e||e&&!O(i)))return null;if(!O(i))return r.createElement(A,null,o);if(!e){const{data:e}=i[0];return r.createElement(L,null,l(e))}return r.createElement(n.Fragment,null,i.map(({data:e,value:n})=>r.createElement(T,{key:n,data:e,value:n,renderOptionLabel:l,isFocused:n===a,removeSelectedOption:s})))});V.displayName="Value";const B={display:"inline-block"},j={type:"text",spellCheck:!1,autoCorrect:"off",autoComplete:"off",autoCapitalize:"none","aria-autocomplete":"list","data-testid":"rfs-autosize-input"},P=i.div`
   top: 0;
@@ -73,3 +73,3 @@ left: 0;
   ${()=>(()=>w.test(window.navigator.userAgent))()&&"::-ms-clear { display: none; }"}
-`,U=r.memo(r.forwardRef(({id:e,onBlur:t,onFocus:o,readOnly:i,onChange:a,ariaLabel:l,inputValue:s,addClassNames:d,ariaLabelledBy:c},u)=>{const p=n.useRef(null),[f,m]=n.useState(2);n.useEffect(()=>{p.current&&m(p.current.scrollWidth+2)},[s]);const g=Object.assign({},j,{"aria-label":l,"aria-labelledby":c,style:{width:f}});return r.createElement("div",{style:B},r.createElement(W,Object.assign({id:e,ref:u,onBlur:t,onFocus:o,value:s,readOnly:i},g,{onChange:i?void 0:a,className:d?"rfs-autosize-input":void 0})),r.createElement(P,{ref:p},s))}));U.displayName="AutosizeInput";const H=t.keyframes`
+`,U=r.memo(r.forwardRef(({id:e,onBlur:t,onFocus:o,readOnly:i,onChange:a,ariaLabel:l,inputValue:s,addClassNames:d,ariaLabelledBy:c},u)=>{const p=n.useRef(null),[f,m]=n.useState(2);n.useEffect(()=>{p.current&&m(p.current.scrollWidth+2)},[s]);const g=Object.assign({},j,{"aria-label":l,"aria-labelledby":c});return r.createElement("div",{style:B},r.createElement(W,Object.assign({id:e,ref:u,onBlur:t,onFocus:o,value:s,readOnly:i},g,{style:{width:f},onChange:i?void 0:a,className:d?"rfs-autosize-input":void 0})),r.createElement(P,{ref:p},s))}));U.displayName="AutosizeInput";const H=t.keyframes`
   0%, 80%, 100% {
@@ -138,3 +138,3 @@ transform: scale(0);
   clip-path: inset(50%);
-`,ee=({menuOpen:e,isFocused:n,ariaLabel:t,inputValue:o,optionCount:i,isSearchable:a,focusedOption:l,selectedOption:s})=>{if(!n)return null;const{label:d,index:c,isDisabled:u}=l,p=`Selected option: ${O(s)?s.map(e=>e.label).join(" "):"N/A"}`,f=`${i} result(s) available${o?` for search input ${o}`:""}.`,m=`Focused option: ${d||"N/A"}${u?" - disabled":""}, ${c+1} of ${i}.`,g=e?"Use Up and Down arrow keys to choose options, press Enter or Tab to select the currently focused option, press Escape to close the menu.":`${t||"Select"} is focused${a?", type to filter options":""}, press Down arrow key to open the menu.`;return r.createElement(Z,{"aria-live":"polite"},r.createElement("p",{id:"aria-selection-event"},p),r.createElement("p",{id:"aria-context"},`${m} ${f} ${g}`))},ne=i.div`
+`,ee=({menuOpen:e,isFocused:n,ariaLabel:t,inputValue:o,optionCount:i,isSearchable:a,focusedOption:l,selectedOption:s})=>{if(!n)return null;const{value:d,label:c,index:u,isDisabled:p}=l,f=`Selected option: ${O(s)?s.map(e=>e.label).join(" "):"N/A"}`,m=`${i} result(s) available${o?` for search input ${o}`:""}.`,g=d?`Focused option: ${c}${p?" - disabled":""}, ${u+1} of ${i}.`:"",b=e?"Use Up and Down arrow keys to choose options, press Enter or Tab to select the currently focused option, press Escape to close the menu.":`${t||"Select"} is focused${a?", type to filter options":""}, press Down arrow key to open the menu.`;return r.createElement(Z,{"aria-live":"polite"},r.createElement("p",null,f),r.createElement("p",null,`${g} ${m} ${b}`))},ne=i.div`
   position: relative;
@@ -179,2 +179,2 @@ box-sizing: border-box;
   }
-`,ie=r.forwardRef(({isMulti:o,inputId:i,selectId:l,autoFocus:s,isLoading:d,onKeyDown:b,clearIcon:h,caretIcon:v,isInvalid:w,ariaLabel:$,menuWidth:x,isDisabled:y,inputDelay:E,onMenuOpen:z,onMenuClose:M,onInputBlur:N,isClearable:R,themeConfig:D,loadingNode:T,onInputFocus:A,initialValue:L,addClassNames:B,ariaLabelledBy:j,onOptionChange:P,getOptionLabel:W,getOptionValue:H,openMenuOnFocus:q,isAriaLiveEnabled:X,menuOverscanCount:Y,blurInputOnSelect:K,renderOptionLabel:_,menuScrollDuration:G,filterIgnoreAccents:J,hideSelectedOptions:Z,getIsOptionDisabled:ie,getFilterOptionString:ae,isSearchable:le=!0,openMenuOnClick:se=!0,filterIgnoreCase:de=!0,tabSelectsOption:ce=!0,closeMenuOnSelect:ue=!0,scrollMenuIntoView:pe=!0,backspaceClearsValue:fe=!0,options:me=f,placeholder:ge="Select option..",filterMatchFrom:be=e.FilterMatchEnum.ANY,noOptionsMsg:he="No options",menuItemSize:ve=35,menuMaxHeight:we=300},$e)=>{const xe=n.useRef(),ye=n.useRef(null),Oe=n.useRef(null),Se=n.useRef(null),[Ee,Ce]=n.useState(""),[ke,Ie]=n.useState(!1),[ze,Me]=n.useState(!1),[Fe,Ne]=n.useState(g),[Re,De]=n.useState(null),{data:Te,value:Ae,label:Le,index:Ve,isDisabled:Be,isSelected:je}=Fe,Pe=n.useMemo(()=>S(D)?function e(n,t){const o=Object.assign({},n);return Object.keys(t).forEach(r=>{S(t[r])?o[r]=r in n?e(n[r],t[r]):t[r]||"":o[r]=t[r]}),o}(a,D):Object.assign({},a),[D]),We=n.useMemo(()=>W||(e=>e.label),[W]),Ue=n.useMemo(()=>H||(e=>e.value),[H]),He=n.useMemo(()=>_||We,[_,We]),qe=((e,t)=>{const[o,r]=n.useState(e);return n.useEffect(()=>{if(void 0===t)return;const n=setTimeout(()=>{r(e)},t);return()=>{clearTimeout(n)}},[e,t]),void 0===t?e:o})(Ee,E),[Xe,Ye]=n.useState(()=>k(L,Ue,We)),Ke=((e,t,o,r,i,a,l)=>{const s=n.useRef(!1),[d,c]=n.useState(o);return p(()=>{if(t){const n=e=>{a&&a(),e&&(s.current=!0,c(e))};C(e.current,r,i,n)}else l&&l(),s.current&&(s.current=!1,c(o))},[e,t,l,a,o,i,r]),d})(Oe,ke,we,G,pe,z,M),_e=I(me,qe,be,"boolean"!=typeof Z?!!o:Z,Xe,Ue,We,ie,ae,de,J),Ge=()=>{Se.current&&Se.current.blur()},Je=()=>{Se.current&&Se.current.focus()},Qe=e=>{ye.current&&ye.current.scrollToItem(e)},Ze=n.useCallback((e,n)=>{n&&(n.stopPropagation(),"mousedown"===n.type&&n.preventDefault()),Ye(n=>n.filter(n=>n.value!==e))},[]),en=n.useCallback(e=>{if(!O(_e))return void Ie(!0);const n=o?-1:_e.findIndex(e=>e.isSelected),t=n>-1?n:e===u.FIRST?0:_e.length-1;Ie(!0),Ne(Object.assign({index:t},_e[t])),Qe(t)},[o,_e]),nn=n.useCallback((e,n)=>{n?o&&Ze(e.value):Ye(n=>o?[...n,e]:[e]),("boolean"==typeof K?K:(()=>window.matchMedia("(pointer: coarse)").matches)())?Ge():ue&&(Ie(!1),Ce(""))},[o,ue,K,Ze]);n.useImperativeHandle($e,()=>({blur:Ge,focus:Je,clearValue:()=>{Ye(m),Ne(g)},setValue:e=>{const n=function(e,n,t){if(null==e)return m;const o=k(e).filter(e=>S(e)).map(e=>t(e)).filter((e,n,t)=>t.indexOf(e)===n);if(!O(o))return m;const r=[];for(const e of n)if(o.includes(t(e))&&(r.push(e),o.length===r.length))break;return r}(e,_e,Ue);Ye(n)},toggleMenu:e=>{!0===e||void 0===e&&!ke?(!ze&&Je(),en(u.FIRST)):Ge()}})),n.useEffect(()=>{s&&Je()},[s]),n.useEffect(()=>{ze&&q&&en(u.FIRST)},[ze,q,en]),p(()=>{if(P){const e=o?Xe.map(e=>e.data):O(Xe)?Xe[0].data:null;P(e)}},[o,Xe,P]),p(()=>{const e=!!_e.length&&(_e.length!==me.length||0===xe.current);O(_e)?(1===_e.length||e)&&(Ne(Object.assign({index:0},_e[0])),Qe(0)):Ne(g),xe.current=_e.length},[me,_e]);const tn=()=>{if(!Te||Be)return;nn({data:Te,value:Ae,label:Le},je)},on=e=>{if(!O(Xe))return;let n=-1;const t=Xe.length-1,o=Re?Xe.findIndex(e=>e.value===Re):-1,r=-1===(n=e===c.NEXT?o>-1&&o<t?o+1:-1:0!==o?-1===o?t:o-1:0)?null:Xe[n].value;Te&&Ne(g),r!==Re&&De(r)},rn=e=>{if(!O(_e))return;const n=e===u.DOWN?(Ve+1)%_e.length:Ve>0?Ve-1:_e.length-1;Re&&De(null),Ne(Object.assign({index:n},_e[n])),Qe(n)},an=e=>{y||(ze||Je(),ke?"INPUT"!==e.currentTarget.tagName&&(Ie(!1),Ee&&Ce("")):se&&en(u.FIRST),"INPUT"!==e.currentTarget.tagName&&e.preventDefault())},ln=n.useCallback(e=>{N&&N(e),Me(!1),Ie(!1),Ce("")},[N]),sn=n.useCallback(e=>{A&&A(e),Me(!0)},[A]),dn=n.useCallback(e=>{Ie(!0),Ce(e.currentTarget.value||"")},[]),cn=n.useCallback(e=>{e.stopPropagation(),"mousedown"===e.type&&e.preventDefault(),Ye(m),Je()},[]),un=n.useCallback(e=>{e.stopPropagation(),"mousedown"===e.type&&e.preventDefault(),Je(),ke?Ie(!1):en(u.FIRST)},[ke,en]);return r.createElement(t.ThemeProvider,{theme:Pe},r.createElement(ne,{id:l,onKeyDown:e=>{if(!(y||b&&(b(e),e.defaultPrevented))){switch(e.key){case"ArrowDown":ke?rn(u.DOWN):en(u.FIRST);break;case"ArrowUp":ke?rn(u.UP):en(u.LAST);break;case"ArrowLeft":if(!o||Ee)return;on(c.PREVIOUS);break;case"ArrowRight":if(!o||Ee)return;on(c.NEXT);break;case" ":if(Ee)return;if(!ke){en(u.FIRST);break}if(!Te)return;tn();break;case"Enter":ke&&229!==e.keyCode&&tn();break;case"Escape":ke&&(Ie(!1),Ce(""));break;case"Tab":if(!ke||!ce||!Te||e.shiftKey)return;tn();break;case"Delete":case"Backspace":if(Ee)return;if(Re){const e=Xe.findIndex(e=>e.value===Re),n=e>-1&&e<Xe.length-1?Xe[e+1].value:null;Ze(Re),De(n)}else{if(!fe)return;if(O(Xe))if(o){const{value:e}=Xe[Xe.length-1];Ze(e)}else R&&Ye(m)}break;default:return}e.preventDefault()}},"data-testid":"rfs-select-container",className:B?"rfs-select-container":void 0},r.createElement(oe,{isInvalid:w,isFocused:ze,isDisabled:y,onTouchEnd:an,onMouseDown:an,"data-testid":"rfs-control-container",className:B?"rfs-control-container":void 0},r.createElement(te,null,r.createElement(V,{isMulti:o,inputValue:Ee,placeholder:ge,selectedOption:Xe,focusedMultiValue:Re,renderOptionLabel:He,removeSelectedOption:Ze}),r.createElement(U,{id:i,ref:Se,ariaLabel:$,inputValue:Ee,onBlur:ln,onFocus:sn,addClassNames:B,onChange:dn,ariaLabelledBy:j,readOnly:y||!le||!!Re})),r.createElement(Q,{menuOpen:ke,clearIcon:h,caretIcon:v,isInvalid:w,isLoading:d,loadingNode:T,addClassNames:B,onClearMouseDown:cn,showClear:!(!R||y||!O(Xe)),onCaretMouseDown:y||se?void 0:un})),r.createElement(re,{ref:Oe,hideMenu:!ke,onMouseDown:e=>{e.stopPropagation(),e.preventDefault(),Je()},"data-testid":"rfs-menu-container",className:B?"rfs-menu-container":void 0},r.createElement(F,{ref:ye,maxHeight:Ke,itemSize:ve,menuOptions:_e,noOptionsMsg:he,selectOption:nn,overscanCount:Y,width:x||Pe.menu.width,focusedOptionIndex:Ve,renderOptionLabel:He})),X&&r.createElement(ee,{menuOpen:ke,isFocused:ze,ariaLabel:$,inputValue:Ee,isSearchable:le,focusedOption:Fe,selectedOption:Xe,optionCount:_e.length})))});ie.displayName="Select",e.Select=ie,Object.defineProperty(e,"__esModule",{value:!0})}));
+`,ie=r.forwardRef(({isMulti:o,inputId:i,selectId:l,autoFocus:s,isLoading:d,onKeyDown:b,clearIcon:h,caretIcon:v,isInvalid:w,ariaLabel:$,menuWidth:x,isDisabled:y,inputDelay:E,onMenuOpen:z,onMenuClose:M,onInputBlur:R,isClearable:D,themeConfig:N,loadingNode:T,onInputFocus:L,initialValue:A,addClassNames:B,ariaLabelledBy:j,onOptionChange:P,getOptionLabel:W,getOptionValue:H,openMenuOnFocus:q,isAriaLiveEnabled:X,menuOverscanCount:Y,blurInputOnSelect:K,renderOptionLabel:_,menuScrollDuration:G,filterIgnoreAccents:J,hideSelectedOptions:Z,getIsOptionDisabled:ie,getFilterOptionString:ae,isSearchable:le=!0,openMenuOnClick:se=!0,filterIgnoreCase:de=!0,tabSelectsOption:ce=!0,closeMenuOnSelect:ue=!0,scrollMenuIntoView:pe=!0,backspaceClearsValue:fe=!0,options:me=f,placeholder:ge="Select option..",filterMatchFrom:be=e.FilterMatchEnum.ANY,noOptionsMsg:he="No options",menuItemSize:ve=35,menuMaxHeight:we=300},$e)=>{const xe=n.useRef(),ye=n.useRef(null),Oe=n.useRef(null),Se=n.useRef(null),[Ee,Ce]=n.useState(""),[ke,Ie]=n.useState(!1),[ze,Me]=n.useState(!1),[Fe,Re]=n.useState(g),[De,Ne]=n.useState(null),Te=n.useMemo(()=>S(N)?function e(n,t){const o=Object.assign({},n);return Object.keys(t).forEach(r=>{S(t[r])?o[r]=r in n?e(n[r],t[r]):t[r]||"":o[r]=t[r]}),o}(a,N):Object.assign({},a),[N]),Le=n.useMemo(()=>W||(e=>e.label),[W]),Ae=n.useMemo(()=>H||(e=>e.value),[H]),Ve=n.useMemo(()=>_||Le,[_,Le]),Be=((e,t)=>{const[o,r]=n.useState(e);return n.useEffect(()=>{if(void 0===t)return;const n=setTimeout(()=>{r(e)},t);return()=>{clearTimeout(n)}},[e,t]),void 0===t?e:o})(Ee,E),[je,Pe]=n.useState(()=>k(A,Ae,Le)),We=((e,t,o,r,i,a,l)=>{const s=n.useRef(!1),[d,c]=n.useState(o);return p(()=>{if(t){const n=e=>{a&&a(),e&&(s.current=!0,c(e))};C(e.current,r,i,n)}else l&&l(),s.current&&(s.current=!1,c(o))},[e,t,l,a,o,i,r]),d})(Oe,ke,we,G,pe,z,M),Ue=I(me,Be,be,"boolean"!=typeof Z?!!o:Z,je,Ae,Le,ie,ae,de,J),He=()=>{Se.current&&Se.current.blur()},qe=()=>{Se.current&&Se.current.focus()},Xe=e=>{ye.current&&ye.current.scrollToItem(e)},Ye=n.useCallback((e,n)=>{n&&(n.stopPropagation(),"mousedown"===n.type&&n.preventDefault()),Pe(n=>n.filter(n=>n.value!==e))},[]),Ke=n.useCallback(e=>{if(!O(Ue))return void Ie(!0);const n=o?-1:Ue.findIndex(e=>e.isSelected),t=n>-1?n:e===u.FIRST?0:Ue.length-1;Ie(!0),Re(Object.assign({index:t},Ue[t])),Xe(t)},[o,Ue]),_e=n.useCallback((e,n)=>{n?o&&Ye(e.value):Pe(n=>o?[...n,e]:[e]),("boolean"==typeof K?K:(()=>window.matchMedia("(pointer: coarse)").matches)())?He():ue&&(Ie(!1),Ce(""))},[o,ue,K,Ye]);n.useImperativeHandle($e,()=>({blur:He,focus:qe,clearValue:()=>{Pe(m),Re(g)},setValue:e=>{const n=function(e,n,t){if(null==e)return m;const o=k(e).filter(e=>S(e)).map(e=>t(e)).filter((e,n,t)=>t.indexOf(e)===n);if(!O(o))return m;const r=[];for(const e of n)if(o.includes(t(e))&&(r.push(e),o.length===r.length))break;return r}(e,Ue,Ae);Pe(n)},toggleMenu:e=>{!0===e||void 0===e&&!ke?(!ze&&qe(),Ke(u.FIRST)):He()}})),n.useEffect(()=>{s&&qe()},[s]),n.useEffect(()=>{ze&&q&&Ke(u.FIRST)},[ze,q,Ke]),p(()=>{if(P){const e=o?je.map(e=>e.data):O(je)?je[0].data:null;P(e)}},[o,je,P]),p(()=>{const e=!!Ue.length&&(Ue.length!==me.length||0===xe.current);O(Ue)?(1===Ue.length||e)&&(Re(Object.assign({index:0},Ue[0])),Xe(0)):Re(g),xe.current=Ue.length},[me,Ue]);const Ge=()=>{const{data:e,value:n,label:t,isSelected:o,isDisabled:r}=Fe;e&&!r&&_e({data:e,value:n,label:t},o)},Je=e=>{if(!O(je))return;let n=-1;const t=je.length-1,o=De?je.findIndex(e=>e.value===De):-1,r=-1===(n=e===c.NEXT?o>-1&&o<t?o+1:-1:0!==o?-1===o?t:o-1:0)?null:je[n].value;Fe.data&&Re(g),r!==De&&Ne(r)},Qe=e=>{if(!O(Ue))return;const n=e===u.DOWN?(Fe.index+1)%Ue.length:Fe.index>0?Fe.index-1:Ue.length-1;De&&Ne(null),Re(Object.assign({index:n},Ue[n])),Xe(n)},Ze=e=>{y||(ze||qe(),ke?"INPUT"!==e.currentTarget.tagName&&(Ie(!1),Ee&&Ce("")):se&&Ke(u.FIRST),"INPUT"!==e.currentTarget.tagName&&e.preventDefault())},en=n.useCallback(e=>{R&&R(e),Me(!1),Ie(!1),Ce("")},[R]),nn=n.useCallback(e=>{L&&L(e),Me(!0)},[L]),tn=n.useCallback(e=>{Ie(!0),Ce(e.currentTarget.value||"")},[]),on=n.useCallback(e=>{e.stopPropagation(),"mousedown"===e.type&&e.preventDefault(),Pe(m),qe()},[]),rn=n.useCallback(e=>{e.stopPropagation(),"mousedown"===e.type&&e.preventDefault(),qe(),ke?Ie(!1):Ke(u.FIRST)},[ke,Ke]);return r.createElement(t.ThemeProvider,{theme:Te},r.createElement(ne,{id:l,onKeyDown:e=>{if(!(y||b&&(b(e),e.defaultPrevented))){switch(e.key){case"ArrowDown":ke?Qe(u.DOWN):Ke(u.FIRST);break;case"ArrowUp":ke?Qe(u.UP):Ke(u.LAST);break;case"ArrowLeft":if(!o||Ee)return;Je(c.PREVIOUS);break;case"ArrowRight":if(!o||Ee)return;Je(c.NEXT);break;case" ":if(Ee)return;if(!ke){Ke(u.FIRST);break}if(!Fe.data)return;Ge();break;case"Enter":ke&&229!==e.keyCode&&Ge();break;case"Escape":ke&&(Ie(!1),Ce(""));break;case"Tab":if(!ke||!ce||!Fe.data||e.shiftKey)return;Ge();break;case"Delete":case"Backspace":if(Ee)return;if(De){const e=je.findIndex(e=>e.value===De),n=e>-1&&e<je.length-1?je[e+1].value:null;Ye(De),Ne(n)}else{if(!fe)return;if(O(je))if(o){const{value:e}=je[je.length-1];Ye(e)}else D&&Pe(m)}break;default:return}e.preventDefault()}},"data-testid":"rfs-select-container",className:B?"rfs-select-container":void 0},r.createElement(oe,{isInvalid:w,isFocused:ze,isDisabled:y,onTouchEnd:Ze,onMouseDown:Ze,"data-testid":"rfs-control-container",className:B?"rfs-control-container":void 0},r.createElement(te,null,r.createElement(V,{isMulti:o,inputValue:Ee,placeholder:ge,selectedOption:je,focusedMultiValue:De,renderOptionLabel:Ve,removeSelectedOption:Ye}),r.createElement(U,{id:i,ref:Se,ariaLabel:$,inputValue:Ee,onBlur:en,onFocus:nn,addClassNames:B,onChange:tn,ariaLabelledBy:j,readOnly:y||!le||!!De})),r.createElement(Q,{menuOpen:ke,clearIcon:h,caretIcon:v,isInvalid:w,isLoading:d,loadingNode:T,addClassNames:B,onClearMouseDown:on,showClear:!(!D||y||!O(je)),onCaretMouseDown:y||se?void 0:rn})),r.createElement(re,{ref:Oe,hideMenu:!ke,onMouseDown:e=>{e.stopPropagation(),e.preventDefault(),qe()},"data-testid":"rfs-menu-container",className:B?"rfs-menu-container":void 0},r.createElement(F,{ref:ye,maxHeight:We,itemSize:ve,menuOptions:Ue,noOptionsMsg:he,selectOption:_e,overscanCount:Y,width:x||Te.menu.width,renderOptionLabel:Ve,focusedOptionIndex:Fe.index})),X&&r.createElement(ee,{menuOpen:ke,isFocused:ze,ariaLabel:$,inputValue:Ee,isSearchable:le,focusedOption:Fe,selectedOption:je,optionCount:Ue.length})))});ie.displayName="Select",e.Select=ie,Object.defineProperty(e,"__esModule",{value:!0})}));

dist/index-prod.umd.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("styled-components"),require("react-window")):"function"==typeof define&&define.amd?define(["exports","react","styled-components","react-window"],t):t((e=e||self).ReactFunctionalSelect={},e.React,e.StyledComponents,e.ReactWindow)}(this,(function(e,t,n,o){"use strict";var r="default"in t?t.default:t,i="default"in n?n.default:n,a=Object.freeze({color:{border:"#ced4da",danger:"#dc3545",primary:"#007bff",disabled:"#e9ecef",placeholder:"#6E7276",dangerLight:"rgba(220, 53, 69, 0.25)"},select:{},loader:{size:"0.625rem",padding:"0.375rem 0.75rem",color:"rgba(0, 123, 255, 0.42)"},icon:{color:"#cccccc",padding:"0.5rem 0.9375rem",hoverColor:"#A6A6A6",clear:{fontWeight:900,fontSize:"0.85em",transition:"color 0.15s ease-in-out",fontFamily:'"Helvetica", "Arial", sans-serif'},caret:{size:"7px",transition:"transform 0.225s ease-in-out, color 0.15s ease-in-out"}},control:{minHeight:"38px",borderWidth:"1px",borderStyle:"solid",borderRadius:"0.25rem",boxShadow:"0 0 0 0.2rem",padding:"0.375rem 0.75rem",boxShadowColor:"rgba(0, 123, 255, 0.25)",focusedBorderColor:"rgba(0, 123, 255, 0.75)",transition:"box-shadow 0.15s ease-in-out, border-color 0.15s ease-in-out"},menu:{width:"100%",margin:"0.5rem 0",padding:"0.15rem 0",borderRadius:"0.25rem",backgroundColor:"#fff",boxShadow:"0 0 0 1px rgba(0, 0, 0, 0.1), 0 4px 11px rgba(0, 0, 0, 0.1)",option:{textAlign:"left",selectedColor:"#fff",selectedBgColor:"#007bff",padding:"0.375rem 0.75rem",focusedBgColor:"rgba(0, 123, 255, 0.20)"}},noOptions:{fontSize:"1.25rem",margin:"0.25rem 0",color:"hsl(0, 0%, 60%)",padding:"0.375rem 0.75rem"},multiValue:{margin:"1px 2px",borderRadius:"0.25rem",backgroundColor:"#e7edf3",label:{fontSize:"0.825em",borderRadius:"0.25rem",padding:"1px 2px 1px 6px"},clear:{fontWeight:700,padding:"0 7px",fontSize:"0.675em",alignItems:"center",borderRadius:"0.25rem",transition:"color 0.15s ease-in-out, background-color 0.15s ease-in-out"}}});const l=n.keyframes`
+!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react"),require("styled-components"),require("react-window")):"function"==typeof define&&define.amd?define(["exports","react","styled-components","react-window"],n):n((e=e||self).ReactFunctionalSelect={},e.React,e.StyledComponents,e.ReactWindow)}(this,(function(e,n,t,o){"use strict";var r="default"in n?n.default:n,i="default"in t?t.default:t,a=Object.freeze({color:{border:"#ced4da",danger:"#dc3545",primary:"#007bff",disabled:"#e9ecef",placeholder:"#6E7276",dangerLight:"rgba(220, 53, 69, 0.25)"},select:{},loader:{size:"0.625rem",padding:"0.375rem 0.75rem",color:"rgba(0, 123, 255, 0.42)"},icon:{color:"#cccccc",padding:"0.5rem 0.9375rem",hoverColor:"#A6A6A6",clear:{fontWeight:900,fontSize:"0.85em",transition:"color 0.15s ease-in-out",fontFamily:'"Helvetica", "Arial", sans-serif'},caret:{size:"7px",transition:"transform 0.225s ease-in-out, color 0.15s ease-in-out"}},control:{minHeight:"38px",borderWidth:"1px",borderStyle:"solid",borderRadius:"0.25rem",boxShadow:"0 0 0 0.2rem",padding:"0.375rem 0.75rem",boxShadowColor:"rgba(0, 123, 255, 0.25)",focusedBorderColor:"rgba(0, 123, 255, 0.75)",transition:"box-shadow 0.15s ease-in-out, border-color 0.15s ease-in-out"},menu:{width:"100%",margin:"0.5rem 0",padding:"0.15rem 0",borderRadius:"0.25rem",backgroundColor:"#fff",boxShadow:"0 0 0 1px rgba(0, 0, 0, 0.1), 0 4px 11px rgba(0, 0, 0, 0.1)",option:{textAlign:"left",selectedColor:"#fff",selectedBgColor:"#007bff",padding:"0.375rem 0.75rem",focusedBgColor:"rgba(0, 123, 255, 0.20)"}},noOptions:{fontSize:"1.25rem",margin:"0.25rem 0",color:"hsl(0, 0%, 60%)",padding:"0.375rem 0.75rem"},multiValue:{margin:"1px 2px",borderRadius:"0.25rem",backgroundColor:"#e7edf3",label:{fontSize:"0.825em",borderRadius:"0.25rem",padding:"1px 2px 1px 6px"},clear:{fontWeight:700,padding:"0 7px",fontSize:"0.675em",alignItems:"center",borderRadius:"0.25rem",transition:"color 0.15s ease-in-out, background-color 0.15s ease-in-out"}}});const l=t.keyframes`
   from {
@@ -7,8 +7,8 @@ opacity: 0;
   }
-`,s=n.css`
+`,s=t.css`
   animation: ${l} 0.225s ease-in-out forwards;
-`;var d;(d=e.FilterMatchEnum||(e.FilterMatchEnum={})).ANY="any",d.START="start";const c=Object.freeze({NEXT:0,PREVIOUS:1}),u=Object.freeze({UP:0,DOWN:1,FIRST:2,LAST:3}),p=(e,n)=>{const o=(()=>{const e=t.useRef(!0);return e.current?(e.current=!1,!0):e.current})();t.useEffect(()=>{!o&&e()},n)},f=[],m=[],g=Object.freeze({index:-1}),b=/^\s+|\s+$/g,h=/(auto|scroll)/,v=/[\u0300-\u036f]/g,w=/MSIE |Trident\/|Edge\//;function $(e){return e===document.documentElement||e===document.body||e===window}function x(e){return $(e)?window.pageYOffset:e.scrollTop}function y(e,t,n=300,o){let r=0;const i=x(e),a=t-i;window.requestAnimationFrame((function t(){var l,s,d;s=a*((d=(d=r+=5)/n-1)*d*d+1)+i,$(l=e)?window.scrollTo(0,s):l.scrollTop=s,r<n?window.requestAnimationFrame(t):o&&o()}))}function O(e){return Array.isArray(e)&&!!e.length}function S(e){return e&&"object"==typeof e&&!Array.isArray(e)}function E(e,t,n){let o=e.replace(b,"");return t&&(o=o.toLowerCase()),n?function(e){return e.normalize("NFD").replace(v,"")}(o):o}function C(e,t,n,o){if(!n||!e||!e.getBoundingClientRect)return void o();const{top:r,bottom:i,height:a}=e.getBoundingClientRect(),l=window.innerHeight;if(l-r>=a)return void o();const s=function(e){let t=getComputedStyle(e);const n="absolute"===t.position;if("fixed"===t.position)return document.documentElement;for(let o=e;o=o?o.parentElement:null;)if(t=getComputedStyle(o),(!n||"static"!==t.position)&&h.test(`${t.overflow}${t.overflowY}${t.overflowX}`))return o;return document.documentElement}(e),d=x(s),c=s.getBoundingClientRect().height-d-r;c<a?o(c):y(s,i-l+d+parseInt(getComputedStyle(e).marginBottom||"0",10),t,o)}function k(e,t,n){const o=Array.isArray(e)?e.filter(Boolean):S(e)?[e]:m;return t&&n&&O(o)?o.map(e=>({data:e,value:t(e),label:n(e)})):o}const I=(n,o,r,i,a,l,s,d,c,u,p)=>{const[m,g]=t.useState(f);return t.useEffect(()=>{const t=r===e.FilterMatchEnum.ANY,p=a.length?a.map(e=>e.value):void 0,m=E(o,u,u),b=d||(e=>!!e.isDisabled),h=c||(e=>String(e.label)),v=e=>{const n=l(e),o=Object.assign({data:e,value:n,label:s(e)},b(e)&&{isDisabled:!0},{},p&&p.includes(n)&&{isSelected:!0});if(!(m&&!(e=>{const n=E(h(e),u,u);return t?n.indexOf(m)>-1:n.substr(0,m.length)===m})(o)||i&&o.isSelected))return o},w=n.reduce((e,t)=>{const n=v(t);return n&&e.push(n),e},[])||f;g(w)},[n,a,i,r,u,p,o,c,d,l,s]),m},z=r.memo(({index:e,style:t,data:{menuOptions:n,selectOption:o,renderOptionLabel:i,focusedOptionIndex:a}})=>{const{data:l,value:s,label:d,isDisabled:c,isSelected:u}=n[e],p="rfs-option"+(c?" rfs-option-disabled":"")+(u?" rfs-option-selected":"")+(e===a?" rfs-option-focused":"");return r.createElement("div",{style:t,className:p,onClick:c?void 0:()=>o({data:l,value:s,label:d},u)},i(l))},o.areEqual);z.displayName="Option";const M=i.div`
+`;var d;(d=e.FilterMatchEnum||(e.FilterMatchEnum={})).ANY="any",d.START="start";const c=Object.freeze({NEXT:0,PREVIOUS:1}),u=Object.freeze({UP:0,DOWN:1,FIRST:2,LAST:3}),p=(e,t)=>{const o=(()=>{const e=n.useRef(!0);return e.current?(e.current=!1,!0):e.current})();n.useEffect(()=>{!o&&e()},t)},f=[],m=[],g=Object.freeze({index:-1}),b=/^\s+|\s+$/g,h=/(auto|scroll)/,v=/[\u0300-\u036f]/g,w=/MSIE |Trident\/|Edge\//;function $(e){return e===document.documentElement||e===document.body||e===window}function x(e){return $(e)?window.pageYOffset:e.scrollTop}function y(e,n,t=300,o){let r=0;const i=x(e),a=n-i;window.requestAnimationFrame((function n(){var l,s,d;s=a*((d=(d=r+=5)/t-1)*d*d+1)+i,$(l=e)?window.scrollTo(0,s):l.scrollTop=s,r<t?window.requestAnimationFrame(n):o&&o()}))}function O(e){return Array.isArray(e)&&!!e.length}function S(e){return e&&"object"==typeof e&&!Array.isArray(e)}function E(e,n,t){let o=e.replace(b,"");return n&&(o=o.toLowerCase()),t?function(e){return e.normalize("NFD").replace(v,"")}(o):o}function C(e,n,t,o){if(!t||!e||!e.getBoundingClientRect)return void o();const{top:r,bottom:i,height:a}=e.getBoundingClientRect(),l=window.innerHeight;if(l-r>=a)return void o();const s=function(e){let n=getComputedStyle(e);const t="absolute"===n.position;if("fixed"===n.position)return document.documentElement;for(let o=e;o=o?o.parentElement:null;)if(n=getComputedStyle(o),(!t||"static"!==n.position)&&h.test(`${n.overflow}${n.overflowY}${n.overflowX}`))return o;return document.documentElement}(e),d=x(s),c=s.getBoundingClientRect().height-d-r;c<a?o(c):y(s,i-l+d+parseInt(getComputedStyle(e).marginBottom||"0",10),n,o)}function k(e,n,t){const o=Array.isArray(e)?e.filter(Boolean):S(e)?[e]:m;return n&&t&&O(o)?o.map(e=>({data:e,value:n(e),label:t(e)})):o}const I=(t,o,r,i,a,l,s,d,c,u,p)=>{const[m,g]=n.useState(f);return n.useEffect(()=>{const n=r===e.FilterMatchEnum.ANY,p=a.length?a.map(e=>e.value):void 0,m=E(o,u,u),b=d||(e=>!!e.isDisabled),h=c||(e=>String(e.label)),v=e=>{const t=l(e),o=Object.assign({data:e,value:t,label:s(e)},b(e)&&{isDisabled:!0},{},p&&p.includes(t)&&{isSelected:!0});if(!(m&&!(e=>{const t=E(h(e),u,u);return n?t.indexOf(m)>-1:t.substr(0,m.length)===m})(o)||i&&o.isSelected))return o},w=t.reduce((e,n)=>{const t=v(n);return t&&e.push(t),e},[])||f;g(w)},[t,a,i,r,u,p,o,c,d,l,s]),m},z=r.memo(({index:e,style:n,data:{menuOptions:t,selectOption:o,renderOptionLabel:i,focusedOptionIndex:a}})=>{const{data:l,value:s,label:d,isDisabled:c,isSelected:u}=t[e],p="rfs-option"+(c?" rfs-option-disabled":"")+(u?" rfs-option-selected":"")+(e===a?" rfs-option-focused":"");return r.createElement("div",{style:n,className:p,onClick:c?void 0:()=>o({data:l,value:s,label:d},u)},i(l))},o.areEqual);z.displayName="Option";const M=i.div`
   text-align: center;
   ${({theme:{noOptions:e}})=>`\n    color: ${e.color};\n    margin: ${e.margin};\n    padding: ${e.padding};\n    font-size: ${e.fontSize};\n  `}
-`,F=r.forwardRef(({width:e,itemSize:n,maxHeight:i,menuOptions:a,selectOption:l,noOptionsMsg:s,overscanCount:d,renderOptionLabel:c,focusedOptionIndex:u},p)=>{const f=t.useMemo(()=>({menuOptions:a,selectOption:l,renderOptionLabel:c,focusedOptionIndex:u}),[a,u,l,c]);return r.createElement(t.Fragment,null,r.createElement(o.FixedSizeList,{ref:p,width:e,itemSize:n,itemData:f,overscanCount:d,itemCount:a.length,height:Math.min(i,a.length*n)},z),!O(a)&&r.createElement(M,null,s))});F.displayName="Menu";const N=i.div`
+`,F=r.forwardRef(({width:e,itemSize:t,maxHeight:i,menuOptions:a,selectOption:l,noOptionsMsg:s,overscanCount:d,renderOptionLabel:c,focusedOptionIndex:u},p)=>{const f=n.useMemo(()=>({menuOptions:a,selectOption:l,renderOptionLabel:c,focusedOptionIndex:u}),[a,u,l,c]);return r.createElement(n.Fragment,null,r.createElement(o.FixedSizeList,{ref:p,width:e,itemSize:t,itemData:f,overscanCount:d,itemCount:a.length,height:Math.min(i,a.length*t)},z),!O(a)&&r.createElement(M,null,s))});F.displayName="Menu";const R=i.div`
   min-width: 0;
@@ -18,3 +18,3 @@ display: flex;
   ${({theme:{multiValue:e}})=>`\n    margin: ${e.margin};\n    border-radius: ${e.borderRadius};\n    background-color: ${e.backgroundColor};\n  `}
-`,R=i.div`
+`,D=i.div`
   overflow: hidden;
@@ -24,6 +24,6 @@ white-space: nowrap;
   ${({theme:{multiValue:{label:e}}})=>`\n    padding: ${e.padding};\n    font-size: ${e.fontSize};\n    border-radius: ${e.borderRadius};\n  `}
-`,D=i.div`
+`,N=i.div`
   display: flex;
-  ${({isFocused:e,theme:{color:t,multiValue:{clear:n}}})=>`\n    padding: ${n.padding};\n    font-size: ${n.fontSize};\n    transition: ${n.transition};\n    align-items: ${n.alignItems};\n    font-weight: ${n.fontWeight};\n    border-radius: ${n.borderRadius};\n    background-color: ${e?t.dangerLight:"transparent"};\n    :hover {\n      color: ${t.danger};\n      background-color: ${t.dangerLight};\n    }\n  `}
-`,T=({data:e,value:t,isFocused:n,renderOptionLabel:o,removeSelectedOption:i})=>r.createElement(N,null,r.createElement(R,null,o(e)),r.createElement(D,{"aria-hidden":"true",isFocused:n,"data-testid":void 0,onTouchEnd:e=>i(t,e),onMouseDown:e=>i(t,e)},"X")),A=i.div`
+  ${({isFocused:e,theme:{color:n,multiValue:{clear:t}}})=>`\n    padding: ${t.padding};\n    font-size: ${t.fontSize};\n    transition: ${t.transition};\n    align-items: ${t.alignItems};\n    font-weight: ${t.fontWeight};\n    border-radius: ${t.borderRadius};\n    background-color: ${e?n.dangerLight:"transparent"};\n    :hover {\n      color: ${n.danger};\n      background-color: ${n.dangerLight};\n    }\n  `}
+`,T=({data:e,value:n,isFocused:t,renderOptionLabel:o,removeSelectedOption:i})=>r.createElement(R,null,r.createElement(D,null,o(e)),r.createElement(N,{"aria-hidden":"true",isFocused:t,"data-testid":void 0,onTouchEnd:e=>i(n,e),onMouseDown:e=>i(n,e)},"X")),L=i.div`
   overflow: hidden;
@@ -35,3 +35,3 @@ position: absolute;
   max-width: calc(100% - 0.5rem);
-`,L=i.div`
+`,A=i.div`
   overflow: hidden;
@@ -43,3 +43,3 @@ position: absolute;
   color: ${({theme:e})=>e.color.placeholder};
-`,V=r.memo(({isMulti:e,inputValue:n,placeholder:o,selectedOption:i,focusedMultiValue:a,renderOptionLabel:l,removeSelectedOption:s})=>{if(n&&(!e||e&&!O(i)))return null;if(!O(i))return r.createElement(L,null,o);if(!e){const{data:e}=i[0];return r.createElement(A,null,l(e))}return r.createElement(t.Fragment,null,i.map(({data:e,value:t})=>r.createElement(T,{key:t,data:e,value:t,renderOptionLabel:l,isFocused:t===a,removeSelectedOption:s})))});V.displayName="Value";const B={display:"inline-block"},j={type:"text",spellCheck:!1,autoCorrect:"off",autoComplete:"off",autoCapitalize:"none","aria-autocomplete":"list","data-testid":void 0},P=i.div`
+`,V=r.memo(({isMulti:e,inputValue:t,placeholder:o,selectedOption:i,focusedMultiValue:a,renderOptionLabel:l,removeSelectedOption:s})=>{if(t&&(!e||e&&!O(i)))return null;if(!O(i))return r.createElement(A,null,o);if(!e){const{data:e}=i[0];return r.createElement(L,null,l(e))}return r.createElement(n.Fragment,null,i.map(({data:e,value:n})=>r.createElement(T,{key:n,data:e,value:n,renderOptionLabel:l,isFocused:n===a,removeSelectedOption:s})))});V.displayName="Value";const B={display:"inline-block"},j={type:"text",spellCheck:!1,autoCorrect:"off",autoComplete:"off",autoCapitalize:"none","aria-autocomplete":"list","data-testid":void 0},P=i.div`
   top: 0;
@@ -73,3 +73,3 @@ left: 0;
   ${()=>(()=>w.test(window.navigator.userAgent))()&&"::-ms-clear { display: none; }"}
-`,U=r.memo(r.forwardRef(({id:e,onBlur:n,onFocus:o,readOnly:i,onChange:a,ariaLabel:l,inputValue:s,addClassNames:d,ariaLabelledBy:c},u)=>{const p=t.useRef(null),[f,m]=t.useState(2);t.useEffect(()=>{p.current&&m(p.current.scrollWidth+2)},[s]);const g=Object.assign({},j,{"aria-label":l,"aria-labelledby":c,style:{width:f}});return r.createElement("div",{style:B},r.createElement(W,Object.assign({id:e,ref:u,onBlur:n,onFocus:o,value:s,readOnly:i},g,{onChange:i?void 0:a,className:d?"rfs-autosize-input":void 0})),r.createElement(P,{ref:p},s))}));U.displayName="AutosizeInput";const H=n.keyframes`
+`,U=r.memo(r.forwardRef(({id:e,onBlur:t,onFocus:o,readOnly:i,onChange:a,ariaLabel:l,inputValue:s,addClassNames:d,ariaLabelledBy:c},u)=>{const p=n.useRef(null),[f,m]=n.useState(2);n.useEffect(()=>{p.current&&m(p.current.scrollWidth+2)},[s]);const g=Object.assign({},j,{"aria-label":l,"aria-labelledby":c});return r.createElement("div",{style:B},r.createElement(W,Object.assign({id:e,ref:u,onBlur:t,onFocus:o,value:s,readOnly:i},g,{style:{width:f},onChange:i?void 0:a,className:d?"rfs-autosize-input":void 0})),r.createElement(P,{ref:p},s))}));U.displayName="AutosizeInput";const H=t.keyframes`
   0%, 80%, 100% {
@@ -120,3 +120,3 @@ transform: scale(0);
 
-  ${({menuOpen:e,isInvalid:t,theme:{color:n}})=>e&&`\n      transform: rotate(180deg);\n      color: ${t?n.danger:n.caretActive||n.primary};\n    `}
+  ${({menuOpen:e,isInvalid:n,theme:{color:t}})=>e&&`\n      transform: rotate(180deg);\n      color: ${n?t.danger:t.caretActive||t.primary};\n    `}
 `,J=i.div`
@@ -128,3 +128,3 @@ width: 1px;
   background-color: ${({theme:e})=>e.color.iconSeparator||e.color.border};
-`,Q=r.memo(({menuOpen:e,clearIcon:t,caretIcon:n,isInvalid:o,showClear:i,isLoading:a,loadingNode:l,addClassNames:s,onCaretMouseDown:d,onClearMouseDown:c})=>r.createElement(Y,null,i&&!a&&r.createElement(K,{"aria-hidden":"true",onTouchEnd:c,onMouseDown:c,"data-testid":void 0},t||r.createElement(_,{className:s?"rfs-clear-icon":void 0},"X")),a&&(l||r.createElement(X,null)),r.createElement(J,null),r.createElement(K,{"aria-hidden":"true",onTouchEnd:d,onMouseDown:d,"data-testid":void 0},n||r.createElement(G,{menuOpen:e,isInvalid:o,className:s?"rfs-caret-icon":void 0}))));Q.displayName="IndicatorIcons";const Z=i.span`
+`,Q=r.memo(({menuOpen:e,clearIcon:n,caretIcon:t,isInvalid:o,showClear:i,isLoading:a,loadingNode:l,addClassNames:s,onCaretMouseDown:d,onClearMouseDown:c})=>r.createElement(Y,null,i&&!a&&r.createElement(K,{"aria-hidden":"true",onTouchEnd:c,onMouseDown:c,"data-testid":void 0},n||r.createElement(_,{className:s?"rfs-clear-icon":void 0},"X")),a&&(l||r.createElement(X,null)),r.createElement(J,null),r.createElement(K,{"aria-hidden":"true",onTouchEnd:d,onMouseDown:d,"data-testid":void 0},t||r.createElement(G,{menuOpen:e,isInvalid:o,className:s?"rfs-caret-icon":void 0}))));Q.displayName="IndicatorIcons";const Z=i.span`
   border: 0;
@@ -140,3 +140,3 @@ padding: 0;
   clip-path: inset(50%);
-`,ee=({menuOpen:e,isFocused:t,ariaLabel:n,inputValue:o,optionCount:i,isSearchable:a,focusedOption:l,selectedOption:s})=>{if(!t)return null;const{label:d,index:c,isDisabled:u}=l,p=`Selected option: ${O(s)?s.map(e=>e.label).join(" "):"N/A"}`,f=`${i} result(s) available${o?` for search input ${o}`:""}.`,m=`Focused option: ${d||"N/A"}${u?" - disabled":""}, ${c+1} of ${i}.`,g=e?"Use Up and Down arrow keys to choose options, press Enter or Tab to select the currently focused option, press Escape to close the menu.":`${n||"Select"} is focused${a?", type to filter options":""}, press Down arrow key to open the menu.`;return r.createElement(Z,{"aria-live":"polite"},r.createElement("p",{id:"aria-selection-event"},p),r.createElement("p",{id:"aria-context"},`${m} ${f} ${g}`))},te=i.div`
+`,ee=({menuOpen:e,isFocused:n,ariaLabel:t,inputValue:o,optionCount:i,isSearchable:a,focusedOption:l,selectedOption:s})=>{if(!n)return null;const{value:d,label:c,index:u,isDisabled:p}=l,f=`Selected option: ${O(s)?s.map(e=>e.label).join(" "):"N/A"}`,m=`${i} result(s) available${o?` for search input ${o}`:""}.`,g=d?`Focused option: ${c}${p?" - disabled":""}, ${u+1} of ${i}.`:"",b=e?"Use Up and Down arrow keys to choose options, press Enter or Tab to select the currently focused option, press Escape to close the menu.":`${t||"Select"} is focused${a?", type to filter options":""}, press Down arrow key to open the menu.`;return r.createElement(Z,{"aria-live":"polite"},r.createElement("p",null,f),r.createElement("p",null,`${g} ${m} ${b}`))},ne=i.div`
   position: relative;
@@ -146,3 +146,3 @@ box-sizing: border-box;
   ${({theme:e})=>e.select.fontSize?`font-size: ${e.select.fontSize};`:""}
-`,ne=i.div`
+`,te=i.div`
   flex: 1 1 0%;
@@ -165,3 +165,3 @@ display: flex;
   justify-content: space-between;
-  ${({isDisabled:e,isFocused:t,isInvalid:n,theme:{control:o,color:r}})=>`\n    min-height: ${o.minHeight};\n    transition: ${o.transition};\n    border-style: ${o.borderStyle};\n    border-width: ${o.borderWidth};\n    border-radius: ${o.borderRadius};\n    border-color: ${n?r.danger:t?o.focusedBorderColor:r.border};\n    ${e?"pointer-events: none;":""}\n    ${o.height?`height: ${o.height};`:""}\n    ${o.backgroundColor||e?`background-color: ${e?r.disabled:o.backgroundColor};`:""}\n    ${t?`box-shadow: ${o.boxShadow} ${n?r.dangerLight:o.boxShadowColor};`:""}\n  `}
+  ${({isDisabled:e,isFocused:n,isInvalid:t,theme:{control:o,color:r}})=>`\n    min-height: ${o.minHeight};\n    transition: ${o.transition};\n    border-style: ${o.borderStyle};\n    border-width: ${o.borderWidth};\n    border-radius: ${o.borderRadius};\n    border-color: ${t?r.danger:n?o.focusedBorderColor:r.border};\n    ${e?"pointer-events: none;":""}\n    ${o.height?`height: ${o.height};`:""}\n    ${o.backgroundColor||e?`background-color: ${e?r.disabled:o.backgroundColor};`:""}\n    ${n?`box-shadow: ${o.boxShadow} ${t?r.dangerLight:o.boxShadowColor};`:""}\n  `}
 `,re=i.div`
@@ -172,3 +172,3 @@ z-index: 999;
   ${s}
-  ${({hideMenu:e,theme:{menu:t}})=>`\n    width: ${t.width};\n    margin: ${t.margin};\n    padding: ${t.padding};\n    box-shadow: ${t.boxShadow};\n    border-radius: ${t.borderRadius};\n    background-color: ${t.backgroundColor};\n    ${e?"display: none;":""}\n  `}
+  ${({hideMenu:e,theme:{menu:n}})=>`\n    width: ${n.width};\n    margin: ${n.margin};\n    padding: ${n.padding};\n    box-shadow: ${n.boxShadow};\n    border-radius: ${n.borderRadius};\n    background-color: ${n.backgroundColor};\n    ${e?"display: none;":""}\n  `}
 
@@ -184,2 +184,2 @@ .${"rfs-option"} {
   }
-`,ie=r.forwardRef(({isMulti:o,inputId:i,selectId:l,autoFocus:s,isLoading:d,onKeyDown:b,clearIcon:h,caretIcon:v,isInvalid:w,ariaLabel:$,menuWidth:x,isDisabled:y,inputDelay:E,onMenuOpen:z,onMenuClose:M,onInputBlur:N,isClearable:R,themeConfig:D,loadingNode:T,onInputFocus:A,initialValue:L,addClassNames:B,ariaLabelledBy:j,onOptionChange:P,getOptionLabel:W,getOptionValue:H,openMenuOnFocus:q,isAriaLiveEnabled:X,menuOverscanCount:Y,blurInputOnSelect:K,renderOptionLabel:_,menuScrollDuration:G,filterIgnoreAccents:J,hideSelectedOptions:Z,getIsOptionDisabled:ie,getFilterOptionString:ae,isSearchable:le=!0,openMenuOnClick:se=!0,filterIgnoreCase:de=!0,tabSelectsOption:ce=!0,closeMenuOnSelect:ue=!0,scrollMenuIntoView:pe=!0,backspaceClearsValue:fe=!0,options:me=f,placeholder:ge="Select option..",filterMatchFrom:be=e.FilterMatchEnum.ANY,noOptionsMsg:he="No options",menuItemSize:ve=35,menuMaxHeight:we=300},$e)=>{const xe=t.useRef(),ye=t.useRef(null),Oe=t.useRef(null),Se=t.useRef(null),[Ee,Ce]=t.useState(""),[ke,Ie]=t.useState(!1),[ze,Me]=t.useState(!1),[Fe,Ne]=t.useState(g),[Re,De]=t.useState(null),{data:Te,value:Ae,label:Le,index:Ve,isDisabled:Be,isSelected:je}=Fe,Pe=t.useMemo(()=>S(D)?function e(t,n){const o=Object.assign({},t);return Object.keys(n).forEach(r=>{S(n[r])?o[r]=r in t?e(t[r],n[r]):n[r]||"":o[r]=n[r]}),o}(a,D):Object.assign({},a),[D]),We=t.useMemo(()=>W||(e=>e.label),[W]),Ue=t.useMemo(()=>H||(e=>e.value),[H]),He=t.useMemo(()=>_||We,[_,We]),qe=((e,n)=>{const[o,r]=t.useState(e);return t.useEffect(()=>{if(void 0===n)return;const t=setTimeout(()=>{r(e)},n);return()=>{clearTimeout(t)}},[e,n]),void 0===n?e:o})(Ee,E),[Xe,Ye]=t.useState(()=>k(L,Ue,We)),Ke=((e,n,o,r,i,a,l)=>{const s=t.useRef(!1),[d,c]=t.useState(o);return p(()=>{if(n){const t=e=>{a&&a(),e&&(s.current=!0,c(e))};C(e.current,r,i,t)}else l&&l(),s.current&&(s.current=!1,c(o))},[e,n,l,a,o,i,r]),d})(Oe,ke,we,G,pe,z,M),_e=I(me,qe,be,"boolean"!=typeof Z?!!o:Z,Xe,Ue,We,ie,ae,de,J),Ge=()=>{Se.current&&Se.current.blur()},Je=()=>{Se.current&&Se.current.focus()},Qe=e=>{ye.current&&ye.current.scrollToItem(e)},Ze=t.useCallback((e,t)=>{t&&(t.stopPropagation(),"mousedown"===t.type&&t.preventDefault()),Ye(t=>t.filter(t=>t.value!==e))},[]),et=t.useCallback(e=>{if(!O(_e))return void Ie(!0);const t=o?-1:_e.findIndex(e=>e.isSelected),n=t>-1?t:e===u.FIRST?0:_e.length-1;Ie(!0),Ne(Object.assign({index:n},_e[n])),Qe(n)},[o,_e]),tt=t.useCallback((e,t)=>{t?o&&Ze(e.value):Ye(t=>o?[...t,e]:[e]),("boolean"==typeof K?K:(()=>window.matchMedia("(pointer: coarse)").matches)())?Ge():ue&&(Ie(!1),Ce(""))},[o,ue,K,Ze]);t.useImperativeHandle($e,()=>({blur:Ge,focus:Je,clearValue:()=>{Ye(m),Ne(g)},setValue:e=>{const t=function(e,t,n){if(null==e)return m;const o=k(e).filter(e=>S(e)).map(e=>n(e)).filter((e,t,n)=>n.indexOf(e)===t);if(!O(o))return m;const r=[];for(const e of t)if(o.includes(n(e))&&(r.push(e),o.length===r.length))break;return r}(e,_e,Ue);Ye(t)},toggleMenu:e=>{!0===e||void 0===e&&!ke?(!ze&&Je(),et(u.FIRST)):Ge()}})),t.useEffect(()=>{s&&Je()},[s]),t.useEffect(()=>{ze&&q&&et(u.FIRST)},[ze,q,et]),p(()=>{if(P){const e=o?Xe.map(e=>e.data):O(Xe)?Xe[0].data:null;P(e)}},[o,Xe,P]),p(()=>{const e=!!_e.length&&(_e.length!==me.length||0===xe.current);O(_e)?(1===_e.length||e)&&(Ne(Object.assign({index:0},_e[0])),Qe(0)):Ne(g),xe.current=_e.length},[me,_e]);const nt=()=>{if(!Te||Be)return;tt({data:Te,value:Ae,label:Le},je)},ot=e=>{if(!O(Xe))return;let t=-1;const n=Xe.length-1,o=Re?Xe.findIndex(e=>e.value===Re):-1,r=-1===(t=e===c.NEXT?o>-1&&o<n?o+1:-1:0!==o?-1===o?n:o-1:0)?null:Xe[t].value;Te&&Ne(g),r!==Re&&De(r)},rt=e=>{if(!O(_e))return;const t=e===u.DOWN?(Ve+1)%_e.length:Ve>0?Ve-1:_e.length-1;Re&&De(null),Ne(Object.assign({index:t},_e[t])),Qe(t)},it=e=>{y||(ze||Je(),ke?"INPUT"!==e.currentTarget.tagName&&(Ie(!1),Ee&&Ce("")):se&&et(u.FIRST),"INPUT"!==e.currentTarget.tagName&&e.preventDefault())},at=t.useCallback(e=>{N&&N(e),Me(!1),Ie(!1),Ce("")},[N]),lt=t.useCallback(e=>{A&&A(e),Me(!0)},[A]),st=t.useCallback(e=>{Ie(!0),Ce(e.currentTarget.value||"")},[]),dt=t.useCallback(e=>{e.stopPropagation(),"mousedown"===e.type&&e.preventDefault(),Ye(m),Je()},[]),ct=t.useCallback(e=>{e.stopPropagation(),"mousedown"===e.type&&e.preventDefault(),Je(),ke?Ie(!1):et(u.FIRST)},[ke,et]);return r.createElement(n.ThemeProvider,{theme:Pe},r.createElement(te,{id:l,onKeyDown:e=>{if(!(y||b&&(b(e),e.defaultPrevented))){switch(e.key){case"ArrowDown":ke?rt(u.DOWN):et(u.FIRST);break;case"ArrowUp":ke?rt(u.UP):et(u.LAST);break;case"ArrowLeft":if(!o||Ee)return;ot(c.PREVIOUS);break;case"ArrowRight":if(!o||Ee)return;ot(c.NEXT);break;case" ":if(Ee)return;if(!ke){et(u.FIRST);break}if(!Te)return;nt();break;case"Enter":ke&&229!==e.keyCode&&nt();break;case"Escape":ke&&(Ie(!1),Ce(""));break;case"Tab":if(!ke||!ce||!Te||e.shiftKey)return;nt();break;case"Delete":case"Backspace":if(Ee)return;if(Re){const e=Xe.findIndex(e=>e.value===Re),t=e>-1&&e<Xe.length-1?Xe[e+1].value:null;Ze(Re),De(t)}else{if(!fe)return;if(O(Xe))if(o){const{value:e}=Xe[Xe.length-1];Ze(e)}else R&&Ye(m)}break;default:return}e.preventDefault()}},"data-testid":void 0,className:B?"rfs-select-container":void 0},r.createElement(oe,{isInvalid:w,isFocused:ze,isDisabled:y,onTouchEnd:it,onMouseDown:it,"data-testid":void 0,className:B?"rfs-control-container":void 0},r.createElement(ne,null,r.createElement(V,{isMulti:o,inputValue:Ee,placeholder:ge,selectedOption:Xe,focusedMultiValue:Re,renderOptionLabel:He,removeSelectedOption:Ze}),r.createElement(U,{id:i,ref:Se,ariaLabel:$,inputValue:Ee,onBlur:at,onFocus:lt,addClassNames:B,onChange:st,ariaLabelledBy:j,readOnly:y||!le||!!Re})),r.createElement(Q,{menuOpen:ke,clearIcon:h,caretIcon:v,isInvalid:w,isLoading:d,loadingNode:T,addClassNames:B,onClearMouseDown:dt,showClear:!(!R||y||!O(Xe)),onCaretMouseDown:y||se?void 0:ct})),r.createElement(re,{ref:Oe,hideMenu:!ke,onMouseDown:e=>{e.stopPropagation(),e.preventDefault(),Je()},"data-testid":void 0,className:B?"rfs-menu-container":void 0},r.createElement(F,{ref:ye,maxHeight:Ke,itemSize:ve,menuOptions:_e,noOptionsMsg:he,selectOption:tt,overscanCount:Y,width:x||Pe.menu.width,focusedOptionIndex:Ve,renderOptionLabel:He})),X&&r.createElement(ee,{menuOpen:ke,isFocused:ze,ariaLabel:$,inputValue:Ee,isSearchable:le,focusedOption:Fe,selectedOption:Xe,optionCount:_e.length})))});ie.displayName="Select",e.Select=ie,Object.defineProperty(e,"__esModule",{value:!0})}));
+`,ie=r.forwardRef(({isMulti:o,inputId:i,selectId:l,autoFocus:s,isLoading:d,onKeyDown:b,clearIcon:h,caretIcon:v,isInvalid:w,ariaLabel:$,menuWidth:x,isDisabled:y,inputDelay:E,onMenuOpen:z,onMenuClose:M,onInputBlur:R,isClearable:D,themeConfig:N,loadingNode:T,onInputFocus:L,initialValue:A,addClassNames:B,ariaLabelledBy:j,onOptionChange:P,getOptionLabel:W,getOptionValue:H,openMenuOnFocus:q,isAriaLiveEnabled:X,menuOverscanCount:Y,blurInputOnSelect:K,renderOptionLabel:_,menuScrollDuration:G,filterIgnoreAccents:J,hideSelectedOptions:Z,getIsOptionDisabled:ie,getFilterOptionString:ae,isSearchable:le=!0,openMenuOnClick:se=!0,filterIgnoreCase:de=!0,tabSelectsOption:ce=!0,closeMenuOnSelect:ue=!0,scrollMenuIntoView:pe=!0,backspaceClearsValue:fe=!0,options:me=f,placeholder:ge="Select option..",filterMatchFrom:be=e.FilterMatchEnum.ANY,noOptionsMsg:he="No options",menuItemSize:ve=35,menuMaxHeight:we=300},$e)=>{const xe=n.useRef(),ye=n.useRef(null),Oe=n.useRef(null),Se=n.useRef(null),[Ee,Ce]=n.useState(""),[ke,Ie]=n.useState(!1),[ze,Me]=n.useState(!1),[Fe,Re]=n.useState(g),[De,Ne]=n.useState(null),Te=n.useMemo(()=>S(N)?function e(n,t){const o=Object.assign({},n);return Object.keys(t).forEach(r=>{S(t[r])?o[r]=r in n?e(n[r],t[r]):t[r]||"":o[r]=t[r]}),o}(a,N):Object.assign({},a),[N]),Le=n.useMemo(()=>W||(e=>e.label),[W]),Ae=n.useMemo(()=>H||(e=>e.value),[H]),Ve=n.useMemo(()=>_||Le,[_,Le]),Be=((e,t)=>{const[o,r]=n.useState(e);return n.useEffect(()=>{if(void 0===t)return;const n=setTimeout(()=>{r(e)},t);return()=>{clearTimeout(n)}},[e,t]),void 0===t?e:o})(Ee,E),[je,Pe]=n.useState(()=>k(A,Ae,Le)),We=((e,t,o,r,i,a,l)=>{const s=n.useRef(!1),[d,c]=n.useState(o);return p(()=>{if(t){const n=e=>{a&&a(),e&&(s.current=!0,c(e))};C(e.current,r,i,n)}else l&&l(),s.current&&(s.current=!1,c(o))},[e,t,l,a,o,i,r]),d})(Oe,ke,we,G,pe,z,M),Ue=I(me,Be,be,"boolean"!=typeof Z?!!o:Z,je,Ae,Le,ie,ae,de,J),He=()=>{Se.current&&Se.current.blur()},qe=()=>{Se.current&&Se.current.focus()},Xe=e=>{ye.current&&ye.current.scrollToItem(e)},Ye=n.useCallback((e,n)=>{n&&(n.stopPropagation(),"mousedown"===n.type&&n.preventDefault()),Pe(n=>n.filter(n=>n.value!==e))},[]),Ke=n.useCallback(e=>{if(!O(Ue))return void Ie(!0);const n=o?-1:Ue.findIndex(e=>e.isSelected),t=n>-1?n:e===u.FIRST?0:Ue.length-1;Ie(!0),Re(Object.assign({index:t},Ue[t])),Xe(t)},[o,Ue]),_e=n.useCallback((e,n)=>{n?o&&Ye(e.value):Pe(n=>o?[...n,e]:[e]),("boolean"==typeof K?K:(()=>window.matchMedia("(pointer: coarse)").matches)())?He():ue&&(Ie(!1),Ce(""))},[o,ue,K,Ye]);n.useImperativeHandle($e,()=>({blur:He,focus:qe,clearValue:()=>{Pe(m),Re(g)},setValue:e=>{const n=function(e,n,t){if(null==e)return m;const o=k(e).filter(e=>S(e)).map(e=>t(e)).filter((e,n,t)=>t.indexOf(e)===n);if(!O(o))return m;const r=[];for(const e of n)if(o.includes(t(e))&&(r.push(e),o.length===r.length))break;return r}(e,Ue,Ae);Pe(n)},toggleMenu:e=>{!0===e||void 0===e&&!ke?(!ze&&qe(),Ke(u.FIRST)):He()}})),n.useEffect(()=>{s&&qe()},[s]),n.useEffect(()=>{ze&&q&&Ke(u.FIRST)},[ze,q,Ke]),p(()=>{if(P){const e=o?je.map(e=>e.data):O(je)?je[0].data:null;P(e)}},[o,je,P]),p(()=>{const e=!!Ue.length&&(Ue.length!==me.length||0===xe.current);O(Ue)?(1===Ue.length||e)&&(Re(Object.assign({index:0},Ue[0])),Xe(0)):Re(g),xe.current=Ue.length},[me,Ue]);const Ge=()=>{const{data:e,value:n,label:t,isSelected:o,isDisabled:r}=Fe;e&&!r&&_e({data:e,value:n,label:t},o)},Je=e=>{if(!O(je))return;let n=-1;const t=je.length-1,o=De?je.findIndex(e=>e.value===De):-1,r=-1===(n=e===c.NEXT?o>-1&&o<t?o+1:-1:0!==o?-1===o?t:o-1:0)?null:je[n].value;Fe.data&&Re(g),r!==De&&Ne(r)},Qe=e=>{if(!O(Ue))return;const n=e===u.DOWN?(Fe.index+1)%Ue.length:Fe.index>0?Fe.index-1:Ue.length-1;De&&Ne(null),Re(Object.assign({index:n},Ue[n])),Xe(n)},Ze=e=>{y||(ze||qe(),ke?"INPUT"!==e.currentTarget.tagName&&(Ie(!1),Ee&&Ce("")):se&&Ke(u.FIRST),"INPUT"!==e.currentTarget.tagName&&e.preventDefault())},en=n.useCallback(e=>{R&&R(e),Me(!1),Ie(!1),Ce("")},[R]),nn=n.useCallback(e=>{L&&L(e),Me(!0)},[L]),tn=n.useCallback(e=>{Ie(!0),Ce(e.currentTarget.value||"")},[]),on=n.useCallback(e=>{e.stopPropagation(),"mousedown"===e.type&&e.preventDefault(),Pe(m),qe()},[]),rn=n.useCallback(e=>{e.stopPropagation(),"mousedown"===e.type&&e.preventDefault(),qe(),ke?Ie(!1):Ke(u.FIRST)},[ke,Ke]);return r.createElement(t.ThemeProvider,{theme:Te},r.createElement(ne,{id:l,onKeyDown:e=>{if(!(y||b&&(b(e),e.defaultPrevented))){switch(e.key){case"ArrowDown":ke?Qe(u.DOWN):Ke(u.FIRST);break;case"ArrowUp":ke?Qe(u.UP):Ke(u.LAST);break;case"ArrowLeft":if(!o||Ee)return;Je(c.PREVIOUS);break;case"ArrowRight":if(!o||Ee)return;Je(c.NEXT);break;case" ":if(Ee)return;if(!ke){Ke(u.FIRST);break}if(!Fe.data)return;Ge();break;case"Enter":ke&&229!==e.keyCode&&Ge();break;case"Escape":ke&&(Ie(!1),Ce(""));break;case"Tab":if(!ke||!ce||!Fe.data||e.shiftKey)return;Ge();break;case"Delete":case"Backspace":if(Ee)return;if(De){const e=je.findIndex(e=>e.value===De),n=e>-1&&e<je.length-1?je[e+1].value:null;Ye(De),Ne(n)}else{if(!fe)return;if(O(je))if(o){const{value:e}=je[je.length-1];Ye(e)}else D&&Pe(m)}break;default:return}e.preventDefault()}},"data-testid":void 0,className:B?"rfs-select-container":void 0},r.createElement(oe,{isInvalid:w,isFocused:ze,isDisabled:y,onTouchEnd:Ze,onMouseDown:Ze,"data-testid":void 0,className:B?"rfs-control-container":void 0},r.createElement(te,null,r.createElement(V,{isMulti:o,inputValue:Ee,placeholder:ge,selectedOption:je,focusedMultiValue:De,renderOptionLabel:Ve,removeSelectedOption:Ye}),r.createElement(U,{id:i,ref:Se,ariaLabel:$,inputValue:Ee,onBlur:en,onFocus:nn,addClassNames:B,onChange:tn,ariaLabelledBy:j,readOnly:y||!le||!!De})),r.createElement(Q,{menuOpen:ke,clearIcon:h,caretIcon:v,isInvalid:w,isLoading:d,loadingNode:T,addClassNames:B,onClearMouseDown:on,showClear:!(!D||y||!O(je)),onCaretMouseDown:y||se?void 0:rn})),r.createElement(re,{ref:Oe,hideMenu:!ke,onMouseDown:e=>{e.stopPropagation(),e.preventDefault(),qe()},"data-testid":void 0,className:B?"rfs-menu-container":void 0},r.createElement(F,{ref:ye,maxHeight:We,itemSize:ve,menuOptions:Ue,noOptionsMsg:he,selectOption:_e,overscanCount:Y,width:x||Te.menu.width,renderOptionLabel:Ve,focusedOptionIndex:Fe.index})),X&&r.createElement(ee,{menuOpen:ke,isFocused:ze,ariaLabel:$,inputValue:Ee,isSearchable:le,focusedOption:Fe,selectedOption:je,optionCount:Ue.length})))});ie.displayName="Select",e.Select=ie,Object.defineProperty(e,"__esModule",{value:!0})}));

dist/index.cjs.js

@@ -245,3 +245,3 @@ 'use strict';
 const isTouchDevice = () => window.matchMedia('(pointer: coarse)').matches;
-const isEdgeOrIE = () => MS_BROWSER_REGEXP.test(window.navigator.userAgent);
+const isBrowserMS = () => MS_BROWSER_REGEXP.test(window.navigator.userAgent);
 function trimAndFormatFilterStr(value, filterIgnoreCase, filterIgnoreAccents) {
@@ -672,3 +672,3 @@ let formatVal = value.replace(TRIM_REGEXP, '');
 
-  ${() => isEdgeOrIE() && `::-ms-clear { display: none; }`}
+  ${() => isBrowserMS() && `::-ms-clear { display: none; }`}
 `;
@@ -693,8 +693,5 @@ const AutosizeInput = React__default.memo(React__default.forwardRef(({
   }, [inputValue]);
-  const inputAttributes = Object.assign({}, STATIC_ATTRIBUTES, {
+  const autosizeInputAttrs = Object.assign({}, STATIC_ATTRIBUTES, {
     'aria-label': ariaLabel,
-    'aria-labelledby': ariaLabelledBy,
-    style: {
-      width: inputWidth
-    }
+    'aria-labelledby': ariaLabelledBy
   });
@@ -710,3 +707,6 @@ return React__default.createElement("div", {
     readOnly: readOnly
-  }, inputAttributes, {
+  }, autosizeInputAttrs, {
+    style: {
+      width: inputWidth
+    },
     onChange: !readOnly ? onChange : undefined,
@@ -894,2 +894,3 @@ className: addClassNames ? AUTOSIZE_INPUT_CLS : undefined
   const {
+    value: focusedOptionValue,
     label: focusedOptionLabel,
@@ -902,11 +903,7 @@ index: focusedOptionIndex,
   const optionsMsg = `${optionCount} result(s) available${inputValue ? ` for search input ${inputValue}` : ''}.`;
-  const focusedMsg = `Focused option: ${focusedOptionLabel || 'N/A'}${isFocusedOptionDisabled ? ' - disabled' : ''}, ${focusedOptionIndex + 1} of ${optionCount}.`;
+  const focusedMsg = focusedOptionValue ? `Focused option: ${focusedOptionLabel}${isFocusedOptionDisabled ? ' - disabled' : ''}, ${focusedOptionIndex + 1} of ${optionCount}.` : '';
   const menuMsg = menuOpen ? 'Use Up and Down arrow keys to choose options, press Enter or Tab to select the currently focused option, press Escape to close the menu.' : `${ariaLabel || 'Select'} is focused${isSearchable ? ', type to filter options' : ''}, press Down arrow key to open the menu.`;
   return React__default.createElement(A11yText, {
     "aria-live": 'polite'
-  }, React__default.createElement("p", {
-    id: 'aria-selection-event'
-  }, selectedOptionMsg), React__default.createElement("p", {
-    id: 'aria-context'
-  }, `${focusedMsg} ${optionsMsg} ${menuMsg}`));
+  }, React__default.createElement("p", null, selectedOptionMsg), React__default.createElement("p", null, `${focusedMsg} ${optionsMsg} ${menuMsg}`));
 };
@@ -1079,10 +1076,2 @@
   const [focusedMultiValue, setFocusedMultiValue] = React.useState(FOCUSED_MULTI_DEFAULT);
-  const {
-    data: focusedOptionData,
-    value: focusedOptionValue,
-    label: focusedOptionLabel,
-    index: focusedOptionIndex,
-    isDisabled: isFocusedOptionDisabled,
-    isSelected: isFocusedOptionSelected
-  } = focusedOption;
   const theme = React.useMemo(() => {
@@ -1206,12 +1195,17 @@ return !isPlainObject(themeConfig) ? Object.assign({}, DefaultThemeObj) : mergeDeep(DefaultThemeObj, themeConfig);
   const selectOptionFromFocused = () => {
-    if (!focusedOptionData || isFocusedOptionDisabled) {
-      return;
+    const {
+      data,
+      value,
+      label,
+      isSelected,
+      isDisabled: focusedOptionDisabled
+    } = focusedOption;
+
+    if (data && !focusedOptionDisabled) {
+      selectOption({
+        data,
+        value,
+        label
+      }, isSelected);
     }
-
-    const newOption = {
-      data: focusedOptionData,
-      value: focusedOptionValue,
-      label: focusedOptionLabel
-    };
-    selectOption(newOption, isFocusedOptionSelected);
   };
@@ -1235,3 +1229,3 @@
     const nextFocusedVal = nextFocusedIndex === -1 ? FOCUSED_MULTI_DEFAULT : selectedOption[nextFocusedIndex].value;
-    focusedOptionData && setFocusedOption(FOCUSED_OPTION_DEFAULT);
+    focusedOption.data && setFocusedOption(FOCUSED_OPTION_DEFAULT);
     nextFocusedVal !== focusedMultiValue && setFocusedMultiValue(nextFocusedVal);
@@ -1245,3 +1239,3 @@ };
 
-    const index = direction === OptionIndexEnum.DOWN ? (focusedOptionIndex + 1) % menuOptions.length : focusedOptionIndex > 0 ? focusedOptionIndex - 1 : menuOptions.length - 1;
+    const index = direction === OptionIndexEnum.DOWN ? (focusedOption.index + 1) % menuOptions.length : focusedOption.index > 0 ? focusedOption.index - 1 : menuOptions.length - 1;
     focusedMultiValue && setFocusedMultiValue(FOCUSED_MULTI_DEFAULT);
@@ -1308,3 +1302,3 @@ setFocusedOption(Object.assign({
           break;
-        } else if (!focusedOptionData) {
+        } else if (!focusedOption.data) {
           return;
@@ -1332,3 +1326,3 @@ }
       case 'Tab':
-        if (!menuOpen || !tabSelectsOption || !focusedOptionData || e.shiftKey) {
+        if (!menuOpen || !tabSelectsOption || !focusedOption.data || e.shiftKey) {
           return;
@@ -1495,4 +1489,4 @@ }
     width: menuWidth || theme.menu.width,
-    focusedOptionIndex: focusedOptionIndex,
-    renderOptionLabel: renderOptionLabelCB
+    renderOptionLabel: renderOptionLabelCB,
+    focusedOptionIndex: focusedOption.index
   })), isAriaLiveEnabled && React__default.createElement(AriaLiveRegion, {
@@ -1499,0 +1493,0 @@ menuOpen: menuOpen,

dist/index.esm.js

@@ -239,3 +239,3 @@ import React, { useState, useEffect, useRef, useMemo, Fragment, useCallback, useImperativeHandle } from 'react';
 const isTouchDevice = () => window.matchMedia('(pointer: coarse)').matches;
-const isEdgeOrIE = () => MS_BROWSER_REGEXP.test(window.navigator.userAgent);
+const isBrowserMS = () => MS_BROWSER_REGEXP.test(window.navigator.userAgent);
 function trimAndFormatFilterStr(value, filterIgnoreCase, filterIgnoreAccents) {
@@ -666,3 +666,3 @@ let formatVal = value.replace(TRIM_REGEXP, '');
 
-  ${() => isEdgeOrIE() && `::-ms-clear { display: none; }`}
+  ${() => isBrowserMS() && `::-ms-clear { display: none; }`}
 `;
@@ -687,8 +687,5 @@ const AutosizeInput = React.memo(React.forwardRef(({
   }, [inputValue]);
-  const inputAttributes = Object.assign({}, STATIC_ATTRIBUTES, {
+  const autosizeInputAttrs = Object.assign({}, STATIC_ATTRIBUTES, {
     'aria-label': ariaLabel,
-    'aria-labelledby': ariaLabelledBy,
-    style: {
-      width: inputWidth
-    }
+    'aria-labelledby': ariaLabelledBy
   });
@@ -704,3 +701,6 @@ return React.createElement("div", {
     readOnly: readOnly
-  }, inputAttributes, {
+  }, autosizeInputAttrs, {
+    style: {
+      width: inputWidth
+    },
     onChange: !readOnly ? onChange : undefined,
@@ -888,2 +888,3 @@ className: addClassNames ? AUTOSIZE_INPUT_CLS : undefined
   const {
+    value: focusedOptionValue,
     label: focusedOptionLabel,
@@ -896,11 +897,7 @@ index: focusedOptionIndex,
   const optionsMsg = `${optionCount} result(s) available${inputValue ? ` for search input ${inputValue}` : ''}.`;
-  const focusedMsg = `Focused option: ${focusedOptionLabel || 'N/A'}${isFocusedOptionDisabled ? ' - disabled' : ''}, ${focusedOptionIndex + 1} of ${optionCount}.`;
+  const focusedMsg = focusedOptionValue ? `Focused option: ${focusedOptionLabel}${isFocusedOptionDisabled ? ' - disabled' : ''}, ${focusedOptionIndex + 1} of ${optionCount}.` : '';
   const menuMsg = menuOpen ? 'Use Up and Down arrow keys to choose options, press Enter or Tab to select the currently focused option, press Escape to close the menu.' : `${ariaLabel || 'Select'} is focused${isSearchable ? ', type to filter options' : ''}, press Down arrow key to open the menu.`;
   return React.createElement(A11yText, {
     "aria-live": 'polite'
-  }, React.createElement("p", {
-    id: 'aria-selection-event'
-  }, selectedOptionMsg), React.createElement("p", {
-    id: 'aria-context'
-  }, `${focusedMsg} ${optionsMsg} ${menuMsg}`));
+  }, React.createElement("p", null, selectedOptionMsg), React.createElement("p", null, `${focusedMsg} ${optionsMsg} ${menuMsg}`));
 };
@@ -1073,10 +1070,2 @@
   const [focusedMultiValue, setFocusedMultiValue] = useState(FOCUSED_MULTI_DEFAULT);
-  const {
-    data: focusedOptionData,
-    value: focusedOptionValue,
-    label: focusedOptionLabel,
-    index: focusedOptionIndex,
-    isDisabled: isFocusedOptionDisabled,
-    isSelected: isFocusedOptionSelected
-  } = focusedOption;
   const theme = useMemo(() => {
@@ -1200,12 +1189,17 @@ return !isPlainObject(themeConfig) ? Object.assign({}, DefaultThemeObj) : mergeDeep(DefaultThemeObj, themeConfig);
   const selectOptionFromFocused = () => {
-    if (!focusedOptionData || isFocusedOptionDisabled) {
-      return;
+    const {
+      data,
+      value,
+      label,
+      isSelected,
+      isDisabled: focusedOptionDisabled
+    } = focusedOption;
+
+    if (data && !focusedOptionDisabled) {
+      selectOption({
+        data,
+        value,
+        label
+      }, isSelected);
     }
-
-    const newOption = {
-      data: focusedOptionData,
-      value: focusedOptionValue,
-      label: focusedOptionLabel
-    };
-    selectOption(newOption, isFocusedOptionSelected);
   };
@@ -1229,3 +1223,3 @@
     const nextFocusedVal = nextFocusedIndex === -1 ? FOCUSED_MULTI_DEFAULT : selectedOption[nextFocusedIndex].value;
-    focusedOptionData && setFocusedOption(FOCUSED_OPTION_DEFAULT);
+    focusedOption.data && setFocusedOption(FOCUSED_OPTION_DEFAULT);
     nextFocusedVal !== focusedMultiValue && setFocusedMultiValue(nextFocusedVal);
@@ -1239,3 +1233,3 @@ };
 
-    const index = direction === OptionIndexEnum.DOWN ? (focusedOptionIndex + 1) % menuOptions.length : focusedOptionIndex > 0 ? focusedOptionIndex - 1 : menuOptions.length - 1;
+    const index = direction === OptionIndexEnum.DOWN ? (focusedOption.index + 1) % menuOptions.length : focusedOption.index > 0 ? focusedOption.index - 1 : menuOptions.length - 1;
     focusedMultiValue && setFocusedMultiValue(FOCUSED_MULTI_DEFAULT);
@@ -1302,3 +1296,3 @@ setFocusedOption(Object.assign({
           break;
-        } else if (!focusedOptionData) {
+        } else if (!focusedOption.data) {
           return;
@@ -1326,3 +1320,3 @@ }
       case 'Tab':
-        if (!menuOpen || !tabSelectsOption || !focusedOptionData || e.shiftKey) {
+        if (!menuOpen || !tabSelectsOption || !focusedOption.data || e.shiftKey) {
           return;
@@ -1489,4 +1483,4 @@ }
     width: menuWidth || theme.menu.width,
-    focusedOptionIndex: focusedOptionIndex,
-    renderOptionLabel: renderOptionLabelCB
+    renderOptionLabel: renderOptionLabelCB,
+    focusedOptionIndex: focusedOption.index
   })), isAriaLiveEnabled && React.createElement(AriaLiveRegion, {
@@ -1493,0 +1487,0 @@ menuOpen: menuOpen,

dist/utils.d.ts

@@ -6,3 +6,3 @@ import { ReactText } from 'react';
 export declare const isTouchDevice: () => boolean;
-export declare const isEdgeOrIE: () => boolean;
+export declare const isBrowserMS: () => boolean;
 export declare function trimAndFormatFilterStr(value: string, filterIgnoreCase?: boolean, filterIgnoreAccents?: boolean): string;
@@ -9,0 +9,0 @@ export declare function mergeDeep(target: any, source: any): any;

package.json

 {
   "name": "react-functional-select",
-  "version": "1.2.9",
+  "version": "1.2.10",
   "author": "Matt Areddia <[e-mail]> (https://github.com/based-ghost/)",
@@ -59,3 +59,3 @@ "description": "Miro-sized and micro-optimized select component for React.js",
     "@types/jest": "^24.0.25",
-    "@types/node": "^13.1.2",
+    "@types/node": "^13.1.4",
     "@types/react": "^16.9.17",
@@ -87,3 +87,3 @@ "@types/react-dom": "^16.9.4",
     "rimraf": "^3.0.0",
-    "rollup": "^1.27.14",
+    "rollup": "^1.28.0",
     "rollup-plugin-babel": "^4.3.3",
@@ -95,3 +95,3 @@ "rollup-plugin-commonjs": "^10.1.0",
     "rollup-plugin-typescript2": "^0.25.3",
-    "styled-components": "^5.0.0-regexrehydrate",
+    "styled-components": "^5.0.0-rc.3",
     "tslint": "^5.20.1",
@@ -98,0 +98,0 @@ "tslint-config-poetez": "^2.0.0",

README.md

@@ -10,4 +10,2 @@ # react-functional-select
 
-## Overview
-
 <strong>Key features:</strong>
@@ -20,7 +18,18 @@
 
-Essentially, this is a focused subset of [`react-select`](https://github.com/JedWatson/react-select)'s API that is engineered for ultimate performance and minimal bundle size. It is built entirely using `React Hooks` and `FunctionComponents`. In addition, most of the code I was able to roll myself, so there are minimal peer dependencies to worry about. The peer dependencies for this package are:
+<strong>Peer dependencies:</strong>
 
-- [`react-window`](https://github.com/bvaughn/react-window) leveraged for integrated data virtualization/windowing (easily handles data-sets numbering in the tens of thousands with minimal-to-no impact on normally resource-intensive actions like keying and searching).
-- [`styled-components`](https://github.com/styled-components/styled-components) to handle dynamic, extensible styling via CSS-in-JS (there is also the option to generate `className` attributes for legacy stylesheets as a fall-back option).
+- [`styled-components`](https://github.com/styled-components/styled-components) for dynamic styling/theming via CSS-in-JS
+- [`react-window`](https://github.com/bvaughn/react-window) for integrated menu option data virtualization/windowing
 
+## Overview
+
+Essentially, this is a focused subset of [`react-select`](https://github.com/JedWatson/react-select)'s API that is engineered for ultimate performance and minimal bundle size. It is built entirely using `React Hooks` and `FunctionComponents`.  The primary design principal revolves around weighing the cost/benefits of adding a feature against the impact to performance & # of lines of code its addition would have. 
+
+I opted to exclude less "in-demand" features such as: 
+
+- Preventing scroll events on the app's body if the menu is open <strong><em>TODO: add code example</em></strong>
+- Closing an open menu if the app's body is scrolled <strong><em>TODO: add code example</em></strong>
+
+These feature would have added significant overhead to the package. In addition, if we expose the right public methods and/or callback properties, this feature should be trivial to add to wrapping components - proper decoupling and abstraction of code is key to keeping such channels open for similar customizations that can be kept out of this package. 
+
 ## Installation
@@ -104,2 +113,4 @@
 
+> <strong><em>Note that the following non-primitive properties should be properly memoized if defined:</em></strong><br>`clearIcon`, `caretIcon`, `options`, `renderOptionLabel`, `onMenuOpen`, `onOptionChange`, `onKeyDown`, `getOptionLabel`, `getOptionLabel`, `getOptionValue`, `onInputBlur`, `onInputFocus`, `getIsOptionDisabled`, `getFilterOptionString`, `themeConfig`
+
 | Property | Type | Default | Description
@@ -117,9 +128,9 @@ :---|:---|:---|:---
 |`placeholder`| string | `Select option..` | Placeholder text for the select value
-|`menuWidth`| React.ReactText | `100%` | Width of the menu
+|`menuWidth`| ReactText | `100%` | Width of the menu
 |`menuItemSize`| number | `35` | The height of each option in the menu (px)
 |`isClearable`| bool | `false` | Is the select value clearable
 |`noOptionsMsg`| string | `No options` | The text displayed in the menu when there are no options available
-|`clearIcon`| React.ReactNode | `undefined` | Custom clear icon node
-|`caretIcon`| React.ReactNode | `undefined` | Custom caret icon node
-|`loadingNode`| React.ReactNode | `undefined` | Custom loading node
+|`clearIcon`| ReactNode | `undefined` | Custom clear icon node
+|`caretIcon`| ReactNode | `undefined` | Custom caret icon node
+|`loadingNode`| ReactNode | `undefined` | Custom loading node
 |`options`| array | `[]` | The menu options
@@ -137,3 +148,3 @@ |`isSearchable`| bool | `true` | Whether to enable search functionality or not
 |`tabSelectsOption`| bool | `true` | Select the currently focused option when the user presses tab
-|`blurInputOnSelect`| bool | `true IF device is touch-enabled ELSE false` | Remove focus from the input when the user selects an option (useful for dismissing the keyboard on touch devices)
+|`blurInputOnSelect`| bool | `false` | Remove focus from the input when the user selects an option (useful for dismissing the keyboard on touch devices)
 |`closeMenuOnSelect`| bool | `true` | Close the select menu when the user selects an option
@@ -146,13 +157,13 @@ |`isAriaLiveEnabled`| bool | `false` | Enables visually hidden div that reports stateful information (for assistive tech)
 |`filterIgnoreAccents`| bool | `false` | Search input will strip diacritics from string before comparing
-|`onMenuOpen`| (...args: any[]) => void | `undefined` | Callback function executed after the menu is opened
-|`onMenuClose`| (...args: any[]) => void | `undefined` | Callback function executed after the menu is closed
-|`onOptionChange`| (data: any) => void | `undefined` | Callback function executed after a new option is selected
-|`onKeyDown`| React.KeyboardEventHandler\<HTMLDivElement\> | `undefined` | Callback function executed `onKeyDown` event
-|`getOptionLabel`| (data: any) => React.ReactText | `undefined` | Resolves option data to React.ReactText to be displayed as the label by components (by default will use option.label)
-|`getOptionValue`| (data: any) => React.ReactText | `undefined` | Resolves option data to React.ReactText to compare option values (by default will use option.value)
-|`onInputBlur`| React.FocusEventHandler\<HTMLInputElement\> | `undefined` | Handle blur events on the search input
-|`onInputFocus`| React.FocusEventHandler\<HTMLInputElement\> | `undefined` | Handle focus events on the search input
-|`renderOptionLabel`| (data: any) => React.ReactNode | `undefined` | Formats option labels in the menu and control as JSX.Elements or React Components (by default will use `getOptionLabel`)
-|`getIsOptionDisabled`| (data: any) => boolean | `undefined` | When defined will evaluate each option to determine whether it is disabled or not (if not specified, each option will be evaluated as to whether or not it contains a property of `isDisabled` with a value of `true`)
-|`getFilterOptionString`| (option: any) => string | `undefined` | When defined will take each option and generate a string used in the filtering process (by default, will use option.label)
+|`onMenuOpen`| (...args: any[]): void | `undefined` | Callback function executed after the menu is opened
+|`onMenuClose`| (...args: any[]): void | `undefined` | Callback function executed after the menu is closed
+|`onOptionChange`| (data: any): void | `undefined` | Callback function executed after a new option is selected
+|`onKeyDown`| (e: KeyboardEvent\<HTMLDivElement\>): void | `undefined` | Callback function executed `onKeyDown` event
+|`getOptionLabel`| (data: any): ReactText | `undefined` | Resolves option data to React.ReactText to be displayed as the label by components (by default will use option.label)
+|`getOptionValue`| (data: any): ReactText | `undefined` | Resolves option data to React.ReactText to compare option values (by default will use option.value)
+|`onInputBlur`| (e: FocusEvent\<HTMLInputElement\>): void | `undefined` | Handle blur events on the search input
+|`onInputFocus`| (e: FocusEvent\<HTMLInputElement\>): void | `undefined` | Handle focus events on the search input
+|`renderOptionLabel`| (data: any): ReactNode | `undefined` | Formats option labels in the menu and control as JSX.Elements or React Components (by default will use `getOptionLabel`)
+|`getIsOptionDisabled`| (data: any): boolean | `undefined` | When defined will evaluate each option to determine whether it is disabled or not (if not specified, each option will be evaluated as to whether or not it contains a property of `isDisabled` with a value of `true`)
+|`getFilterOptionString`| (option: any): string | `undefined` | When defined will take each option and generate a string used in the filtering process (by default, will use option.label)
 |`themeConfig`| Partial\<DefaultTheme\> | `undefined` | Object that takes specified property key-value pairs and merges them into the theme object
@@ -166,2 +177,2 @@
 
-MIT licensed. [Matt Areddia](https://github.com/based-ghost) &copy; 2019.
+MIT licensed. [Matt Areddia](https://github.com/based-ghost) &copy; 2019.

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

153092

increased by0.14%

Number of lines in readme file

171

increased by6.21%

Worsened metrics

Lines of code

3346

decreased by-0.36%

No dependency changes