@foxford/ui 2.67.0-beta-c9e1f09-20250228 → 2.68.0-beta-1c44173-20250312

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,2 +1,2 @@
1
- 'use strict';var React=require('react');var Fuse=require('fuse.js');var nanoid=require('nanoid');var withMergedProps=require('../../hocs/withMergedProps.js');var useScrollMonitor=require('../../hooks/useScrollMonitor.js');var dom=require('../../shared/utils/dom.js');var constants$1=require('../../shared/constants.js');var DropdownMenu=require('./DropdownMenu.js');var constants=require('./constants.js');var utils=require('./utils.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var FormInputLabel=require('../FormInputLabel/FormInputLabel.js');var FormInput=require('../FormInput/FormInput.js');var Chip=require('../Chip/Chip.js');var IconButton=require('../IconButton/IconButton.js');var MenuList=require('../MenuList/MenuList.js');var ListItem=require('../ListItem/ListItem.js');var InputCheckbox=require('../InputCheckbox/InputCheckbox.js');var MenuDivider=require('../MenuDivider/MenuDivider.js');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var Fuse__default=_interopDefault(Fuse);const Dropdown=withMergedProps.withMergedProps(React.forwardRef(((e,t)=>{const{size:o="m",name:n="fox-dropdown",labelPosition:r="dynamic",searchable:s=!0,primary:a=!0,optionsMultiToggle:i=!0,loading:c=!1,iconProps:l={},menuProps:u={},loadingIconProps:d={},optionsEmptyIconProps:p={},autoFocus:b,disableAutoScrollToSelectedOption:m,closeMenuOnScroll:g,scrollMonitorTarget:x,contrast:v,selectedOption:f,defaultSelectedOption:k,icon:h,inputMode:C,loadingMessage:I,loadingIcon:R,maxLength:y,multiple:j,clearable:D,onCloseMenu:w,onOpenMenu:M,onSelectOption:S,options:L,groupSelectedOptions:P,optionsMultiToggleCaption:F,optionsEmptyMessage:E,optionsEmptyIcon:T,palette:B,placeholder:q,readOnly:z,required:O,status:K,sizeXXS:_,sizeXS:X,sizeS:$,sizeM:H,sizeL:N,sizeXL:Z,form:A,...U}=e;const G={size:o,sizeXXS:_,sizeXS:X,sizeS:$,sizeM:H,sizeL:N,sizeXL:Z};const J={sizes:constants.SIZES_ICON,color:U.disabled?'content-disabled':'content-onmain-tertiary'};const Q=React.useMemo((()=>U.id??`${n}-${nanoid.nanoid()}`),[n,U.id]);const V=React.useMemo((()=>nanoid.nanoid()),[]);const W=React.useMemo((()=>nanoid.nanoid()),[]);const Y=React.useMemo((()=>{const e=new Fuse__default.default(L,{threshold:.4,ignoreLocation:!0,keys:[constants.FuseSearchKeys.text,constants.FuseSearchKeys.label,constants.FuseSearchKeys.tags]});return t=>t.length===0?L:e.search(t).map((e=>e.item))}),[L]);const[ee,te]=React.useState((()=>utils.getDropdownSelectedOption(f!==void 0?f:k,j)));const[oe,ne]=React.useState((()=>utils.getDropdownInputText(ee,j)));const[re,se]=React.useState(!1);const[ae,ie]=React.useState((()=>Y(oe)));const[ce,le]=React.useState(!1);const ue=j?utils.groupDropdownOptions(L,ee):[[],[]];const de=ce&&!U.disabled;const pe=oe===utils.getDropdownInputText(ee);const be=O&&ee.length===0;const me=Boolean(de||oe||re);const ge=ue[0].length>0&&ue[1].length===0;const xe=ue[0].length>0&&ue[1].length>0;const ve=React.useRef(null);const[fe,ke]=React.useState(null);const he=React.useRef(null);const Ce=React.useRef(null);const Ie=React.useRef(null);const Re=React.useRef(oe);const ye=React.useRef(de);return useScrollMonitor.useScrollMonitor({target:x,onScrollStart:()=>{g&&de&&(ve.current?.focus(),le(!1))}}),React.useEffect((()=>(oe===Re.current?ie(Y(oe)):(Re.current=oe,Ie.current=setTimeout((()=>{ie(Y(oe))}),150)),()=>{Ie.current&&clearTimeout(Ie.current)})),[Y,oe]),React.useLayoutEffect((()=>{f!==void 0&&(j||de||ne(utils.getDropdownInputText(f)),te(utils.getDropdownSelectedOption(f,j)))}),[j,f,de]),React.useEffect((()=>{de!==ye.current&&(de&&M&&M(),!de&&w&&w(),ye.current=de)}),[de,w,M]),React.useEffect((()=>{if(!j&&!m&&de&&fe&&Ce.current){const e=fe.getBoundingClientRect();const t=Ce.current.getBoundingClientRect();(t.top<e.top||t.bottom>e.bottom)&&setTimeout((()=>{fe&&Ce.current&&fe.scrollTo(0,Ce.current.offsetTop)}),0)}}),[j,m,de,fe]),jsxRuntime.jsx(FormInputLabel.FormInputLabel,{...U,...G,ref:t,id:Q,labelId:V,labelPosition:r,active:me,onColored:v,primary:a,error:K==='error',success:K==='success',focus:re,icon:[h,jsxRuntime.jsx(style.ChevronIcon,{up:de},'chevron')],iconProps:{...G,...J,...l},palette:{color:U.disabled?B.labelColorDisabled:B.labelColor,backgroundColor:U.disabled?B.backgroundColorDisabled:B.backgroundColor,backgroundColorHover:U.disabled?B.backgroundColorDisabled:B.backgroundColorHover,borderColor:U.disabled?B.borderColorDisabled:B.borderColor},onClick:e=>{U.onClick&&U.onClick(e),U.disabled||(ve.current?.focus(),de?fe&&e.target instanceof Node&&!fe.contains(e.target)&&le(!1):(le(!0),s&&!j&&pe&&(ne(''),ie(Y('')))))},onPointerDown:e=>{U.onPointerDown&&U.onPointerDown(e),e.target!==ve.current&&e.target instanceof Node&&(e.currentTarget.contains(e.target)||u.renderInPortal&&de&&fe&&fe.contains(e.target))&&e.preventDefault()},onFocus:e=>{U.onFocus&&U.onFocus(e),se(!0),ve.current&&e.target===ve.current&&s&&!j&&pe&&!de&&(ne(''),ie(Y('')))},onBlur:e=>{U.onBlur&&U.onBlur(e),e.currentTarget.contains(e.relatedTarget)||u.renderInPortal&&de&&fe&&fe.contains(e.relatedTarget)||(se(!1),ne(utils.getDropdownInputText(ee,j)),le(!1))},input:jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[be&&!s&&!z&&jsxRuntime.jsx(style.InputMimic,{required:!0,type:"text",inputMode:"none",form:A,tabIndex:-1,onFocus:()=>{ve.current?.focus()}}),jsxRuntime.jsx(FormInput.FormInput,{ref:ve,role:"combobox","aria-controls":W,"aria-expanded":de,"aria-labelledby":U.label?V:void 0,type:"text",autoComplete:"off",autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",form:A,autoFocus:b,inputMode:s?C:'none',maxLength:y,placeholder:q,readOnly:z||!s,required:be,disabled:U.disabled,value:oe,palette:{color:B.color,colorDisabled:B.colorDisabled,placeholderColor:B.placeholderColor,placeholderColorDisabled:B.placeholderColorDisabled},onClick:e=>{de&&e.currentTarget.selectionStart!==e.currentTarget.selectionEnd&&e.stopPropagation()},onChange:e=>{ne(e.currentTarget.value),le(!0)},onKeyDown:e=>{if(constants$1.keyboardKeys.Enter.validate(e.key)&&(ne(utils.getDropdownInputText(ee,j)),le(!1)),!constants$1.keyboardKeys.Space.validate(e.key)||de&&e.currentTarget.selectionStart!==0||(e.preventDefault(),s&&!j&&pe&&!de&&(ne(''),ie(Y(''))),le((e=>!e))),constants$1.keyboardKeys.Esc.validate(e.key)&&le(!1),constants$1.keyboardKeys.Tab.validate(e.key)&&de&&(e.preventDefault(),le(!1)),constants$1.keyboardKeys.ArrowDown.validate(e.key)&&de&&he.current)if(e.preventDefault(),!j&&Ce.current){const e=[...he.current.children];const t=e.findIndex((e=>e.contains(Ce.current)));const o=e[t+1]??e[0];o instanceof HTMLElement&&dom.focusFirstFocusable(o)}else dom.focusFirstFocusable(he.current);if(constants$1.keyboardKeys.ArrowUp.validate(e.key)&&de&&he.current)if(e.preventDefault(),!j&&Ce.current){const e=[...he.current.children];const t=e.findIndex((e=>e.contains(Ce.current)));const o=e[t-1]??e[e.length-1];o instanceof HTMLElement&&dom.focusFirstFocusable(o)}else dom.focusLastFocusable(he.current)}}),ee.map((e=>jsxRuntime.jsx("input",{type:"hidden",name:n,value:e.value,form:A,disabled:U.disabled},e.value)))]}),addon:jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[j&&ee.length>0&&jsxRuntime.jsx(Chip.Chip,{size:"xs",active:!0,black:!0,marginLeft:12,disabled:U.disabled,cursor:U.disabled?'not-allowed':void 0,text:ee.length,textProps:{appearance:'caption',size:'xs'},palette:U.disabled?{color:'content-disabled',colorHover:'content-disabled',backgroundColor:'bg-disabled-small',backgroundColorHover:'bg-disabled-small'}:void 0,onPointerDown:e=>{e.preventDefault()},discardButtonProps:{square:!0,contrast:!U.disabled,onClick:e=>{e.stopPropagation(),z||(f===void 0&&te([]),S&&S(j?[]:null),ve.current?.focus(),le(!0))}}}),!j&&D&&ee.length>0&&jsxRuntime.jsx(IconButton.IconButton,{icon:"close",size:"l",square:!0,marginLeft:12,disabled:U.disabled,onClick:e=>{e.stopPropagation(),z||(pe&&(ne(''),ie(Y(''))),f===void 0&&te([]),S&&S(j?[]:null),ve.current?.focus(),le(!0))}})]}),dropdown:jsxRuntime.jsx(DropdownMenu.DropdownMenu,{...u,setRef:ke,open:de,popperReferenceId:Q,secondary:!v,elevated:v,disableAutoFocus:!0,palette:{backgroundColor:B.menuBackgroundColor,borderColor:B.menuBorderColor},empty:ae.length===0,loading:c,loadingMessage:I,loadingIcon:R,loadingIconProps:{...G,...J,...d},emptyMessage:E,emptyIcon:T,emptyIconProps:{...G,...J,...p},onKeyDown:e=>{constants$1.keyboardKeys.Tab.validate(e.key)&&(e.preventDefault(),ve.current?.focus(),le(!1)),constants$1.keyboardKeys.Enter.validate(e.key)&&(ve.current?.focus(),ne(utils.getDropdownInputText(ee,j)),le(!1)),constants$1.keyboardKeys.Esc.validate(e.key)&&(ve.current?.focus(),le(!1)),constants$1.keyboardKeys.Backspace.validate(e.key)&&!z&&(j||!j&&D)&&(f===void 0&&te([]),S&&S(j?[]:null))},children:jsxRuntime.jsx(MenuList.MenuList,j?{ref:he,id:W,role:"listbox","aria-labelledby":U.label?V:void 0,"aria-multiselectable":!0,children:oe.length===0?jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[i&&jsxRuntime.jsx(ListItem.ListItem,{...G,text:F,disabled:U.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:jsxRuntime.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",name:n,checked:ge,indeterminate:xe,error:(ge||xe)&&K==='error',success:(ge||xe)&&K==='success',onChange:()=>{if(!z){const e=ge||xe?[]:[...L];f===void 0&&te(e),S&&S(e)}}})}),i&&jsxRuntime.jsx(MenuDivider.MenuDivider,{}),P&&ue[0].map((e=>{const t=e.status??K;const o=t==='error';const r=t==='success';return React.createElement(ListItem.ListItem,{...G,key:e.value,active:!0,text:e.text,danger:o,success:r,disabled:U.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation(),ve.current?.focus()},control:jsxRuntime.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",role:"option","aria-selected":!0,name:n,value:e.value,checked:!0,error:o,success:r,onChange:e=>{if(!z){const t=ee.filter((t=>t.value!==e.currentTarget.value));f===void 0&&te(t),S&&S(t)}}})})})),P&&ue[0].length>0&&ue[1].length>0&&jsxRuntime.jsx(MenuDivider.MenuDivider,{}),P&&ue[1].map((e=>React.createElement(ListItem.ListItem,{...G,key:e.value,text:e.text,disabled:U.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation(),ve.current?.focus()},control:jsxRuntime.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",role:"option","aria-selected":!1,name:n,value:e.value,checked:!1,onChange:()=>{if(!z){const t=[...ee,e];f===void 0&&te(t),S&&S(t)}}})}))),!P&&L.map((e=>{const t=ee.findIndex((t=>t.value===e.value))!==-1;const o=e.status??K;const r=t&&o==='error';const s=t&&o==='success';return React.createElement(ListItem.ListItem,{...G,key:e.value,text:e.text,danger:r,success:s,disabled:U.disabled,active:t,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:jsxRuntime.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",role:"option","aria-selected":t,name:n,value:e.value,checked:t,error:r,success:s,onChange:o=>{if(!z){const n=t?ee.filter((e=>e.value!==o.currentTarget.value)):[...ee,e];f===void 0&&te(n),S&&S(n)}}})})}))]}):jsxRuntime.jsx(jsxRuntime.Fragment,{children:ae.map((e=>{const t=ee.findIndex((t=>t.value===e.value))!==-1;const o=e.status??K;const r=t&&o==='error';const s=t&&o==='success';return React.createElement(ListItem.ListItem,{...G,key:e.value,text:e.text,danger:r,success:s,disabled:U.disabled,active:t,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:jsxRuntime.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",role:"option","aria-selected":t,name:n,value:e.value,checked:t,error:r,success:s,onChange:o=>{if(!z){const n=t?ee.filter((e=>e.value!==o.currentTarget.value)):[...ee,e];f===void 0&&te(n),S&&S(n)}}})})}))})}:{ref:he,id:W,role:"listbox","aria-labelledby":U.label?V:void 0,children:(s?ae:L).map((e=>{const t=ee.findIndex((t=>t.value===e.value))!==-1;return React.createElement(ListItem.ListItem,{...G,role:"option","aria-selected":t,ref:t?Ce:void 0,key:e.value,text:e.text,active:t,danger:t&&K==='error',success:t&&K==='success',disabled:U.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:t=>{if(t.stopPropagation(),!z){const t={...e};f===void 0&&(ne(utils.getDropdownInputText(t)),te(utils.getDropdownSelectedOption(t))),S&&S(t),ve.current?.focus(),le(!1)}}})}))})})})})),{sizes:constants.SIZES,displayName:"Dropdown"});exports.COMPONENT_NAME="Dropdown",exports.Dropdown=Dropdown;
1
+ 'use strict';var React=require('react');var nanoid=require('nanoid');var withMergedProps=require('../../hocs/withMergedProps.js');var useScrollMonitor=require('../../hooks/useScrollMonitor.js');var dom=require('../../shared/utils/dom.js');var misc=require('../../shared/utils/misc.js');var constants$1=require('../../shared/constants.js');var DropdownMenu=require('./DropdownMenu.js');var hooks=require('./hooks.js');var constants=require('./constants.js');var utils=require('./utils.js');var style=require('./style.js');var jsxRuntime=require('react/jsx-runtime');var FormInputLabel=require('../FormInputLabel/FormInputLabel.js');var FormInput=require('../FormInput/FormInput.js');var Chip=require('../Chip/Chip.js');var IconButton=require('../IconButton/IconButton.js');var MenuList=require('../MenuList/MenuList.js');var ListItem=require('../ListItem/ListItem.js');var InputCheckbox=require('../InputCheckbox/InputCheckbox.js');var MenuDivider=require('../MenuDivider/MenuDivider.js');const Dropdown=withMergedProps.withMergedProps(React.forwardRef(((e,t)=>{const{size:o="m",name:n="fox-dropdown",labelPosition:r="dynamic",searchable:s=!0,primary:a=!0,optionsMultiToggle:i=!0,iconProps:c={},menuProps:l={},loadingIconProps:u={},optionsEmptyIconProps:d={},loading:p,autoFocus:b,disableAutoScrollToSelectedOption:m,closeMenuOnScroll:g,scrollMonitorTarget:x,contrast:v,selectedOption:k,defaultSelectedOption:f,icon:C,inputMode:h,loadingMessage:I,loadingIcon:R,maxLength:j,multiple:y,clearable:D,onChangeInput:w,onCloseMenu:M,onOpenMenu:S,onSelectOption:L,options:P,loadOptions:E,groupSelectedOptions:T,optionsMultiToggleCaption:F,optionsEmptyMessage:q,optionsEmptyIcon:B,palette:z,placeholder:O,readOnly:K,required:X,status:$,sizeXXS:H,sizeXS:N,sizeS:Z,sizeM:_,sizeL:A,sizeXL:U,form:G,...J}=e;const Q={size:o,sizeXXS:H,sizeXS:N,sizeS:Z,sizeM:_,sizeL:A,sizeXL:U};const V={sizes:constants.SIZES_ICON,color:J.disabled?'content-disabled':'content-onmain-tertiary'};const W=React.useMemo((()=>J.id??`${n}-${nanoid.nanoid()}`),[n,J.id]);const Y=React.useMemo((()=>nanoid.nanoid()),[]);const ee=React.useMemo((()=>nanoid.nanoid()),[]);const[te,oe]=hooks.useFilteredOptions({options:P});const[ne,re,se]=hooks.useLoadedOptions({loadOptions:E,options:P});const[ae,ie]=React.useState((()=>utils.getDropdownSelectedOption(k!==void 0?k:f,y)));const[ce,le]=React.useState((()=>utils.getDropdownInputText(ae,y)));const[ue,de]=React.useState(!1);const[pe,be]=React.useState(!1);const me=E?ne:te;const ge=E?p??re:p;const xe=React.useMemo((()=>y?utils.groupDropdownOptions(me,ae):[[],[]]),[y,me,ae]);const ve=pe&&!J.disabled;const ke=X&&ae.length===0;const fe=Boolean(ve||ce||ue);const Ce=xe[0].length>0&&xe[1].length===0;const he=xe[0].length>0&&xe[1].length>0;const Ie=React.useRef(null);const[Re,je]=React.useState(null);const ye=React.useRef(null);const De=React.useRef(null);const we=React.useRef(ve);const Me=React.useCallback((e=>{le(e),w&&w(e)}),[w]);const Se=React.useCallback((e=>{E?se(e):oe(e)}),[E,se,oe]);const Le=React.useMemo((()=>misc.createDebouncedCallback(Se,150)),[Se]);return useScrollMonitor.useScrollMonitor({target:x,onScrollStart:()=>{g&&ve&&(Ie.current?.focus(),be(!1))}}),React.useLayoutEffect((()=>{k!==void 0&&(y||ve||Me(utils.getDropdownInputText(k)),ie(utils.getDropdownSelectedOption(k,y)))}),[y,k,ve,Me]),React.useEffect((()=>{ve!==we.current&&(ve&&S&&S(),!ve&&M&&M(),we.current=ve)}),[ve,M,S]),React.useEffect((()=>{if(!y&&!m&&ve&&!ge&&ce.length===0&&Re&&De.current){const e=Re.getBoundingClientRect();const t=De.current.getBoundingClientRect();(t.top<e.top||t.bottom>e.bottom)&&setTimeout((()=>{Re&&De.current&&Re.scrollTo(0,De.current.offsetTop)}),0)}}),[y,m,ve,ge,ce,Re]),jsxRuntime.jsx(FormInputLabel.FormInputLabel,{...J,...Q,ref:t,id:W,labelId:Y,labelPosition:r,active:fe,onColored:v,primary:a,error:$==='error',success:$==='success',focus:ue,icon:[C,jsxRuntime.jsx(style.ChevronIcon,{up:ve},'chevron')],iconProps:{...Q,...V,...c},palette:{color:J.disabled?z.labelColorDisabled:z.labelColor,backgroundColor:J.disabled?z.backgroundColorDisabled:z.backgroundColor,backgroundColorHover:J.disabled?z.backgroundColorDisabled:z.backgroundColorHover,borderColor:J.disabled?z.borderColorDisabled:z.borderColor},onClick:e=>{J.onClick&&J.onClick(e),J.disabled||(Ie.current?.focus(),ve?Re&&e.target instanceof Node&&!Re.contains(e.target)&&(be(!1),Me(utils.getDropdownInputText(ae,y))):(be(!0),Se(''),s&&Me('')))},onPointerDown:e=>{J.onPointerDown&&J.onPointerDown(e),e.target!==Ie.current&&e.target instanceof Node&&(e.currentTarget.contains(e.target)||l.renderInPortal&&ve&&Re&&Re.contains(e.target))&&e.preventDefault()},onFocus:e=>{J.onFocus&&J.onFocus(e),de(!0),Ie.current&&e.target===Ie.current&&s&&!y&&!ve&&Me('')},onBlur:e=>{J.onBlur&&J.onBlur(e),e.currentTarget.contains(e.relatedTarget)||l.renderInPortal&&ve&&Re&&Re.contains(e.relatedTarget)||(de(!1),Me(utils.getDropdownInputText(ae,y)),be(!1))},input:jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[ke&&!s&&!K&&jsxRuntime.jsx(style.InputMimic,{required:!0,type:"text",inputMode:"none",form:G,tabIndex:-1,onFocus:()=>{Ie.current?.focus()}}),jsxRuntime.jsx(FormInput.FormInput,{ref:Ie,role:"combobox","aria-controls":ee,"aria-expanded":ve,"aria-labelledby":J.label?Y:void 0,type:"text",autoComplete:"off",autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",form:G,autoFocus:b,inputMode:s?h:'none',maxLength:j,placeholder:O,readOnly:K||!s,required:ke,disabled:J.disabled,value:ce,palette:{color:z.color,colorDisabled:z.colorDisabled,placeholderColor:z.placeholderColor,placeholderColorDisabled:z.placeholderColorDisabled},onClick:e=>{ve&&e.currentTarget.selectionStart!==e.currentTarget.selectionEnd&&e.stopPropagation()},onChange:e=>{const t=e.currentTarget.value;Me(t),Le(t),be(!0)},onKeyDown:e=>{if(constants$1.keyboardKeys.Enter.validate(e.key)&&(Me(utils.getDropdownInputText(ae,y)),be(!1)),!constants$1.keyboardKeys.Space.validate(e.key)||ve&&e.currentTarget.selectionStart!==0||(e.preventDefault(),ve||(Se(''),s&&Me('')),be((e=>!e))),constants$1.keyboardKeys.Esc.validate(e.key)&&be(!1),constants$1.keyboardKeys.Tab.validate(e.key)&&ve&&(e.preventDefault(),be(!1)),constants$1.keyboardKeys.ArrowDown.validate(e.key)&&ve&&ye.current)if(e.preventDefault(),!y&&De.current){const e=[...ye.current.children];const t=e.findIndex((e=>e.contains(De.current)));const o=e[t+1]??e[0];o instanceof HTMLElement&&dom.focusFirstFocusable(o)}else dom.focusFirstFocusable(ye.current);if(constants$1.keyboardKeys.ArrowUp.validate(e.key)&&ve&&ye.current)if(e.preventDefault(),!y&&De.current){const e=[...ye.current.children];const t=e.findIndex((e=>e.contains(De.current)));const o=e[t-1]??e[e.length-1];o instanceof HTMLElement&&dom.focusFirstFocusable(o)}else dom.focusLastFocusable(ye.current)}}),ae.map((e=>jsxRuntime.jsx("input",{type:"hidden",name:n,value:e.value,form:G,disabled:J.disabled},e.value)))]}),addon:jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[y&&ae.length>0&&jsxRuntime.jsx(Chip.Chip,{size:"xs",active:!0,black:!0,marginLeft:12,disabled:J.disabled,cursor:J.disabled?'not-allowed':void 0,text:ae.length,textProps:{appearance:'caption',size:'xs'},palette:J.disabled?{color:'content-disabled',colorHover:'content-disabled',backgroundColor:'bg-disabled-small',backgroundColorHover:'bg-disabled-small'}:void 0,onPointerDown:e=>{e.preventDefault()},discardButtonProps:{square:!0,contrast:!J.disabled,onClick:e=>{e.stopPropagation(),K||(k===void 0&&ie([]),L&&L([]),Ie.current?.focus(),Me(''),Se(''),be(!0))}}}),!y&&D&&ae.length>0&&jsxRuntime.jsx(IconButton.IconButton,{icon:"close",size:"l",square:!0,marginLeft:12,disabled:J.disabled,onClick:e=>{e.stopPropagation(),K||(k===void 0&&ie([]),L&&L(null),Ie.current?.focus(),Me(''),Se(''),be(!0))}})]}),dropdown:jsxRuntime.jsx(DropdownMenu.DropdownMenu,{...l,setRef:je,open:ve,popperReferenceId:W,secondary:!v,elevated:v,disableAutoFocus:!0,palette:{backgroundColor:z.menuBackgroundColor,borderColor:z.menuBorderColor},empty:me.length===0,loading:ge,loadingMessage:I,loadingIcon:R,loadingIconProps:{...Q,...V,...u},emptyMessage:q,emptyIcon:B,emptyIconProps:{...Q,...V,...d},onKeyDown:e=>{constants$1.keyboardKeys.Tab.validate(e.key)&&(e.preventDefault(),Ie.current?.focus(),be(!1)),constants$1.keyboardKeys.Enter.validate(e.key)&&(Ie.current?.focus(),Me(utils.getDropdownInputText(ae,y)),be(!1)),constants$1.keyboardKeys.Esc.validate(e.key)&&(Ie.current?.focus(),be(!1)),constants$1.keyboardKeys.Backspace.validate(e.key)&&!K&&(y||!y&&D)&&(k===void 0&&ie([]),L&&L(y?[]:null),Me(''),Se(''))},children:jsxRuntime.jsx(MenuList.MenuList,y?{ref:ye,id:ee,role:"listbox","aria-labelledby":J.label?Y:void 0,"aria-multiselectable":!0,children:ce.length===0?jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[i&&jsxRuntime.jsx(ListItem.ListItem,{...Q,text:F,disabled:J.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:jsxRuntime.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",name:n,checked:Ce,indeterminate:he,error:(Ce||he)&&$==='error',success:(Ce||he)&&$==='success',onChange:()=>{if(!K){const e=Ce||he?[]:[...me];k===void 0&&ie(e),L&&L(e)}}})}),i&&jsxRuntime.jsx(MenuDivider.MenuDivider,{}),T&&xe[0].map((e=>{const t=e.status??$;const o=t==='error';const r=t==='success';return React.createElement(ListItem.ListItem,{...Q,key:e.value,active:!0,text:e.text,danger:o,success:r,disabled:J.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation(),Ie.current?.focus()},control:jsxRuntime.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",role:"option","aria-selected":!0,name:n,value:e.value,checked:!0,error:o,success:r,onChange:e=>{if(!K){const t=ae.filter((t=>t.value!==e.currentTarget.value));k===void 0&&ie(t),L&&L(t)}}})})})),T&&xe[0].length>0&&xe[1].length>0&&jsxRuntime.jsx(MenuDivider.MenuDivider,{}),T&&xe[1].map((e=>React.createElement(ListItem.ListItem,{...Q,key:e.value,text:e.text,disabled:J.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation(),Ie.current?.focus()},control:jsxRuntime.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",role:"option","aria-selected":!1,name:n,value:e.value,checked:!1,onChange:()=>{if(!K){const t=[...ae,e];k===void 0&&ie(t),L&&L(t)}}})}))),!T&&me.map((e=>{const t=ae.findIndex((t=>t.value===e.value))!==-1;const o=e.status??$;const r=t&&o==='error';const s=t&&o==='success';return React.createElement(ListItem.ListItem,{...Q,key:e.value,text:e.text,danger:r,success:s,disabled:J.disabled,active:t,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:jsxRuntime.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",role:"option","aria-selected":t,name:n,value:e.value,checked:t,error:r,success:s,onChange:o=>{if(!K){const n=t?ae.filter((e=>e.value!==o.currentTarget.value)):[...ae,e];k===void 0&&ie(n),L&&L(n)}}})})}))]}):jsxRuntime.jsx(jsxRuntime.Fragment,{children:me.map((e=>{const t=ae.findIndex((t=>t.value===e.value))!==-1;const o=e.status??$;const r=t&&o==='error';const s=t&&o==='success';return React.createElement(ListItem.ListItem,{...Q,key:e.value,text:e.text,danger:r,success:s,disabled:J.disabled,active:t,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:jsxRuntime.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",role:"option","aria-selected":t,name:n,value:e.value,checked:t,error:r,success:s,onChange:o=>{if(!K){const n=t?ae.filter((e=>e.value!==o.currentTarget.value)):[...ae,e];k===void 0&&ie(n),L&&L(n)}}})})}))})}:{ref:ye,id:ee,role:"listbox","aria-labelledby":J.label?Y:void 0,children:me.map((e=>{const t=ae.findIndex((t=>t.value===e.value))!==-1;return React.createElement(ListItem.ListItem,{...Q,role:"option","aria-selected":t,ref:t?De:void 0,key:e.value,text:e.text,active:t,danger:t&&$==='error',success:t&&$==='success',disabled:J.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:t=>{if(t.stopPropagation(),!K){const t={...e};k===void 0&&(Me(utils.getDropdownInputText(t)),ie(utils.getDropdownSelectedOption(t))),L&&L(t),Ie.current?.focus(),be(!1)}}})}))})})})})),{sizes:constants.SIZES,displayName:"Dropdown"});exports.COMPONENT_NAME="Dropdown",exports.Dropdown=Dropdown;
2
2
  //# sourceMappingURL=Dropdown.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Dropdown.js","sources":["../../../../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["import { forwardRef, useState, useRef, useEffect, useLayoutEffect, useMemo } from 'react'\nimport Fuse from 'fuse.js'\nimport { nanoid } from 'nanoid'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { useScrollMonitor } from 'hooks/useScrollMonitor'\nimport { focusFirstFocusable, focusLastFocusable } from 'shared/utils/dom'\nimport { keyboardKeys } from 'shared/constants'\nimport type { Nullable } from 'shared/types'\nimport { FormInput } from 'components/FormInput'\nimport { FormInputLabel } from 'components/FormInputLabel'\nimport { MenuList } from 'components/MenuList'\nimport { MenuDivider } from 'components/MenuDivider'\nimport { ListItem } from 'components/ListItem'\nimport { InputCheckbox } from 'components/InputCheckbox'\nimport { Chip } from 'components/Chip'\nimport { IconButton } from 'components/IconButton'\nimport type { IconProps } from 'components/Icon'\nimport { DropdownMenu } from './DropdownMenu'\nimport { SIZES, SIZES_CHECKBOX, SIZES_ICON, FuseSearchKeys } from './constants'\nimport { getDropdownInputText, getDropdownSelectedOption, groupDropdownOptions } from './utils'\nimport * as Styled from './style'\nimport type { DropdownProps, DropdownOption } from './types'\n\nconst COMPONENT_NAME = 'Dropdown'\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<div\\> элемента.\n *\n * Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n *\n * Поддерживаются пропсы определения размеров и внешних отступов в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/Dropdown/types.ts).\n */\nconst Dropdown: React.ForwardRefExoticComponent<DropdownProps> = withMergedProps<DropdownProps, HTMLDivElement>(\n forwardRef((props, ref) => {\n const {\n size = 'm',\n name = 'fox-dropdown',\n labelPosition = 'dynamic',\n searchable = true,\n primary = true,\n optionsMultiToggle = true,\n loading = false,\n iconProps = {},\n menuProps = {},\n loadingIconProps = {},\n optionsEmptyIconProps = {},\n autoFocus,\n disableAutoScrollToSelectedOption,\n closeMenuOnScroll,\n scrollMonitorTarget,\n contrast,\n selectedOption,\n defaultSelectedOption,\n icon,\n inputMode,\n loadingMessage,\n loadingIcon,\n maxLength,\n multiple,\n clearable,\n onCloseMenu,\n onOpenMenu,\n onSelectOption,\n options,\n groupSelectedOptions,\n optionsMultiToggleCaption,\n optionsEmptyMessage,\n optionsEmptyIcon,\n palette,\n placeholder,\n readOnly,\n required,\n status,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n form,\n ...rootProps\n } = props\n\n const sizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const iconBaseProps: IconProps = {\n sizes: SIZES_ICON,\n color: rootProps.disabled ? 'content-disabled' : 'content-onmain-tertiary',\n }\n\n const formInputLabelId = useMemo(() => rootProps.id ?? `${name}-${nanoid()}`, [name, rootProps.id])\n const inputLabelId = useMemo(() => nanoid(), [])\n const menuListId = useMemo(() => nanoid(), [])\n\n const getRelevantOptions = useMemo(() => {\n const fuse = new Fuse<DropdownOption>(options, {\n threshold: 0.4,\n ignoreLocation: true,\n keys: [FuseSearchKeys.text, FuseSearchKeys.label, FuseSearchKeys.tags],\n })\n\n return (pattern: string): DropdownOption[] =>\n pattern.length === 0 ? options : fuse.search(pattern).map((result) => result.item)\n }, [options])\n\n const [dropdownSelectedOption, setDropdownSelectedOption] = useState<DropdownOption[]>(() =>\n getDropdownSelectedOption(selectedOption !== undefined ? selectedOption : defaultSelectedOption, multiple)\n )\n\n const [inputText, setInputText] = useState<string>(() => getDropdownInputText(dropdownSelectedOption, multiple))\n\n const [focusWithin, setFocusWithin] = useState<boolean>(false)\n\n const [menuRelevantOptions, setMenuRelevantOptions] = useState<DropdownOption[]>(() =>\n getRelevantOptions(inputText)\n )\n\n const [menuOpenRequest, setMenuOpenRequest] = useState<boolean>(false)\n\n const menuOptionsGroups: ReturnType<typeof groupDropdownOptions> = multiple\n ? groupDropdownOptions(options, dropdownSelectedOption)\n : [[], []]\n\n const menuOpen = menuOpenRequest && !rootProps.disabled\n\n const inputSynced = inputText === getDropdownInputText(dropdownSelectedOption)\n const inputRequired = required && dropdownSelectedOption.length === 0\n const inputActive = Boolean(menuOpen || inputText || focusWithin)\n\n const multiToggleChecked = menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length === 0\n const multiToggleIndeterminate = menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length > 0\n\n const inputRef = useRef<HTMLInputElement>(null)\n const [menuRef, setMenuRef] = useState<Nullable<HTMLElement>>(null)\n const menuListRef = useRef<HTMLUListElement>(null)\n const selectedOptionRef = useRef<HTMLElement>(null)\n\n const timeoutIdRef = useRef<Nullable<ReturnType<typeof setTimeout>>>(null)\n\n const inputTextPrevRef = useRef<string>(inputText)\n const menuOpenPrevRef = useRef<boolean>(menuOpen)\n\n useScrollMonitor({\n target: scrollMonitorTarget,\n onScrollStart: () => {\n if (closeMenuOnScroll && menuOpen) {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n },\n })\n\n useEffect(() => {\n if (inputText === inputTextPrevRef.current) {\n setMenuRelevantOptions(getRelevantOptions(inputText))\n } else {\n inputTextPrevRef.current = inputText\n timeoutIdRef.current = setTimeout(() => {\n setMenuRelevantOptions(getRelevantOptions(inputText))\n }, 150)\n }\n\n return () => {\n if (timeoutIdRef.current) {\n clearTimeout(timeoutIdRef.current)\n }\n }\n }, [getRelevantOptions, inputText])\n\n useLayoutEffect(() => {\n if (selectedOption === undefined) return\n\n if (!multiple && !menuOpen) {\n setInputText(getDropdownInputText(selectedOption))\n }\n setDropdownSelectedOption(getDropdownSelectedOption(selectedOption, multiple))\n }, [multiple, selectedOption, menuOpen])\n\n useEffect(() => {\n if (menuOpen === menuOpenPrevRef.current) return\n\n if (menuOpen && onOpenMenu) onOpenMenu()\n if (!menuOpen && onCloseMenu) onCloseMenu()\n\n menuOpenPrevRef.current = menuOpen\n }, [menuOpen, onCloseMenu, onOpenMenu])\n\n useEffect(() => {\n if (!multiple && !disableAutoScrollToSelectedOption && menuOpen && menuRef && selectedOptionRef.current) {\n const menuRect = menuRef.getBoundingClientRect()\n const selectedOptionRect = selectedOptionRef.current.getBoundingClientRect()\n\n if (selectedOptionRect.top < menuRect.top || selectedOptionRect.bottom > menuRect.bottom) {\n setTimeout(() => {\n if (menuRef && selectedOptionRef.current) {\n menuRef.scrollTo(0, selectedOptionRef.current.offsetTop)\n }\n }, 0)\n }\n }\n }, [multiple, disableAutoScrollToSelectedOption, menuOpen, menuRef])\n\n return (\n <FormInputLabel\n {...rootProps}\n {...sizeProps}\n ref={ref}\n id={formInputLabelId}\n labelId={inputLabelId}\n labelPosition={labelPosition}\n active={inputActive}\n onColored={contrast}\n primary={primary}\n error={status === 'error'}\n success={status === 'success'}\n focus={focusWithin}\n icon={[icon, <Styled.ChevronIcon key='chevron' up={menuOpen} />]}\n iconProps={{\n ...sizeProps,\n ...iconBaseProps,\n ...iconProps,\n }}\n palette={{\n color: rootProps.disabled ? palette.labelColorDisabled : palette.labelColor,\n backgroundColor: rootProps.disabled ? palette.backgroundColorDisabled : palette.backgroundColor,\n backgroundColorHover: rootProps.disabled ? palette.backgroundColorDisabled : palette.backgroundColorHover,\n borderColor: rootProps.disabled ? palette.borderColorDisabled : palette.borderColor,\n }}\n onClick={(evt) => {\n if (rootProps.onClick) rootProps.onClick(evt)\n\n if (rootProps.disabled) return\n\n inputRef.current?.focus()\n\n if (!menuOpen) {\n setMenuOpenRequest(true)\n\n if (searchable && !multiple && inputSynced) {\n setInputText('')\n setMenuRelevantOptions(getRelevantOptions(''))\n }\n } else if (menuRef && evt.target instanceof Node && !menuRef.contains(evt.target)) {\n setMenuOpenRequest(false)\n }\n }}\n onPointerDown={(evt) => {\n if (rootProps.onPointerDown) rootProps.onPointerDown(evt)\n\n if (\n evt.target !== inputRef.current &&\n evt.target instanceof Node &&\n (evt.currentTarget.contains(evt.target) ||\n (menuProps.renderInPortal && menuOpen && menuRef && menuRef.contains(evt.target)))\n ) {\n evt.preventDefault()\n }\n }}\n onFocus={(evt) => {\n if (rootProps.onFocus) rootProps.onFocus(evt)\n\n setFocusWithin(true)\n\n if (\n inputRef.current &&\n evt.target === inputRef.current &&\n searchable &&\n !multiple &&\n inputSynced &&\n !menuOpen\n ) {\n setInputText('')\n setMenuRelevantOptions(getRelevantOptions(''))\n }\n }}\n onBlur={(evt) => {\n if (rootProps.onBlur) rootProps.onBlur(evt)\n\n if (\n evt.currentTarget.contains(evt.relatedTarget) ||\n (menuProps.renderInPortal && menuOpen && menuRef && menuRef.contains(evt.relatedTarget))\n ) {\n return\n }\n\n setFocusWithin(false)\n setInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }}\n input={\n <>\n {inputRequired && !searchable && !readOnly && (\n <Styled.InputMimic\n required\n type='text'\n inputMode='none'\n form={form}\n tabIndex={-1}\n onFocus={() => {\n inputRef.current?.focus()\n }}\n />\n )}\n <FormInput\n ref={inputRef}\n role='combobox'\n aria-controls={menuListId}\n aria-expanded={menuOpen}\n aria-labelledby={rootProps.label ? inputLabelId : undefined}\n type='text'\n autoComplete='off'\n autoCapitalize='off'\n autoCorrect='off'\n spellCheck='false'\n form={form}\n autoFocus={autoFocus}\n inputMode={searchable ? inputMode : 'none'}\n maxLength={maxLength}\n placeholder={placeholder}\n readOnly={readOnly || !searchable}\n required={inputRequired}\n disabled={rootProps.disabled}\n value={inputText}\n palette={{\n color: palette.color,\n colorDisabled: palette.colorDisabled,\n placeholderColor: palette.placeholderColor,\n placeholderColorDisabled: palette.placeholderColorDisabled,\n }}\n onClick={(evt) => {\n if (menuOpen && evt.currentTarget.selectionStart !== evt.currentTarget.selectionEnd) {\n evt.stopPropagation()\n }\n }}\n onChange={(evt) => {\n setInputText(evt.currentTarget.value)\n setMenuOpenRequest(true)\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.Enter.validate(evt.key)) {\n setInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Space.validate(evt.key) && (!menuOpen || evt.currentTarget.selectionStart === 0)) {\n evt.preventDefault()\n\n if (searchable && !multiple && inputSynced && !menuOpen) {\n setInputText('')\n setMenuRelevantOptions(getRelevantOptions(''))\n }\n\n setMenuOpenRequest((prev) => !prev)\n }\n\n if (keyboardKeys.Esc.validate(evt.key)) {\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Tab.validate(evt.key) && menuOpen) {\n evt.preventDefault()\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.ArrowDown.validate(evt.key) && menuOpen && menuListRef.current) {\n evt.preventDefault()\n\n if (!multiple && selectedOptionRef.current) {\n const menuItems = [...menuListRef.current.children]\n\n const idx = menuItems.findIndex((item) => item.contains(selectedOptionRef.current as Node))\n\n const focusTarget = menuItems[idx + 1] ?? menuItems[0]\n\n if (focusTarget instanceof HTMLElement) {\n focusFirstFocusable(focusTarget)\n }\n } else {\n focusFirstFocusable(menuListRef.current)\n }\n }\n\n if (keyboardKeys.ArrowUp.validate(evt.key) && menuOpen && menuListRef.current) {\n evt.preventDefault()\n\n if (!multiple && selectedOptionRef.current) {\n const menuItems = [...menuListRef.current.children]\n\n const idx = menuItems.findIndex((item) => item.contains(selectedOptionRef.current as Node))\n\n const focusTarget = menuItems[idx - 1] ?? menuItems[menuItems.length - 1]\n\n if (focusTarget instanceof HTMLElement) {\n focusFirstFocusable(focusTarget)\n }\n } else {\n focusLastFocusable(menuListRef.current)\n }\n }\n }}\n />\n {dropdownSelectedOption.map((item) => (\n <input\n key={item.value}\n type='hidden'\n name={name}\n value={item.value}\n form={form}\n disabled={rootProps.disabled}\n />\n ))}\n </>\n }\n addon={\n <>\n {multiple && dropdownSelectedOption.length > 0 && (\n <Chip\n size='xs'\n active\n black\n marginLeft={12}\n disabled={rootProps.disabled}\n cursor={rootProps.disabled ? 'not-allowed' : undefined}\n text={dropdownSelectedOption.length}\n textProps={{\n appearance: 'caption',\n size: 'xs',\n }}\n palette={\n rootProps.disabled\n ? {\n color: 'content-disabled',\n colorHover: 'content-disabled',\n backgroundColor: 'bg-disabled-small',\n backgroundColorHover: 'bg-disabled-small',\n }\n : undefined\n }\n onPointerDown={(evt) => {\n evt.preventDefault()\n }}\n discardButtonProps={{\n square: true,\n contrast: !rootProps.disabled,\n onClick: (evt) => {\n evt.stopPropagation()\n\n if (!readOnly) {\n if (selectedOption === undefined) {\n setDropdownSelectedOption([])\n }\n\n if (onSelectOption) onSelectOption(multiple ? [] : null)\n\n inputRef.current?.focus()\n setMenuOpenRequest(true)\n }\n },\n }}\n />\n )}\n {!multiple && clearable && dropdownSelectedOption.length > 0 && (\n <IconButton\n icon='close'\n size='l'\n square\n marginLeft={12}\n disabled={rootProps.disabled}\n onClick={(evt) => {\n evt.stopPropagation()\n\n if (!readOnly) {\n if (inputSynced) {\n setInputText('')\n setMenuRelevantOptions(getRelevantOptions(''))\n }\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption([])\n }\n\n if (onSelectOption) onSelectOption(multiple ? [] : null)\n\n inputRef.current?.focus()\n setMenuOpenRequest(true)\n }\n }}\n />\n )}\n </>\n }\n dropdown={\n <DropdownMenu\n {...menuProps}\n setRef={setMenuRef}\n open={menuOpen}\n popperReferenceId={formInputLabelId}\n secondary={!contrast}\n elevated={contrast}\n disableAutoFocus\n palette={{\n backgroundColor: palette.menuBackgroundColor,\n borderColor: palette.menuBorderColor,\n }}\n empty={menuRelevantOptions.length === 0}\n loading={loading}\n loadingMessage={loadingMessage}\n loadingIcon={loadingIcon}\n loadingIconProps={{\n ...sizeProps,\n ...iconBaseProps,\n ...loadingIconProps,\n }}\n emptyMessage={optionsEmptyMessage}\n emptyIcon={optionsEmptyIcon}\n emptyIconProps={{\n ...sizeProps,\n ...iconBaseProps,\n ...optionsEmptyIconProps,\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.Tab.validate(evt.key)) {\n evt.preventDefault()\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Enter.validate(evt.key)) {\n inputRef.current?.focus()\n setInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Esc.validate(evt.key)) {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Backspace.validate(evt.key) && !readOnly && (multiple || (!multiple && clearable))) {\n if (selectedOption === undefined) {\n setDropdownSelectedOption([])\n }\n\n if (onSelectOption) onSelectOption(multiple ? [] : null)\n }\n }}\n >\n {multiple ? (\n <MenuList\n ref={menuListRef}\n id={menuListId}\n role='listbox'\n aria-labelledby={rootProps.label ? inputLabelId : undefined}\n aria-multiselectable\n >\n {inputText.length === 0 ? (\n <>\n {optionsMultiToggle && (\n <ListItem\n {...sizeProps}\n text={optionsMultiToggleCaption}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n name={name}\n checked={multiToggleChecked}\n indeterminate={multiToggleIndeterminate}\n error={(multiToggleChecked || multiToggleIndeterminate) && status === 'error'}\n success={(multiToggleChecked || multiToggleIndeterminate) && status === 'success'}\n onChange={() => {\n if (!readOnly) {\n const update = multiToggleChecked || multiToggleIndeterminate ? [] : [...options]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )}\n {optionsMultiToggle && <MenuDivider />}\n {groupSelectedOptions &&\n menuOptionsGroups[0].map((option) => {\n const optionStatus = option.status ?? status\n const optionErrorStatus = optionStatus === 'error'\n const optionSuccessStatus = optionStatus === 'success'\n\n return (\n <ListItem\n {...sizeProps}\n key={option.value}\n active\n text={option.text}\n danger={optionErrorStatus}\n success={optionSuccessStatus}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n inputRef.current?.focus()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected\n name={name}\n value={option.value}\n checked\n error={optionErrorStatus}\n success={optionSuccessStatus}\n onChange={(evt) => {\n if (!readOnly) {\n const update = dropdownSelectedOption.filter(\n (item) => item.value !== evt.currentTarget.value\n )\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )\n })}\n {groupSelectedOptions && menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length > 0 && (\n <MenuDivider />\n )}\n {groupSelectedOptions &&\n menuOptionsGroups[1].map((option) => (\n <ListItem\n {...sizeProps}\n key={option.value}\n text={option.text}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n inputRef.current?.focus()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected={false}\n name={name}\n value={option.value}\n checked={false}\n onChange={() => {\n if (!readOnly) {\n const update = [...dropdownSelectedOption, option]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n ))}\n {!groupSelectedOptions &&\n options.map((option) => {\n const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n const optionStatus = option.status ?? status\n const optionErrorStatus = selected && optionStatus === 'error'\n const optionSuccessStatus = selected && optionStatus === 'success'\n\n return (\n <ListItem\n {...sizeProps}\n key={option.value}\n text={option.text}\n danger={optionErrorStatus}\n success={optionSuccessStatus}\n disabled={rootProps.disabled}\n active={selected}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected={selected}\n name={name}\n value={option.value}\n checked={selected}\n error={optionErrorStatus}\n success={optionSuccessStatus}\n onChange={(evt) => {\n if (!readOnly) {\n const update = selected\n ? dropdownSelectedOption.filter((item) => item.value !== evt.currentTarget.value)\n : [...dropdownSelectedOption, option]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )\n })}\n </>\n ) : (\n <>\n {menuRelevantOptions.map((option) => {\n const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n const optionStatus = option.status ?? status\n const optionErrorStatus = selected && optionStatus === 'error'\n const optionSuccessStatus = selected && optionStatus === 'success'\n\n return (\n <ListItem\n {...sizeProps}\n key={option.value}\n text={option.text}\n danger={optionErrorStatus}\n success={optionSuccessStatus}\n disabled={rootProps.disabled}\n active={selected}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected={selected}\n name={name}\n value={option.value}\n checked={selected}\n error={optionErrorStatus}\n success={optionSuccessStatus}\n onChange={(evt) => {\n if (!readOnly) {\n const update = selected\n ? dropdownSelectedOption.filter((item) => item.value !== evt.currentTarget.value)\n : [...dropdownSelectedOption, option]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )\n })}\n </>\n )}\n </MenuList>\n ) : (\n <MenuList\n ref={menuListRef}\n id={menuListId}\n role='listbox'\n aria-labelledby={rootProps.label ? inputLabelId : undefined}\n >\n {(searchable ? menuRelevantOptions : options).map((option) => {\n const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n return (\n <ListItem\n {...sizeProps}\n role='option'\n aria-selected={selected}\n ref={selected ? selectedOptionRef : undefined}\n key={option.value}\n text={option.text}\n active={selected}\n danger={selected && status === 'error'}\n success={selected && status === 'success'}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n\n if (!readOnly) {\n const update = { ...option }\n\n if (selectedOption === undefined) {\n setInputText(getDropdownInputText(update))\n setDropdownSelectedOption(getDropdownSelectedOption(update))\n }\n\n if (onSelectOption) onSelectOption(update)\n\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n }}\n />\n )\n })}\n </MenuList>\n )}\n </DropdownMenu>\n }\n />\n )\n }),\n {\n sizes: SIZES,\n displayName: COMPONENT_NAME,\n }\n)\n\nexport { Dropdown, COMPONENT_NAME }\n"],"names":["Dropdown","withMergedProps","forwardRef","props","ref","size","name","labelPosition","searchable","primary","optionsMultiToggle","loading","iconProps","menuProps","loadingIconProps","optionsEmptyIconProps","autoFocus","disableAutoScrollToSelectedOption","closeMenuOnScroll","scrollMonitorTarget","contrast","selectedOption","defaultSelectedOption","icon","inputMode","loadingMessage","loadingIcon","maxLength","multiple","clearable","onCloseMenu","onOpenMenu","onSelectOption","options","groupSelectedOptions","optionsMultiToggleCaption","optionsEmptyMessage","optionsEmptyIcon","palette","placeholder","readOnly","required","status","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","form","rootProps","sizeProps","iconBaseProps","sizes","SIZES_ICON","color","disabled","formInputLabelId","useMemo","id","nanoid","inputLabelId","menuListId","getRelevantOptions","fuse","Fuse","default","threshold","ignoreLocation","keys","FuseSearchKeys","text","label","tags","pattern","length","search","map","result","item","dropdownSelectedOption","setDropdownSelectedOption","useState","getDropdownSelectedOption","undefined","inputText","setInputText","getDropdownInputText","focusWithin","setFocusWithin","menuRelevantOptions","setMenuRelevantOptions","menuOpenRequest","setMenuOpenRequest","menuOptionsGroups","groupDropdownOptions","menuOpen","inputSynced","inputRequired","inputActive","Boolean","multiToggleChecked","multiToggleIndeterminate","inputRef","useRef","menuRef","setMenuRef","menuListRef","selectedOptionRef","timeoutIdRef","inputTextPrevRef","menuOpenPrevRef","useScrollMonitor","target","onScrollStart","current","focus","useEffect","setTimeout","clearTimeout","useLayoutEffect","menuRect","getBoundingClientRect","selectedOptionRect","top","bottom","scrollTo","offsetTop","_jsx","FormInputLabel","labelId","active","onColored","error","success","jsx","Styled","up","labelColorDisabled","labelColor","backgroundColor","backgroundColorDisabled","backgroundColorHover","borderColor","borderColorDisabled","onClick","evt","Node","contains","onPointerDown","currentTarget","renderInPortal","preventDefault","onFocus","onBlur","relatedTarget","input","_jsxs","jsxs","_Fragment","children","type","tabIndex","FormInput","role","autoComplete","autoCapitalize","autoCorrect","spellCheck","value","colorDisabled","placeholderColor","placeholderColorDisabled","selectionStart","selectionEnd","stopPropagation","onChange","onKeyDown","keyboardKeys","Enter","validate","key","Space","prev","Esc","Tab","ArrowDown","menuItems","idx","findIndex","focusTarget","HTMLElement","focusFirstFocusable","ArrowUp","focusLastFocusable","addon","Chip","black","marginLeft","cursor","textProps","appearance","colorHover","discardButtonProps","square","IconButton","dropdown","DropdownMenu","setRef","open","popperReferenceId","secondary","elevated","disableAutoFocus","menuBackgroundColor","menuBorderColor","empty","emptyMessage","emptyIcon","emptyIconProps","Backspace","MenuList","ListItem","borderRadius","ellipsis","wordBreak","control","InputCheckbox","SIZES_CHECKBOX","checked","indeterminate","update","MenuDivider","option","optionStatus","optionErrorStatus","optionSuccessStatus","_createElement","danger","filter","createElement","selected","SIZES","displayName"],"mappings":"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"}
1
+ {"version":3,"file":"Dropdown.js","sources":["../../../../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["import { forwardRef, useState, useRef, useEffect, useLayoutEffect, useMemo, useCallback } from 'react'\nimport { nanoid } from 'nanoid'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { useScrollMonitor } from 'hooks/useScrollMonitor'\nimport { focusFirstFocusable, focusLastFocusable } from 'shared/utils/dom'\nimport { createDebouncedCallback } from 'shared/utils/misc'\nimport { keyboardKeys } from 'shared/constants'\nimport type { Nullable } from 'shared/types'\nimport { FormInput } from 'components/FormInput'\nimport { FormInputLabel } from 'components/FormInputLabel'\nimport { MenuList } from 'components/MenuList'\nimport { MenuDivider } from 'components/MenuDivider'\nimport { ListItem } from 'components/ListItem'\nimport { InputCheckbox } from 'components/InputCheckbox'\nimport { Chip } from 'components/Chip'\nimport { IconButton } from 'components/IconButton'\nimport type { IconProps } from 'components/Icon'\nimport { DropdownMenu } from './DropdownMenu'\nimport { useFilteredOptions, useLoadedOptions } from './hooks'\nimport { SIZES, SIZES_CHECKBOX, SIZES_ICON } from './constants'\nimport { getDropdownInputText, getDropdownSelectedOption, groupDropdownOptions } from './utils'\nimport * as Styled from './style'\nimport type { DropdownProps, DropdownOption } from './types'\n\nconst COMPONENT_NAME = 'Dropdown'\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<div\\> элемента.\n *\n * Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n *\n * Поддерживаются пропсы определения размеров и внешних отступов в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/Dropdown/types.ts).\n */\nconst Dropdown: React.ForwardRefExoticComponent<DropdownProps> = withMergedProps<DropdownProps, HTMLDivElement>(\n forwardRef((props, ref) => {\n const {\n size = 'm',\n name = 'fox-dropdown',\n labelPosition = 'dynamic',\n searchable = true,\n primary = true,\n optionsMultiToggle = true,\n iconProps = {},\n menuProps = {},\n loadingIconProps = {},\n optionsEmptyIconProps = {},\n loading,\n autoFocus,\n disableAutoScrollToSelectedOption,\n closeMenuOnScroll,\n scrollMonitorTarget,\n contrast,\n selectedOption,\n defaultSelectedOption,\n icon,\n inputMode,\n loadingMessage,\n loadingIcon,\n maxLength,\n multiple,\n clearable,\n onChangeInput,\n onCloseMenu,\n onOpenMenu,\n onSelectOption,\n options,\n loadOptions,\n groupSelectedOptions,\n optionsMultiToggleCaption,\n optionsEmptyMessage,\n optionsEmptyIcon,\n palette,\n placeholder,\n readOnly,\n required,\n status,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n form,\n ...rootProps\n } = props\n\n const sizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const iconBaseProps: IconProps = {\n sizes: SIZES_ICON,\n color: rootProps.disabled ? 'content-disabled' : 'content-onmain-tertiary',\n }\n\n const formInputLabelId = useMemo(() => rootProps.id ?? `${name}-${nanoid()}`, [name, rootProps.id])\n const inputLabelId = useMemo(() => nanoid(), [])\n const menuListId = useMemo(() => nanoid(), [])\n\n const [filteredOptions, getFilteredOptions] = useFilteredOptions({\n options,\n })\n\n const [loadedOptions, optionsLoading, getLoadedOptions] = useLoadedOptions({\n loadOptions,\n options,\n })\n\n const [dropdownSelectedOption, setDropdownSelectedOption] = useState<DropdownOption[]>(() =>\n getDropdownSelectedOption(selectedOption !== undefined ? selectedOption : defaultSelectedOption, multiple)\n )\n\n const [inputText, setInputText] = useState<string>(() => getDropdownInputText(dropdownSelectedOption, multiple))\n\n const [focusWithin, setFocusWithin] = useState<boolean>(false)\n\n const [menuOpenRequest, setMenuOpenRequest] = useState<boolean>(false)\n\n const menuOptions: DropdownOption[] = loadOptions ? loadedOptions : filteredOptions\n const menuOptionsLoading = loadOptions ? loading ?? optionsLoading : loading\n\n const menuOptionsGroups: ReturnType<typeof groupDropdownOptions> = useMemo(\n () => (multiple ? groupDropdownOptions(menuOptions, dropdownSelectedOption) : [[], []]),\n [multiple, menuOptions, dropdownSelectedOption]\n )\n\n const menuOpen = menuOpenRequest && !rootProps.disabled\n\n const inputRequired = required && dropdownSelectedOption.length === 0\n const inputActive = Boolean(menuOpen || inputText || focusWithin)\n\n const multiToggleChecked = menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length === 0\n const multiToggleIndeterminate = menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length > 0\n\n const inputRef = useRef<HTMLInputElement>(null)\n const [menuRef, setMenuRef] = useState<Nullable<HTMLElement>>(null)\n const menuListRef = useRef<HTMLUListElement>(null)\n const selectedOptionRef = useRef<HTMLElement>(null)\n const menuOpenPrevRef = useRef<boolean>(menuOpen)\n\n const updateInputText = useCallback(\n (inputTextValue: string) => {\n setInputText(inputTextValue)\n\n if (onChangeInput) {\n onChangeInput(inputTextValue)\n }\n },\n [onChangeInput]\n )\n\n const updateOptions = useCallback(\n (inputTextValue: string) => {\n if (loadOptions) {\n getLoadedOptions(inputTextValue)\n } else {\n getFilteredOptions(inputTextValue)\n }\n },\n [loadOptions, getLoadedOptions, getFilteredOptions]\n )\n\n const updateOptionsDebounced = useMemo(() => {\n return createDebouncedCallback(updateOptions, 150)\n }, [updateOptions])\n\n useScrollMonitor({\n target: scrollMonitorTarget,\n onScrollStart: () => {\n if (closeMenuOnScroll && menuOpen) {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n },\n })\n\n useLayoutEffect(() => {\n if (selectedOption === undefined) return\n\n if (!multiple && !menuOpen) {\n updateInputText(getDropdownInputText(selectedOption))\n }\n setDropdownSelectedOption(getDropdownSelectedOption(selectedOption, multiple))\n }, [multiple, selectedOption, menuOpen, updateInputText])\n\n useEffect(() => {\n if (menuOpen === menuOpenPrevRef.current) return\n\n if (menuOpen && onOpenMenu) onOpenMenu()\n if (!menuOpen && onCloseMenu) onCloseMenu()\n\n menuOpenPrevRef.current = menuOpen\n }, [menuOpen, onCloseMenu, onOpenMenu])\n\n useEffect(() => {\n if (\n !multiple &&\n !disableAutoScrollToSelectedOption &&\n menuOpen &&\n !menuOptionsLoading &&\n inputText.length === 0 &&\n menuRef &&\n selectedOptionRef.current\n ) {\n const menuRect = menuRef.getBoundingClientRect()\n const selectedOptionRect = selectedOptionRef.current.getBoundingClientRect()\n\n if (selectedOptionRect.top < menuRect.top || selectedOptionRect.bottom > menuRect.bottom) {\n setTimeout(() => {\n if (menuRef && selectedOptionRef.current) {\n menuRef.scrollTo(0, selectedOptionRef.current.offsetTop)\n }\n }, 0)\n }\n }\n }, [multiple, disableAutoScrollToSelectedOption, menuOpen, menuOptionsLoading, inputText, menuRef])\n\n return (\n <FormInputLabel\n {...rootProps}\n {...sizeProps}\n ref={ref}\n id={formInputLabelId}\n labelId={inputLabelId}\n labelPosition={labelPosition}\n active={inputActive}\n onColored={contrast}\n primary={primary}\n error={status === 'error'}\n success={status === 'success'}\n focus={focusWithin}\n icon={[icon, <Styled.ChevronIcon key='chevron' up={menuOpen} />]}\n iconProps={{\n ...sizeProps,\n ...iconBaseProps,\n ...iconProps,\n }}\n palette={{\n color: rootProps.disabled ? palette.labelColorDisabled : palette.labelColor,\n backgroundColor: rootProps.disabled ? palette.backgroundColorDisabled : palette.backgroundColor,\n backgroundColorHover: rootProps.disabled ? palette.backgroundColorDisabled : palette.backgroundColorHover,\n borderColor: rootProps.disabled ? palette.borderColorDisabled : palette.borderColor,\n }}\n onClick={(evt) => {\n if (rootProps.onClick) rootProps.onClick(evt)\n\n if (rootProps.disabled) return\n\n inputRef.current?.focus()\n\n if (!menuOpen) {\n setMenuOpenRequest(true)\n\n updateOptions('')\n if (searchable) {\n updateInputText('')\n }\n } else if (menuRef && evt.target instanceof Node && !menuRef.contains(evt.target)) {\n setMenuOpenRequest(false)\n updateInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n }\n }}\n onPointerDown={(evt) => {\n if (rootProps.onPointerDown) rootProps.onPointerDown(evt)\n\n if (\n evt.target !== inputRef.current &&\n evt.target instanceof Node &&\n (evt.currentTarget.contains(evt.target) ||\n (menuProps.renderInPortal && menuOpen && menuRef && menuRef.contains(evt.target)))\n ) {\n evt.preventDefault()\n }\n }}\n onFocus={(evt) => {\n if (rootProps.onFocus) rootProps.onFocus(evt)\n\n setFocusWithin(true)\n\n if (inputRef.current && evt.target === inputRef.current && searchable && !multiple && !menuOpen) {\n updateInputText('')\n }\n }}\n onBlur={(evt) => {\n if (rootProps.onBlur) rootProps.onBlur(evt)\n\n if (\n evt.currentTarget.contains(evt.relatedTarget) ||\n (menuProps.renderInPortal && menuOpen && menuRef && menuRef.contains(evt.relatedTarget))\n ) {\n return\n }\n\n setFocusWithin(false)\n updateInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }}\n input={\n <>\n {inputRequired && !searchable && !readOnly && (\n <Styled.InputMimic\n required\n type='text'\n inputMode='none'\n form={form}\n tabIndex={-1}\n onFocus={() => {\n inputRef.current?.focus()\n }}\n />\n )}\n <FormInput\n ref={inputRef}\n role='combobox'\n aria-controls={menuListId}\n aria-expanded={menuOpen}\n aria-labelledby={rootProps.label ? inputLabelId : undefined}\n type='text'\n autoComplete='off'\n autoCapitalize='off'\n autoCorrect='off'\n spellCheck='false'\n form={form}\n autoFocus={autoFocus}\n inputMode={searchable ? inputMode : 'none'}\n maxLength={maxLength}\n placeholder={placeholder}\n readOnly={readOnly || !searchable}\n required={inputRequired}\n disabled={rootProps.disabled}\n value={inputText}\n palette={{\n color: palette.color,\n colorDisabled: palette.colorDisabled,\n placeholderColor: palette.placeholderColor,\n placeholderColorDisabled: palette.placeholderColorDisabled,\n }}\n onClick={(evt) => {\n if (menuOpen && evt.currentTarget.selectionStart !== evt.currentTarget.selectionEnd) {\n evt.stopPropagation()\n }\n }}\n onChange={(evt) => {\n const inputValue = evt.currentTarget.value\n\n updateInputText(inputValue)\n updateOptionsDebounced(inputValue)\n setMenuOpenRequest(true)\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.Enter.validate(evt.key)) {\n updateInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Space.validate(evt.key) && (!menuOpen || evt.currentTarget.selectionStart === 0)) {\n evt.preventDefault()\n\n if (!menuOpen) {\n updateOptions('')\n if (searchable) {\n updateInputText('')\n }\n }\n\n setMenuOpenRequest((prev) => !prev)\n }\n\n if (keyboardKeys.Esc.validate(evt.key)) {\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Tab.validate(evt.key) && menuOpen) {\n evt.preventDefault()\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.ArrowDown.validate(evt.key) && menuOpen && menuListRef.current) {\n evt.preventDefault()\n\n if (!multiple && selectedOptionRef.current) {\n const menuItems = [...menuListRef.current.children]\n\n const idx = menuItems.findIndex((item) => item.contains(selectedOptionRef.current as Node))\n\n const focusTarget = menuItems[idx + 1] ?? menuItems[0]\n\n if (focusTarget instanceof HTMLElement) {\n focusFirstFocusable(focusTarget)\n }\n } else {\n focusFirstFocusable(menuListRef.current)\n }\n }\n\n if (keyboardKeys.ArrowUp.validate(evt.key) && menuOpen && menuListRef.current) {\n evt.preventDefault()\n\n if (!multiple && selectedOptionRef.current) {\n const menuItems = [...menuListRef.current.children]\n\n const idx = menuItems.findIndex((item) => item.contains(selectedOptionRef.current as Node))\n\n const focusTarget = menuItems[idx - 1] ?? menuItems[menuItems.length - 1]\n\n if (focusTarget instanceof HTMLElement) {\n focusFirstFocusable(focusTarget)\n }\n } else {\n focusLastFocusable(menuListRef.current)\n }\n }\n }}\n />\n {dropdownSelectedOption.map((item) => (\n <input\n key={item.value}\n type='hidden'\n name={name}\n value={item.value}\n form={form}\n disabled={rootProps.disabled}\n />\n ))}\n </>\n }\n addon={\n <>\n {multiple && dropdownSelectedOption.length > 0 && (\n <Chip\n size='xs'\n active\n black\n marginLeft={12}\n disabled={rootProps.disabled}\n cursor={rootProps.disabled ? 'not-allowed' : undefined}\n text={dropdownSelectedOption.length}\n textProps={{\n appearance: 'caption',\n size: 'xs',\n }}\n palette={\n rootProps.disabled\n ? {\n color: 'content-disabled',\n colorHover: 'content-disabled',\n backgroundColor: 'bg-disabled-small',\n backgroundColorHover: 'bg-disabled-small',\n }\n : undefined\n }\n onPointerDown={(evt) => {\n evt.preventDefault()\n }}\n discardButtonProps={{\n square: true,\n contrast: !rootProps.disabled,\n onClick: (evt) => {\n evt.stopPropagation()\n\n if (!readOnly) {\n if (selectedOption === undefined) {\n setDropdownSelectedOption([])\n }\n\n if (onSelectOption) onSelectOption([])\n\n inputRef.current?.focus()\n updateInputText('')\n updateOptions('')\n setMenuOpenRequest(true)\n }\n },\n }}\n />\n )}\n {!multiple && clearable && dropdownSelectedOption.length > 0 && (\n <IconButton\n icon='close'\n size='l'\n square\n marginLeft={12}\n disabled={rootProps.disabled}\n onClick={(evt) => {\n evt.stopPropagation()\n\n if (!readOnly) {\n if (selectedOption === undefined) {\n setDropdownSelectedOption([])\n }\n\n if (onSelectOption) onSelectOption(null)\n\n inputRef.current?.focus()\n updateInputText('')\n updateOptions('')\n setMenuOpenRequest(true)\n }\n }}\n />\n )}\n </>\n }\n dropdown={\n <DropdownMenu\n {...menuProps}\n setRef={setMenuRef}\n open={menuOpen}\n popperReferenceId={formInputLabelId}\n secondary={!contrast}\n elevated={contrast}\n disableAutoFocus\n palette={{\n backgroundColor: palette.menuBackgroundColor,\n borderColor: palette.menuBorderColor,\n }}\n empty={menuOptions.length === 0}\n loading={menuOptionsLoading}\n loadingMessage={loadingMessage}\n loadingIcon={loadingIcon}\n loadingIconProps={{\n ...sizeProps,\n ...iconBaseProps,\n ...loadingIconProps,\n }}\n emptyMessage={optionsEmptyMessage}\n emptyIcon={optionsEmptyIcon}\n emptyIconProps={{\n ...sizeProps,\n ...iconBaseProps,\n ...optionsEmptyIconProps,\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.Tab.validate(evt.key)) {\n evt.preventDefault()\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Enter.validate(evt.key)) {\n inputRef.current?.focus()\n updateInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Esc.validate(evt.key)) {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Backspace.validate(evt.key) && !readOnly && (multiple || (!multiple && clearable))) {\n if (selectedOption === undefined) {\n setDropdownSelectedOption([])\n }\n\n if (onSelectOption) onSelectOption(multiple ? [] : null)\n\n updateInputText('')\n updateOptions('')\n }\n }}\n >\n {multiple ? (\n <MenuList\n ref={menuListRef}\n id={menuListId}\n role='listbox'\n aria-labelledby={rootProps.label ? inputLabelId : undefined}\n aria-multiselectable\n >\n {inputText.length === 0 ? (\n <>\n {optionsMultiToggle && (\n <ListItem\n {...sizeProps}\n text={optionsMultiToggleCaption}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n name={name}\n checked={multiToggleChecked}\n indeterminate={multiToggleIndeterminate}\n error={(multiToggleChecked || multiToggleIndeterminate) && status === 'error'}\n success={(multiToggleChecked || multiToggleIndeterminate) && status === 'success'}\n onChange={() => {\n if (!readOnly) {\n const update = multiToggleChecked || multiToggleIndeterminate ? [] : [...menuOptions]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )}\n {optionsMultiToggle && <MenuDivider />}\n {groupSelectedOptions &&\n menuOptionsGroups[0].map((option) => {\n const optionStatus = option.status ?? status\n const optionErrorStatus = optionStatus === 'error'\n const optionSuccessStatus = optionStatus === 'success'\n\n return (\n <ListItem\n {...sizeProps}\n key={option.value}\n active\n text={option.text}\n danger={optionErrorStatus}\n success={optionSuccessStatus}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n inputRef.current?.focus()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected\n name={name}\n value={option.value}\n checked\n error={optionErrorStatus}\n success={optionSuccessStatus}\n onChange={(evt) => {\n if (!readOnly) {\n const update = dropdownSelectedOption.filter(\n (item) => item.value !== evt.currentTarget.value\n )\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )\n })}\n {groupSelectedOptions && menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length > 0 && (\n <MenuDivider />\n )}\n {groupSelectedOptions &&\n menuOptionsGroups[1].map((option) => (\n <ListItem\n {...sizeProps}\n key={option.value}\n text={option.text}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n inputRef.current?.focus()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected={false}\n name={name}\n value={option.value}\n checked={false}\n onChange={() => {\n if (!readOnly) {\n const update = [...dropdownSelectedOption, option]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n ))}\n {!groupSelectedOptions &&\n menuOptions.map((option) => {\n const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n const optionStatus = option.status ?? status\n const optionErrorStatus = selected && optionStatus === 'error'\n const optionSuccessStatus = selected && optionStatus === 'success'\n\n return (\n <ListItem\n {...sizeProps}\n key={option.value}\n text={option.text}\n danger={optionErrorStatus}\n success={optionSuccessStatus}\n disabled={rootProps.disabled}\n active={selected}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected={selected}\n name={name}\n value={option.value}\n checked={selected}\n error={optionErrorStatus}\n success={optionSuccessStatus}\n onChange={(evt) => {\n if (!readOnly) {\n const update = selected\n ? dropdownSelectedOption.filter((item) => item.value !== evt.currentTarget.value)\n : [...dropdownSelectedOption, option]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )\n })}\n </>\n ) : (\n <>\n {menuOptions.map((option) => {\n const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n const optionStatus = option.status ?? status\n const optionErrorStatus = selected && optionStatus === 'error'\n const optionSuccessStatus = selected && optionStatus === 'success'\n\n return (\n <ListItem\n {...sizeProps}\n key={option.value}\n text={option.text}\n danger={optionErrorStatus}\n success={optionSuccessStatus}\n disabled={rootProps.disabled}\n active={selected}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected={selected}\n name={name}\n value={option.value}\n checked={selected}\n error={optionErrorStatus}\n success={optionSuccessStatus}\n onChange={(evt) => {\n if (!readOnly) {\n const update = selected\n ? dropdownSelectedOption.filter((item) => item.value !== evt.currentTarget.value)\n : [...dropdownSelectedOption, option]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )\n })}\n </>\n )}\n </MenuList>\n ) : (\n <MenuList\n ref={menuListRef}\n id={menuListId}\n role='listbox'\n aria-labelledby={rootProps.label ? inputLabelId : undefined}\n >\n {menuOptions.map((option) => {\n const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n return (\n <ListItem\n {...sizeProps}\n role='option'\n aria-selected={selected}\n ref={selected ? selectedOptionRef : undefined}\n key={option.value}\n text={option.text}\n active={selected}\n danger={selected && status === 'error'}\n success={selected && status === 'success'}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n\n if (!readOnly) {\n const update = { ...option }\n\n if (selectedOption === undefined) {\n updateInputText(getDropdownInputText(update))\n setDropdownSelectedOption(getDropdownSelectedOption(update))\n }\n\n if (onSelectOption) onSelectOption(update)\n\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n }}\n />\n )\n })}\n </MenuList>\n )}\n </DropdownMenu>\n }\n />\n )\n }),\n {\n sizes: SIZES,\n displayName: COMPONENT_NAME,\n }\n)\n\nexport { Dropdown, COMPONENT_NAME }\n"],"names":["Dropdown","withMergedProps","forwardRef","props","ref","size","name","labelPosition","searchable","primary","optionsMultiToggle","iconProps","menuProps","loadingIconProps","optionsEmptyIconProps","loading","autoFocus","disableAutoScrollToSelectedOption","closeMenuOnScroll","scrollMonitorTarget","contrast","selectedOption","defaultSelectedOption","icon","inputMode","loadingMessage","loadingIcon","maxLength","multiple","clearable","onChangeInput","onCloseMenu","onOpenMenu","onSelectOption","options","loadOptions","groupSelectedOptions","optionsMultiToggleCaption","optionsEmptyMessage","optionsEmptyIcon","palette","placeholder","readOnly","required","status","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","form","rootProps","sizeProps","iconBaseProps","sizes","SIZES_ICON","color","disabled","formInputLabelId","useMemo","id","nanoid","inputLabelId","menuListId","filteredOptions","getFilteredOptions","useFilteredOptions","loadedOptions","optionsLoading","getLoadedOptions","useLoadedOptions","dropdownSelectedOption","setDropdownSelectedOption","useState","getDropdownSelectedOption","undefined","inputText","setInputText","getDropdownInputText","focusWithin","setFocusWithin","menuOpenRequest","setMenuOpenRequest","menuOptions","menuOptionsLoading","menuOptionsGroups","groupDropdownOptions","menuOpen","inputRequired","length","inputActive","Boolean","multiToggleChecked","multiToggleIndeterminate","inputRef","useRef","menuRef","setMenuRef","menuListRef","selectedOptionRef","menuOpenPrevRef","updateInputText","useCallback","inputTextValue","updateOptions","updateOptionsDebounced","createDebouncedCallback","useScrollMonitor","target","onScrollStart","current","focus","useLayoutEffect","useEffect","menuRect","getBoundingClientRect","selectedOptionRect","top","bottom","setTimeout","scrollTo","offsetTop","_jsx","FormInputLabel","labelId","active","onColored","error","success","jsx","Styled","up","labelColorDisabled","labelColor","backgroundColor","backgroundColorDisabled","backgroundColorHover","borderColor","borderColorDisabled","onClick","evt","Node","contains","onPointerDown","currentTarget","renderInPortal","preventDefault","onFocus","onBlur","relatedTarget","input","_jsxs","jsxs","_Fragment","children","type","tabIndex","FormInput","role","label","autoComplete","autoCapitalize","autoCorrect","spellCheck","value","colorDisabled","placeholderColor","placeholderColorDisabled","selectionStart","selectionEnd","stopPropagation","onChange","inputValue","onKeyDown","keyboardKeys","Enter","validate","key","Space","prev","Esc","Tab","ArrowDown","menuItems","idx","findIndex","item","focusTarget","HTMLElement","focusFirstFocusable","ArrowUp","focusLastFocusable","map","addon","Chip","black","marginLeft","cursor","text","textProps","appearance","colorHover","discardButtonProps","square","IconButton","dropdown","DropdownMenu","setRef","open","popperReferenceId","secondary","elevated","disableAutoFocus","menuBackgroundColor","menuBorderColor","empty","emptyMessage","emptyIcon","emptyIconProps","Backspace","MenuList","ListItem","borderRadius","ellipsis","wordBreak","control","InputCheckbox","SIZES_CHECKBOX","checked","indeterminate","update","MenuDivider","option","optionStatus","optionErrorStatus","optionSuccessStatus","_createElement","danger","filter","createElement","selected","SIZES","displayName"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{forwardRef,useMemo,useState,useRef,useEffect,useLayoutEffect,createElement}from'react';import Fuse from'fuse.js';import{nanoid}from'nanoid';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{useScrollMonitor}from'../../hooks/useScrollMonitor.mjs';import{focusFirstFocusable,focusLastFocusable}from'../../shared/utils/dom.mjs';import{keyboardKeys}from'../../shared/constants.mjs';import{DropdownMenu}from'./DropdownMenu.mjs';import{SIZES,SIZES_ICON,FuseSearchKeys,SIZES_CHECKBOX}from'./constants.mjs';import{getDropdownSelectedOption,getDropdownInputText,groupDropdownOptions}from'./utils.mjs';import{ChevronIcon,InputMimic}from'./style.mjs';import{jsx,jsxs,Fragment}from'react/jsx-runtime';import{FormInputLabel}from'../FormInputLabel/FormInputLabel.mjs';import{FormInput}from'../FormInput/FormInput.mjs';import{Chip}from'../Chip/Chip.mjs';import{IconButton}from'../IconButton/IconButton.mjs';import{MenuList}from'../MenuList/MenuList.mjs';import{ListItem}from'../ListItem/ListItem.mjs';import{InputCheckbox}from'../InputCheckbox/InputCheckbox.mjs';import{MenuDivider}from'../MenuDivider/MenuDivider.mjs';const COMPONENT_NAME='Dropdown';const Dropdown=withMergedProps(forwardRef(((e,o)=>{const{size:t="m",name:r="fox-dropdown",labelPosition:n="dynamic",searchable:s=!0,primary:a=!0,optionsMultiToggle:l=!0,loading:i=!1,iconProps:c={},menuProps:d={},loadingIconProps:u={},optionsEmptyIconProps:p={},autoFocus:m,disableAutoScrollToSelectedOption:b,closeMenuOnScroll:f,scrollMonitorTarget:g,contrast:v,selectedOption:k,defaultSelectedOption:x,icon:C,inputMode:h,loadingMessage:I,loadingIcon:y,maxLength:S,multiple:w,clearable:D,onCloseMenu:M,onOpenMenu:E,onSelectOption:j,options:P,groupSelectedOptions:F,optionsMultiToggleCaption:T,optionsEmptyMessage:L,optionsEmptyIcon:O,palette:B,placeholder:z,readOnly:K,required:R,status:X,sizeXXS:H,sizeXS:N,sizeS:Z,sizeM:_,sizeL:A,sizeXL:q,form:$,...U}=e;const G={size:t,sizeXXS:H,sizeXS:N,sizeS:Z,sizeM:_,sizeL:A,sizeXL:q};const J={sizes:SIZES_ICON,color:U.disabled?'content-disabled':'content-onmain-tertiary'};const Q=useMemo((()=>U.id??`${r}-${nanoid()}`),[r,U.id]);const V=useMemo((()=>nanoid()),[]);const W=useMemo((()=>nanoid()),[]);const Y=useMemo((()=>{const e=new Fuse(P,{threshold:.4,ignoreLocation:!0,keys:[FuseSearchKeys.text,FuseSearchKeys.label,FuseSearchKeys.tags]});return o=>o.length===0?P:e.search(o).map((e=>e.item))}),[P]);const[ee,oe]=useState((()=>getDropdownSelectedOption(k!==void 0?k:x,w)));const[te,re]=useState((()=>getDropdownInputText(ee,w)));const[ne,se]=useState(!1);const[ae,le]=useState((()=>Y(te)));const[ie,ce]=useState(!1);const de=w?groupDropdownOptions(P,ee):[[],[]];const ue=ie&&!U.disabled;const pe=te===getDropdownInputText(ee);const me=R&&ee.length===0;const be=Boolean(ue||te||ne);const fe=de[0].length>0&&de[1].length===0;const ge=de[0].length>0&&de[1].length>0;const ve=useRef(null);const[ke,xe]=useState(null);const Ce=useRef(null);const he=useRef(null);const Ie=useRef(null);const ye=useRef(te);const Se=useRef(ue);return useScrollMonitor({target:g,onScrollStart:()=>{f&&ue&&(ve.current?.focus(),ce(!1))}}),useEffect((()=>(te===ye.current?le(Y(te)):(ye.current=te,Ie.current=setTimeout((()=>{le(Y(te))}),150)),()=>{Ie.current&&clearTimeout(Ie.current)})),[Y,te]),useLayoutEffect((()=>{k!==void 0&&(w||ue||re(getDropdownInputText(k)),oe(getDropdownSelectedOption(k,w)))}),[w,k,ue]),useEffect((()=>{ue!==Se.current&&(ue&&E&&E(),!ue&&M&&M(),Se.current=ue)}),[ue,M,E]),useEffect((()=>{if(!w&&!b&&ue&&ke&&he.current){const e=ke.getBoundingClientRect();const o=he.current.getBoundingClientRect();(o.top<e.top||o.bottom>e.bottom)&&setTimeout((()=>{ke&&he.current&&ke.scrollTo(0,he.current.offsetTop)}),0)}}),[w,b,ue,ke]),jsx(FormInputLabel,{...U,...G,ref:o,id:Q,labelId:V,labelPosition:n,active:be,onColored:v,primary:a,error:X==='error',success:X==='success',focus:ne,icon:[C,jsx(ChevronIcon,{up:ue},'chevron')],iconProps:{...G,...J,...c},palette:{color:U.disabled?B.labelColorDisabled:B.labelColor,backgroundColor:U.disabled?B.backgroundColorDisabled:B.backgroundColor,backgroundColorHover:U.disabled?B.backgroundColorDisabled:B.backgroundColorHover,borderColor:U.disabled?B.borderColorDisabled:B.borderColor},onClick:e=>{U.onClick&&U.onClick(e),U.disabled||(ve.current?.focus(),ue?ke&&e.target instanceof Node&&!ke.contains(e.target)&&ce(!1):(ce(!0),s&&!w&&pe&&(re(''),le(Y('')))))},onPointerDown:e=>{U.onPointerDown&&U.onPointerDown(e),e.target!==ve.current&&e.target instanceof Node&&(e.currentTarget.contains(e.target)||d.renderInPortal&&ue&&ke&&ke.contains(e.target))&&e.preventDefault()},onFocus:e=>{U.onFocus&&U.onFocus(e),se(!0),ve.current&&e.target===ve.current&&s&&!w&&pe&&!ue&&(re(''),le(Y('')))},onBlur:e=>{U.onBlur&&U.onBlur(e),e.currentTarget.contains(e.relatedTarget)||d.renderInPortal&&ue&&ke&&ke.contains(e.relatedTarget)||(se(!1),re(getDropdownInputText(ee,w)),ce(!1))},input:jsxs(Fragment,{children:[me&&!s&&!K&&jsx(InputMimic,{required:!0,type:"text",inputMode:"none",form:$,tabIndex:-1,onFocus:()=>{ve.current?.focus()}}),jsx(FormInput,{ref:ve,role:"combobox","aria-controls":W,"aria-expanded":ue,"aria-labelledby":U.label?V:void 0,type:"text",autoComplete:"off",autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",form:$,autoFocus:m,inputMode:s?h:'none',maxLength:S,placeholder:z,readOnly:K||!s,required:me,disabled:U.disabled,value:te,palette:{color:B.color,colorDisabled:B.colorDisabled,placeholderColor:B.placeholderColor,placeholderColorDisabled:B.placeholderColorDisabled},onClick:e=>{ue&&e.currentTarget.selectionStart!==e.currentTarget.selectionEnd&&e.stopPropagation()},onChange:e=>{re(e.currentTarget.value),ce(!0)},onKeyDown:e=>{if(keyboardKeys.Enter.validate(e.key)&&(re(getDropdownInputText(ee,w)),ce(!1)),!keyboardKeys.Space.validate(e.key)||ue&&e.currentTarget.selectionStart!==0||(e.preventDefault(),s&&!w&&pe&&!ue&&(re(''),le(Y(''))),ce((e=>!e))),keyboardKeys.Esc.validate(e.key)&&ce(!1),keyboardKeys.Tab.validate(e.key)&&ue&&(e.preventDefault(),ce(!1)),keyboardKeys.ArrowDown.validate(e.key)&&ue&&Ce.current)if(e.preventDefault(),!w&&he.current){const e=[...Ce.current.children];const o=e.findIndex((e=>e.contains(he.current)));const t=e[o+1]??e[0];t instanceof HTMLElement&&focusFirstFocusable(t)}else focusFirstFocusable(Ce.current);if(keyboardKeys.ArrowUp.validate(e.key)&&ue&&Ce.current)if(e.preventDefault(),!w&&he.current){const e=[...Ce.current.children];const o=e.findIndex((e=>e.contains(he.current)));const t=e[o-1]??e[e.length-1];t instanceof HTMLElement&&focusFirstFocusable(t)}else focusLastFocusable(Ce.current)}}),ee.map((e=>jsx("input",{type:"hidden",name:r,value:e.value,form:$,disabled:U.disabled},e.value)))]}),addon:jsxs(Fragment,{children:[w&&ee.length>0&&jsx(Chip,{size:"xs",active:!0,black:!0,marginLeft:12,disabled:U.disabled,cursor:U.disabled?'not-allowed':void 0,text:ee.length,textProps:{appearance:'caption',size:'xs'},palette:U.disabled?{color:'content-disabled',colorHover:'content-disabled',backgroundColor:'bg-disabled-small',backgroundColorHover:'bg-disabled-small'}:void 0,onPointerDown:e=>{e.preventDefault()},discardButtonProps:{square:!0,contrast:!U.disabled,onClick:e=>{e.stopPropagation(),K||(k===void 0&&oe([]),j&&j(w?[]:null),ve.current?.focus(),ce(!0))}}}),!w&&D&&ee.length>0&&jsx(IconButton,{icon:"close",size:"l",square:!0,marginLeft:12,disabled:U.disabled,onClick:e=>{e.stopPropagation(),K||(pe&&(re(''),le(Y(''))),k===void 0&&oe([]),j&&j(w?[]:null),ve.current?.focus(),ce(!0))}})]}),dropdown:jsx(DropdownMenu,{...d,setRef:xe,open:ue,popperReferenceId:Q,secondary:!v,elevated:v,disableAutoFocus:!0,palette:{backgroundColor:B.menuBackgroundColor,borderColor:B.menuBorderColor},empty:ae.length===0,loading:i,loadingMessage:I,loadingIcon:y,loadingIconProps:{...G,...J,...u},emptyMessage:L,emptyIcon:O,emptyIconProps:{...G,...J,...p},onKeyDown:e=>{keyboardKeys.Tab.validate(e.key)&&(e.preventDefault(),ve.current?.focus(),ce(!1)),keyboardKeys.Enter.validate(e.key)&&(ve.current?.focus(),re(getDropdownInputText(ee,w)),ce(!1)),keyboardKeys.Esc.validate(e.key)&&(ve.current?.focus(),ce(!1)),keyboardKeys.Backspace.validate(e.key)&&!K&&(w||!w&&D)&&(k===void 0&&oe([]),j&&j(w?[]:null))},children:jsx(MenuList,w?{ref:Ce,id:W,role:"listbox","aria-labelledby":U.label?V:void 0,"aria-multiselectable":!0,children:te.length===0?jsxs(Fragment,{children:[l&&jsx(ListItem,{...G,text:T,disabled:U.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,checked:fe,indeterminate:ge,error:(fe||ge)&&X==='error',success:(fe||ge)&&X==='success',onChange:()=>{if(!K){const e=fe||ge?[]:[...P];k===void 0&&oe(e),j&&j(e)}}})}),l&&jsx(MenuDivider,{}),F&&de[0].map((e=>{const o=e.status??X;const t=o==='error';const n=o==='success';return createElement(ListItem,{...G,key:e.value,active:!0,text:e.text,danger:t,success:n,disabled:U.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation(),ve.current?.focus()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",role:"option","aria-selected":!0,name:r,value:e.value,checked:!0,error:t,success:n,onChange:e=>{if(!K){const o=ee.filter((o=>o.value!==e.currentTarget.value));k===void 0&&oe(o),j&&j(o)}}})})})),F&&de[0].length>0&&de[1].length>0&&jsx(MenuDivider,{}),F&&de[1].map((e=>createElement(ListItem,{...G,key:e.value,text:e.text,disabled:U.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation(),ve.current?.focus()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",role:"option","aria-selected":!1,name:r,value:e.value,checked:!1,onChange:()=>{if(!K){const o=[...ee,e];k===void 0&&oe(o),j&&j(o)}}})}))),!F&&P.map((e=>{const o=ee.findIndex((o=>o.value===e.value))!==-1;const t=e.status??X;const n=o&&t==='error';const s=o&&t==='success';return createElement(ListItem,{...G,key:e.value,text:e.text,danger:n,success:s,disabled:U.disabled,active:o,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",role:"option","aria-selected":o,name:r,value:e.value,checked:o,error:n,success:s,onChange:t=>{if(!K){const r=o?ee.filter((e=>e.value!==t.currentTarget.value)):[...ee,e];k===void 0&&oe(r),j&&j(r)}}})})}))]}):jsx(Fragment,{children:ae.map((e=>{const o=ee.findIndex((o=>o.value===e.value))!==-1;const t=e.status??X;const n=o&&t==='error';const s=o&&t==='success';return createElement(ListItem,{...G,key:e.value,text:e.text,danger:n,success:s,disabled:U.disabled,active:o,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",role:"option","aria-selected":o,name:r,value:e.value,checked:o,error:n,success:s,onChange:t=>{if(!K){const r=o?ee.filter((e=>e.value!==t.currentTarget.value)):[...ee,e];k===void 0&&oe(r),j&&j(r)}}})})}))})}:{ref:Ce,id:W,role:"listbox","aria-labelledby":U.label?V:void 0,children:(s?ae:P).map((e=>{const o=ee.findIndex((o=>o.value===e.value))!==-1;return createElement(ListItem,{...G,role:"option","aria-selected":o,ref:o?he:void 0,key:e.value,text:e.text,active:o,danger:o&&X==='error',success:o&&X==='success',disabled:U.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:o=>{if(o.stopPropagation(),!K){const o={...e};k===void 0&&(re(getDropdownInputText(o)),oe(getDropdownSelectedOption(o))),j&&j(o),ve.current?.focus(),ce(!1)}}})}))})})})})),{sizes:SIZES,displayName:"Dropdown"});export{COMPONENT_NAME,Dropdown};
1
+ import{forwardRef,useMemo,useState,useRef,useCallback,useLayoutEffect,useEffect,createElement}from'react';import{nanoid}from'nanoid';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{useScrollMonitor}from'../../hooks/useScrollMonitor.mjs';import{focusFirstFocusable,focusLastFocusable}from'../../shared/utils/dom.mjs';import{createDebouncedCallback}from'../../shared/utils/misc.mjs';import{keyboardKeys}from'../../shared/constants.mjs';import{DropdownMenu}from'./DropdownMenu.mjs';import{useFilteredOptions,useLoadedOptions}from'./hooks.mjs';import{SIZES,SIZES_ICON,SIZES_CHECKBOX}from'./constants.mjs';import{getDropdownSelectedOption,getDropdownInputText,groupDropdownOptions}from'./utils.mjs';import{ChevronIcon,InputMimic}from'./style.mjs';import{jsx,jsxs,Fragment}from'react/jsx-runtime';import{FormInputLabel}from'../FormInputLabel/FormInputLabel.mjs';import{FormInput}from'../FormInput/FormInput.mjs';import{Chip}from'../Chip/Chip.mjs';import{IconButton}from'../IconButton/IconButton.mjs';import{MenuList}from'../MenuList/MenuList.mjs';import{ListItem}from'../ListItem/ListItem.mjs';import{InputCheckbox}from'../InputCheckbox/InputCheckbox.mjs';import{MenuDivider}from'../MenuDivider/MenuDivider.mjs';const COMPONENT_NAME='Dropdown';const Dropdown=withMergedProps(forwardRef(((e,o)=>{const{size:t="m",name:r="fox-dropdown",labelPosition:n="dynamic",searchable:s=!0,primary:a=!0,optionsMultiToggle:l=!0,iconProps:i={},menuProps:c={},loadingIconProps:d={},optionsEmptyIconProps:u={},loading:p,autoFocus:m,disableAutoScrollToSelectedOption:b,closeMenuOnScroll:f,scrollMonitorTarget:g,contrast:C,selectedOption:k,defaultSelectedOption:v,icon:x,inputMode:I,loadingMessage:h,loadingIcon:y,maxLength:w,multiple:D,clearable:S,onChangeInput:M,onCloseMenu:j,onOpenMenu:E,onSelectOption:P,options:L,loadOptions:O,groupSelectedOptions:F,optionsMultiToggleCaption:T,optionsEmptyMessage:B,optionsEmptyIcon:z,palette:K,placeholder:R,readOnly:X,required:H,status:N,sizeXXS:Z,sizeXS:_,sizeS:A,sizeM:q,sizeL:$,sizeXL:U,form:G,...J}=e;const Q={size:t,sizeXXS:Z,sizeXS:_,sizeS:A,sizeM:q,sizeL:$,sizeXL:U};const V={sizes:SIZES_ICON,color:J.disabled?'content-disabled':'content-onmain-tertiary'};const W=useMemo((()=>J.id??`${r}-${nanoid()}`),[r,J.id]);const Y=useMemo((()=>nanoid()),[]);const ee=useMemo((()=>nanoid()),[]);const[oe,te]=useFilteredOptions({options:L});const[re,ne,se]=useLoadedOptions({loadOptions:O,options:L});const[ae,le]=useState((()=>getDropdownSelectedOption(k!==void 0?k:v,D)));const[ie,ce]=useState((()=>getDropdownInputText(ae,D)));const[de,ue]=useState(!1);const[pe,me]=useState(!1);const be=O?re:oe;const fe=O?p??ne:p;const ge=useMemo((()=>D?groupDropdownOptions(be,ae):[[],[]]),[D,be,ae]);const Ce=pe&&!J.disabled;const ke=H&&ae.length===0;const ve=Boolean(Ce||ie||de);const xe=ge[0].length>0&&ge[1].length===0;const Ie=ge[0].length>0&&ge[1].length>0;const he=useRef(null);const[ye,we]=useState(null);const De=useRef(null);const Se=useRef(null);const Me=useRef(Ce);const je=useCallback((e=>{ce(e),M&&M(e)}),[M]);const Ee=useCallback((e=>{O?se(e):te(e)}),[O,se,te]);const Pe=useMemo((()=>createDebouncedCallback(Ee,150)),[Ee]);return useScrollMonitor({target:g,onScrollStart:()=>{f&&Ce&&(he.current?.focus(),me(!1))}}),useLayoutEffect((()=>{k!==void 0&&(D||Ce||je(getDropdownInputText(k)),le(getDropdownSelectedOption(k,D)))}),[D,k,Ce,je]),useEffect((()=>{Ce!==Me.current&&(Ce&&E&&E(),!Ce&&j&&j(),Me.current=Ce)}),[Ce,j,E]),useEffect((()=>{if(!D&&!b&&Ce&&!fe&&ie.length===0&&ye&&Se.current){const e=ye.getBoundingClientRect();const o=Se.current.getBoundingClientRect();(o.top<e.top||o.bottom>e.bottom)&&setTimeout((()=>{ye&&Se.current&&ye.scrollTo(0,Se.current.offsetTop)}),0)}}),[D,b,Ce,fe,ie,ye]),jsx(FormInputLabel,{...J,...Q,ref:o,id:W,labelId:Y,labelPosition:n,active:ve,onColored:C,primary:a,error:N==='error',success:N==='success',focus:de,icon:[x,jsx(ChevronIcon,{up:Ce},'chevron')],iconProps:{...Q,...V,...i},palette:{color:J.disabled?K.labelColorDisabled:K.labelColor,backgroundColor:J.disabled?K.backgroundColorDisabled:K.backgroundColor,backgroundColorHover:J.disabled?K.backgroundColorDisabled:K.backgroundColorHover,borderColor:J.disabled?K.borderColorDisabled:K.borderColor},onClick:e=>{J.onClick&&J.onClick(e),J.disabled||(he.current?.focus(),Ce?ye&&e.target instanceof Node&&!ye.contains(e.target)&&(me(!1),je(getDropdownInputText(ae,D))):(me(!0),Ee(''),s&&je('')))},onPointerDown:e=>{J.onPointerDown&&J.onPointerDown(e),e.target!==he.current&&e.target instanceof Node&&(e.currentTarget.contains(e.target)||c.renderInPortal&&Ce&&ye&&ye.contains(e.target))&&e.preventDefault()},onFocus:e=>{J.onFocus&&J.onFocus(e),ue(!0),he.current&&e.target===he.current&&s&&!D&&!Ce&&je('')},onBlur:e=>{J.onBlur&&J.onBlur(e),e.currentTarget.contains(e.relatedTarget)||c.renderInPortal&&Ce&&ye&&ye.contains(e.relatedTarget)||(ue(!1),je(getDropdownInputText(ae,D)),me(!1))},input:jsxs(Fragment,{children:[ke&&!s&&!X&&jsx(InputMimic,{required:!0,type:"text",inputMode:"none",form:G,tabIndex:-1,onFocus:()=>{he.current?.focus()}}),jsx(FormInput,{ref:he,role:"combobox","aria-controls":ee,"aria-expanded":Ce,"aria-labelledby":J.label?Y:void 0,type:"text",autoComplete:"off",autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",form:G,autoFocus:m,inputMode:s?I:'none',maxLength:w,placeholder:R,readOnly:X||!s,required:ke,disabled:J.disabled,value:ie,palette:{color:K.color,colorDisabled:K.colorDisabled,placeholderColor:K.placeholderColor,placeholderColorDisabled:K.placeholderColorDisabled},onClick:e=>{Ce&&e.currentTarget.selectionStart!==e.currentTarget.selectionEnd&&e.stopPropagation()},onChange:e=>{const o=e.currentTarget.value;je(o),Pe(o),me(!0)},onKeyDown:e=>{if(keyboardKeys.Enter.validate(e.key)&&(je(getDropdownInputText(ae,D)),me(!1)),!keyboardKeys.Space.validate(e.key)||Ce&&e.currentTarget.selectionStart!==0||(e.preventDefault(),Ce||(Ee(''),s&&je('')),me((e=>!e))),keyboardKeys.Esc.validate(e.key)&&me(!1),keyboardKeys.Tab.validate(e.key)&&Ce&&(e.preventDefault(),me(!1)),keyboardKeys.ArrowDown.validate(e.key)&&Ce&&De.current)if(e.preventDefault(),!D&&Se.current){const e=[...De.current.children];const o=e.findIndex((e=>e.contains(Se.current)));const t=e[o+1]??e[0];t instanceof HTMLElement&&focusFirstFocusable(t)}else focusFirstFocusable(De.current);if(keyboardKeys.ArrowUp.validate(e.key)&&Ce&&De.current)if(e.preventDefault(),!D&&Se.current){const e=[...De.current.children];const o=e.findIndex((e=>e.contains(Se.current)));const t=e[o-1]??e[e.length-1];t instanceof HTMLElement&&focusFirstFocusable(t)}else focusLastFocusable(De.current)}}),ae.map((e=>jsx("input",{type:"hidden",name:r,value:e.value,form:G,disabled:J.disabled},e.value)))]}),addon:jsxs(Fragment,{children:[D&&ae.length>0&&jsx(Chip,{size:"xs",active:!0,black:!0,marginLeft:12,disabled:J.disabled,cursor:J.disabled?'not-allowed':void 0,text:ae.length,textProps:{appearance:'caption',size:'xs'},palette:J.disabled?{color:'content-disabled',colorHover:'content-disabled',backgroundColor:'bg-disabled-small',backgroundColorHover:'bg-disabled-small'}:void 0,onPointerDown:e=>{e.preventDefault()},discardButtonProps:{square:!0,contrast:!J.disabled,onClick:e=>{e.stopPropagation(),X||(k===void 0&&le([]),P&&P([]),he.current?.focus(),je(''),Ee(''),me(!0))}}}),!D&&S&&ae.length>0&&jsx(IconButton,{icon:"close",size:"l",square:!0,marginLeft:12,disabled:J.disabled,onClick:e=>{e.stopPropagation(),X||(k===void 0&&le([]),P&&P(null),he.current?.focus(),je(''),Ee(''),me(!0))}})]}),dropdown:jsx(DropdownMenu,{...c,setRef:we,open:Ce,popperReferenceId:W,secondary:!C,elevated:C,disableAutoFocus:!0,palette:{backgroundColor:K.menuBackgroundColor,borderColor:K.menuBorderColor},empty:be.length===0,loading:fe,loadingMessage:h,loadingIcon:y,loadingIconProps:{...Q,...V,...d},emptyMessage:B,emptyIcon:z,emptyIconProps:{...Q,...V,...u},onKeyDown:e=>{keyboardKeys.Tab.validate(e.key)&&(e.preventDefault(),he.current?.focus(),me(!1)),keyboardKeys.Enter.validate(e.key)&&(he.current?.focus(),je(getDropdownInputText(ae,D)),me(!1)),keyboardKeys.Esc.validate(e.key)&&(he.current?.focus(),me(!1)),keyboardKeys.Backspace.validate(e.key)&&!X&&(D||!D&&S)&&(k===void 0&&le([]),P&&P(D?[]:null),je(''),Ee(''))},children:jsx(MenuList,D?{ref:De,id:ee,role:"listbox","aria-labelledby":J.label?Y:void 0,"aria-multiselectable":!0,children:ie.length===0?jsxs(Fragment,{children:[l&&jsx(ListItem,{...Q,text:T,disabled:J.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,checked:xe,indeterminate:Ie,error:(xe||Ie)&&N==='error',success:(xe||Ie)&&N==='success',onChange:()=>{if(!X){const e=xe||Ie?[]:[...be];k===void 0&&le(e),P&&P(e)}}})}),l&&jsx(MenuDivider,{}),F&&ge[0].map((e=>{const o=e.status??N;const t=o==='error';const n=o==='success';return createElement(ListItem,{...Q,key:e.value,active:!0,text:e.text,danger:t,success:n,disabled:J.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation(),he.current?.focus()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",role:"option","aria-selected":!0,name:r,value:e.value,checked:!0,error:t,success:n,onChange:e=>{if(!X){const o=ae.filter((o=>o.value!==e.currentTarget.value));k===void 0&&le(o),P&&P(o)}}})})})),F&&ge[0].length>0&&ge[1].length>0&&jsx(MenuDivider,{}),F&&ge[1].map((e=>createElement(ListItem,{...Q,key:e.value,text:e.text,disabled:J.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation(),he.current?.focus()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",role:"option","aria-selected":!1,name:r,value:e.value,checked:!1,onChange:()=>{if(!X){const o=[...ae,e];k===void 0&&le(o),P&&P(o)}}})}))),!F&&be.map((e=>{const o=ae.findIndex((o=>o.value===e.value))!==-1;const t=e.status??N;const n=o&&t==='error';const s=o&&t==='success';return createElement(ListItem,{...Q,key:e.value,text:e.text,danger:n,success:s,disabled:J.disabled,active:o,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",role:"option","aria-selected":o,name:r,value:e.value,checked:o,error:n,success:s,onChange:t=>{if(!X){const r=o?ae.filter((e=>e.value!==t.currentTarget.value)):[...ae,e];k===void 0&&le(r),P&&P(r)}}})})}))]}):jsx(Fragment,{children:be.map((e=>{const o=ae.findIndex((o=>o.value===e.value))!==-1;const t=e.status??N;const n=o&&t==='error';const s=o&&t==='success';return createElement(ListItem,{...Q,key:e.value,text:e.text,danger:n,success:s,disabled:J.disabled,active:o,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",role:"option","aria-selected":o,name:r,value:e.value,checked:o,error:n,success:s,onChange:t=>{if(!X){const r=o?ae.filter((e=>e.value!==t.currentTarget.value)):[...ae,e];k===void 0&&le(r),P&&P(r)}}})})}))})}:{ref:De,id:ee,role:"listbox","aria-labelledby":J.label?Y:void 0,children:be.map((e=>{const o=ae.findIndex((o=>o.value===e.value))!==-1;return createElement(ListItem,{...Q,role:"option","aria-selected":o,ref:o?Se:void 0,key:e.value,text:e.text,active:o,danger:o&&N==='error',success:o&&N==='success',disabled:J.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:o=>{if(o.stopPropagation(),!X){const o={...e};k===void 0&&(je(getDropdownInputText(o)),le(getDropdownSelectedOption(o))),P&&P(o),he.current?.focus(),me(!1)}}})}))})})})})),{sizes:SIZES,displayName:"Dropdown"});export{COMPONENT_NAME,Dropdown};
2
2
  //# sourceMappingURL=Dropdown.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"Dropdown.mjs","sources":["../../../../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["import { forwardRef, useState, useRef, useEffect, useLayoutEffect, useMemo } from 'react'\nimport Fuse from 'fuse.js'\nimport { nanoid } from 'nanoid'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { useScrollMonitor } from 'hooks/useScrollMonitor'\nimport { focusFirstFocusable, focusLastFocusable } from 'shared/utils/dom'\nimport { keyboardKeys } from 'shared/constants'\nimport type { Nullable } from 'shared/types'\nimport { FormInput } from 'components/FormInput'\nimport { FormInputLabel } from 'components/FormInputLabel'\nimport { MenuList } from 'components/MenuList'\nimport { MenuDivider } from 'components/MenuDivider'\nimport { ListItem } from 'components/ListItem'\nimport { InputCheckbox } from 'components/InputCheckbox'\nimport { Chip } from 'components/Chip'\nimport { IconButton } from 'components/IconButton'\nimport type { IconProps } from 'components/Icon'\nimport { DropdownMenu } from './DropdownMenu'\nimport { SIZES, SIZES_CHECKBOX, SIZES_ICON, FuseSearchKeys } from './constants'\nimport { getDropdownInputText, getDropdownSelectedOption, groupDropdownOptions } from './utils'\nimport * as Styled from './style'\nimport type { DropdownProps, DropdownOption } from './types'\n\nconst COMPONENT_NAME = 'Dropdown'\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<div\\> элемента.\n *\n * Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n *\n * Поддерживаются пропсы определения размеров и внешних отступов в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/Dropdown/types.ts).\n */\nconst Dropdown: React.ForwardRefExoticComponent<DropdownProps> = withMergedProps<DropdownProps, HTMLDivElement>(\n forwardRef((props, ref) => {\n const {\n size = 'm',\n name = 'fox-dropdown',\n labelPosition = 'dynamic',\n searchable = true,\n primary = true,\n optionsMultiToggle = true,\n loading = false,\n iconProps = {},\n menuProps = {},\n loadingIconProps = {},\n optionsEmptyIconProps = {},\n autoFocus,\n disableAutoScrollToSelectedOption,\n closeMenuOnScroll,\n scrollMonitorTarget,\n contrast,\n selectedOption,\n defaultSelectedOption,\n icon,\n inputMode,\n loadingMessage,\n loadingIcon,\n maxLength,\n multiple,\n clearable,\n onCloseMenu,\n onOpenMenu,\n onSelectOption,\n options,\n groupSelectedOptions,\n optionsMultiToggleCaption,\n optionsEmptyMessage,\n optionsEmptyIcon,\n palette,\n placeholder,\n readOnly,\n required,\n status,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n form,\n ...rootProps\n } = props\n\n const sizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const iconBaseProps: IconProps = {\n sizes: SIZES_ICON,\n color: rootProps.disabled ? 'content-disabled' : 'content-onmain-tertiary',\n }\n\n const formInputLabelId = useMemo(() => rootProps.id ?? `${name}-${nanoid()}`, [name, rootProps.id])\n const inputLabelId = useMemo(() => nanoid(), [])\n const menuListId = useMemo(() => nanoid(), [])\n\n const getRelevantOptions = useMemo(() => {\n const fuse = new Fuse<DropdownOption>(options, {\n threshold: 0.4,\n ignoreLocation: true,\n keys: [FuseSearchKeys.text, FuseSearchKeys.label, FuseSearchKeys.tags],\n })\n\n return (pattern: string): DropdownOption[] =>\n pattern.length === 0 ? options : fuse.search(pattern).map((result) => result.item)\n }, [options])\n\n const [dropdownSelectedOption, setDropdownSelectedOption] = useState<DropdownOption[]>(() =>\n getDropdownSelectedOption(selectedOption !== undefined ? selectedOption : defaultSelectedOption, multiple)\n )\n\n const [inputText, setInputText] = useState<string>(() => getDropdownInputText(dropdownSelectedOption, multiple))\n\n const [focusWithin, setFocusWithin] = useState<boolean>(false)\n\n const [menuRelevantOptions, setMenuRelevantOptions] = useState<DropdownOption[]>(() =>\n getRelevantOptions(inputText)\n )\n\n const [menuOpenRequest, setMenuOpenRequest] = useState<boolean>(false)\n\n const menuOptionsGroups: ReturnType<typeof groupDropdownOptions> = multiple\n ? groupDropdownOptions(options, dropdownSelectedOption)\n : [[], []]\n\n const menuOpen = menuOpenRequest && !rootProps.disabled\n\n const inputSynced = inputText === getDropdownInputText(dropdownSelectedOption)\n const inputRequired = required && dropdownSelectedOption.length === 0\n const inputActive = Boolean(menuOpen || inputText || focusWithin)\n\n const multiToggleChecked = menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length === 0\n const multiToggleIndeterminate = menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length > 0\n\n const inputRef = useRef<HTMLInputElement>(null)\n const [menuRef, setMenuRef] = useState<Nullable<HTMLElement>>(null)\n const menuListRef = useRef<HTMLUListElement>(null)\n const selectedOptionRef = useRef<HTMLElement>(null)\n\n const timeoutIdRef = useRef<Nullable<ReturnType<typeof setTimeout>>>(null)\n\n const inputTextPrevRef = useRef<string>(inputText)\n const menuOpenPrevRef = useRef<boolean>(menuOpen)\n\n useScrollMonitor({\n target: scrollMonitorTarget,\n onScrollStart: () => {\n if (closeMenuOnScroll && menuOpen) {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n },\n })\n\n useEffect(() => {\n if (inputText === inputTextPrevRef.current) {\n setMenuRelevantOptions(getRelevantOptions(inputText))\n } else {\n inputTextPrevRef.current = inputText\n timeoutIdRef.current = setTimeout(() => {\n setMenuRelevantOptions(getRelevantOptions(inputText))\n }, 150)\n }\n\n return () => {\n if (timeoutIdRef.current) {\n clearTimeout(timeoutIdRef.current)\n }\n }\n }, [getRelevantOptions, inputText])\n\n useLayoutEffect(() => {\n if (selectedOption === undefined) return\n\n if (!multiple && !menuOpen) {\n setInputText(getDropdownInputText(selectedOption))\n }\n setDropdownSelectedOption(getDropdownSelectedOption(selectedOption, multiple))\n }, [multiple, selectedOption, menuOpen])\n\n useEffect(() => {\n if (menuOpen === menuOpenPrevRef.current) return\n\n if (menuOpen && onOpenMenu) onOpenMenu()\n if (!menuOpen && onCloseMenu) onCloseMenu()\n\n menuOpenPrevRef.current = menuOpen\n }, [menuOpen, onCloseMenu, onOpenMenu])\n\n useEffect(() => {\n if (!multiple && !disableAutoScrollToSelectedOption && menuOpen && menuRef && selectedOptionRef.current) {\n const menuRect = menuRef.getBoundingClientRect()\n const selectedOptionRect = selectedOptionRef.current.getBoundingClientRect()\n\n if (selectedOptionRect.top < menuRect.top || selectedOptionRect.bottom > menuRect.bottom) {\n setTimeout(() => {\n if (menuRef && selectedOptionRef.current) {\n menuRef.scrollTo(0, selectedOptionRef.current.offsetTop)\n }\n }, 0)\n }\n }\n }, [multiple, disableAutoScrollToSelectedOption, menuOpen, menuRef])\n\n return (\n <FormInputLabel\n {...rootProps}\n {...sizeProps}\n ref={ref}\n id={formInputLabelId}\n labelId={inputLabelId}\n labelPosition={labelPosition}\n active={inputActive}\n onColored={contrast}\n primary={primary}\n error={status === 'error'}\n success={status === 'success'}\n focus={focusWithin}\n icon={[icon, <Styled.ChevronIcon key='chevron' up={menuOpen} />]}\n iconProps={{\n ...sizeProps,\n ...iconBaseProps,\n ...iconProps,\n }}\n palette={{\n color: rootProps.disabled ? palette.labelColorDisabled : palette.labelColor,\n backgroundColor: rootProps.disabled ? palette.backgroundColorDisabled : palette.backgroundColor,\n backgroundColorHover: rootProps.disabled ? palette.backgroundColorDisabled : palette.backgroundColorHover,\n borderColor: rootProps.disabled ? palette.borderColorDisabled : palette.borderColor,\n }}\n onClick={(evt) => {\n if (rootProps.onClick) rootProps.onClick(evt)\n\n if (rootProps.disabled) return\n\n inputRef.current?.focus()\n\n if (!menuOpen) {\n setMenuOpenRequest(true)\n\n if (searchable && !multiple && inputSynced) {\n setInputText('')\n setMenuRelevantOptions(getRelevantOptions(''))\n }\n } else if (menuRef && evt.target instanceof Node && !menuRef.contains(evt.target)) {\n setMenuOpenRequest(false)\n }\n }}\n onPointerDown={(evt) => {\n if (rootProps.onPointerDown) rootProps.onPointerDown(evt)\n\n if (\n evt.target !== inputRef.current &&\n evt.target instanceof Node &&\n (evt.currentTarget.contains(evt.target) ||\n (menuProps.renderInPortal && menuOpen && menuRef && menuRef.contains(evt.target)))\n ) {\n evt.preventDefault()\n }\n }}\n onFocus={(evt) => {\n if (rootProps.onFocus) rootProps.onFocus(evt)\n\n setFocusWithin(true)\n\n if (\n inputRef.current &&\n evt.target === inputRef.current &&\n searchable &&\n !multiple &&\n inputSynced &&\n !menuOpen\n ) {\n setInputText('')\n setMenuRelevantOptions(getRelevantOptions(''))\n }\n }}\n onBlur={(evt) => {\n if (rootProps.onBlur) rootProps.onBlur(evt)\n\n if (\n evt.currentTarget.contains(evt.relatedTarget) ||\n (menuProps.renderInPortal && menuOpen && menuRef && menuRef.contains(evt.relatedTarget))\n ) {\n return\n }\n\n setFocusWithin(false)\n setInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }}\n input={\n <>\n {inputRequired && !searchable && !readOnly && (\n <Styled.InputMimic\n required\n type='text'\n inputMode='none'\n form={form}\n tabIndex={-1}\n onFocus={() => {\n inputRef.current?.focus()\n }}\n />\n )}\n <FormInput\n ref={inputRef}\n role='combobox'\n aria-controls={menuListId}\n aria-expanded={menuOpen}\n aria-labelledby={rootProps.label ? inputLabelId : undefined}\n type='text'\n autoComplete='off'\n autoCapitalize='off'\n autoCorrect='off'\n spellCheck='false'\n form={form}\n autoFocus={autoFocus}\n inputMode={searchable ? inputMode : 'none'}\n maxLength={maxLength}\n placeholder={placeholder}\n readOnly={readOnly || !searchable}\n required={inputRequired}\n disabled={rootProps.disabled}\n value={inputText}\n palette={{\n color: palette.color,\n colorDisabled: palette.colorDisabled,\n placeholderColor: palette.placeholderColor,\n placeholderColorDisabled: palette.placeholderColorDisabled,\n }}\n onClick={(evt) => {\n if (menuOpen && evt.currentTarget.selectionStart !== evt.currentTarget.selectionEnd) {\n evt.stopPropagation()\n }\n }}\n onChange={(evt) => {\n setInputText(evt.currentTarget.value)\n setMenuOpenRequest(true)\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.Enter.validate(evt.key)) {\n setInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Space.validate(evt.key) && (!menuOpen || evt.currentTarget.selectionStart === 0)) {\n evt.preventDefault()\n\n if (searchable && !multiple && inputSynced && !menuOpen) {\n setInputText('')\n setMenuRelevantOptions(getRelevantOptions(''))\n }\n\n setMenuOpenRequest((prev) => !prev)\n }\n\n if (keyboardKeys.Esc.validate(evt.key)) {\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Tab.validate(evt.key) && menuOpen) {\n evt.preventDefault()\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.ArrowDown.validate(evt.key) && menuOpen && menuListRef.current) {\n evt.preventDefault()\n\n if (!multiple && selectedOptionRef.current) {\n const menuItems = [...menuListRef.current.children]\n\n const idx = menuItems.findIndex((item) => item.contains(selectedOptionRef.current as Node))\n\n const focusTarget = menuItems[idx + 1] ?? menuItems[0]\n\n if (focusTarget instanceof HTMLElement) {\n focusFirstFocusable(focusTarget)\n }\n } else {\n focusFirstFocusable(menuListRef.current)\n }\n }\n\n if (keyboardKeys.ArrowUp.validate(evt.key) && menuOpen && menuListRef.current) {\n evt.preventDefault()\n\n if (!multiple && selectedOptionRef.current) {\n const menuItems = [...menuListRef.current.children]\n\n const idx = menuItems.findIndex((item) => item.contains(selectedOptionRef.current as Node))\n\n const focusTarget = menuItems[idx - 1] ?? menuItems[menuItems.length - 1]\n\n if (focusTarget instanceof HTMLElement) {\n focusFirstFocusable(focusTarget)\n }\n } else {\n focusLastFocusable(menuListRef.current)\n }\n }\n }}\n />\n {dropdownSelectedOption.map((item) => (\n <input\n key={item.value}\n type='hidden'\n name={name}\n value={item.value}\n form={form}\n disabled={rootProps.disabled}\n />\n ))}\n </>\n }\n addon={\n <>\n {multiple && dropdownSelectedOption.length > 0 && (\n <Chip\n size='xs'\n active\n black\n marginLeft={12}\n disabled={rootProps.disabled}\n cursor={rootProps.disabled ? 'not-allowed' : undefined}\n text={dropdownSelectedOption.length}\n textProps={{\n appearance: 'caption',\n size: 'xs',\n }}\n palette={\n rootProps.disabled\n ? {\n color: 'content-disabled',\n colorHover: 'content-disabled',\n backgroundColor: 'bg-disabled-small',\n backgroundColorHover: 'bg-disabled-small',\n }\n : undefined\n }\n onPointerDown={(evt) => {\n evt.preventDefault()\n }}\n discardButtonProps={{\n square: true,\n contrast: !rootProps.disabled,\n onClick: (evt) => {\n evt.stopPropagation()\n\n if (!readOnly) {\n if (selectedOption === undefined) {\n setDropdownSelectedOption([])\n }\n\n if (onSelectOption) onSelectOption(multiple ? [] : null)\n\n inputRef.current?.focus()\n setMenuOpenRequest(true)\n }\n },\n }}\n />\n )}\n {!multiple && clearable && dropdownSelectedOption.length > 0 && (\n <IconButton\n icon='close'\n size='l'\n square\n marginLeft={12}\n disabled={rootProps.disabled}\n onClick={(evt) => {\n evt.stopPropagation()\n\n if (!readOnly) {\n if (inputSynced) {\n setInputText('')\n setMenuRelevantOptions(getRelevantOptions(''))\n }\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption([])\n }\n\n if (onSelectOption) onSelectOption(multiple ? [] : null)\n\n inputRef.current?.focus()\n setMenuOpenRequest(true)\n }\n }}\n />\n )}\n </>\n }\n dropdown={\n <DropdownMenu\n {...menuProps}\n setRef={setMenuRef}\n open={menuOpen}\n popperReferenceId={formInputLabelId}\n secondary={!contrast}\n elevated={contrast}\n disableAutoFocus\n palette={{\n backgroundColor: palette.menuBackgroundColor,\n borderColor: palette.menuBorderColor,\n }}\n empty={menuRelevantOptions.length === 0}\n loading={loading}\n loadingMessage={loadingMessage}\n loadingIcon={loadingIcon}\n loadingIconProps={{\n ...sizeProps,\n ...iconBaseProps,\n ...loadingIconProps,\n }}\n emptyMessage={optionsEmptyMessage}\n emptyIcon={optionsEmptyIcon}\n emptyIconProps={{\n ...sizeProps,\n ...iconBaseProps,\n ...optionsEmptyIconProps,\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.Tab.validate(evt.key)) {\n evt.preventDefault()\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Enter.validate(evt.key)) {\n inputRef.current?.focus()\n setInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Esc.validate(evt.key)) {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Backspace.validate(evt.key) && !readOnly && (multiple || (!multiple && clearable))) {\n if (selectedOption === undefined) {\n setDropdownSelectedOption([])\n }\n\n if (onSelectOption) onSelectOption(multiple ? [] : null)\n }\n }}\n >\n {multiple ? (\n <MenuList\n ref={menuListRef}\n id={menuListId}\n role='listbox'\n aria-labelledby={rootProps.label ? inputLabelId : undefined}\n aria-multiselectable\n >\n {inputText.length === 0 ? (\n <>\n {optionsMultiToggle && (\n <ListItem\n {...sizeProps}\n text={optionsMultiToggleCaption}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n name={name}\n checked={multiToggleChecked}\n indeterminate={multiToggleIndeterminate}\n error={(multiToggleChecked || multiToggleIndeterminate) && status === 'error'}\n success={(multiToggleChecked || multiToggleIndeterminate) && status === 'success'}\n onChange={() => {\n if (!readOnly) {\n const update = multiToggleChecked || multiToggleIndeterminate ? [] : [...options]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )}\n {optionsMultiToggle && <MenuDivider />}\n {groupSelectedOptions &&\n menuOptionsGroups[0].map((option) => {\n const optionStatus = option.status ?? status\n const optionErrorStatus = optionStatus === 'error'\n const optionSuccessStatus = optionStatus === 'success'\n\n return (\n <ListItem\n {...sizeProps}\n key={option.value}\n active\n text={option.text}\n danger={optionErrorStatus}\n success={optionSuccessStatus}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n inputRef.current?.focus()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected\n name={name}\n value={option.value}\n checked\n error={optionErrorStatus}\n success={optionSuccessStatus}\n onChange={(evt) => {\n if (!readOnly) {\n const update = dropdownSelectedOption.filter(\n (item) => item.value !== evt.currentTarget.value\n )\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )\n })}\n {groupSelectedOptions && menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length > 0 && (\n <MenuDivider />\n )}\n {groupSelectedOptions &&\n menuOptionsGroups[1].map((option) => (\n <ListItem\n {...sizeProps}\n key={option.value}\n text={option.text}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n inputRef.current?.focus()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected={false}\n name={name}\n value={option.value}\n checked={false}\n onChange={() => {\n if (!readOnly) {\n const update = [...dropdownSelectedOption, option]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n ))}\n {!groupSelectedOptions &&\n options.map((option) => {\n const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n const optionStatus = option.status ?? status\n const optionErrorStatus = selected && optionStatus === 'error'\n const optionSuccessStatus = selected && optionStatus === 'success'\n\n return (\n <ListItem\n {...sizeProps}\n key={option.value}\n text={option.text}\n danger={optionErrorStatus}\n success={optionSuccessStatus}\n disabled={rootProps.disabled}\n active={selected}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected={selected}\n name={name}\n value={option.value}\n checked={selected}\n error={optionErrorStatus}\n success={optionSuccessStatus}\n onChange={(evt) => {\n if (!readOnly) {\n const update = selected\n ? dropdownSelectedOption.filter((item) => item.value !== evt.currentTarget.value)\n : [...dropdownSelectedOption, option]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )\n })}\n </>\n ) : (\n <>\n {menuRelevantOptions.map((option) => {\n const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n const optionStatus = option.status ?? status\n const optionErrorStatus = selected && optionStatus === 'error'\n const optionSuccessStatus = selected && optionStatus === 'success'\n\n return (\n <ListItem\n {...sizeProps}\n key={option.value}\n text={option.text}\n danger={optionErrorStatus}\n success={optionSuccessStatus}\n disabled={rootProps.disabled}\n active={selected}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected={selected}\n name={name}\n value={option.value}\n checked={selected}\n error={optionErrorStatus}\n success={optionSuccessStatus}\n onChange={(evt) => {\n if (!readOnly) {\n const update = selected\n ? dropdownSelectedOption.filter((item) => item.value !== evt.currentTarget.value)\n : [...dropdownSelectedOption, option]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )\n })}\n </>\n )}\n </MenuList>\n ) : (\n <MenuList\n ref={menuListRef}\n id={menuListId}\n role='listbox'\n aria-labelledby={rootProps.label ? inputLabelId : undefined}\n >\n {(searchable ? menuRelevantOptions : options).map((option) => {\n const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n return (\n <ListItem\n {...sizeProps}\n role='option'\n aria-selected={selected}\n ref={selected ? selectedOptionRef : undefined}\n key={option.value}\n text={option.text}\n active={selected}\n danger={selected && status === 'error'}\n success={selected && status === 'success'}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n\n if (!readOnly) {\n const update = { ...option }\n\n if (selectedOption === undefined) {\n setInputText(getDropdownInputText(update))\n setDropdownSelectedOption(getDropdownSelectedOption(update))\n }\n\n if (onSelectOption) onSelectOption(update)\n\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n }}\n />\n )\n })}\n </MenuList>\n )}\n </DropdownMenu>\n }\n />\n )\n }),\n {\n sizes: SIZES,\n displayName: COMPONENT_NAME,\n }\n)\n\nexport { Dropdown, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","Dropdown","withMergedProps","forwardRef","props","ref","size","name","labelPosition","searchable","primary","optionsMultiToggle","loading","iconProps","menuProps","loadingIconProps","optionsEmptyIconProps","autoFocus","disableAutoScrollToSelectedOption","closeMenuOnScroll","scrollMonitorTarget","contrast","selectedOption","defaultSelectedOption","icon","inputMode","loadingMessage","loadingIcon","maxLength","multiple","clearable","onCloseMenu","onOpenMenu","onSelectOption","options","groupSelectedOptions","optionsMultiToggleCaption","optionsEmptyMessage","optionsEmptyIcon","palette","placeholder","readOnly","required","status","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","form","rootProps","sizeProps","iconBaseProps","sizes","SIZES_ICON","color","disabled","formInputLabelId","useMemo","id","nanoid","inputLabelId","menuListId","getRelevantOptions","fuse","Fuse","threshold","ignoreLocation","keys","FuseSearchKeys","text","label","tags","pattern","length","search","map","result","item","dropdownSelectedOption","setDropdownSelectedOption","useState","getDropdownSelectedOption","undefined","inputText","setInputText","getDropdownInputText","focusWithin","setFocusWithin","menuRelevantOptions","setMenuRelevantOptions","menuOpenRequest","setMenuOpenRequest","menuOptionsGroups","groupDropdownOptions","menuOpen","inputSynced","inputRequired","inputActive","Boolean","multiToggleChecked","multiToggleIndeterminate","inputRef","useRef","menuRef","setMenuRef","menuListRef","selectedOptionRef","timeoutIdRef","inputTextPrevRef","menuOpenPrevRef","useScrollMonitor","target","onScrollStart","current","focus","useEffect","setTimeout","clearTimeout","useLayoutEffect","menuRect","getBoundingClientRect","selectedOptionRect","top","bottom","scrollTo","offsetTop","_jsx","FormInputLabel","labelId","active","onColored","error","success","Styled","up","labelColorDisabled","labelColor","backgroundColor","backgroundColorDisabled","backgroundColorHover","borderColor","borderColorDisabled","onClick","evt","Node","contains","onPointerDown","currentTarget","renderInPortal","preventDefault","onFocus","onBlur","relatedTarget","input","_jsxs","_Fragment","children","type","tabIndex","FormInput","role","autoComplete","autoCapitalize","autoCorrect","spellCheck","value","colorDisabled","placeholderColor","placeholderColorDisabled","selectionStart","selectionEnd","stopPropagation","onChange","onKeyDown","keyboardKeys","Enter","validate","key","Space","prev","Esc","Tab","ArrowDown","menuItems","idx","findIndex","focusTarget","HTMLElement","focusFirstFocusable","ArrowUp","focusLastFocusable","addon","Chip","black","marginLeft","cursor","textProps","appearance","colorHover","discardButtonProps","square","IconButton","dropdown","DropdownMenu","setRef","open","popperReferenceId","secondary","elevated","disableAutoFocus","menuBackgroundColor","menuBorderColor","empty","emptyMessage","emptyIcon","emptyIconProps","Backspace","MenuList","ListItem","borderRadius","ellipsis","wordBreak","control","InputCheckbox","SIZES_CHECKBOX","checked","indeterminate","update","MenuDivider","option","optionStatus","optionErrorStatus","optionSuccessStatus","_createElement","danger","filter","selected","SIZES","displayName"],"mappings":"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"}
1
+ {"version":3,"file":"Dropdown.mjs","sources":["../../../../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["import { forwardRef, useState, useRef, useEffect, useLayoutEffect, useMemo, useCallback } from 'react'\nimport { nanoid } from 'nanoid'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { useScrollMonitor } from 'hooks/useScrollMonitor'\nimport { focusFirstFocusable, focusLastFocusable } from 'shared/utils/dom'\nimport { createDebouncedCallback } from 'shared/utils/misc'\nimport { keyboardKeys } from 'shared/constants'\nimport type { Nullable } from 'shared/types'\nimport { FormInput } from 'components/FormInput'\nimport { FormInputLabel } from 'components/FormInputLabel'\nimport { MenuList } from 'components/MenuList'\nimport { MenuDivider } from 'components/MenuDivider'\nimport { ListItem } from 'components/ListItem'\nimport { InputCheckbox } from 'components/InputCheckbox'\nimport { Chip } from 'components/Chip'\nimport { IconButton } from 'components/IconButton'\nimport type { IconProps } from 'components/Icon'\nimport { DropdownMenu } from './DropdownMenu'\nimport { useFilteredOptions, useLoadedOptions } from './hooks'\nimport { SIZES, SIZES_CHECKBOX, SIZES_ICON } from './constants'\nimport { getDropdownInputText, getDropdownSelectedOption, groupDropdownOptions } from './utils'\nimport * as Styled from './style'\nimport type { DropdownProps, DropdownOption } from './types'\n\nconst COMPONENT_NAME = 'Dropdown'\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<div\\> элемента.\n *\n * Можно передать \"ref\", который будет ассоциирован с рутовым элементом.\n *\n * Поддерживаются пропсы определения размеров и внешних отступов в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/Dropdown/types.ts).\n */\nconst Dropdown: React.ForwardRefExoticComponent<DropdownProps> = withMergedProps<DropdownProps, HTMLDivElement>(\n forwardRef((props, ref) => {\n const {\n size = 'm',\n name = 'fox-dropdown',\n labelPosition = 'dynamic',\n searchable = true,\n primary = true,\n optionsMultiToggle = true,\n iconProps = {},\n menuProps = {},\n loadingIconProps = {},\n optionsEmptyIconProps = {},\n loading,\n autoFocus,\n disableAutoScrollToSelectedOption,\n closeMenuOnScroll,\n scrollMonitorTarget,\n contrast,\n selectedOption,\n defaultSelectedOption,\n icon,\n inputMode,\n loadingMessage,\n loadingIcon,\n maxLength,\n multiple,\n clearable,\n onChangeInput,\n onCloseMenu,\n onOpenMenu,\n onSelectOption,\n options,\n loadOptions,\n groupSelectedOptions,\n optionsMultiToggleCaption,\n optionsEmptyMessage,\n optionsEmptyIcon,\n palette,\n placeholder,\n readOnly,\n required,\n status,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n form,\n ...rootProps\n } = props\n\n const sizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const iconBaseProps: IconProps = {\n sizes: SIZES_ICON,\n color: rootProps.disabled ? 'content-disabled' : 'content-onmain-tertiary',\n }\n\n const formInputLabelId = useMemo(() => rootProps.id ?? `${name}-${nanoid()}`, [name, rootProps.id])\n const inputLabelId = useMemo(() => nanoid(), [])\n const menuListId = useMemo(() => nanoid(), [])\n\n const [filteredOptions, getFilteredOptions] = useFilteredOptions({\n options,\n })\n\n const [loadedOptions, optionsLoading, getLoadedOptions] = useLoadedOptions({\n loadOptions,\n options,\n })\n\n const [dropdownSelectedOption, setDropdownSelectedOption] = useState<DropdownOption[]>(() =>\n getDropdownSelectedOption(selectedOption !== undefined ? selectedOption : defaultSelectedOption, multiple)\n )\n\n const [inputText, setInputText] = useState<string>(() => getDropdownInputText(dropdownSelectedOption, multiple))\n\n const [focusWithin, setFocusWithin] = useState<boolean>(false)\n\n const [menuOpenRequest, setMenuOpenRequest] = useState<boolean>(false)\n\n const menuOptions: DropdownOption[] = loadOptions ? loadedOptions : filteredOptions\n const menuOptionsLoading = loadOptions ? loading ?? optionsLoading : loading\n\n const menuOptionsGroups: ReturnType<typeof groupDropdownOptions> = useMemo(\n () => (multiple ? groupDropdownOptions(menuOptions, dropdownSelectedOption) : [[], []]),\n [multiple, menuOptions, dropdownSelectedOption]\n )\n\n const menuOpen = menuOpenRequest && !rootProps.disabled\n\n const inputRequired = required && dropdownSelectedOption.length === 0\n const inputActive = Boolean(menuOpen || inputText || focusWithin)\n\n const multiToggleChecked = menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length === 0\n const multiToggleIndeterminate = menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length > 0\n\n const inputRef = useRef<HTMLInputElement>(null)\n const [menuRef, setMenuRef] = useState<Nullable<HTMLElement>>(null)\n const menuListRef = useRef<HTMLUListElement>(null)\n const selectedOptionRef = useRef<HTMLElement>(null)\n const menuOpenPrevRef = useRef<boolean>(menuOpen)\n\n const updateInputText = useCallback(\n (inputTextValue: string) => {\n setInputText(inputTextValue)\n\n if (onChangeInput) {\n onChangeInput(inputTextValue)\n }\n },\n [onChangeInput]\n )\n\n const updateOptions = useCallback(\n (inputTextValue: string) => {\n if (loadOptions) {\n getLoadedOptions(inputTextValue)\n } else {\n getFilteredOptions(inputTextValue)\n }\n },\n [loadOptions, getLoadedOptions, getFilteredOptions]\n )\n\n const updateOptionsDebounced = useMemo(() => {\n return createDebouncedCallback(updateOptions, 150)\n }, [updateOptions])\n\n useScrollMonitor({\n target: scrollMonitorTarget,\n onScrollStart: () => {\n if (closeMenuOnScroll && menuOpen) {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n },\n })\n\n useLayoutEffect(() => {\n if (selectedOption === undefined) return\n\n if (!multiple && !menuOpen) {\n updateInputText(getDropdownInputText(selectedOption))\n }\n setDropdownSelectedOption(getDropdownSelectedOption(selectedOption, multiple))\n }, [multiple, selectedOption, menuOpen, updateInputText])\n\n useEffect(() => {\n if (menuOpen === menuOpenPrevRef.current) return\n\n if (menuOpen && onOpenMenu) onOpenMenu()\n if (!menuOpen && onCloseMenu) onCloseMenu()\n\n menuOpenPrevRef.current = menuOpen\n }, [menuOpen, onCloseMenu, onOpenMenu])\n\n useEffect(() => {\n if (\n !multiple &&\n !disableAutoScrollToSelectedOption &&\n menuOpen &&\n !menuOptionsLoading &&\n inputText.length === 0 &&\n menuRef &&\n selectedOptionRef.current\n ) {\n const menuRect = menuRef.getBoundingClientRect()\n const selectedOptionRect = selectedOptionRef.current.getBoundingClientRect()\n\n if (selectedOptionRect.top < menuRect.top || selectedOptionRect.bottom > menuRect.bottom) {\n setTimeout(() => {\n if (menuRef && selectedOptionRef.current) {\n menuRef.scrollTo(0, selectedOptionRef.current.offsetTop)\n }\n }, 0)\n }\n }\n }, [multiple, disableAutoScrollToSelectedOption, menuOpen, menuOptionsLoading, inputText, menuRef])\n\n return (\n <FormInputLabel\n {...rootProps}\n {...sizeProps}\n ref={ref}\n id={formInputLabelId}\n labelId={inputLabelId}\n labelPosition={labelPosition}\n active={inputActive}\n onColored={contrast}\n primary={primary}\n error={status === 'error'}\n success={status === 'success'}\n focus={focusWithin}\n icon={[icon, <Styled.ChevronIcon key='chevron' up={menuOpen} />]}\n iconProps={{\n ...sizeProps,\n ...iconBaseProps,\n ...iconProps,\n }}\n palette={{\n color: rootProps.disabled ? palette.labelColorDisabled : palette.labelColor,\n backgroundColor: rootProps.disabled ? palette.backgroundColorDisabled : palette.backgroundColor,\n backgroundColorHover: rootProps.disabled ? palette.backgroundColorDisabled : palette.backgroundColorHover,\n borderColor: rootProps.disabled ? palette.borderColorDisabled : palette.borderColor,\n }}\n onClick={(evt) => {\n if (rootProps.onClick) rootProps.onClick(evt)\n\n if (rootProps.disabled) return\n\n inputRef.current?.focus()\n\n if (!menuOpen) {\n setMenuOpenRequest(true)\n\n updateOptions('')\n if (searchable) {\n updateInputText('')\n }\n } else if (menuRef && evt.target instanceof Node && !menuRef.contains(evt.target)) {\n setMenuOpenRequest(false)\n updateInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n }\n }}\n onPointerDown={(evt) => {\n if (rootProps.onPointerDown) rootProps.onPointerDown(evt)\n\n if (\n evt.target !== inputRef.current &&\n evt.target instanceof Node &&\n (evt.currentTarget.contains(evt.target) ||\n (menuProps.renderInPortal && menuOpen && menuRef && menuRef.contains(evt.target)))\n ) {\n evt.preventDefault()\n }\n }}\n onFocus={(evt) => {\n if (rootProps.onFocus) rootProps.onFocus(evt)\n\n setFocusWithin(true)\n\n if (inputRef.current && evt.target === inputRef.current && searchable && !multiple && !menuOpen) {\n updateInputText('')\n }\n }}\n onBlur={(evt) => {\n if (rootProps.onBlur) rootProps.onBlur(evt)\n\n if (\n evt.currentTarget.contains(evt.relatedTarget) ||\n (menuProps.renderInPortal && menuOpen && menuRef && menuRef.contains(evt.relatedTarget))\n ) {\n return\n }\n\n setFocusWithin(false)\n updateInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }}\n input={\n <>\n {inputRequired && !searchable && !readOnly && (\n <Styled.InputMimic\n required\n type='text'\n inputMode='none'\n form={form}\n tabIndex={-1}\n onFocus={() => {\n inputRef.current?.focus()\n }}\n />\n )}\n <FormInput\n ref={inputRef}\n role='combobox'\n aria-controls={menuListId}\n aria-expanded={menuOpen}\n aria-labelledby={rootProps.label ? inputLabelId : undefined}\n type='text'\n autoComplete='off'\n autoCapitalize='off'\n autoCorrect='off'\n spellCheck='false'\n form={form}\n autoFocus={autoFocus}\n inputMode={searchable ? inputMode : 'none'}\n maxLength={maxLength}\n placeholder={placeholder}\n readOnly={readOnly || !searchable}\n required={inputRequired}\n disabled={rootProps.disabled}\n value={inputText}\n palette={{\n color: palette.color,\n colorDisabled: palette.colorDisabled,\n placeholderColor: palette.placeholderColor,\n placeholderColorDisabled: palette.placeholderColorDisabled,\n }}\n onClick={(evt) => {\n if (menuOpen && evt.currentTarget.selectionStart !== evt.currentTarget.selectionEnd) {\n evt.stopPropagation()\n }\n }}\n onChange={(evt) => {\n const inputValue = evt.currentTarget.value\n\n updateInputText(inputValue)\n updateOptionsDebounced(inputValue)\n setMenuOpenRequest(true)\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.Enter.validate(evt.key)) {\n updateInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Space.validate(evt.key) && (!menuOpen || evt.currentTarget.selectionStart === 0)) {\n evt.preventDefault()\n\n if (!menuOpen) {\n updateOptions('')\n if (searchable) {\n updateInputText('')\n }\n }\n\n setMenuOpenRequest((prev) => !prev)\n }\n\n if (keyboardKeys.Esc.validate(evt.key)) {\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Tab.validate(evt.key) && menuOpen) {\n evt.preventDefault()\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.ArrowDown.validate(evt.key) && menuOpen && menuListRef.current) {\n evt.preventDefault()\n\n if (!multiple && selectedOptionRef.current) {\n const menuItems = [...menuListRef.current.children]\n\n const idx = menuItems.findIndex((item) => item.contains(selectedOptionRef.current as Node))\n\n const focusTarget = menuItems[idx + 1] ?? menuItems[0]\n\n if (focusTarget instanceof HTMLElement) {\n focusFirstFocusable(focusTarget)\n }\n } else {\n focusFirstFocusable(menuListRef.current)\n }\n }\n\n if (keyboardKeys.ArrowUp.validate(evt.key) && menuOpen && menuListRef.current) {\n evt.preventDefault()\n\n if (!multiple && selectedOptionRef.current) {\n const menuItems = [...menuListRef.current.children]\n\n const idx = menuItems.findIndex((item) => item.contains(selectedOptionRef.current as Node))\n\n const focusTarget = menuItems[idx - 1] ?? menuItems[menuItems.length - 1]\n\n if (focusTarget instanceof HTMLElement) {\n focusFirstFocusable(focusTarget)\n }\n } else {\n focusLastFocusable(menuListRef.current)\n }\n }\n }}\n />\n {dropdownSelectedOption.map((item) => (\n <input\n key={item.value}\n type='hidden'\n name={name}\n value={item.value}\n form={form}\n disabled={rootProps.disabled}\n />\n ))}\n </>\n }\n addon={\n <>\n {multiple && dropdownSelectedOption.length > 0 && (\n <Chip\n size='xs'\n active\n black\n marginLeft={12}\n disabled={rootProps.disabled}\n cursor={rootProps.disabled ? 'not-allowed' : undefined}\n text={dropdownSelectedOption.length}\n textProps={{\n appearance: 'caption',\n size: 'xs',\n }}\n palette={\n rootProps.disabled\n ? {\n color: 'content-disabled',\n colorHover: 'content-disabled',\n backgroundColor: 'bg-disabled-small',\n backgroundColorHover: 'bg-disabled-small',\n }\n : undefined\n }\n onPointerDown={(evt) => {\n evt.preventDefault()\n }}\n discardButtonProps={{\n square: true,\n contrast: !rootProps.disabled,\n onClick: (evt) => {\n evt.stopPropagation()\n\n if (!readOnly) {\n if (selectedOption === undefined) {\n setDropdownSelectedOption([])\n }\n\n if (onSelectOption) onSelectOption([])\n\n inputRef.current?.focus()\n updateInputText('')\n updateOptions('')\n setMenuOpenRequest(true)\n }\n },\n }}\n />\n )}\n {!multiple && clearable && dropdownSelectedOption.length > 0 && (\n <IconButton\n icon='close'\n size='l'\n square\n marginLeft={12}\n disabled={rootProps.disabled}\n onClick={(evt) => {\n evt.stopPropagation()\n\n if (!readOnly) {\n if (selectedOption === undefined) {\n setDropdownSelectedOption([])\n }\n\n if (onSelectOption) onSelectOption(null)\n\n inputRef.current?.focus()\n updateInputText('')\n updateOptions('')\n setMenuOpenRequest(true)\n }\n }}\n />\n )}\n </>\n }\n dropdown={\n <DropdownMenu\n {...menuProps}\n setRef={setMenuRef}\n open={menuOpen}\n popperReferenceId={formInputLabelId}\n secondary={!contrast}\n elevated={contrast}\n disableAutoFocus\n palette={{\n backgroundColor: palette.menuBackgroundColor,\n borderColor: palette.menuBorderColor,\n }}\n empty={menuOptions.length === 0}\n loading={menuOptionsLoading}\n loadingMessage={loadingMessage}\n loadingIcon={loadingIcon}\n loadingIconProps={{\n ...sizeProps,\n ...iconBaseProps,\n ...loadingIconProps,\n }}\n emptyMessage={optionsEmptyMessage}\n emptyIcon={optionsEmptyIcon}\n emptyIconProps={{\n ...sizeProps,\n ...iconBaseProps,\n ...optionsEmptyIconProps,\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.Tab.validate(evt.key)) {\n evt.preventDefault()\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Enter.validate(evt.key)) {\n inputRef.current?.focus()\n updateInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Esc.validate(evt.key)) {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Backspace.validate(evt.key) && !readOnly && (multiple || (!multiple && clearable))) {\n if (selectedOption === undefined) {\n setDropdownSelectedOption([])\n }\n\n if (onSelectOption) onSelectOption(multiple ? [] : null)\n\n updateInputText('')\n updateOptions('')\n }\n }}\n >\n {multiple ? (\n <MenuList\n ref={menuListRef}\n id={menuListId}\n role='listbox'\n aria-labelledby={rootProps.label ? inputLabelId : undefined}\n aria-multiselectable\n >\n {inputText.length === 0 ? (\n <>\n {optionsMultiToggle && (\n <ListItem\n {...sizeProps}\n text={optionsMultiToggleCaption}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n name={name}\n checked={multiToggleChecked}\n indeterminate={multiToggleIndeterminate}\n error={(multiToggleChecked || multiToggleIndeterminate) && status === 'error'}\n success={(multiToggleChecked || multiToggleIndeterminate) && status === 'success'}\n onChange={() => {\n if (!readOnly) {\n const update = multiToggleChecked || multiToggleIndeterminate ? [] : [...menuOptions]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )}\n {optionsMultiToggle && <MenuDivider />}\n {groupSelectedOptions &&\n menuOptionsGroups[0].map((option) => {\n const optionStatus = option.status ?? status\n const optionErrorStatus = optionStatus === 'error'\n const optionSuccessStatus = optionStatus === 'success'\n\n return (\n <ListItem\n {...sizeProps}\n key={option.value}\n active\n text={option.text}\n danger={optionErrorStatus}\n success={optionSuccessStatus}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n inputRef.current?.focus()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected\n name={name}\n value={option.value}\n checked\n error={optionErrorStatus}\n success={optionSuccessStatus}\n onChange={(evt) => {\n if (!readOnly) {\n const update = dropdownSelectedOption.filter(\n (item) => item.value !== evt.currentTarget.value\n )\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )\n })}\n {groupSelectedOptions && menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length > 0 && (\n <MenuDivider />\n )}\n {groupSelectedOptions &&\n menuOptionsGroups[1].map((option) => (\n <ListItem\n {...sizeProps}\n key={option.value}\n text={option.text}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n inputRef.current?.focus()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected={false}\n name={name}\n value={option.value}\n checked={false}\n onChange={() => {\n if (!readOnly) {\n const update = [...dropdownSelectedOption, option]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n ))}\n {!groupSelectedOptions &&\n menuOptions.map((option) => {\n const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n const optionStatus = option.status ?? status\n const optionErrorStatus = selected && optionStatus === 'error'\n const optionSuccessStatus = selected && optionStatus === 'success'\n\n return (\n <ListItem\n {...sizeProps}\n key={option.value}\n text={option.text}\n danger={optionErrorStatus}\n success={optionSuccessStatus}\n disabled={rootProps.disabled}\n active={selected}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected={selected}\n name={name}\n value={option.value}\n checked={selected}\n error={optionErrorStatus}\n success={optionSuccessStatus}\n onChange={(evt) => {\n if (!readOnly) {\n const update = selected\n ? dropdownSelectedOption.filter((item) => item.value !== evt.currentTarget.value)\n : [...dropdownSelectedOption, option]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )\n })}\n </>\n ) : (\n <>\n {menuOptions.map((option) => {\n const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n const optionStatus = option.status ?? status\n const optionErrorStatus = selected && optionStatus === 'error'\n const optionSuccessStatus = selected && optionStatus === 'success'\n\n return (\n <ListItem\n {...sizeProps}\n key={option.value}\n text={option.text}\n danger={optionErrorStatus}\n success={optionSuccessStatus}\n disabled={rootProps.disabled}\n active={selected}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n role='option'\n aria-selected={selected}\n name={name}\n value={option.value}\n checked={selected}\n error={optionErrorStatus}\n success={optionSuccessStatus}\n onChange={(evt) => {\n if (!readOnly) {\n const update = selected\n ? dropdownSelectedOption.filter((item) => item.value !== evt.currentTarget.value)\n : [...dropdownSelectedOption, option]\n\n if (selectedOption === undefined) {\n setDropdownSelectedOption(update)\n }\n\n if (onSelectOption) onSelectOption(update)\n }\n }}\n />\n }\n />\n )\n })}\n </>\n )}\n </MenuList>\n ) : (\n <MenuList\n ref={menuListRef}\n id={menuListId}\n role='listbox'\n aria-labelledby={rootProps.label ? inputLabelId : undefined}\n >\n {menuOptions.map((option) => {\n const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n return (\n <ListItem\n {...sizeProps}\n role='option'\n aria-selected={selected}\n ref={selected ? selectedOptionRef : undefined}\n key={option.value}\n text={option.text}\n active={selected}\n danger={selected && status === 'error'}\n success={selected && status === 'success'}\n disabled={rootProps.disabled}\n borderRadius={8}\n ellipsis={false}\n textProps={{ wordBreak: 'break-word' }}\n onClick={(evt) => {\n evt.stopPropagation()\n\n if (!readOnly) {\n const update = { ...option }\n\n if (selectedOption === undefined) {\n updateInputText(getDropdownInputText(update))\n setDropdownSelectedOption(getDropdownSelectedOption(update))\n }\n\n if (onSelectOption) onSelectOption(update)\n\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n }}\n />\n )\n })}\n </MenuList>\n )}\n </DropdownMenu>\n }\n />\n )\n }),\n {\n sizes: SIZES,\n displayName: COMPONENT_NAME,\n }\n)\n\nexport { Dropdown, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","Dropdown","withMergedProps","forwardRef","props","ref","size","name","labelPosition","searchable","primary","optionsMultiToggle","iconProps","menuProps","loadingIconProps","optionsEmptyIconProps","loading","autoFocus","disableAutoScrollToSelectedOption","closeMenuOnScroll","scrollMonitorTarget","contrast","selectedOption","defaultSelectedOption","icon","inputMode","loadingMessage","loadingIcon","maxLength","multiple","clearable","onChangeInput","onCloseMenu","onOpenMenu","onSelectOption","options","loadOptions","groupSelectedOptions","optionsMultiToggleCaption","optionsEmptyMessage","optionsEmptyIcon","palette","placeholder","readOnly","required","status","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","form","rootProps","sizeProps","iconBaseProps","sizes","SIZES_ICON","color","disabled","formInputLabelId","useMemo","id","nanoid","inputLabelId","menuListId","filteredOptions","getFilteredOptions","useFilteredOptions","loadedOptions","optionsLoading","getLoadedOptions","useLoadedOptions","dropdownSelectedOption","setDropdownSelectedOption","useState","getDropdownSelectedOption","undefined","inputText","setInputText","getDropdownInputText","focusWithin","setFocusWithin","menuOpenRequest","setMenuOpenRequest","menuOptions","menuOptionsLoading","menuOptionsGroups","groupDropdownOptions","menuOpen","inputRequired","length","inputActive","Boolean","multiToggleChecked","multiToggleIndeterminate","inputRef","useRef","menuRef","setMenuRef","menuListRef","selectedOptionRef","menuOpenPrevRef","updateInputText","useCallback","inputTextValue","updateOptions","updateOptionsDebounced","createDebouncedCallback","useScrollMonitor","target","onScrollStart","current","focus","useLayoutEffect","useEffect","menuRect","getBoundingClientRect","selectedOptionRect","top","bottom","setTimeout","scrollTo","offsetTop","_jsx","FormInputLabel","labelId","active","onColored","error","success","Styled","up","labelColorDisabled","labelColor","backgroundColor","backgroundColorDisabled","backgroundColorHover","borderColor","borderColorDisabled","onClick","evt","Node","contains","onPointerDown","currentTarget","renderInPortal","preventDefault","onFocus","onBlur","relatedTarget","input","_jsxs","_Fragment","children","type","tabIndex","FormInput","role","label","autoComplete","autoCapitalize","autoCorrect","spellCheck","value","colorDisabled","placeholderColor","placeholderColorDisabled","selectionStart","selectionEnd","stopPropagation","onChange","inputValue","onKeyDown","keyboardKeys","Enter","validate","key","Space","prev","Esc","Tab","ArrowDown","menuItems","idx","findIndex","item","focusTarget","HTMLElement","focusFirstFocusable","ArrowUp","focusLastFocusable","map","addon","Chip","black","marginLeft","cursor","text","textProps","appearance","colorHover","discardButtonProps","square","IconButton","dropdown","DropdownMenu","setRef","open","popperReferenceId","secondary","elevated","disableAutoFocus","menuBackgroundColor","menuBorderColor","empty","emptyMessage","emptyIcon","emptyIconProps","Backspace","MenuList","ListItem","borderRadius","ellipsis","wordBreak","control","InputCheckbox","SIZES_CHECKBOX","checked","indeterminate","update","MenuDivider","option","optionStatus","optionErrorStatus","optionSuccessStatus","_createElement","danger","filter","selected","SIZES","displayName"],"mappings":"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"}
@@ -0,0 +1,2 @@
1
+ 'use strict';var React=require('react');var Fuse=require('fuse.js');var useMountedStatus=require('../../hooks/useMountedStatus.js');var constants=require('./constants.js');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var Fuse__default=_interopDefault(Fuse);exports.useFilteredOptions=({options:e})=>{const[t,s]=React.useState((()=>Array.isArray(e)?e:[]));const r=React.useRef('');const u=React.useMemo((()=>{const t=new Fuse__default.default(e??[],{threshold:.4,ignoreLocation:!0,keys:[constants.FuseSearchKeys.text,constants.FuseSearchKeys.label,constants.FuseSearchKeys.tags]});return u=>{r.current=u,s(u.length>0?t.search(u).map((e=>e.item)):e??[])}}),[e]);return React.useEffect((()=>{u(r.current)}),[u]),[t,u]},exports.useLoadedOptions=({loadOptions:e,options:t})=>{const s=useMountedStatus.useMountedStatus();const[r,u]=React.useState((()=>Array.isArray(t)?t:[]));const[n,a]=React.useState(!1);const c=React.useRef(null);return[r,n,React.useCallback((r=>{if(e)if(r.length===0&&Array.isArray(t))c.current=null,u(t),a(!1);else{const t=c.current=e(r);a(!0),t.then((e=>{s()&&c.current===t&&(c.current=null,u(e),a(!1))})).catch((e=>{console.error(e),s()&&c.current===t&&(c.current=null,u([]),a(!1))}))}}),[e,t,s])]};
2
+ //# sourceMappingURL=hooks.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"hooks.js","sources":["../../../../src/components/Dropdown/hooks.ts"],"sourcesContent":["import { useState, useRef, useCallback, useMemo, useEffect } from 'react'\nimport Fuse from 'fuse.js'\nimport { useMountedStatus } from 'hooks/useMountedStatus'\nimport { FuseSearchKeys } from './constants'\nimport type { DropdownOption } from './types'\n\nexport const useFilteredOptions = ({\n options,\n}: {\n options?: DropdownOption[]\n}): [DropdownOption[], (pattern: string) => void] => {\n const [filteredOptions, setFilteredOptions] = useState<DropdownOption[]>(() =>\n Array.isArray(options) ? options : []\n )\n\n const search = useRef<string>('')\n\n const getFilteredOptions = useMemo(() => {\n const fuse = new Fuse<DropdownOption>(options ?? [], {\n threshold: 0.4,\n ignoreLocation: true,\n keys: [FuseSearchKeys.text, FuseSearchKeys.label, FuseSearchKeys.tags],\n })\n\n return (pattern: string) => {\n search.current = pattern\n setFilteredOptions(pattern.length > 0 ? fuse.search(pattern).map((result) => result.item) : options ?? [])\n }\n }, [options])\n\n useEffect(() => {\n getFilteredOptions(search.current)\n }, [getFilteredOptions])\n\n return [filteredOptions, getFilteredOptions]\n}\n\nexport const useLoadedOptions = ({\n loadOptions,\n options,\n}: {\n loadOptions?: (pattern: string) => Promise<DropdownOption[]>\n options?: DropdownOption[]\n}): [DropdownOption[], boolean, (pattern: string) => void] => {\n const getMountedStatus = useMountedStatus()\n\n const [loadedOptions, setLoadedOptions] = useState<DropdownOption[]>(() => (Array.isArray(options) ? options : []))\n const [optionsLoading, setOptionsLoading] = useState<boolean>(false)\n\n const optionsLoader = useRef<Promise<DropdownOption[]> | null>(null)\n\n const getLoadedOptions = useCallback(\n (pattern: string) => {\n if (!loadOptions) return\n\n if (pattern.length === 0 && Array.isArray(options)) {\n optionsLoader.current = null\n setLoadedOptions(options)\n setOptionsLoading(false)\n } else {\n const loader: Promise<DropdownOption[]> = (optionsLoader.current = loadOptions(pattern))\n\n setOptionsLoading(true)\n loader\n .then((payload) => {\n if (getMountedStatus() && optionsLoader.current === loader) {\n optionsLoader.current = null\n setLoadedOptions(payload)\n setOptionsLoading(false)\n }\n })\n .catch((err) => {\n // eslint-disable-next-line no-console\n console.error(err)\n if (getMountedStatus() && optionsLoader.current === loader) {\n optionsLoader.current = null\n setLoadedOptions([])\n setOptionsLoading(false)\n }\n })\n }\n },\n [loadOptions, options, getMountedStatus]\n )\n\n return [loadedOptions, optionsLoading, getLoadedOptions]\n}\n"],"names":["useFilteredOptions","options","filteredOptions","setFilteredOptions","useState","Array","isArray","search","useRef","getFilteredOptions","useMemo","fuse","Fuse","threshold","ignoreLocation","keys","FuseSearchKeys","text","label","tags","pattern","current","length","map","result","item","useEffect","useLoadedOptions","loadOptions","getMountedStatus","useMountedStatus","loadedOptions","setLoadedOptions","optionsLoading","setOptionsLoading","optionsLoader","useCallback","loader","then","payload","catch","err","console","error"],"mappings":"gTAMkCA,EAChCC,cAIA,MAAOC,EAAiBC,GAAsBC,gBAA2B,IACvEC,MAAMC,QAAQL,GAAWA,EAAU,KAGrC,MAAMM,EAASC,aAAe,IAE9B,MAAMC,EAAqBC,MAAAA,SAAQ,KACjC,MAAMC,EAAO,IAAIC,sBAAqBX,GAAW,GAAI,CACnDY,UAAW,GACXC,gBAAgB,EAChBC,KAAM,CAACC,UAAAA,eAAeC,KAAMD,UAAcA,eAACE,MAAOF,UAAcA,eAACG,QAGnE,OAAQC,IACNb,EAAOc,QAAUD,EACjBjB,EAAmBiB,EAAQE,OAAS,EAAIX,EAAKJ,OAAOa,GAASG,KAAKC,GAAWA,EAAOC,OAAQxB,GAAW,GAAG,CAC3G,GACA,CAACA,IAMJ,OAJAyB,MAAAA,WAAU,KACRjB,EAAmBF,EAAOc,QAAQ,GACjC,CAACZ,IAEG,CAACP,EAAiBO,EAAmB,2BAGdkB,EAC9BC,cACA3B,cAKA,MAAM4B,EAAmBC,iBAAAA,mBAEzB,MAAOC,EAAeC,GAAoB5B,gBAA2B,IAAOC,MAAMC,QAAQL,GAAWA,EAAU,KAC/G,MAAOgC,EAAgBC,GAAqB9B,MAAQA,UAAU,GAE9D,MAAM+B,EAAgB3B,aAAyC,MAoC/D,MAAO,CAACuB,EAAeE,EAlCEG,MAAWA,aACjChB,IACC,GAAKQ,EAEL,GAAIR,EAAQE,SAAW,GAAKjB,MAAMC,QAAQL,GACxCkC,EAAcd,QAAU,KACxBW,EAAiB/B,GACjBiC,GAAkB,OACb,CACL,MAAMG,EAAqCF,EAAcd,QAAUO,EAAYR,GAE/Ec,GAAkB,GAClBG,EACGC,MAAMC,IACDV,KAAsBM,EAAcd,UAAYgB,IAClDF,EAAcd,QAAU,KACxBW,EAAiBO,GACjBL,GAAkB,GACpB,IAEDM,OAAOC,IAENC,QAAQC,MAAMF,GACVZ,KAAsBM,EAAcd,UAAYgB,IAClDF,EAAcd,QAAU,KACxBW,EAAiB,IACjBE,GAAkB,GACpB,GAEN,IAEF,CAACN,EAAa3B,EAAS4B,IAG+B"}
@@ -0,0 +1,2 @@
1
+ import{useState,useRef,useMemo,useEffect,useCallback}from'react';import Fuse from'fuse.js';import{useMountedStatus}from'../../hooks/useMountedStatus.mjs';import{FuseSearchKeys}from'./constants.mjs';const useFilteredOptions=({options:e})=>{const[t,s]=useState((()=>Array.isArray(e)?e:[]));const r=useRef('');const u=useMemo((()=>{const t=new Fuse(e??[],{threshold:.4,ignoreLocation:!0,keys:[FuseSearchKeys.text,FuseSearchKeys.label,FuseSearchKeys.tags]});return u=>{r.current=u,s(u.length>0?t.search(u).map((e=>e.item)):e??[])}}),[e]);return useEffect((()=>{u(r.current)}),[u]),[t,u]};const useLoadedOptions=({loadOptions:e,options:t})=>{const s=useMountedStatus();const[r,u]=useState((()=>Array.isArray(t)?t:[]));const[o,n]=useState(!1);const c=useRef(null);return[r,o,useCallback((r=>{if(e)if(r.length===0&&Array.isArray(t))c.current=null,u(t),n(!1);else{const t=c.current=e(r);n(!0),t.then((e=>{s()&&c.current===t&&(c.current=null,u(e),n(!1))})).catch((e=>{console.error(e),s()&&c.current===t&&(c.current=null,u([]),n(!1))}))}}),[e,t,s])]};export{useFilteredOptions,useLoadedOptions};
2
+ //# sourceMappingURL=hooks.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"hooks.mjs","sources":["../../../../src/components/Dropdown/hooks.ts"],"sourcesContent":["import { useState, useRef, useCallback, useMemo, useEffect } from 'react'\nimport Fuse from 'fuse.js'\nimport { useMountedStatus } from 'hooks/useMountedStatus'\nimport { FuseSearchKeys } from './constants'\nimport type { DropdownOption } from './types'\n\nexport const useFilteredOptions = ({\n options,\n}: {\n options?: DropdownOption[]\n}): [DropdownOption[], (pattern: string) => void] => {\n const [filteredOptions, setFilteredOptions] = useState<DropdownOption[]>(() =>\n Array.isArray(options) ? options : []\n )\n\n const search = useRef<string>('')\n\n const getFilteredOptions = useMemo(() => {\n const fuse = new Fuse<DropdownOption>(options ?? [], {\n threshold: 0.4,\n ignoreLocation: true,\n keys: [FuseSearchKeys.text, FuseSearchKeys.label, FuseSearchKeys.tags],\n })\n\n return (pattern: string) => {\n search.current = pattern\n setFilteredOptions(pattern.length > 0 ? fuse.search(pattern).map((result) => result.item) : options ?? [])\n }\n }, [options])\n\n useEffect(() => {\n getFilteredOptions(search.current)\n }, [getFilteredOptions])\n\n return [filteredOptions, getFilteredOptions]\n}\n\nexport const useLoadedOptions = ({\n loadOptions,\n options,\n}: {\n loadOptions?: (pattern: string) => Promise<DropdownOption[]>\n options?: DropdownOption[]\n}): [DropdownOption[], boolean, (pattern: string) => void] => {\n const getMountedStatus = useMountedStatus()\n\n const [loadedOptions, setLoadedOptions] = useState<DropdownOption[]>(() => (Array.isArray(options) ? options : []))\n const [optionsLoading, setOptionsLoading] = useState<boolean>(false)\n\n const optionsLoader = useRef<Promise<DropdownOption[]> | null>(null)\n\n const getLoadedOptions = useCallback(\n (pattern: string) => {\n if (!loadOptions) return\n\n if (pattern.length === 0 && Array.isArray(options)) {\n optionsLoader.current = null\n setLoadedOptions(options)\n setOptionsLoading(false)\n } else {\n const loader: Promise<DropdownOption[]> = (optionsLoader.current = loadOptions(pattern))\n\n setOptionsLoading(true)\n loader\n .then((payload) => {\n if (getMountedStatus() && optionsLoader.current === loader) {\n optionsLoader.current = null\n setLoadedOptions(payload)\n setOptionsLoading(false)\n }\n })\n .catch((err) => {\n // eslint-disable-next-line no-console\n console.error(err)\n if (getMountedStatus() && optionsLoader.current === loader) {\n optionsLoader.current = null\n setLoadedOptions([])\n setOptionsLoading(false)\n }\n })\n }\n },\n [loadOptions, options, getMountedStatus]\n )\n\n return [loadedOptions, optionsLoading, getLoadedOptions]\n}\n"],"names":["useFilteredOptions","options","filteredOptions","setFilteredOptions","useState","Array","isArray","search","useRef","getFilteredOptions","useMemo","fuse","Fuse","threshold","ignoreLocation","keys","FuseSearchKeys","text","label","tags","pattern","current","length","map","result","item","useEffect","useLoadedOptions","loadOptions","getMountedStatus","useMountedStatus","loadedOptions","setLoadedOptions","optionsLoading","setOptionsLoading","optionsLoader","useCallback","loader","then","payload","catch","err","console","error"],"mappings":"sMAMO,MAAMA,mBAAqBA,EAChCC,cAIA,MAAOC,EAAiBC,GAAsBC,UAA2B,IACvEC,MAAMC,QAAQL,GAAWA,EAAU,KAGrC,MAAMM,EAASC,OAAe,IAE9B,MAAMC,EAAqBC,SAAQ,KACjC,MAAMC,EAAO,IAAIC,KAAqBX,GAAW,GAAI,CACnDY,UAAW,GACXC,gBAAgB,EAChBC,KAAM,CAACC,eAAeC,KAAMD,eAAeE,MAAOF,eAAeG,QAGnE,OAAQC,IACNb,EAAOc,QAAUD,EACjBjB,EAAmBiB,EAAQE,OAAS,EAAIX,EAAKJ,OAAOa,GAASG,KAAKC,GAAWA,EAAOC,OAAQxB,GAAW,GAAG,CAC3G,GACA,CAACA,IAMJ,OAJAyB,WAAU,KACRjB,EAAmBF,EAAOc,QAAQ,GACjC,CAACZ,IAEG,CAACP,EAAiBO,EAAmB,EAGvC,MAAMkB,iBAAmBA,EAC9BC,cACA3B,cAKA,MAAM4B,EAAmBC,mBAEzB,MAAOC,EAAeC,GAAoB5B,UAA2B,IAAOC,MAAMC,QAAQL,GAAWA,EAAU,KAC/G,MAAOgC,EAAgBC,GAAqB9B,UAAkB,GAE9D,MAAM+B,EAAgB3B,OAAyC,MAoC/D,MAAO,CAACuB,EAAeE,EAlCEG,aACtBhB,IACC,GAAKQ,EAEL,GAAIR,EAAQE,SAAW,GAAKjB,MAAMC,QAAQL,GACxCkC,EAAcd,QAAU,KACxBW,EAAiB/B,GACjBiC,GAAkB,OACb,CACL,MAAMG,EAAqCF,EAAcd,QAAUO,EAAYR,GAE/Ec,GAAkB,GAClBG,EACGC,MAAMC,IACDV,KAAsBM,EAAcd,UAAYgB,IAClDF,EAAcd,QAAU,KACxBW,EAAiBO,GACjBL,GAAkB,GACpB,IAEDM,OAAOC,IAENC,QAAQC,MAAMF,GACVZ,KAAsBM,EAAcd,UAAYgB,IAClDF,EAAcd,QAAU,KACxBW,EAAiB,IACjBE,GAAkB,GACpB,GAEN,IAEF,CAACN,EAAa3B,EAAS4B,IAG+B"}
package/dts/index.d.ts CHANGED
@@ -5675,6 +5675,10 @@ interface DropdownProps extends ResponsiveSizeProps<DropdownSize>, ResponsiveMar
5675
5675
  * Значение для атрибута name инпутов, которые хранят value выбранных опций
5676
5676
  * @default "fox-dropdown" */
5677
5677
  name?: string;
5678
+ /**
5679
+ * Колбек, который будет вызван при изменении значения текстового инпута
5680
+ * @default undefined */
5681
+ onChangeInput?: (value: string) => void;
5678
5682
  /**
5679
5683
  * Колбек, который будет вызван при закрытии выпадающего меню
5680
5684
  * @default undefined */
@@ -5688,8 +5692,21 @@ interface DropdownProps extends ResponsiveSizeProps<DropdownSize>, ResponsiveMar
5688
5692
  * Получает аргументом текущую выбранную опцию, опции или null
5689
5693
  * @default undefined */
5690
5694
  onSelectOption?: (selectedOption: DropdownOption | null | DropdownOption[]) => void;
5691
- /** Доступные для выбора опции */
5692
- options: DropdownOption[];
5695
+ /**
5696
+ * Доступные для выбора опции (синхронный поиск).
5697
+ *
5698
+ * Или начальный набор опции при пустой строке в инпуте текстового ввода (асинхронный поиск).
5699
+ *
5700
+ * @default undefined */
5701
+ options?: DropdownOption[];
5702
+ /**
5703
+ * Колбек, который возвращает промис с резолвом опций, которые релевантны значению в инпуте текстового ввода.
5704
+ *
5705
+ * Пустая строка в аргументе должна соответствовать начальному набору опций (если не используется `options`).
5706
+ *
5707
+ * Использование пропа включает асинхронный поиск опций.
5708
+ * @default undefined */
5709
+ loadOptions?: (inputValue: string) => Promise<DropdownOption[]>;
5693
5710
  /**
5694
5711
  * Группировать выбранные опции в выпадающем меню, если включен мод множественного выбора
5695
5712
  * @default false */
@@ -0,0 +1,2 @@
1
+ 'use strict';var React=require('react');exports.useMountedStatus=()=>{const e=React.useRef(!1);const t=React.useCallback((()=>e.current),[]);return React.useEffect((()=>(e.current=!0,()=>{e.current=!1})),[]),t};
2
+ //# sourceMappingURL=useMountedStatus.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useMountedStatus.js","sources":["../../../src/hooks/useMountedStatus.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react'\n\nexport const useMountedStatus = () => {\n const mounted = useRef<boolean>(false)\n\n const getStatus = useCallback(() => mounted.current, [])\n\n useEffect(() => {\n mounted.current = true\n return () => {\n mounted.current = false\n }\n }, [])\n\n return getStatus\n}\n"],"names":["useMountedStatus","mounted","useRef","getStatus","useCallback","current","useEffect"],"mappings":"iEAEgCA,KAC9B,MAAMC,EAAUC,cAAgB,GAEhC,MAAMC,EAAYC,MAAAA,aAAY,IAAMH,EAAQI,SAAS,IASrD,OAPAC,MAAAA,WAAU,KACRL,EAAQI,SAAU,EACX,KACLJ,EAAQI,SAAU,CAAK,IAExB,IAEIF,CAAS"}
@@ -0,0 +1,2 @@
1
+ import{useRef,useCallback,useEffect}from'react';const useMountedStatus=()=>{const e=useRef(!1);const t=useCallback((()=>e.current),[]);return useEffect((()=>(e.current=!0,()=>{e.current=!1})),[]),t};export{useMountedStatus};
2
+ //# sourceMappingURL=useMountedStatus.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useMountedStatus.mjs","sources":["../../../src/hooks/useMountedStatus.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react'\n\nexport const useMountedStatus = () => {\n const mounted = useRef<boolean>(false)\n\n const getStatus = useCallback(() => mounted.current, [])\n\n useEffect(() => {\n mounted.current = true\n return () => {\n mounted.current = false\n }\n }, [])\n\n return getStatus\n}\n"],"names":["useMountedStatus","mounted","useRef","getStatus","useCallback","current","useEffect"],"mappings":"gDAEaA,MAAAA,iBAAmBA,KAC9B,MAAMC,EAAUC,QAAgB,GAEhC,MAAMC,EAAYC,aAAY,IAAMH,EAAQI,SAAS,IASrD,OAPAC,WAAU,KACRL,EAAQI,SAAU,EACX,KACLJ,EAAQI,SAAU,CAAK,IAExB,IAEIF,CAAS"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@foxford/ui",
3
- "version": "2.67.0-beta-c9e1f09-20250228",
3
+ "version": "2.68.0-beta-1c44173-20250312",
4
4
  "description": "UI components library",
5
5
  "bugs": {
6
6
  "url": "https://github.com/foxford/ui/issues"
@@ -1,2 +1,2 @@
1
- 'use strict';const deepmerge=require('deepmerge-ts').deepmergeCustom({mergeArrays:!1});exports.createThrottledCallback=(e,r=100)=>{let t=null;return s=>{t||(t=setTimeout((()=>{t=null}),r),e(s))}},exports.deepmerge=deepmerge,exports.getProgressPercent=(e,r)=>{if(e<0||r<=0)return 0;const t=e/r*100;return Number.isNaN(t)?0:Math.round(Math.min(t,100))};
1
+ 'use strict';const deepmerge=require('deepmerge-ts').deepmergeCustom({mergeArrays:!1});exports.createDebouncedCallback=(e,r=100)=>{let t=null;return u=>{t&&clearTimeout(t),t=setTimeout((()=>{e(u),t=null}),r)}},exports.createThrottledCallback=(e,r=100)=>{let t=null;return u=>{t||(t=setTimeout((()=>{t=null}),r),e(u))}},exports.deepmerge=deepmerge,exports.getProgressPercent=(e,r)=>{if(e<0||r<=0)return 0;const t=e/r*100;return Number.isNaN(t)?0:Math.round(Math.min(t,100))};
2
2
  //# sourceMappingURL=misc.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"misc.js","sources":["../../../../src/shared/utils/misc.ts"],"sourcesContent":["import { deepmergeCustom } from 'deepmerge-ts'\nimport type { Nullable } from 'shared/types'\n\nexport const deepmerge = deepmergeCustom({\n mergeArrays: false,\n})\n\nexport const createThrottledCallback = <T>(cb: (params: T) => void, throttleMS = 100): typeof cb => {\n let timerId: Nullable<ReturnType<typeof setTimeout>> = null\n\n return (params: T) => {\n if (timerId) return\n\n timerId = setTimeout(() => {\n timerId = null\n }, throttleMS)\n\n cb(params)\n }\n}\n\nexport const getProgressPercent = (value: number, max: number): number => {\n if (value < 0 || max <= 0) return 0\n\n const percent = (value / max) * 100\n\n return Number.isNaN(percent) ? 0 : Math.round(Math.min(percent, 100))\n}\n"],"names":["deepmerge","deepmergeCustom","mergeArrays","createThrottledCallback","cb","throttleMS","timerId","params","setTimeout","getProgressPercent","value","max","percent","Number","isNaN","Math","round","min"],"mappings":"aAGaA,MAAAA,kCAAYC,gBAAgB,CACvCC,aAAa,oCAGwBC,CAAIC,EAAyBC,EAAa,OAC/E,IAAIC,EAAmD,KAEvD,OAAQC,IACFD,IAEJA,EAAUE,YAAW,KACnBF,EAAU,IAAI,GACbD,GAEHD,EAAGG,GAAO,CACX,yDAG+BE,CAACC,EAAeC,KAChD,GAAID,EAAQ,GAAKC,GAAO,EAAG,OAAO,EAElC,MAAMC,EAAWF,EAAQC,EAAO,IAEhC,OAAOE,OAAOC,MAAMF,GAAW,EAAIG,KAAKC,MAAMD,KAAKE,IAAIL,EAAS,KAAK"}
1
+ {"version":3,"file":"misc.js","sources":["../../../../src/shared/utils/misc.ts"],"sourcesContent":["import { deepmergeCustom } from 'deepmerge-ts'\nimport type { Nullable } from 'shared/types'\n\nexport const deepmerge = deepmergeCustom({\n mergeArrays: false,\n})\n\nexport const createThrottledCallback = <T>(cb: (params: T) => void, throttleMS = 100): typeof cb => {\n let timerId: Nullable<ReturnType<typeof setTimeout>> = null\n\n return (params: T) => {\n if (timerId) return\n\n timerId = setTimeout(() => {\n timerId = null\n }, throttleMS)\n\n cb(params)\n }\n}\n\nexport const createDebouncedCallback = <T>(cb: (params: T) => void, debounceMS = 100): typeof cb => {\n let timerId: ReturnType<typeof setTimeout> | null = null\n\n return (params: T) => {\n if (timerId) clearTimeout(timerId)\n timerId = setTimeout(() => {\n cb(params)\n timerId = null\n }, debounceMS)\n }\n}\n\nexport const getProgressPercent = (value: number, max: number): number => {\n if (value < 0 || max <= 0) return 0\n\n const percent = (value / max) * 100\n\n return Number.isNaN(percent) ? 0 : Math.round(Math.min(percent, 100))\n}\n"],"names":["deepmerge","deepmergeCustom","mergeArrays","createDebouncedCallback","cb","debounceMS","timerId","params","clearTimeout","setTimeout","createThrottledCallback","throttleMS","getProgressPercent","value","max","percent","Number","isNaN","Math","round","min"],"mappings":"aAGaA,MAAAA,kCAAYC,gBAAgB,CACvCC,aAAa,oCAiBwBC,CAAIC,EAAyBC,EAAa,OAC/E,IAAIC,EAAgD,KAEpD,OAAQC,IACFD,GAASE,aAAaF,GAC1BA,EAAUG,YAAW,KACnBL,EAAGG,GACHD,EAAU,IAAI,GACbD,EAAW,CACf,kCAvBoCK,CAAIN,EAAyBO,EAAa,OAC/E,IAAIL,EAAmD,KAEvD,OAAQC,IACFD,IAEJA,EAAUG,YAAW,KACnBH,EAAU,IAAI,GACbK,GAEHP,EAAGG,GAAO,CACX,yDAe+BK,CAACC,EAAeC,KAChD,GAAID,EAAQ,GAAKC,GAAO,EAAG,OAAO,EAElC,MAAMC,EAAWF,EAAQC,EAAO,IAEhC,OAAOE,OAAOC,MAAMF,GAAW,EAAIG,KAAKC,MAAMD,KAAKE,IAAIL,EAAS,KAAK"}
@@ -1,2 +1,2 @@
1
- import{deepmergeCustom}from'deepmerge-ts';const deepmerge=deepmergeCustom({mergeArrays:!1});const createThrottledCallback=(e,r=100)=>{let t=null;return o=>{t||(t=setTimeout((()=>{t=null}),r),e(o))}};const getProgressPercent=(e,r)=>{if(e<0||r<=0)return 0;const t=e/r*100;return Number.isNaN(t)?0:Math.round(Math.min(t,100))};export{createThrottledCallback,deepmerge,getProgressPercent};
1
+ import{deepmergeCustom}from'deepmerge-ts';const deepmerge=deepmergeCustom({mergeArrays:!1});const createThrottledCallback=(e,t=100)=>{let r=null;return l=>{r||(r=setTimeout((()=>{r=null}),t),e(l))}};const createDebouncedCallback=(e,t=100)=>{let r=null;return l=>{r&&clearTimeout(r),r=setTimeout((()=>{e(l),r=null}),t)}};const getProgressPercent=(e,t)=>{if(e<0||t<=0)return 0;const r=e/t*100;return Number.isNaN(r)?0:Math.round(Math.min(r,100))};export{createDebouncedCallback,createThrottledCallback,deepmerge,getProgressPercent};
2
2
  //# sourceMappingURL=misc.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"misc.mjs","sources":["../../../../src/shared/utils/misc.ts"],"sourcesContent":["import { deepmergeCustom } from 'deepmerge-ts'\nimport type { Nullable } from 'shared/types'\n\nexport const deepmerge = deepmergeCustom({\n mergeArrays: false,\n})\n\nexport const createThrottledCallback = <T>(cb: (params: T) => void, throttleMS = 100): typeof cb => {\n let timerId: Nullable<ReturnType<typeof setTimeout>> = null\n\n return (params: T) => {\n if (timerId) return\n\n timerId = setTimeout(() => {\n timerId = null\n }, throttleMS)\n\n cb(params)\n }\n}\n\nexport const getProgressPercent = (value: number, max: number): number => {\n if (value < 0 || max <= 0) return 0\n\n const percent = (value / max) * 100\n\n return Number.isNaN(percent) ? 0 : Math.round(Math.min(percent, 100))\n}\n"],"names":["deepmerge","deepmergeCustom","mergeArrays","createThrottledCallback","cb","throttleMS","timerId","params","setTimeout","getProgressPercent","value","max","percent","Number","isNaN","Math","round","min"],"mappings":"0CAGaA,MAAAA,UAAYC,gBAAgB,CACvCC,aAAa,IAGR,MAAMC,wBAA0BA,CAAIC,EAAyBC,EAAa,OAC/E,IAAIC,EAAmD,KAEvD,OAAQC,IACFD,IAEJA,EAAUE,YAAW,KACnBF,EAAU,IAAI,GACbD,GAEHD,EAAGG,GAAO,CACX,QAGUE,mBAAqBA,CAACC,EAAeC,KAChD,GAAID,EAAQ,GAAKC,GAAO,EAAG,OAAO,EAElC,MAAMC,EAAWF,EAAQC,EAAO,IAEhC,OAAOE,OAAOC,MAAMF,GAAW,EAAIG,KAAKC,MAAMD,KAAKE,IAAIL,EAAS,KAAK"}
1
+ {"version":3,"file":"misc.mjs","sources":["../../../../src/shared/utils/misc.ts"],"sourcesContent":["import { deepmergeCustom } from 'deepmerge-ts'\nimport type { Nullable } from 'shared/types'\n\nexport const deepmerge = deepmergeCustom({\n mergeArrays: false,\n})\n\nexport const createThrottledCallback = <T>(cb: (params: T) => void, throttleMS = 100): typeof cb => {\n let timerId: Nullable<ReturnType<typeof setTimeout>> = null\n\n return (params: T) => {\n if (timerId) return\n\n timerId = setTimeout(() => {\n timerId = null\n }, throttleMS)\n\n cb(params)\n }\n}\n\nexport const createDebouncedCallback = <T>(cb: (params: T) => void, debounceMS = 100): typeof cb => {\n let timerId: ReturnType<typeof setTimeout> | null = null\n\n return (params: T) => {\n if (timerId) clearTimeout(timerId)\n timerId = setTimeout(() => {\n cb(params)\n timerId = null\n }, debounceMS)\n }\n}\n\nexport const getProgressPercent = (value: number, max: number): number => {\n if (value < 0 || max <= 0) return 0\n\n const percent = (value / max) * 100\n\n return Number.isNaN(percent) ? 0 : Math.round(Math.min(percent, 100))\n}\n"],"names":["deepmerge","deepmergeCustom","mergeArrays","createThrottledCallback","cb","throttleMS","timerId","params","setTimeout","createDebouncedCallback","debounceMS","clearTimeout","getProgressPercent","value","max","percent","Number","isNaN","Math","round","min"],"mappings":"0CAGaA,MAAAA,UAAYC,gBAAgB,CACvCC,aAAa,IAGR,MAAMC,wBAA0BA,CAAIC,EAAyBC,EAAa,OAC/E,IAAIC,EAAmD,KAEvD,OAAQC,IACFD,IAEJA,EAAUE,YAAW,KACnBF,EAAU,IAAI,GACbD,GAEHD,EAAGG,GAAO,CACX,EAGI,MAAME,wBAA0BA,CAAIL,EAAyBM,EAAa,OAC/E,IAAIJ,EAAgD,KAEpD,OAAQC,IACFD,GAASK,aAAaL,GAC1BA,EAAUE,YAAW,KACnBJ,EAAGG,GACHD,EAAU,IAAI,GACbI,EAAW,CACf,QAGUE,mBAAqBA,CAACC,EAAeC,KAChD,GAAID,EAAQ,GAAKC,GAAO,EAAG,OAAO,EAElC,MAAMC,EAAWF,EAAQC,EAAO,IAEhC,OAAOE,OAAOC,MAAMF,GAAW,EAAIG,KAAKC,MAAMD,KAAKE,IAAIL,EAAS,KAAK"}