react-functional-select - npm Package Compare versions

Comparing version 1.0.2 to 1.0.3

dist/index-dev.umd.js

@@ -9,3 +9,3 @@ !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,o,n){"use strict";var r="default"in t?t.default:t,i="default"in o?o.default:o,a=Object.freeze({color:{border:"#ced4da",danger:"#dc3545",primary:"#007bff",disabled:"#e9ecef",placeholder:"#6E7276",dangerLight:"rgba(220, 53, 69, 0.25)"},select:{},loader:{opacity:"0.42",size:"0.625rem",color:"#007bff",padding:"0.375rem 0.75rem"},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=o.keyframes`
   animation: ${l} 0.225s ease-in-out forwards;
-`,d=[],c=[],u=Object.freeze({index:-1});function p(e){return e===document.documentElement||e===document.body||e===window}function m(e){return p(e)?window.pageYOffset:e.scrollTop}function f(e,t,o,n){let r=0;const i=m(e),a=t-i;window.requestAnimationFrame((function t(){var l,s,d;s=a*((d=(d=r+=5)/o-1)*d*d+1)+i,p(l=e)?window.scrollTo(0,s):l.scrollTop=s,r<o?window.requestAnimationFrame(t):n&&n()}))}function h(e){return Array.isArray(e)&&!!e.length}function b(e){return e&&"object"==typeof e&&!Array.isArray(e)}function g(e,t){const o=e.replace(/^\s+|\s+$/g,"");return t?o:o.toLowerCase()}function v(e,t,o){if(!t||!e||!e.getBoundingClientRect)return void o();const{top:n,bottom:r,height:i}=e.getBoundingClientRect(),a=window.innerHeight;if(a-n>=i)return void o();const l=function(e){let t=getComputedStyle(e);const o="absolute"===t.position;if("fixed"===t.position)return document.documentElement;for(let n=e;n=n?n.parentElement:null;)if(t=getComputedStyle(n),(!o||"static"!==t.position)&&/(auto|scroll)/.test(`${t.overflow}${t.overflowY}${t.overflowX}`))return n;return document.documentElement}(e),s=m(l),d=l.getBoundingClientRect().height-s-n;d<i?o(d):f(l,r-a+s+parseInt(getComputedStyle(e).marginBottom||"0",10),300,o)}function w(e,t,o){const n=Array.isArray(e)?e.filter(Boolean):"object"==typeof e&&null!==e?[e]:c;return t&&o&&h(n)?n.map(e=>({data:e,value:t(e),label:o(e)})):n}const $=(e,o,n,r,i,a,l,s,c)=>{const[u,p]=t.useState(d);return t.useEffect(()=>{const t=g(o,c),u=l||(e=>!!e.isDisabled),m=s||(e=>String(e.label)),f=r.length?r.map(e=>e.value):void 0;p((()=>{const o=e=>{const o=i(e),r=Object.assign({data:e,value:o,label:a(e)},f&&f.includes(o)&&{isSelected:!0});if(!(t&&!(e=>{return g(m(e),c).indexOf(t)>-1})(r)||n&&r.isSelected))return Object.assign({},r,{},u(e)&&{isDisabled:!0})};return e.reduce((e,t)=>{const n=o(t);return n&&e.push(n),e},[])})()||d)},[e,r,n,c,o,s,l,i,a]),u},x="INPUT",y="mousedown",O=r.memo(({index:e,style:t,data:{menuOptions:o,selectOption:n,renderOptionLabel:i,focusedOptionIndex:a}})=>{const{data:l,value:s,label:d,isDisabled:c,isSelected:u}=o[e],p="rfs-option"+(c?" rfs-option-disabled":"")+(u?" rfs-option-selected":"")+(e===a?" rfs-option-focused":"");return r.createElement("div",{role:"button",style:t,className:p,onClick:c?void 0:()=>n({data:l,value:s,label:d},u)},i(l))},n.areEqual);O.displayName="Option";const S=i.div`
+`,c=[],d=[],u=Object.freeze({index:-1});function p(e){return e===document.documentElement||e===document.body||e===window}function m(e){return p(e)?window.pageYOffset:e.scrollTop}function f(e,t,o,n){let r=0;const i=m(e),a=t-i;window.requestAnimationFrame((function t(){var l,s,c;s=a*((c=(c=r+=5)/o-1)*c*c+1)+i,p(l=e)?window.scrollTo(0,s):l.scrollTop=s,r<o?window.requestAnimationFrame(t):n&&n()}))}function h(e){return Array.isArray(e)&&!!e.length}function b(e){return e&&"object"==typeof e&&!Array.isArray(e)}function g(e,t){const o=e.replace(/^\s+|\s+$/g,"");return t?o:o.toLowerCase()}function v(e,t,o){if(!t||!e||!e.getBoundingClientRect)return void o();const{top:n,bottom:r,height:i}=e.getBoundingClientRect(),a=window.innerHeight;if(a-n>=i)return void o();const l=function(e){let t=getComputedStyle(e);const o="absolute"===t.position;if("fixed"===t.position)return document.documentElement;for(let n=e;n=n?n.parentElement:null;)if(t=getComputedStyle(n),(!o||"static"!==t.position)&&/(auto|scroll)/.test(`${t.overflow}${t.overflowY}${t.overflowX}`))return n;return document.documentElement}(e),s=m(l),c=l.getBoundingClientRect().height-s-n;c<i?o(c):f(l,r-a+s+parseInt(getComputedStyle(e).marginBottom||"0",10),300,o)}function w(e,t,o){const n=Array.isArray(e)?e.filter(Boolean):"object"==typeof e&&null!==e?[e]:d;return t&&o&&h(n)?n.map(e=>({data:e,value:t(e),label:o(e)})):n}const $=(e,o,n,r,i,a,l,s,d)=>{const[u,p]=t.useState(c);return t.useEffect(()=>{const t=g(o,d),u=l||(e=>!!e.isDisabled),m=s||(e=>String(e.label)),f=r.length?r.map(e=>e.value):void 0;p((()=>{const o=e=>{const o=i(e),r=Object.assign({data:e,value:o,label:a(e)},f&&f.includes(o)&&{isSelected:!0});if(!(t&&!(e=>{return g(m(e),d).indexOf(t)>-1})(r)||n&&r.isSelected))return Object.assign({},r,{},u(e)&&{isDisabled:!0})};return e.reduce((e,t)=>{const n=o(t);return n&&e.push(n),e},[])})()||c)},[e,r,n,d,o,s,l,i,a]),u},x="INPUT",y="mousedown",O=r.memo(({index:e,style:t,data:{menuOptions:o,selectOption:n,renderOptionLabel:i,focusedOptionIndex:a}})=>{const{data:l,value:s,label:c,isDisabled:d,isSelected:u}=o[e],p="rfs-option"+(d?" rfs-option-disabled":"")+(u?" rfs-option-selected":"")+(e===a?" rfs-option-focused":"");return r.createElement("div",{role:"button",style:t,className:p,onClick:d?void 0:()=>n({data:l,value:s,label:c},u)},i(l))},n.areEqual);O.displayName="Option";const S=i.div`
   text-align: center;
@@ -16,3 +16,3 @@ color: ${({theme:e})=>e.noOptions.color};
   font-size: ${({theme:e})=>e.noOptions.fontSize};
-`,C=r.forwardRef(({width:e,itemSize:o,maxHeight:i,menuOptions:a,selectOption:l,noOptionsMsg:s,overscanCount:d,renderOptionLabel:c,focusedOptionIndex:u},p)=>{const m=t.useMemo(()=>({menuOptions:a,selectOption:l,renderOptionLabel:c,focusedOptionIndex:u}),[a,u,l,c]);return r.createElement(t.Fragment,null,r.createElement(n.FixedSizeList,{ref:p,width:e,itemSize:o,itemData:m,overscanCount:d,itemCount:a.length,height:Math.min(i,a.length*o)},O),!h(a)&&r.createElement(S,null,s))});C.displayName="Menu";const E=i.div`
+`,C=r.forwardRef(({width:e,itemSize:o,maxHeight:i,menuOptions:a,selectOption:l,noOptionsMsg:s,overscanCount:c,renderOptionLabel:d,focusedOptionIndex:u},p)=>{const m=t.useMemo(()=>({menuOptions:a,selectOption:l,renderOptionLabel:d,focusedOptionIndex:u}),[a,u,l,d]);return r.createElement(t.Fragment,null,r.createElement(n.FixedSizeList,{ref:p,width:e,itemSize:o,itemData:m,overscanCount:c,itemCount:a.length,height:Math.min(i,a.length*o)},O),!h(a)&&r.createElement(S,null,s))});C.displayName="Menu";const E=i.div`
   min-width: 0;
@@ -52,3 +52,3 @@ display: flex;
   max-width: calc(100% - 0.5rem);
-`,D=i.div`
+`,R=i.div`
   overflow: hidden;
@@ -60,3 +60,3 @@ position: absolute;
   color: ${({theme:e})=>e.color.placeholder};
-`,R=r.memo(({isMulti:e,inputValue:o,placeholder:n,selectedOption:i,focusedMultiValue:a,renderOptionLabel:l,removeSelectedOption:s})=>o&&(!e||e&&!h(i))?null:h(i)?e?r.createElement(t.Fragment,null,i.map(({data:e,value:t})=>r.createElement(I,{key:t,data:e,value:t,renderOptionLabel:l,isFocused:t===a,removeSelectedOption:s}))):r.createElement(M,null,l(i[0].data)):r.createElement(D,null,n));R.displayName="Value";const L=Object.freeze({display:"inline-block"}),V=Object.freeze({type:"text",spellCheck:!1,autoCorrect:"off",autoComplete:"off",autoCapitalize:"none","aria-autocomplete":"list","data-testid":"rfs-autosize-input"}),N=i.div`
+`,D=r.memo(({isMulti:e,inputValue:o,placeholder:n,selectedOption:i,focusedMultiValue:a,renderOptionLabel:l,removeSelectedOption:s})=>o&&(!e||e&&!h(i))?null:h(i)?e?r.createElement(t.Fragment,null,i.map(({data:e,value:t})=>r.createElement(I,{key:t,data:e,value:t,renderOptionLabel:l,isFocused:t===a,removeSelectedOption:s}))):r.createElement(M,null,l(i[0].data)):r.createElement(R,null,n));D.displayName="Value";const L=Object.freeze({display:"inline-block"}),V=Object.freeze({type:"text",spellCheck:!1,autoCorrect:"off",autoComplete:"off",autoCapitalize:"none","aria-autocomplete":"list","data-testid":"rfs-autosize-input"}),F=i.div`
   top: 0;
@@ -94,3 +94,3 @@ left: 0;
     `}
-`,F=r.memo(r.forwardRef(({id:e,onBlur:o,onFocus:n,readOnly:i,onChange:a,ariaLabel:l,inputValue:s,addClassNames:d,ariaLabelledBy:c},u)=>{const p=t.useRef(null),[m,f]=t.useState(2);t.useEffect(()=>{p.current&&f(p.current.scrollWidth+2)},[s]);const h=Object.assign({},V,{"aria-label":l,"aria-labelledby":c,style:{width:m}});return r.createElement("div",{style:L},r.createElement(T,Object.assign({id:e,ref:u,onBlur:o,onFocus:n,value:s,readOnly:i},h,{onChange:i?void 0:a,className:d?"rfs-autosize-input":void 0})),r.createElement(N,{ref:p},s))}));F.displayName="AutosizeInput";const A=o.keyframes`
+`,N=r.memo(r.forwardRef(({id:e,onBlur:o,onFocus:n,readOnly:i,onChange:a,ariaLabel:l,inputValue:s,addClassNames:c,ariaLabelledBy:d},u)=>{const p=t.useRef(null),[m,f]=t.useState(2);t.useEffect(()=>{p.current&&f(p.current.scrollWidth+2)},[s]);const h=Object.assign({},V,{"aria-label":l,"aria-labelledby":d,style:{width:m}});return r.createElement("div",{style:L},r.createElement(T,Object.assign({id:e,ref:u,onBlur:o,onFocus:n,value:s,readOnly:i},h,{onChange:i?void 0:a,className:c?"rfs-autosize-input":void 0})),r.createElement(F,{ref:p},s))}));N.displayName="AutosizeInput";const A=o.keyframes`
   0%, 80%, 100% {
@@ -163,3 +163,3 @@ transform: scale(0);
   background-color: ${({theme:e})=>e.color.iconSeparator||e.color.border};
-`,X=r.memo(({menuOpen:e,clearIcon:t,caretIcon:o,isInvalid:n,showClear:i,isLoading:a,addClassNames:l,onCaretMouseDown:s,onClearMouseDown:d})=>r.createElement(P,null,i&&!a&&r.createElement(W,{"aria-hidden":"true",onTouchEnd:d,onMouseDown:d,"data-testid":"rfs-clear-icon"},t||r.createElement(H,{className:l?"rfs-clear-icon":void 0},"X")),a&&r.createElement(B,null),r.createElement(q,null),r.createElement(W,{"aria-hidden":"true",onTouchEnd:s,onMouseDown:s,"data-testid":"rfs-caret-icon"},o||r.createElement(U,{menuOpen:e,isInvalid:n,className:l?"rfs-caret-icon":void 0}))));X.displayName="IndicatorIcons";const K=i.span`
+`,X=r.memo(({menuOpen:e,clearIcon:t,caretIcon:o,isInvalid:n,showClear:i,isLoading:a,addClassNames:l,onCaretMouseDown:s,onClearMouseDown:c})=>r.createElement(P,null,i&&!a&&r.createElement(W,{"aria-hidden":"true",onTouchEnd:c,onMouseDown:c,"data-testid":"rfs-clear-icon"},t||r.createElement(H,{className:l?"rfs-clear-icon":void 0},"X")),a&&r.createElement(B,null),r.createElement(q,null),r.createElement(W,{"aria-hidden":"true",onTouchEnd:s,onMouseDown:s,"data-testid":"rfs-caret-icon"},o||r.createElement(U,{menuOpen:e,isInvalid:n,className:l?"rfs-caret-icon":void 0}))));X.displayName="IndicatorIcons";const K=i.span`
   border: 0;
@@ -175,3 +175,3 @@ padding: 0;
   clip-path: inset(50%);
-`,Y=({menuOpen:e,ariaLabel:t,inputValue:o,optionCount:n,isSearchable:i,focusedOption:a,selectedOption:l})=>{const{label:s,index:d,isDisabled:c}=a,u=`Selected option: ${h(l)?l.map(e=>e.label).join(" "):"N/A"}`,p=`${n} result(s) available${o?` for search input ${o}`:""}.`,m=`Focused option: ${s||"N/A"}${c?" - disabled":""}, ${d+1} of ${n}.`,f=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${i?", type to filter options":""}, press Down arrow key to open the menu.`;return r.createElement(K,{"aria-live":"polite"},r.createElement("p",null,u),r.createElement("p",null,`${m} ${p} ${f}`))},_=Object.freeze({NEXT:0,PREVIOUS:1}),G=Object.freeze({UP:0,DOWN:1,FIRST:2,LAST:3}),J=i.div`
+`,Y=({menuOpen:e,ariaLabel:t,inputValue:o,optionCount:n,isSearchable:i,focusedOption:a,selectedOption:l})=>{const{label:s,index:c,isDisabled:d}=a,u=`Selected option: ${h(l)?l.map(e=>e.label).join(" "):"N/A"}`,p=`${n} result(s) available${o?` for search input ${o}`:""}.`,m=`Focused option: ${s||"N/A"}${d?" - disabled":""}, ${c+1} of ${n}.`,f=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${i?", type to filter options":""}, press Down arrow key to open the menu.`;return r.createElement(K,{"aria-live":"polite"},r.createElement("p",null,u),r.createElement("p",null,`${m} ${p} ${f}`))},_=Object.freeze({NEXT:0,PREVIOUS:1}),G=Object.freeze({UP:0,DOWN:1,FIRST:2,LAST:3}),J=i.div`
   position: relative;
@@ -253,2 +253,2 @@ box-sizing: border-box;
   }
-`,te=r.forwardRef(({isMulti:e,inputId:n,selectId:i,isLoading:l,onKeyDown:s,clearIcon:p,caretIcon:m,isInvalid:f,ariaLabel:g,menuWidth:O,isDisabled:S,inputDelay:E,onMenuOpen:k,onMenuClose:z,onInputBlur:I,isClearable:M,themeConfig:D,onInputFocus:L,initialValue:V,addClassNames:N,ariaLabelledBy:T,onOptionChange:A,getOptionLabel:j,getOptionValue:B,openMenuOnFocus:P,isAriaLiveEnabled:W,menuOverscanCount:H,blurInputOnSelect:U,renderOptionLabel:q,hideSelectedOptions:K,getIsOptionDisabled:te,filterIsCaseSensitive:oe,getFilterOptionString:ne,isSearchable:re=!0,openMenuOnClick:ie=!0,tabSelectsOption:ae=!0,closeMenuOnSelect:le=!0,scrollMenuIntoView:se=!0,backspaceClearsValue:de=!0,options:ce=d,placeholder:ue="Select option..",noOptionsMsg:pe="No options",menuItemSize:me=35,menuMaxHeight:fe=300},he)=>{const be=t.useRef(),ge=t.useRef(null),ve=t.useRef(null),we=t.useRef(null),[$e,xe]=t.useState(""),[ye,Oe]=t.useState(!1),[Se,Ce]=t.useState(!1),[Ee,ke]=t.useState(u),[ze,Ie]=t.useState(null),{data:Me,value:De,label:Re,index:Le,isDisabled:Ve,isSelected:Ne}=Ee,Te=t.useMemo(()=>b(D)?function e(t,o){const n=Object.assign({},t);return Object.keys(o).forEach(r=>{b(o[r])?n[r]=r in t?e(t[r],o[r]):o[r]:n[r]=o[r]}),n}(a,D):Object.assign({},a),[D]),Fe=t.useMemo(()=>j||(e=>e.label),[j]),Ae=t.useMemo(()=>B||(e=>e.value),[B]),je=t.useMemo(()=>q||Fe,[q,Fe]),Be=((e,o)=>{const[n,r]=t.useState(e);return t.useEffect(()=>{if(void 0===o)return;const t=setTimeout(()=>{r(e)},o);return()=>{clearTimeout(t)}},[e,o]),void 0===o?e:n})($e,E),[Pe,We]=t.useState(()=>w(V,Ae,Fe)),He=((e,o,n,r,i,a)=>{const l=t.useRef(!1),[s,d]=t.useState(n);return t.useEffect(()=>{if(o){const t=e=>{i&&i(),e&&(l.current=!0,d(e))};v(e.current,r,t)}else a&&a(),l.current&&(l.current=!1,d(n))},[e,o,a,i,n,r]),s})(ve,ye,fe,se,k,z),Ue=$(ce,Be,"boolean"!=typeof K?!!e:K,Pe,Ae,Fe,te,ne,oe),qe=()=>{we.current&&we.current.blur()},Xe=()=>{we.current&&we.current.focus()},Ke=e=>{ge.current&&ge.current.scrollToItem(e)};t.useImperativeHandle(he,()=>({blur:qe,focus:Xe,clearValue:()=>{We(c),ke(u)},setValue:e=>{const t=function(e,t,o){if(null==e)return c;const n=[],r=w(e).filter(e=>b(e)).map(e=>o(e)).filter((e,t,o)=>o.indexOf(e)===t);if(!h(r))return c;for(const e of t)if(r.includes(o(e))&&(n.push(e),r.length===n.length))break;return n}(e,Ue,Ae);We(t)}}));const Ye=t.useCallback((e,t)=>{t&&(t.stopPropagation(),t.type===y&&t.preventDefault()),We(t=>t.filter(t=>t.value!==e))},[]),_e=t.useCallback(t=>{if(!h(Ue))return void Oe(!0);const o=e?-1:Ue.findIndex(e=>e.isSelected),n=o>-1?o:t===G.FIRST?0:Ue.length-1;Oe(!0),ke(Object.assign({index:n},Ue[n])),Ke(n)},[e,Ue]),Ge=t.useCallback((t,o)=>{o?e&&Ye(t.value):We(o=>e?[...o,t]:[t]),("boolean"==typeof U?U:(()=>window.matchMedia("(pointer: coarse)").matches)())?qe():le&&(Oe(!1),xe(""))},[e,le,U,Ye]);t.useEffect(()=>{Se&&P&&_e(G.FIRST)},[Se,P,_e]),t.useEffect(()=>{if(A){const t=e?Pe.map(e=>e.data):h(Pe)?Pe[0].data:null;A(t)}},[e,Pe,A]),t.useEffect(()=>{"number"!=typeof be.current||h(Ue)?(1===Ue.length||Ue.length&&(Ue.length!==ce.length||0===be.current))&&(ke(Object.assign({index:0},Ue[0])),Ke(0)):ke(u),be.current=Ue.length},[ce,Ue]);const Je=()=>{if(!Me||Ve)return;Ge({data:Me,value:De,label:Re},Ne)},Qe=e=>{if(!h(Pe))return;let t=-1;const o=Pe.length-1,n=ze?Pe.findIndex(e=>e.value===ze):-1,r=-1===(t=e===_.NEXT?n>-1&&n<o?n+1:-1:0!==n?-1===n?o:n-1:0)?null:Pe[t].value;Me&&ke(u),r!==ze&&Ie(r)},Ze=e=>{if(!h(Ue))return;const t=e===G.DOWN?(Le+1)%Ue.length:Le>0?Le-1:Ue.length-1;ze&&Ie(null),ke(Object.assign({index:t},Ue[t])),Ke(t)},et=e=>{if(S)return;Se||Xe();const t=e.currentTarget.tagName!==x;ye?t&&(Oe(!1),$e&&xe("")):ie&&_e(G.FIRST),t&&e.preventDefault()},tt=t.useCallback(e=>{I&&I(e),Ce(!1),Oe(!1),xe("")},[I]),ot=t.useCallback(e=>{L&&L(e),Ce(!0)},[L]),nt=t.useCallback(e=>{Oe(!0),xe(e.currentTarget.value||"")},[]),rt=t.useCallback(e=>{e.stopPropagation(),e.type===y&&e.preventDefault(),We(c),Xe()},[]),it=t.useCallback(e=>{e.stopPropagation(),e.type===y&&e.preventDefault(),Xe(),ye?Oe(!1):_e(G.FIRST)},[ye,_e]);return r.createElement(o.ThemeProvider,{theme:Te},r.createElement(J,{id:i,onKeyDown:t=>{if(!(S||s&&(s(t),t.defaultPrevented))){switch(t.key){case"ArrowDown":ye?Ze(G.DOWN):_e(G.FIRST);break;case"ArrowUp":ye?Ze(G.UP):_e(G.LAST);break;case"ArrowLeft":if(!e||$e)return;Qe(_.PREVIOUS);break;case"ArrowRight":if(!e||$e)return;Qe(_.NEXT);break;case" ":if($e)return;if(!ye){_e(G.FIRST);break}if(!Me)return;Je();break;case"Enter":229!==t.keyCode&&Je();break;case"Escape":ye&&(Oe(!1),xe(""));break;case"Tab":if(t.shiftKey||!ye||!ae||!Me)return;Je();break;case"Delete":case"Backspace":if($e)return;if(ze){const e=Pe.findIndex(e=>e.value===ze),t=e>-1&&e<Pe.length-1?Pe[e+1].value:null;Ye(ze),Ie(t)}else{if(!de)return;if(h(Pe))if(e){const{value:e}=Pe[Pe.length-1];Ye(e)}else M&&We(c)}break;default:return}t.preventDefault()}},"data-testid":"rfs-select-container",className:N?"rfs-select-container":void 0},r.createElement(Z,{isInvalid:f,isFocused:Se,isDisabled:S,onTouchEnd:et,onMouseDown:et,"data-testid":"rfs-control-container",className:N?"rfs-control-container":void 0},r.createElement(Q,null,r.createElement(R,{isMulti:e,inputValue:$e,placeholder:ue,selectedOption:Pe,focusedMultiValue:ze,renderOptionLabel:je,removeSelectedOption:Ye}),r.createElement(F,{id:n,ref:we,ariaLabel:g,inputValue:$e,onBlur:tt,onFocus:ot,addClassNames:N,onChange:nt,ariaLabelledBy:T,readOnly:S||!re||!!ze})),r.createElement(X,{menuOpen:ye,clearIcon:p,caretIcon:m,isInvalid:f,isLoading:l,addClassNames:N,onClearMouseDown:rt,showClear:!(!M||S||!h(Pe)),onCaretMouseDown:S||ie?void 0:it})),r.createElement(ee,{ref:ve,hideMenu:!ye,onMouseDown:e=>{e.stopPropagation(),e.preventDefault(),Xe()},"data-testid":"rfs-menu-container",className:N?"rfs-menu-container":void 0},r.createElement(C,{ref:ge,maxHeight:He,itemSize:me,menuOptions:Ue,noOptionsMsg:pe,selectOption:Ge,overscanCount:H,width:O||Te.menu.width,focusedOptionIndex:Le,renderOptionLabel:je})),W&&Se&&r.createElement(Y,{menuOpen:ye,ariaLabel:g,inputValue:$e,isSearchable:re,focusedOption:Ee,selectedOption:Pe,optionCount:Ue.length})))});te.displayName="Select",e.Select=te,Object.defineProperty(e,"__esModule",{value:!0})}));
+`,te=r.forwardRef(({isMulti:e,inputId:n,selectId:i,autoFocus:l,isLoading:s,onKeyDown:p,clearIcon:m,caretIcon:f,isInvalid:g,ariaLabel:O,menuWidth:S,isDisabled:E,inputDelay:k,onMenuOpen:z,onMenuClose:I,onInputBlur:M,isClearable:R,themeConfig:L,onInputFocus:V,initialValue:F,addClassNames:T,ariaLabelledBy:A,onOptionChange:j,getOptionLabel:B,getOptionValue:P,openMenuOnFocus:W,isAriaLiveEnabled:H,menuOverscanCount:U,blurInputOnSelect:q,renderOptionLabel:K,hideSelectedOptions:te,getIsOptionDisabled:oe,filterIsCaseSensitive:ne,getFilterOptionString:re,isSearchable:ie=!0,openMenuOnClick:ae=!0,tabSelectsOption:le=!0,closeMenuOnSelect:se=!0,scrollMenuIntoView:ce=!0,backspaceClearsValue:de=!0,options:ue=c,placeholder:pe="Select option..",noOptionsMsg:me="No options",menuItemSize:fe=35,menuMaxHeight:he=300},be)=>{const ge=t.useRef(!1),ve=t.useRef(),we=t.useRef(null),$e=t.useRef(null),xe=t.useRef(null),[ye,Oe]=t.useState(""),[Se,Ce]=t.useState(!1),[Ee,ke]=t.useState(!1),[ze,Ie]=t.useState(u),[Me,Re]=t.useState(null),{data:De,value:Le,label:Ve,index:Fe,isDisabled:Te,isSelected:Ne}=ze,Ae=t.useMemo(()=>b(L)?function e(t,o){const n=Object.assign({},t);return Object.keys(o).forEach(r=>{b(o[r])?n[r]=r in t?e(t[r],o[r]):o[r]:n[r]=o[r]}),n}(a,L):Object.assign({},a),[L]),je=t.useMemo(()=>B||(e=>e.label),[B]),Be=t.useMemo(()=>P||(e=>e.value),[P]),Pe=t.useMemo(()=>K||je,[K,je]),We=((e,o)=>{const[n,r]=t.useState(e);return t.useEffect(()=>{if(void 0===o)return;const t=setTimeout(()=>{r(e)},o);return()=>{clearTimeout(t)}},[e,o]),void 0===o?e:n})(ye,k),[He,Ue]=t.useState(()=>w(F,Be,je)),qe=((e,o,n,r,i,a)=>{const l=t.useRef(!1),[s,c]=t.useState(n);return t.useEffect(()=>{if(o){const t=e=>{i&&i(),e&&(l.current=!0,c(e))};v(e.current,r,t)}else a&&a(),l.current&&(l.current=!1,c(n))},[e,o,a,i,n,r]),s})($e,Se,he,ce,z,I),Xe=$(ue,We,"boolean"!=typeof te?!!e:te,He,Be,je,oe,re,ne),Ke=()=>{xe.current&&xe.current.blur()},Ye=()=>{xe.current&&xe.current.focus()},_e=e=>{we.current&&we.current.scrollToItem(e)};t.useImperativeHandle(be,()=>({blur:Ke,focus:Ye,clearValue:()=>{Ue(d),Ie(u)},setValue:e=>{const t=function(e,t,o){if(null==e)return d;const n=[],r=w(e).filter(e=>b(e)).map(e=>o(e)).filter((e,t,o)=>o.indexOf(e)===t);if(!h(r))return d;for(const e of t)if(r.includes(o(e))&&(n.push(e),r.length===n.length))break;return n}(e,Xe,Be);Ue(t)}}));const Ge=t.useCallback((e,t)=>{t&&(t.stopPropagation(),t.type===y&&t.preventDefault()),Ue(t=>t.filter(t=>t.value!==e))},[]),Je=t.useCallback(t=>{if(!h(Xe))return void Ce(!0);const o=e?-1:Xe.findIndex(e=>e.isSelected),n=o>-1?o:t===G.FIRST?0:Xe.length-1;Ce(!0),Ie(Object.assign({index:n},Xe[n])),_e(n)},[e,Xe]),Qe=t.useCallback((t,o)=>{o?e&&Ge(t.value):Ue(o=>e?[...o,t]:[t]),("boolean"==typeof q?q:(()=>window.matchMedia("(pointer: coarse)").matches)())?Ke():se&&(Ce(!1),Oe(""))},[e,se,q,Ge]);t.useEffect(()=>{l&&!ge.current&&(ge.current=!0,Ye())},[l]),t.useEffect(()=>{Ee&&W&&Je(G.FIRST)},[Ee,W,Je]),t.useEffect(()=>{if(j){const t=e?He.map(e=>e.data):h(He)?He[0].data:null;j(t)}},[e,He,j]),t.useEffect(()=>{"number"!=typeof ve.current||h(Xe)?(1===Xe.length||Xe.length&&(Xe.length!==ue.length||0===ve.current))&&(Ie(Object.assign({index:0},Xe[0])),_e(0)):Ie(u),ve.current=Xe.length},[ue,Xe]);const Ze=()=>{if(!De||Te)return;Qe({data:De,value:Le,label:Ve},Ne)},et=e=>{if(!h(He))return;let t=-1;const o=He.length-1,n=Me?He.findIndex(e=>e.value===Me):-1,r=-1===(t=e===_.NEXT?n>-1&&n<o?n+1:-1:0!==n?-1===n?o:n-1:0)?null:He[t].value;De&&Ie(u),r!==Me&&Re(r)},tt=e=>{if(!h(Xe))return;const t=e===G.DOWN?(Fe+1)%Xe.length:Fe>0?Fe-1:Xe.length-1;Me&&Re(null),Ie(Object.assign({index:t},Xe[t])),_e(t)},ot=e=>{if(E)return;Ee||Ye();const t=e.currentTarget.tagName!==x;Se?t&&(Ce(!1),ye&&Oe("")):ae&&Je(G.FIRST),t&&e.preventDefault()},nt=t.useCallback(e=>{M&&M(e),ke(!1),Ce(!1),Oe("")},[M]),rt=t.useCallback(e=>{V&&V(e),ke(!0)},[V]),it=t.useCallback(e=>{Ce(!0),Oe(e.currentTarget.value||"")},[]),at=t.useCallback(e=>{e.stopPropagation(),e.type===y&&e.preventDefault(),Ue(d),Ye()},[]),lt=t.useCallback(e=>{e.stopPropagation(),e.type===y&&e.preventDefault(),Ye(),Se?Ce(!1):Je(G.FIRST)},[Se,Je]);return r.createElement(o.ThemeProvider,{theme:Ae},r.createElement(J,{id:i,onKeyDown:t=>{if(!(E||p&&(p(t),t.defaultPrevented))){switch(t.key){case"ArrowDown":Se?tt(G.DOWN):Je(G.FIRST);break;case"ArrowUp":Se?tt(G.UP):Je(G.LAST);break;case"ArrowLeft":if(!e||ye)return;et(_.PREVIOUS);break;case"ArrowRight":if(!e||ye)return;et(_.NEXT);break;case" ":if(ye)return;if(!Se){Je(G.FIRST);break}if(!De)return;Ze();break;case"Enter":229!==t.keyCode&&Ze();break;case"Escape":Se&&(Ce(!1),Oe(""));break;case"Tab":if(t.shiftKey||!Se||!le||!De)return;Ze();break;case"Delete":case"Backspace":if(ye)return;if(Me){const e=He.findIndex(e=>e.value===Me),t=e>-1&&e<He.length-1?He[e+1].value:null;Ge(Me),Re(t)}else{if(!de)return;if(h(He))if(e){const{value:e}=He[He.length-1];Ge(e)}else R&&Ue(d)}break;default:return}t.preventDefault()}},"data-testid":"rfs-select-container",className:T?"rfs-select-container":void 0},r.createElement(Z,{isInvalid:g,isFocused:Ee,isDisabled:E,onTouchEnd:ot,onMouseDown:ot,"data-testid":"rfs-control-container",className:T?"rfs-control-container":void 0},r.createElement(Q,null,r.createElement(D,{isMulti:e,inputValue:ye,placeholder:pe,selectedOption:He,focusedMultiValue:Me,renderOptionLabel:Pe,removeSelectedOption:Ge}),r.createElement(N,{id:n,ref:xe,ariaLabel:O,inputValue:ye,onBlur:nt,onFocus:rt,addClassNames:T,onChange:it,ariaLabelledBy:A,readOnly:E||!ie||!!Me})),r.createElement(X,{menuOpen:Se,clearIcon:m,caretIcon:f,isInvalid:g,isLoading:s,addClassNames:T,onClearMouseDown:at,showClear:!(!R||E||!h(He)),onCaretMouseDown:E||ae?void 0:lt})),r.createElement(ee,{ref:$e,hideMenu:!Se,onMouseDown:e=>{e.stopPropagation(),e.preventDefault(),Ye()},"data-testid":"rfs-menu-container",className:T?"rfs-menu-container":void 0},r.createElement(C,{ref:we,maxHeight:qe,itemSize:fe,menuOptions:Xe,noOptionsMsg:me,selectOption:Qe,overscanCount:U,width:S||Ae.menu.width,focusedOptionIndex:Fe,renderOptionLabel:Pe})),H&&Ee&&r.createElement(Y,{menuOpen:Se,ariaLabel:O,inputValue:ye,isSearchable:ie,focusedOption:ze,selectedOption:He,optionCount:Xe.length})))});e.Select=te,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,o,n){"use strict";var i="default"in t?t.default:t,r="default"in o?o.default:o,a=Object.freeze({color:{border:"#ced4da",danger:"#dc3545",primary:"#007bff",disabled:"#e9ecef",placeholder:"#6E7276",dangerLight:"rgba(220, 53, 69, 0.25)"},select:{},loader:{opacity:"0.42",size:"0.625rem",color:"#007bff",padding:"0.375rem 0.75rem"},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=o.keyframes`
+!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,o,n){"use strict";var r="default"in t?t.default:t,i="default"in o?o.default:o,a=Object.freeze({color:{border:"#ced4da",danger:"#dc3545",primary:"#007bff",disabled:"#e9ecef",placeholder:"#6E7276",dangerLight:"rgba(220, 53, 69, 0.25)"},select:{},loader:{opacity:"0.42",size:"0.625rem",color:"#007bff",padding:"0.375rem 0.75rem"},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=o.keyframes`
   from {
@@ -9,3 +9,3 @@ opacity: 0;
   animation: ${l} 0.225s ease-in-out forwards;
-`,d=[],c=[],u=Object.freeze({index:-1});function p(e){return e===document.documentElement||e===document.body||e===window}function m(e){return p(e)?window.pageYOffset:e.scrollTop}function f(e,t,o,n){let i=0;const r=m(e),a=t-r;window.requestAnimationFrame((function t(){var l,s,d;s=a*((d=(d=i+=5)/o-1)*d*d+1)+r,p(l=e)?window.scrollTo(0,s):l.scrollTop=s,i<o?window.requestAnimationFrame(t):n&&n()}))}function h(e){return Array.isArray(e)&&!!e.length}function b(e){return e&&"object"==typeof e&&!Array.isArray(e)}function g(e,t){const o=e.replace(/^\s+|\s+$/g,"");return t?o:o.toLowerCase()}function v(e,t,o){if(!t||!e||!e.getBoundingClientRect)return void o();const{top:n,bottom:i,height:r}=e.getBoundingClientRect(),a=window.innerHeight;if(a-n>=r)return void o();const l=function(e){let t=getComputedStyle(e);const o="absolute"===t.position;if("fixed"===t.position)return document.documentElement;for(let n=e;n=n?n.parentElement:null;)if(t=getComputedStyle(n),(!o||"static"!==t.position)&&/(auto|scroll)/.test(`${t.overflow}${t.overflowY}${t.overflowX}`))return n;return document.documentElement}(e),s=m(l),d=l.getBoundingClientRect().height-s-n;d<r?o(d):f(l,i-a+s+parseInt(getComputedStyle(e).marginBottom||"0",10),300,o)}function w(e,t,o){const n=Array.isArray(e)?e.filter(Boolean):"object"==typeof e&&null!==e?[e]:c;return t&&o&&h(n)?n.map(e=>({data:e,value:t(e),label:o(e)})):n}const $=(e,o,n,i,r,a,l,s,c)=>{const[u,p]=t.useState(d);return t.useEffect(()=>{const t=g(o,c),u=l||(e=>!!e.isDisabled),m=s||(e=>String(e.label)),f=i.length?i.map(e=>e.value):void 0;p((()=>{const o=e=>{const o=r(e),i=Object.assign({data:e,value:o,label:a(e)},f&&f.includes(o)&&{isSelected:!0});if(!(t&&!(e=>{return g(m(e),c).indexOf(t)>-1})(i)||n&&i.isSelected))return Object.assign({},i,{},u(e)&&{isDisabled:!0})};return e.reduce((e,t)=>{const n=o(t);return n&&e.push(n),e},[])})()||d)},[e,i,n,c,o,s,l,r,a]),u},x="INPUT",y="mousedown",O=i.memo(({index:e,style:t,data:{menuOptions:o,selectOption:n,renderOptionLabel:r,focusedOptionIndex:a}})=>{const{data:l,value:s,label:d,isDisabled:c,isSelected:u}=o[e],p="rfs-option"+(c?" rfs-option-disabled":"")+(u?" rfs-option-selected":"")+(e===a?" rfs-option-focused":"");return i.createElement("div",{role:"button",style:t,className:p,onClick:c?void 0:()=>n({data:l,value:s,label:d},u)},r(l))},n.areEqual);O.displayName="Option";const S=r.div`
+`,d=[],c=[],u=Object.freeze({index:-1});function p(e){return e===document.documentElement||e===document.body||e===window}function m(e){return p(e)?window.pageYOffset:e.scrollTop}function f(e,t,o,n){let r=0;const i=m(e),a=t-i;window.requestAnimationFrame((function t(){var l,s,d;s=a*((d=(d=r+=5)/o-1)*d*d+1)+i,p(l=e)?window.scrollTo(0,s):l.scrollTop=s,r<o?window.requestAnimationFrame(t):n&&n()}))}function h(e){return Array.isArray(e)&&!!e.length}function b(e){return e&&"object"==typeof e&&!Array.isArray(e)}function g(e,t){const o=e.replace(/^\s+|\s+$/g,"");return t?o:o.toLowerCase()}function v(e,t,o){if(!t||!e||!e.getBoundingClientRect)return void o();const{top:n,bottom:r,height:i}=e.getBoundingClientRect(),a=window.innerHeight;if(a-n>=i)return void o();const l=function(e){let t=getComputedStyle(e);const o="absolute"===t.position;if("fixed"===t.position)return document.documentElement;for(let n=e;n=n?n.parentElement:null;)if(t=getComputedStyle(n),(!o||"static"!==t.position)&&/(auto|scroll)/.test(`${t.overflow}${t.overflowY}${t.overflowX}`))return n;return document.documentElement}(e),s=m(l),d=l.getBoundingClientRect().height-s-n;d<i?o(d):f(l,r-a+s+parseInt(getComputedStyle(e).marginBottom||"0",10),300,o)}function w(e,t,o){const n=Array.isArray(e)?e.filter(Boolean):"object"==typeof e&&null!==e?[e]:c;return t&&o&&h(n)?n.map(e=>({data:e,value:t(e),label:o(e)})):n}const $=(e,o,n,r,i,a,l,s,c)=>{const[u,p]=t.useState(d);return t.useEffect(()=>{const t=g(o,c),u=l||(e=>!!e.isDisabled),m=s||(e=>String(e.label)),f=r.length?r.map(e=>e.value):void 0;p((()=>{const o=e=>{const o=i(e),r=Object.assign({data:e,value:o,label:a(e)},f&&f.includes(o)&&{isSelected:!0});if(!(t&&!(e=>{return g(m(e),c).indexOf(t)>-1})(r)||n&&r.isSelected))return Object.assign({},r,{},u(e)&&{isDisabled:!0})};return e.reduce((e,t)=>{const n=o(t);return n&&e.push(n),e},[])})()||d)},[e,r,n,c,o,s,l,i,a]),u},x="INPUT",y="mousedown",O=r.memo(({index:e,style:t,data:{menuOptions:o,selectOption:n,renderOptionLabel:i,focusedOptionIndex:a}})=>{const{data:l,value:s,label:d,isDisabled:c,isSelected:u}=o[e],p="rfs-option"+(c?" rfs-option-disabled":"")+(u?" rfs-option-selected":"")+(e===a?" rfs-option-focused":"");return r.createElement("div",{role:"button",style:t,className:p,onClick:c?void 0:()=>n({data:l,value:s,label:d},u)},i(l))},n.areEqual);O.displayName="Option";const S=i.div`
   text-align: center;
@@ -16,3 +16,3 @@ color: ${({theme:e})=>e.noOptions.color};
   font-size: ${({theme:e})=>e.noOptions.fontSize};
-`,C=i.forwardRef(({width:e,itemSize:o,maxHeight:r,menuOptions:a,selectOption:l,noOptionsMsg:s,overscanCount:d,renderOptionLabel:c,focusedOptionIndex:u},p)=>{const m=t.useMemo(()=>({menuOptions:a,selectOption:l,renderOptionLabel:c,focusedOptionIndex:u}),[a,u,l,c]);return i.createElement(t.Fragment,null,i.createElement(n.FixedSizeList,{ref:p,width:e,itemSize:o,itemData:m,overscanCount:d,itemCount:a.length,height:Math.min(r,a.length*o)},O),!h(a)&&i.createElement(S,null,s))});C.displayName="Menu";const E=r.div`
+`,C=r.forwardRef(({width:e,itemSize:o,maxHeight:i,menuOptions:a,selectOption:l,noOptionsMsg:s,overscanCount:d,renderOptionLabel:c,focusedOptionIndex:u},p)=>{const m=t.useMemo(()=>({menuOptions:a,selectOption:l,renderOptionLabel:c,focusedOptionIndex:u}),[a,u,l,c]);return r.createElement(t.Fragment,null,r.createElement(n.FixedSizeList,{ref:p,width:e,itemSize:o,itemData:m,overscanCount:d,itemCount:a.length,height:Math.min(i,a.length*o)},O),!h(a)&&r.createElement(S,null,s))});C.displayName="Menu";const E=i.div`
   min-width: 0;
@@ -24,3 +24,3 @@ display: flex;
   ${s}
-`,k=r.div`
+`,k=i.div`
   overflow: hidden;
@@ -32,3 +32,3 @@ white-space: nowrap;
   border-radius: ${({theme:e})=>e.multiValue.label.borderRadius};
-`,z=r.div`
+`,z=i.div`
   display: flex;
@@ -47,3 +47,3 @@ padding: ${({theme:e})=>e.multiValue.clear.padding};
   }
-`,I=({data:e,value:t,isFocused:o,renderOptionLabel:n,removeSelectedOption:r})=>i.createElement(E,null,i.createElement(k,null,n(e)),i.createElement(z,{"aria-hidden":"true",isFocused:o,onTouchEnd:e=>r(t,e),onMouseDown:e=>r(t,e)},"X")),M=r.div`
+`,I=({data:e,value:t,isFocused:o,renderOptionLabel:n,removeSelectedOption:i})=>r.createElement(E,null,r.createElement(k,null,n(e)),r.createElement(z,{"aria-hidden":"true",isFocused:o,onTouchEnd:e=>i(t,e),onMouseDown:e=>i(t,e)},"X")),M=i.div`
   overflow: hidden;
@@ -55,3 +55,3 @@ position: absolute;
   max-width: calc(100% - 0.5rem);
-`,D=r.div`
+`,R=i.div`
   overflow: hidden;
@@ -63,3 +63,3 @@ position: absolute;
   color: ${({theme:e})=>e.color.placeholder};
-`,R=i.memo(({isMulti:e,inputValue:o,placeholder:n,selectedOption:r,focusedMultiValue:a,renderOptionLabel:l,removeSelectedOption:s})=>o&&(!e||e&&!h(r))?null:h(r)?e?i.createElement(t.Fragment,null,r.map(({data:e,value:t})=>i.createElement(I,{key:t,data:e,value:t,renderOptionLabel:l,isFocused:t===a,removeSelectedOption:s}))):i.createElement(M,null,l(r[0].data)):i.createElement(D,null,n));R.displayName="Value";const L=Object.freeze({display:"inline-block"}),V=Object.freeze({type:"text",spellCheck:!1,autoCorrect:"off",autoComplete:"off",autoCapitalize:"none","aria-autocomplete":"list","data-testid":void 0}),N=r.div`
+`,D=r.memo(({isMulti:e,inputValue:o,placeholder:n,selectedOption:i,focusedMultiValue:a,renderOptionLabel:l,removeSelectedOption:s})=>o&&(!e||e&&!h(i))?null:h(i)?e?r.createElement(t.Fragment,null,i.map(({data:e,value:t})=>r.createElement(I,{key:t,data:e,value:t,renderOptionLabel:l,isFocused:t===a,removeSelectedOption:s}))):r.createElement(M,null,l(i[0].data)):r.createElement(R,null,n));D.displayName="Value";const L=Object.freeze({display:"inline-block"}),V=Object.freeze({type:"text",spellCheck:!1,autoCorrect:"off",autoComplete:"off",autoCapitalize:"none","aria-autocomplete":"list","data-testid":void 0}),F=i.div`
   top: 0;
@@ -75,3 +75,3 @@ left: 0;
   font-family: inherit;
-`,T=r.input`
+`,T=i.input`
   border: 0;
@@ -98,3 +98,3 @@ outline: 0;
     `}
-`,F=i.memo(i.forwardRef(({id:e,onBlur:o,onFocus:n,readOnly:r,onChange:a,ariaLabel:l,inputValue:s,addClassNames:d,ariaLabelledBy:c},u)=>{const p=t.useRef(null),[m,f]=t.useState(2);t.useEffect(()=>{p.current&&f(p.current.scrollWidth+2)},[s]);const h=Object.assign({},V,{"aria-label":l,"aria-labelledby":c,style:{width:m}});return i.createElement("div",{style:L},i.createElement(T,Object.assign({id:e,ref:u,onBlur:o,onFocus:n,value:s,readOnly:r},h,{onChange:r?void 0:a,className:d?"rfs-autosize-input":void 0})),i.createElement(N,{ref:p},s))}));F.displayName="AutosizeInput";const A=o.keyframes`
+`,N=r.memo(r.forwardRef(({id:e,onBlur:o,onFocus:n,readOnly:i,onChange:a,ariaLabel:l,inputValue:s,addClassNames:d,ariaLabelledBy:c},u)=>{const p=t.useRef(null),[m,f]=t.useState(2);t.useEffect(()=>{p.current&&f(p.current.scrollWidth+2)},[s]);const h=Object.assign({},V,{"aria-label":l,"aria-labelledby":c,style:{width:m}});return r.createElement("div",{style:L},r.createElement(T,Object.assign({id:e,ref:u,onBlur:o,onFocus:n,value:s,readOnly:i},h,{onChange:i?void 0:a,className:d?"rfs-autosize-input":void 0})),r.createElement(F,{ref:p},s))}));N.displayName="AutosizeInput";const A=o.keyframes`
   0%, 80%, 100% {
@@ -105,3 +105,3 @@ transform: scale(0);
   }
-`,j=r.div`
+`,j=i.div`
   display: flex;
@@ -130,3 +130,3 @@ align-self: center;
   }
-`,B=()=>i.createElement(j,{"aria-hidden":"true"},i.createElement("div",null),i.createElement("div",null),i.createElement("div",null)),P=r.div`
+`,B=()=>r.createElement(j,{"aria-hidden":"true"},r.createElement("div",null),r.createElement("div",null),r.createElement("div",null)),P=i.div`
   display: flex;
@@ -137,3 +137,3 @@ flex-shrink: 0;
   box-sizing: border-box;
-`,W=r.div`
+`,W=i.div`
   display: flex;
@@ -147,3 +147,3 @@ box-sizing: border-box;
   }
-`,H=r.div`
+`,H=i.div`
   overflow: hidden;
@@ -155,3 +155,3 @@ font-size: ${({theme:e})=>e.icon.clear.fontSize};
   ${s}
-`,U=r.div`
+`,U=i.div`
   transition: ${({theme:e})=>e.icon.caret.transition};
@@ -166,3 +166,3 @@ border-top: ${({theme:e})=>e.icon.caret.size} dashed;
     `}
-`,q=r.div`
+`,q=i.div`
   width: 1px;
@@ -173,3 +173,3 @@ margin: 0.5rem 0;
   background-color: ${({theme:e})=>e.color.iconSeparator||e.color.border};
-`,X=i.memo(({menuOpen:e,clearIcon:t,caretIcon:o,isInvalid:n,showClear:r,isLoading:a,addClassNames:l,onCaretMouseDown:s,onClearMouseDown:d})=>i.createElement(P,null,r&&!a&&i.createElement(W,{"aria-hidden":"true",onTouchEnd:d,onMouseDown:d,"data-testid":void 0},t||i.createElement(H,{className:l?"rfs-clear-icon":void 0},"X")),a&&i.createElement(B,null),i.createElement(q,null),i.createElement(W,{"aria-hidden":"true",onTouchEnd:s,onMouseDown:s,"data-testid":void 0},o||i.createElement(U,{menuOpen:e,isInvalid:n,className:l?"rfs-caret-icon":void 0}))));X.displayName="IndicatorIcons";const K=r.span`
+`,X=r.memo(({menuOpen:e,clearIcon:t,caretIcon:o,isInvalid:n,showClear:i,isLoading:a,addClassNames:l,onCaretMouseDown:s,onClearMouseDown:d})=>r.createElement(P,null,i&&!a&&r.createElement(W,{"aria-hidden":"true",onTouchEnd:d,onMouseDown:d,"data-testid":void 0},t||r.createElement(H,{className:l?"rfs-clear-icon":void 0},"X")),a&&r.createElement(B,null),r.createElement(q,null),r.createElement(W,{"aria-hidden":"true",onTouchEnd:s,onMouseDown:s,"data-testid":void 0},o||r.createElement(U,{menuOpen:e,isInvalid:n,className:l?"rfs-caret-icon":void 0}))));X.displayName="IndicatorIcons";const K=i.span`
   border: 0;
@@ -185,3 +185,3 @@ padding: 0;
   clip-path: inset(50%);
-`,Y=({menuOpen:e,ariaLabel:t,inputValue:o,optionCount:n,isSearchable:r,focusedOption:a,selectedOption:l})=>{const{label:s,index:d,isDisabled:c}=a,u=`Selected option: ${h(l)?l.map(e=>e.label).join(" "):"N/A"}`,p=`${n} result(s) available${o?` for search input ${o}`:""}.`,m=`Focused option: ${s||"N/A"}${c?" - disabled":""}, ${d+1} of ${n}.`,f=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${r?", type to filter options":""}, press Down arrow key to open the menu.`;return i.createElement(K,{"aria-live":"polite"},i.createElement("p",null,u),i.createElement("p",null,`${m} ${p} ${f}`))},_=Object.freeze({NEXT:0,PREVIOUS:1}),G=Object.freeze({UP:0,DOWN:1,FIRST:2,LAST:3}),J=r.div`
+`,Y=({menuOpen:e,ariaLabel:t,inputValue:o,optionCount:n,isSearchable:i,focusedOption:a,selectedOption:l})=>{const{label:s,index:d,isDisabled:c}=a,u=`Selected option: ${h(l)?l.map(e=>e.label).join(" "):"N/A"}`,p=`${n} result(s) available${o?` for search input ${o}`:""}.`,m=`Focused option: ${s||"N/A"}${c?" - disabled":""}, ${d+1} of ${n}.`,f=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${i?", type to filter options":""}, press Down arrow key to open the menu.`;return r.createElement(K,{"aria-live":"polite"},r.createElement("p",null,u),r.createElement("p",null,`${m} ${p} ${f}`))},_=Object.freeze({NEXT:0,PREVIOUS:1}),G=Object.freeze({UP:0,DOWN:1,FIRST:2,LAST:3}),J=i.div`
   position: relative;
@@ -191,3 +191,3 @@ box-sizing: border-box;
   ${({theme:e})=>e.select.fontSize&&o.css`font-size: ${e.select.fontSize};`}
-`,Q=r.div`
+`,Q=i.div`
   flex: 1 1 0%;
@@ -201,3 +201,3 @@ display: flex;
   padding: ${({theme:e})=>e.control.padding};
-`,Z=r.div`
+`,Z=i.div`
   outline: 0;
@@ -212,17 +212,17 @@ display: flex;
 
-  ${({isDisabled:e,isFocused:t,isInvalid:n,theme:{control:i,color:r}})=>o.css`
-    min-height: ${i.minHeight};
-    transition: ${i.transition};
-    border-style: ${i.borderStyle};
-    border-width: ${i.borderWidth};
-    border-radius: ${i.borderRadius};
+  ${({isDisabled:e,isFocused:t,isInvalid:n,theme:{control:r,color:i}})=>o.css`
+    min-height: ${r.minHeight};
+    transition: ${r.transition};
+    border-style: ${r.borderStyle};
+    border-width: ${r.borderWidth};
+    border-radius: ${r.borderRadius};
 
-    border-color: ${n?r.danger:t?i.focusedBorderColor:r.border};
+    border-color: ${n?i.danger:t?r.focusedBorderColor:i.border};
 
     ${e&&"pointer-events: none;"}
-    ${i.height&&`height: ${i.height};`}
-    ${(i.backgroundColor||e)&&`background-color: ${e?r.disabled:i.backgroundColor};`}
-    ${t&&`box-shadow: ${i.boxShadow} ${n?r.dangerLight:i.boxShadowColor};`}
+    ${r.height&&`height: ${r.height};`}
+    ${(r.backgroundColor||e)&&`background-color: ${e?i.disabled:r.backgroundColor};`}
+    ${t&&`box-shadow: ${r.boxShadow} ${n?i.dangerLight:r.boxShadowColor};`}
   `}
-`,ee=r.div`
+`,ee=i.div`
   z-index: 999;
@@ -266,2 +266,2 @@ position: absolute;
   }
-`,te=i.forwardRef(({isMulti:e,inputId:n,selectId:r,isLoading:l,onKeyDown:s,clearIcon:p,caretIcon:m,isInvalid:f,ariaLabel:g,menuWidth:O,isDisabled:S,inputDelay:E,onMenuOpen:k,onMenuClose:z,onInputBlur:I,isClearable:M,themeConfig:D,onInputFocus:L,initialValue:V,addClassNames:N,ariaLabelledBy:T,onOptionChange:A,getOptionLabel:j,getOptionValue:B,openMenuOnFocus:P,isAriaLiveEnabled:W,menuOverscanCount:H,blurInputOnSelect:U,renderOptionLabel:q,hideSelectedOptions:K,getIsOptionDisabled:te,filterIsCaseSensitive:oe,getFilterOptionString:ne,isSearchable:ie=!0,openMenuOnClick:re=!0,tabSelectsOption:ae=!0,closeMenuOnSelect:le=!0,scrollMenuIntoView:se=!0,backspaceClearsValue:de=!0,options:ce=d,placeholder:ue="Select option..",noOptionsMsg:pe="No options",menuItemSize:me=35,menuMaxHeight:fe=300},he)=>{const be=t.useRef(),ge=t.useRef(null),ve=t.useRef(null),we=t.useRef(null),[$e,xe]=t.useState(""),[ye,Oe]=t.useState(!1),[Se,Ce]=t.useState(!1),[Ee,ke]=t.useState(u),[ze,Ie]=t.useState(null),{data:Me,value:De,label:Re,index:Le,isDisabled:Ve,isSelected:Ne}=Ee,Te=t.useMemo(()=>b(D)?function e(t,o){const n=Object.assign({},t);return Object.keys(o).forEach(i=>{b(o[i])?n[i]=i in t?e(t[i],o[i]):o[i]:n[i]=o[i]}),n}(a,D):Object.assign({},a),[D]),Fe=t.useMemo(()=>j||(e=>e.label),[j]),Ae=t.useMemo(()=>B||(e=>e.value),[B]),je=t.useMemo(()=>q||Fe,[q,Fe]),Be=((e,o)=>{const[n,i]=t.useState(e);return t.useEffect(()=>{if(void 0===o)return;const t=setTimeout(()=>{i(e)},o);return()=>{clearTimeout(t)}},[e,o]),void 0===o?e:n})($e,E),[Pe,We]=t.useState(()=>w(V,Ae,Fe)),He=((e,o,n,i,r,a)=>{const l=t.useRef(!1),[s,d]=t.useState(n);return t.useEffect(()=>{if(o){const t=e=>{r&&r(),e&&(l.current=!0,d(e))};v(e.current,i,t)}else a&&a(),l.current&&(l.current=!1,d(n))},[e,o,a,r,n,i]),s})(ve,ye,fe,se,k,z),Ue=$(ce,Be,"boolean"!=typeof K?!!e:K,Pe,Ae,Fe,te,ne,oe),qe=()=>{we.current&&we.current.blur()},Xe=()=>{we.current&&we.current.focus()},Ke=e=>{ge.current&&ge.current.scrollToItem(e)};t.useImperativeHandle(he,()=>({blur:qe,focus:Xe,clearValue:()=>{We(c),ke(u)},setValue:e=>{const t=function(e,t,o){if(null==e)return c;const n=[],i=w(e).filter(e=>b(e)).map(e=>o(e)).filter((e,t,o)=>o.indexOf(e)===t);if(!h(i))return c;for(const e of t)if(i.includes(o(e))&&(n.push(e),i.length===n.length))break;return n}(e,Ue,Ae);We(t)}}));const Ye=t.useCallback((e,t)=>{t&&(t.stopPropagation(),t.type===y&&t.preventDefault()),We(t=>t.filter(t=>t.value!==e))},[]),_e=t.useCallback(t=>{if(!h(Ue))return void Oe(!0);const o=e?-1:Ue.findIndex(e=>e.isSelected),n=o>-1?o:t===G.FIRST?0:Ue.length-1;Oe(!0),ke(Object.assign({index:n},Ue[n])),Ke(n)},[e,Ue]),Ge=t.useCallback((t,o)=>{o?e&&Ye(t.value):We(o=>e?[...o,t]:[t]),("boolean"==typeof U?U:(()=>window.matchMedia("(pointer: coarse)").matches)())?qe():le&&(Oe(!1),xe(""))},[e,le,U,Ye]);t.useEffect(()=>{Se&&P&&_e(G.FIRST)},[Se,P,_e]),t.useEffect(()=>{if(A){const t=e?Pe.map(e=>e.data):h(Pe)?Pe[0].data:null;A(t)}},[e,Pe,A]),t.useEffect(()=>{"number"!=typeof be.current||h(Ue)?(1===Ue.length||Ue.length&&(Ue.length!==ce.length||0===be.current))&&(ke(Object.assign({index:0},Ue[0])),Ke(0)):ke(u),be.current=Ue.length},[ce,Ue]);const Je=()=>{if(!Me||Ve)return;Ge({data:Me,value:De,label:Re},Ne)},Qe=e=>{if(!h(Pe))return;let t=-1;const o=Pe.length-1,n=ze?Pe.findIndex(e=>e.value===ze):-1,i=-1===(t=e===_.NEXT?n>-1&&n<o?n+1:-1:0!==n?-1===n?o:n-1:0)?null:Pe[t].value;Me&&ke(u),i!==ze&&Ie(i)},Ze=e=>{if(!h(Ue))return;const t=e===G.DOWN?(Le+1)%Ue.length:Le>0?Le-1:Ue.length-1;ze&&Ie(null),ke(Object.assign({index:t},Ue[t])),Ke(t)},et=e=>{if(S)return;Se||Xe();const t=e.currentTarget.tagName!==x;ye?t&&(Oe(!1),$e&&xe("")):re&&_e(G.FIRST),t&&e.preventDefault()},tt=t.useCallback(e=>{I&&I(e),Ce(!1),Oe(!1),xe("")},[I]),ot=t.useCallback(e=>{L&&L(e),Ce(!0)},[L]),nt=t.useCallback(e=>{Oe(!0),xe(e.currentTarget.value||"")},[]),it=t.useCallback(e=>{e.stopPropagation(),e.type===y&&e.preventDefault(),We(c),Xe()},[]),rt=t.useCallback(e=>{e.stopPropagation(),e.type===y&&e.preventDefault(),Xe(),ye?Oe(!1):_e(G.FIRST)},[ye,_e]);return i.createElement(o.ThemeProvider,{theme:Te},i.createElement(J,{id:r,onKeyDown:t=>{if(!(S||s&&(s(t),t.defaultPrevented))){switch(t.key){case"ArrowDown":ye?Ze(G.DOWN):_e(G.FIRST);break;case"ArrowUp":ye?Ze(G.UP):_e(G.LAST);break;case"ArrowLeft":if(!e||$e)return;Qe(_.PREVIOUS);break;case"ArrowRight":if(!e||$e)return;Qe(_.NEXT);break;case" ":if($e)return;if(!ye){_e(G.FIRST);break}if(!Me)return;Je();break;case"Enter":229!==t.keyCode&&Je();break;case"Escape":ye&&(Oe(!1),xe(""));break;case"Tab":if(t.shiftKey||!ye||!ae||!Me)return;Je();break;case"Delete":case"Backspace":if($e)return;if(ze){const e=Pe.findIndex(e=>e.value===ze),t=e>-1&&e<Pe.length-1?Pe[e+1].value:null;Ye(ze),Ie(t)}else{if(!de)return;if(h(Pe))if(e){const{value:e}=Pe[Pe.length-1];Ye(e)}else M&&We(c)}break;default:return}t.preventDefault()}},"data-testid":void 0,className:N?"rfs-select-container":void 0},i.createElement(Z,{isInvalid:f,isFocused:Se,isDisabled:S,onTouchEnd:et,onMouseDown:et,"data-testid":void 0,className:N?"rfs-control-container":void 0},i.createElement(Q,null,i.createElement(R,{isMulti:e,inputValue:$e,placeholder:ue,selectedOption:Pe,focusedMultiValue:ze,renderOptionLabel:je,removeSelectedOption:Ye}),i.createElement(F,{id:n,ref:we,ariaLabel:g,inputValue:$e,onBlur:tt,onFocus:ot,addClassNames:N,onChange:nt,ariaLabelledBy:T,readOnly:S||!ie||!!ze})),i.createElement(X,{menuOpen:ye,clearIcon:p,caretIcon:m,isInvalid:f,isLoading:l,addClassNames:N,onClearMouseDown:it,showClear:!(!M||S||!h(Pe)),onCaretMouseDown:S||re?void 0:rt})),i.createElement(ee,{ref:ve,hideMenu:!ye,onMouseDown:e=>{e.stopPropagation(),e.preventDefault(),Xe()},"data-testid":void 0,className:N?"rfs-menu-container":void 0},i.createElement(C,{ref:ge,maxHeight:He,itemSize:me,menuOptions:Ue,noOptionsMsg:pe,selectOption:Ge,overscanCount:H,width:O||Te.menu.width,focusedOptionIndex:Le,renderOptionLabel:je})),W&&Se&&i.createElement(Y,{menuOpen:ye,ariaLabel:g,inputValue:$e,isSearchable:ie,focusedOption:Ee,selectedOption:Pe,optionCount:Ue.length})))});te.displayName="Select",e.Select=te,Object.defineProperty(e,"__esModule",{value:!0})}));
+`,te=r.forwardRef(({isMulti:e,inputId:n,selectId:i,autoFocus:l,isLoading:s,onKeyDown:p,clearIcon:m,caretIcon:f,isInvalid:g,ariaLabel:O,menuWidth:S,isDisabled:E,inputDelay:k,onMenuOpen:z,onMenuClose:I,onInputBlur:M,isClearable:R,themeConfig:L,onInputFocus:V,initialValue:F,addClassNames:T,ariaLabelledBy:A,onOptionChange:j,getOptionLabel:B,getOptionValue:P,openMenuOnFocus:W,isAriaLiveEnabled:H,menuOverscanCount:U,blurInputOnSelect:q,renderOptionLabel:K,hideSelectedOptions:te,getIsOptionDisabled:oe,filterIsCaseSensitive:ne,getFilterOptionString:re,isSearchable:ie=!0,openMenuOnClick:ae=!0,tabSelectsOption:le=!0,closeMenuOnSelect:se=!0,scrollMenuIntoView:de=!0,backspaceClearsValue:ce=!0,options:ue=d,placeholder:pe="Select option..",noOptionsMsg:me="No options",menuItemSize:fe=35,menuMaxHeight:he=300},be)=>{const ge=t.useRef(!1),ve=t.useRef(),we=t.useRef(null),$e=t.useRef(null),xe=t.useRef(null),[ye,Oe]=t.useState(""),[Se,Ce]=t.useState(!1),[Ee,ke]=t.useState(!1),[ze,Ie]=t.useState(u),[Me,Re]=t.useState(null),{data:De,value:Le,label:Ve,index:Fe,isDisabled:Te,isSelected:Ne}=ze,Ae=t.useMemo(()=>b(L)?function e(t,o){const n=Object.assign({},t);return Object.keys(o).forEach(r=>{b(o[r])?n[r]=r in t?e(t[r],o[r]):o[r]:n[r]=o[r]}),n}(a,L):Object.assign({},a),[L]),je=t.useMemo(()=>B||(e=>e.label),[B]),Be=t.useMemo(()=>P||(e=>e.value),[P]),Pe=t.useMemo(()=>K||je,[K,je]),We=((e,o)=>{const[n,r]=t.useState(e);return t.useEffect(()=>{if(void 0===o)return;const t=setTimeout(()=>{r(e)},o);return()=>{clearTimeout(t)}},[e,o]),void 0===o?e:n})(ye,k),[He,Ue]=t.useState(()=>w(F,Be,je)),qe=((e,o,n,r,i,a)=>{const l=t.useRef(!1),[s,d]=t.useState(n);return t.useEffect(()=>{if(o){const t=e=>{i&&i(),e&&(l.current=!0,d(e))};v(e.current,r,t)}else a&&a(),l.current&&(l.current=!1,d(n))},[e,o,a,i,n,r]),s})($e,Se,he,de,z,I),Xe=$(ue,We,"boolean"!=typeof te?!!e:te,He,Be,je,oe,re,ne),Ke=()=>{xe.current&&xe.current.blur()},Ye=()=>{xe.current&&xe.current.focus()},_e=e=>{we.current&&we.current.scrollToItem(e)};t.useImperativeHandle(be,()=>({blur:Ke,focus:Ye,clearValue:()=>{Ue(c),Ie(u)},setValue:e=>{const t=function(e,t,o){if(null==e)return c;const n=[],r=w(e).filter(e=>b(e)).map(e=>o(e)).filter((e,t,o)=>o.indexOf(e)===t);if(!h(r))return c;for(const e of t)if(r.includes(o(e))&&(n.push(e),r.length===n.length))break;return n}(e,Xe,Be);Ue(t)}}));const Ge=t.useCallback((e,t)=>{t&&(t.stopPropagation(),t.type===y&&t.preventDefault()),Ue(t=>t.filter(t=>t.value!==e))},[]),Je=t.useCallback(t=>{if(!h(Xe))return void Ce(!0);const o=e?-1:Xe.findIndex(e=>e.isSelected),n=o>-1?o:t===G.FIRST?0:Xe.length-1;Ce(!0),Ie(Object.assign({index:n},Xe[n])),_e(n)},[e,Xe]),Qe=t.useCallback((t,o)=>{o?e&&Ge(t.value):Ue(o=>e?[...o,t]:[t]),("boolean"==typeof q?q:(()=>window.matchMedia("(pointer: coarse)").matches)())?Ke():se&&(Ce(!1),Oe(""))},[e,se,q,Ge]);t.useEffect(()=>{l&&!ge.current&&(ge.current=!0,Ye())},[l]),t.useEffect(()=>{Ee&&W&&Je(G.FIRST)},[Ee,W,Je]),t.useEffect(()=>{if(j){const t=e?He.map(e=>e.data):h(He)?He[0].data:null;j(t)}},[e,He,j]),t.useEffect(()=>{"number"!=typeof ve.current||h(Xe)?(1===Xe.length||Xe.length&&(Xe.length!==ue.length||0===ve.current))&&(Ie(Object.assign({index:0},Xe[0])),_e(0)):Ie(u),ve.current=Xe.length},[ue,Xe]);const Ze=()=>{if(!De||Te)return;Qe({data:De,value:Le,label:Ve},Ne)},et=e=>{if(!h(He))return;let t=-1;const o=He.length-1,n=Me?He.findIndex(e=>e.value===Me):-1,r=-1===(t=e===_.NEXT?n>-1&&n<o?n+1:-1:0!==n?-1===n?o:n-1:0)?null:He[t].value;De&&Ie(u),r!==Me&&Re(r)},tt=e=>{if(!h(Xe))return;const t=e===G.DOWN?(Fe+1)%Xe.length:Fe>0?Fe-1:Xe.length-1;Me&&Re(null),Ie(Object.assign({index:t},Xe[t])),_e(t)},ot=e=>{if(E)return;Ee||Ye();const t=e.currentTarget.tagName!==x;Se?t&&(Ce(!1),ye&&Oe("")):ae&&Je(G.FIRST),t&&e.preventDefault()},nt=t.useCallback(e=>{M&&M(e),ke(!1),Ce(!1),Oe("")},[M]),rt=t.useCallback(e=>{V&&V(e),ke(!0)},[V]),it=t.useCallback(e=>{Ce(!0),Oe(e.currentTarget.value||"")},[]),at=t.useCallback(e=>{e.stopPropagation(),e.type===y&&e.preventDefault(),Ue(c),Ye()},[]),lt=t.useCallback(e=>{e.stopPropagation(),e.type===y&&e.preventDefault(),Ye(),Se?Ce(!1):Je(G.FIRST)},[Se,Je]);return r.createElement(o.ThemeProvider,{theme:Ae},r.createElement(J,{id:i,onKeyDown:t=>{if(!(E||p&&(p(t),t.defaultPrevented))){switch(t.key){case"ArrowDown":Se?tt(G.DOWN):Je(G.FIRST);break;case"ArrowUp":Se?tt(G.UP):Je(G.LAST);break;case"ArrowLeft":if(!e||ye)return;et(_.PREVIOUS);break;case"ArrowRight":if(!e||ye)return;et(_.NEXT);break;case" ":if(ye)return;if(!Se){Je(G.FIRST);break}if(!De)return;Ze();break;case"Enter":229!==t.keyCode&&Ze();break;case"Escape":Se&&(Ce(!1),Oe(""));break;case"Tab":if(t.shiftKey||!Se||!le||!De)return;Ze();break;case"Delete":case"Backspace":if(ye)return;if(Me){const e=He.findIndex(e=>e.value===Me),t=e>-1&&e<He.length-1?He[e+1].value:null;Ge(Me),Re(t)}else{if(!ce)return;if(h(He))if(e){const{value:e}=He[He.length-1];Ge(e)}else R&&Ue(c)}break;default:return}t.preventDefault()}},"data-testid":void 0,className:T?"rfs-select-container":void 0},r.createElement(Z,{isInvalid:g,isFocused:Ee,isDisabled:E,onTouchEnd:ot,onMouseDown:ot,"data-testid":void 0,className:T?"rfs-control-container":void 0},r.createElement(Q,null,r.createElement(D,{isMulti:e,inputValue:ye,placeholder:pe,selectedOption:He,focusedMultiValue:Me,renderOptionLabel:Pe,removeSelectedOption:Ge}),r.createElement(N,{id:n,ref:xe,ariaLabel:O,inputValue:ye,onBlur:nt,onFocus:rt,addClassNames:T,onChange:it,ariaLabelledBy:A,readOnly:E||!ie||!!Me})),r.createElement(X,{menuOpen:Se,clearIcon:m,caretIcon:f,isInvalid:g,isLoading:s,addClassNames:T,onClearMouseDown:at,showClear:!(!R||E||!h(He)),onCaretMouseDown:E||ae?void 0:lt})),r.createElement(ee,{ref:$e,hideMenu:!Se,onMouseDown:e=>{e.stopPropagation(),e.preventDefault(),Ye()},"data-testid":void 0,className:T?"rfs-menu-container":void 0},r.createElement(C,{ref:we,maxHeight:qe,itemSize:fe,menuOptions:Xe,noOptionsMsg:me,selectOption:Qe,overscanCount:U,width:S||Ae.menu.width,focusedOptionIndex:Fe,renderOptionLabel:Pe})),H&&Ee&&r.createElement(Y,{menuOpen:Se,ariaLabel:O,inputValue:ye,isSearchable:ie,focusedOption:ze,selectedOption:He,optionCount:Xe.length})))});e.Select=te,Object.defineProperty(e,"__esModule",{value:!0})}));

dist/index.cjs.js

@@ -995,2 +995,3 @@ 'use strict';
   selectId,
+  autoFocus,
   isLoading,
@@ -1038,2 +1039,3 @@ onKeyDown,
 }, ref) => {
+  const autoFocused = React.useRef(false);
   const prevMenuOptionsCount = React.useRef();
@@ -1137,2 +1139,8 @@ const listRef = React.useRef(null);
   React.useEffect(() => {
+    if (autoFocus && !autoFocused.current) {
+      autoFocused.current = true;
+      focusInput();
+    }
+  }, [autoFocus]);
+  React.useEffect(() => {
     if (isFocused && openMenuOnFocus) {
@@ -1459,4 +1467,3 @@ openMenuAndFocusOption(OptionIndexEnum.FIRST);
 });
-Select.displayName = 'Select';
 
 exports.Select = Select;

dist/index.esm.js

@@ -987,2 +987,3 @@ import React, { useState, useEffect, useRef, useMemo, Fragment, useImperativeHandle, useCallback } from 'react';
   selectId,
+  autoFocus,
   isLoading,
@@ -1030,2 +1031,3 @@ onKeyDown,
 }, ref) => {
+  const autoFocused = useRef(false);
   const prevMenuOptionsCount = useRef();
@@ -1129,2 +1131,8 @@ const listRef = useRef(null);
   useEffect(() => {
+    if (autoFocus && !autoFocused.current) {
+      autoFocused.current = true;
+      focusInput();
+    }
+  }, [autoFocus]);
+  useEffect(() => {
     if (isFocused && openMenuOnFocus) {
@@ -1451,4 +1459,3 @@ openMenuAndFocusOption(OptionIndexEnum.FIRST);
 });
-Select.displayName = 'Select';
 
 export { Select };

package.json

 {
   "name": "react-functional-select",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "author": "Matt Areddia <[e-mail]> (https://github.com/based-ghost/)",
@@ -84,3 +84,3 @@ "description": "Miro-sized and micro-optimized select component for React.js",
     "rimraf": "^3.0.0",
-    "rollup": "^1.27.10",
+    "rollup": "^1.27.11",
     "rollup-plugin-babel": "^4.3.3",
@@ -87,0 +87,0 @@ "rollup-plugin-commonjs": "^10.1.0",

README.md

@@ -9,5 +9,2 @@ # react-functional-select
 
-## Inspiration
-This project was inspired by [`react-select`](https://github.com/JedWatson/react-select). If you need some features not provided, I suggest checking that package out.
-
 ## Install
@@ -24,8 +21,8 @@
 ## Overview
-Essentially, this is a focused subset of `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:
+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:
 
-- [``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).
+- [`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).
 
-While still a work in progress, its current state should be suitable for many use-cases. Please feel free to contribute and/or make suggestions (below are key areas that still need to be addressed).
+Please feel free to contribute and/or make suggestions (below are key areas that still need to be addressed).
 
@@ -46,2 +43,3 @@ ### Development for future releases:
 import { Select } from 'react-functional-select';
+import React, { useState, useEffect, useCallback } from 'react';
 import { Card, CardHeader, CardBody, Container, SelectContainer } from './helpers/styled';
@@ -102,2 +100,5 @@
 
+## Inspiration
+This project was inspired by [`react-select`](https://github.com/JedWatson/react-select).
+
 ## Properties
@@ -113,2 +114,3 @@
 |`isMulti`| bool | `false` | Does the control allow for multiple selections (defaults to single-value mode)
+|`autoFocus`| bool | `false` | Focus the control following initial mount of component
 |`isLoading`| bool | `false` | Is the select in a state of loading - shows loading dots animation
@@ -153,2 +155,2 @@ |`isInvalid`| bool | `false` | Is the current value invalid - control recieves invalid styling
 |`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
+|`themeConfig`| Partial\<DefaultTheme\> | `undefined` | Object that takes specified property key-value pairs and merges them into the theme object

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

145220

increased by0.35%

Lines of code

3325

increased by0.45%

Number of lines in readme file

150

increased by0.67%

No dependency changes