@foxford/ui 2.48.1 → 2.49.0
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.
- package/components/Dropdown/Dropdown.js +1 -1
- package/components/Dropdown/Dropdown.js.map +1 -1
- package/components/Dropdown/Dropdown.mjs +1 -1
- package/components/Dropdown/Dropdown.mjs.map +1 -1
- package/components/Dropdown/DropdownMenuNoOptions.js +1 -1
- package/components/Dropdown/DropdownMenuNoOptions.js.map +1 -1
- package/components/Dropdown/DropdownMenuNoOptions.mjs +1 -1
- package/components/Dropdown/DropdownMenuNoOptions.mjs.map +1 -1
- package/components/Dropdown/constants.js +1 -1
- package/components/Dropdown/constants.js.map +1 -1
- package/components/Dropdown/constants.mjs +1 -1
- package/components/Dropdown/constants.mjs.map +1 -1
- package/components/Dropdown/style.js +1 -1
- package/components/Dropdown/style.js.map +1 -1
- package/components/Dropdown/style.mjs +1 -1
- package/components/Dropdown/style.mjs.map +1 -1
- package/components/Dropdown/utils.js +1 -1
- package/components/Dropdown/utils.js.map +1 -1
- package/components/Dropdown/utils.mjs +1 -1
- package/components/Dropdown/utils.mjs.map +1 -1
- package/components/FormInput/style.js +1 -1
- package/components/FormInput/style.js.map +1 -1
- package/components/FormInput/style.mjs +1 -1
- package/components/FormInput/style.mjs.map +1 -1
- package/components/FormInputLabel/style.js +1 -1
- package/components/FormInputLabel/style.js.map +1 -1
- package/components/FormInputLabel/style.mjs +1 -1
- package/components/FormInputLabel/style.mjs.map +1 -1
- package/components/MenuList/MenuList.js +1 -1
- package/components/MenuList/MenuList.js.map +1 -1
- package/components/MenuList/MenuList.mjs +1 -1
- package/components/MenuList/MenuList.mjs.map +1 -1
- package/dts/index.d.ts +9 -2
- package/external/.pnpm/@foxford_icon-pack@0.9.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/CheckCircleFill/index.js +1 -1
- package/external/.pnpm/@foxford_icon-pack@0.9.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/CheckCircleFill/index.js.map +1 -1
- package/external/.pnpm/@foxford_icon-pack@0.9.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/ChevronDown/index.js +1 -1
- package/external/.pnpm/@foxford_icon-pack@0.9.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/ChevronDown/index.js.map +1 -1
- package/external/.pnpm/@foxford_icon-pack@0.9.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/Close/index.js +1 -1
- package/external/.pnpm/@foxford_icon-pack@0.9.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/CloseCirlceFill/index.js +1 -1
- package/external/.pnpm/@foxford_icon-pack@0.9.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/LoaderFill/index.js +1 -1
- package/external/.pnpm/@foxford_icon-pack@0.9.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/NotifFill/index.js +1 -1
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
'use strict';var React=require('react');var fuse=require('../../external/.pnpm/fuse.js@7.0.0/node_modules/fuse.js/dist/fuse.js');var index_browser=require('../../external/.pnpm/nanoid@5.0.7/node_modules/nanoid/index.browser.js');var withMergedProps=require('../../hocs/withMergedProps.js');var dom=require('../../shared/utils/dom.js');var constants$1=require('../../shared/constants.js');var DropdownMenu=require('./DropdownMenu.js');var DropdownMenuNoOptions=require('./DropdownMenuNoOptions.js');var constants=require('./constants.js');var utils=require('./utils.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');var FormInputLabel=require('../FormInputLabel/FormInputLabel.js');var FormInput=require('../FormInput/FormInput.js');var Chip=require('../Chip/Chip.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:r="m",name:o="fox-dropdown",labelPosition:n="dynamic",optionsMultiToggle:s=!0,loading:a=!1,iconProps:i={},menuProps:u={},autoFocus:l,closeMenuOnScroll:c,contrast:d,selectedOption:p,defaultSelectedOption:b,icon:g,inputMode:v,loadingMessage:m,loadingIcon:f,loadingIconProps:h,maxLength:C,multiple:x,onCloseMenu:k,onOpenMenu:I,onSelectOption:w,options:$,optionsMultiToggleCaption:y,optionsEmptyMessage:D,optionsEmptyIcon:q,optionsEmptyIconProps:M,palette:j,placeholder:L,readOnly:R,required:P,status:E,sizeXXS:S,sizeXS:F,sizeS:z,sizeM:T,sizeL:K,sizeXL:O,form:B,...X}=e;const N={size:r,sizeXXS:S,sizeXS:F,sizeS:z,sizeM:T,sizeL:K,sizeXL:O};const _={size:24,color:X.disabled?'content-disabled':'content-onmain-tertiary'};const H=React.useMemo((()=>index_browser.nanoid()),[]);const V=React.useMemo((()=>{const e=new fuse.default($,{threshold:.4,ignoreLocation:!0,keys:[constants.FuseSearchKeys.text,constants.FuseSearchKeys.tags]});return t=>t.length===0?$:e.search(t).map((e=>e.item))}),[$]);const[Z,A]=React.useState((()=>x?'':utils.getDropdownInputText(p!==void 0?p:b)));const[U,G]=React.useState((()=>utils.getDropdownInputValue(p!==void 0?p:b)));const[J,Q]=React.useState((()=>utils.getDropdownInputMultipleValue(p!==void 0?p:b)));const[W,Y]=React.useState((()=>V(Z)));const[ee,te]=React.useState(!1);const re=x?utils.groupDropdownOptions($,J):[[],[]];const oe=ee&&!X.disabled;const ne=W.length===0||a;const se=Boolean(oe||Z);const ae=x?J.length===0:U.length===0;const ie=re[0].length>0&&re[1].length===0;const ue=re[0].length>0&&re[1].length>0;const le=React.useRef(null);const ce=React.useRef(null);const de=React.useRef(null);const pe=React.useRef(null);const be=React.useRef(Z);const ge=React.useRef(oe);React.useEffect((()=>(Z===be.current?Y(V(Z)):(be.current=Z,pe.current=setTimeout((()=>{Y(V(Z))}),150)),()=>{pe.current&&clearTimeout(pe.current)})),[V,Z]),React.useLayoutEffect((()=>{p!==void 0&&(x?Q(utils.getDropdownInputMultipleValue(p)):(A(utils.getDropdownInputText(p)),G(utils.getDropdownInputValue(p))))}),[x,p]),React.useEffect((()=>{oe!==ge.current&&(oe&&I&&I(),!oe&&k&&k(),ge.current=oe)}),[oe,k,I]),React.useEffect((()=>{const handleScroll=e=>{le.current?.focus(),te(!1),e.currentTarget&&e.currentTarget.removeEventListener(e.type,handleScroll)};return c&&oe&&document.addEventListener('scroll',handleScroll),()=>{document.removeEventListener('scroll',handleScroll)}}),[c,oe]);const syncInputTextWithSelectedOption=()=>{let e='';if(!x){const t=$.find((e=>e.value===U));e=t?t.text:''}A(e)};return require$$0.jsx(FormInputLabel.FormInputLabel,{...X,...N,ref:t,labelId:H,labelPosition:n,active:se,onColored:d,error:E==='error',success:E==='success',icon:[g,require$$0.jsx(style.ChevronIcon,{up:oe},'chevron')],iconProps:{..._,...i},palette:{color:X.disabled?j.labelColorDisabled:j.labelColor,backgroundColor:X.disabled?j.backgroundColorDisabled:j.backgroundColor,backgroundColorHover:X.disabled?j.backgroundColorDisabled:j.backgroundColorHover,borderColor:X.disabled?j.borderColorDisabled:j.borderColor},onClick:e=>{X.onClick&&X.onClick(e),X.disabled||(le.current?.focus(),oe?ce.current&&e.target instanceof Node&&!ce.current.contains(e.target)&&te(!1):te(!0))},onKeyUp:e=>{X.onKeyUp&&X.onKeyUp(e),constants$1.keyboardKeys.Esc.validate(e.key)&&(le.current?.focus(),te(!1))},onPointerDown:e=>{X.onPointerDown&&X.onPointerDown(e),e.target!==le.current&&e.target instanceof Node&&e.currentTarget.contains(e.target)&&e.preventDefault()},onBlur:e=>{X.onBlur&&X.onBlur(e),e.currentTarget.contains(e.relatedTarget)||(syncInputTextWithSelectedOption(),te(!1))},input:require$$0.jsxs(require$$0.Fragment,{children:[require$$0.jsx(FormInput.FormInput,{ref:le,"aria-labelledby":X.label?H:void 0,type:"text",autoComplete:"off",autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",autoFocus:l,inputMode:v,maxLength:C,placeholder:L,readOnly:R,required:P&&ae,disabled:X.disabled,value:Z,palette:{color:j.color,colorDisabled:j.colorDisabled,placeholderColor:j.placeholderColor,placeholderColorDisabled:j.placeholderColorDisabled},onClick:e=>{oe&&e.currentTarget.selectionStart!==e.currentTarget.selectionEnd&&e.stopPropagation()},onChange:e=>{A(e.currentTarget.value),te(!0)},onKeyDown:e=>{constants$1.keyboardKeys.Enter.validate(e.key)&&(syncInputTextWithSelectedOption(),te(!1)),!constants$1.keyboardKeys.Space.validate(e.key)||oe&&e.currentTarget.selectionStart!==0||(e.preventDefault(),te((e=>!e))),constants$1.keyboardKeys.ArrowDown.validate(e.key)&&de.current&&(e.preventDefault(),dom.focusFirstFocusable(de.current))}}),x?J.map((e=>require$$0.jsx("input",{type:"hidden",name:o,value:e,form:B,disabled:X.disabled},e))):U.length>0&&require$$0.jsx("input",{type:"hidden",name:o,value:U,form:B,disabled:X.disabled})]}),addon:x&&J.length>0?require$$0.jsx(Chip.Chip,{size:"xs",active:!0,black:!0,marginLeft:12,disabled:X.disabled,cursor:X.disabled?'not-allowed':void 0,text:J.length,textProps:{appearance:'caption',size:'xs'},palette:X.disabled?{color:'content-disabled',colorHover:'content-disabled',backgroundColor:'bg-disabled-small',backgroundColorHover:'bg-disabled-small'}:void 0,onPointerDown:e=>{e.preventDefault()},discardButtonProps:{contrast:!X.disabled,onKeyDown:e=>{constants$1.keyboardKeys.ArrowDown.validate(e.key)&&de.current&&(e.preventDefault(),dom.focusFirstFocusable(de.current))},onClick:e=>{e.stopPropagation(),R||(p===void 0&&Q([]),w&&w([]),le.current?.focus(),te(!0))}}}):void 0,dropdown:oe?require$$0.jsx(DropdownMenu.DropdownMenu,{...u,ref:ce,tabIndex:ne?void 0:0,secondary:!d,elevated:d,disableAutoFocus:!0,palette:{backgroundColor:j.menuBackgroundColor,borderColor:j.menuBorderColor},onFocus:e=>{de.current&&e.target===e.currentTarget&&(de.current.contains(e.relatedTarget)?le.current?.focus():dom.focusFirstFocusable(de.current))},onKeyDown:e=>{constants$1.keyboardKeys.Enter.validate(e.key)&&(le.current?.focus(),syncInputTextWithSelectedOption(),te(!1))},children:ne?require$$0.jsx(DropdownMenuNoOptions.DropdownMenuNoOptions,{loading:a,loadingMessage:m,loadingIcon:f,loadingIconProps:{..._,...h},emptyMessage:D,emptyIcon:q,emptyIconProps:{..._,...M}}):require$$0.jsx(MenuList.MenuList,x?{ref:de,children:Z.length>0?require$$0.jsx(require$$0.Fragment,{children:W.map((e=>{const t=J.includes(e.value);const r=e.status??E;const n=t&&r==='error';const s=t&&r==='success';return React.createElement(ListItem.ListItem,{...N,key:e.value,text:e.text,danger:n,success:s,disabled:X.disabled,active:t,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:require$$0.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",name:o,value:e.value,checked:t,error:n,success:s,onChange:e=>{if(!R){const r=t?J.filter((t=>t!==e.currentTarget.value)):[...J,e.currentTarget.value];p===void 0&&Q(r),w&&w($.filter((e=>r.includes(e.value))))}}})})}))}):require$$0.jsxs(require$$0.Fragment,{children:[s&&require$$0.jsx(ListItem.ListItem,{...N,text:y,disabled:X.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{R&&e.stopPropagation()},control:require$$0.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",name:o,checked:ie,indeterminate:ue,error:(ie||ue)&&E==='error',success:(ie||ue)&&E==='success',onChange:()=>{if(!R){const e=ie||ue?[]:$.map((e=>e.value));p===void 0&&Q(e),w&&w(e.length===0?[]:$)}}})}),s&&require$$0.jsx(MenuDivider.MenuDivider,{}),re[0].map((e=>{const t=e.status??E;const r=t==='error';const n=t==='success';return React.createElement(ListItem.ListItem,{...N,key:e.value,active:!0,text:e.text,danger:r,success:n,disabled:X.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{R&&e.stopPropagation()},control:require$$0.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",name:o,value:e.value,checked:!0,error:r,success:n,onChange:e=>{if(!R){const t=J.filter((t=>t!==e.currentTarget.value));p===void 0&&Q(t),w&&w($.filter((e=>t.includes(e.value))))}}})})})),re[0].length>0&&re[1].length>0&&require$$0.jsx(MenuDivider.MenuDivider,{}),re[1].map((e=>React.createElement(ListItem.ListItem,{...N,key:e.value,text:e.text,disabled:X.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{R&&e.stopPropagation()},control:require$$0.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",name:o,value:e.value,checked:!1,onChange:e=>{if(!R){const t=[...J,e.currentTarget.value];p===void 0&&Q(t),w&&w($.filter((e=>t.includes(e.value))))}}})})))]})}:{ref:de,children:W.map((e=>{const t=U===e.value;return React.createElement(ListItem.ListItem,{...N,key:e.value,text:e.text,active:t,danger:t&&E==='error',success:t&&E==='success',disabled:X.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:r=>{if(r.stopPropagation(),!R){const r=t?null:e;p===void 0&&(A(utils.getDropdownInputText(r)),G(utils.getDropdownInputValue(r))),w&&w(r),le.current?.focus(),te(!r)}}})}))})}):void 0})})),{sizes:constants.SIZES,displayName:"Dropdown"});exports.COMPONENT_NAME="Dropdown",exports.Dropdown=Dropdown;
|
|
1
|
+
'use strict';var React=require('react');var fuse=require('../../external/.pnpm/fuse.js@7.0.0/node_modules/fuse.js/dist/fuse.js');var index_browser=require('../../external/.pnpm/nanoid@5.0.7/node_modules/nanoid/index.browser.js');var withMergedProps=require('../../hocs/withMergedProps.js');var dom=require('../../shared/utils/dom.js');var constants$1=require('../../shared/constants.js');var DropdownMenu=require('./DropdownMenu.js');var DropdownMenuNoOptions=require('./DropdownMenuNoOptions.js');var constants=require('./constants.js');var utils=require('./utils.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');var FormInputLabel=require('../FormInputLabel/FormInputLabel.js');var FormInput=require('../FormInput/FormInput.js');var Chip=require('../Chip/Chip.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:r="fox-dropdown",labelPosition:n="dynamic",searchable:s=!0,optionsMultiToggle:a=!0,loading:i=!1,iconProps:c={},menuProps:u={},loadingIconProps:l={},optionsEmptyIconProps:d={},autoFocus:p,closeMenuOnScroll:b,contrast:g,selectedOption:v,defaultSelectedOption:m,icon:x,inputMode:f,loadingMessage:C,loadingIcon:h,maxLength:k,multiple:I,onCloseMenu:w,onOpenMenu:y,onSelectOption:$,options:D,groupSelectedOptions:q,optionsMultiToggleCaption:M,optionsEmptyMessage:j,optionsEmptyIcon:S,palette:L,placeholder:R,readOnly:P,required:E,status:F,sizeXXS:T,sizeXS:z,sizeS:O,sizeM:K,sizeL:B,sizeXL:X,form:N,..._}=e;const H={size:o,sizeXXS:T,sizeXS:z,sizeS:O,sizeM:K,sizeL:B,sizeXL:X};const Z={sizes:constants.SIZES_ICON,color:_.disabled?'content-disabled':'content-onmain-tertiary'};const A=React.useMemo((()=>index_browser.nanoid()),[]);const U=React.useMemo((()=>{const e=new fuse.default(D,{threshold:.4,ignoreLocation:!0,keys:[constants.FuseSearchKeys.text,constants.FuseSearchKeys.label,constants.FuseSearchKeys.tags]});return t=>t.length===0?D:e.search(t).map((e=>e.item))}),[D]);const[G,J]=React.useState((()=>utils.getDropdownSelectedOption(v!==void 0?v:m,I)));const[Q,V]=React.useState((()=>utils.getDropdownInputText(G,I)));const[W,Y]=React.useState(!1);const[ee,te]=React.useState((()=>U(Q)));const[oe,re]=React.useState(!1);const ne=I?utils.groupDropdownOptions(D,G):[[],[]];const se=oe&&!_.disabled;const ae=ee.length===0||i;const ie=Q===utils.getDropdownInputText(G);const ce=E&&G.length===0;const ue=Boolean(se||Q);const le=ne[0].length>0&&ne[1].length===0;const de=ne[0].length>0&&ne[1].length>0;const pe=React.useRef(null);const be=React.useRef(null);const ge=React.useRef(null);const ve=React.useRef(null);const me=React.useRef(Q);const xe=React.useRef(se);return React.useEffect((()=>(Q===me.current?te(U(Q)):(me.current=Q,ve.current=setTimeout((()=>{te(U(Q))}),150)),()=>{ve.current&&clearTimeout(ve.current)})),[U,Q]),React.useLayoutEffect((()=>{v!==void 0&&(I||V(utils.getDropdownInputText(v)),J(utils.getDropdownSelectedOption(v,I)))}),[I,v]),React.useEffect((()=>{se!==xe.current&&(se&&y&&y(),se||(Y(!1),w&&w()),xe.current=se)}),[se,w,y]),React.useEffect((()=>{const handleScroll=e=>{pe.current?.focus(),re(!1),e.currentTarget&&e.currentTarget.removeEventListener(e.type,handleScroll)};return b&&se&&document.addEventListener('scroll',handleScroll),()=>{document.removeEventListener('scroll',handleScroll)}}),[b,se]),require$$0.jsx(FormInputLabel.FormInputLabel,{..._,...H,ref:t,labelId:A,labelPosition:n,active:ue,onColored:g,error:F==='error',success:F==='success',icon:[x,require$$0.jsx(style.ChevronIcon,{up:se},'chevron')],iconProps:{...H,...Z,...c},palette:{color:_.disabled?L.labelColorDisabled:L.labelColor,backgroundColor:_.disabled?L.backgroundColorDisabled:L.backgroundColor,backgroundColorHover:_.disabled?L.backgroundColorDisabled:L.backgroundColorHover,borderColor:_.disabled?L.borderColorDisabled:L.borderColor},onClick:e=>{_.onClick&&_.onClick(e),_.disabled||(pe.current?.focus(),se?be.current&&e.target instanceof Node&&!be.current.contains(e.target)&&re(!1):re(!0))},onKeyUp:e=>{_.onKeyUp&&_.onKeyUp(e),constants$1.keyboardKeys.Esc.validate(e.key)&&(pe.current?.focus(),re(!1))},onPointerDown:e=>{_.onPointerDown&&_.onPointerDown(e),e.target!==pe.current&&e.target instanceof Node&&e.currentTarget.contains(e.target)&&e.preventDefault()},onBlur:e=>{_.onBlur&&_.onBlur(e),e.currentTarget.contains(e.relatedTarget)||(V(utils.getDropdownInputText(G,I)),re(!1))},input:require$$0.jsxs(require$$0.Fragment,{children:[ce&&!s&&!P&&require$$0.jsx(style.InputMimic,{required:!0,type:"text",inputMode:"none",form:N,tabIndex:-1,onFocus:()=>{pe.current?.focus()}}),require$$0.jsx(FormInput.FormInput,{ref:pe,"aria-labelledby":_.label?A:void 0,type:"text",autoComplete:"off",autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",form:N,autoFocus:p,inputMode:s?f:'none',maxLength:k,placeholder:R,readOnly:P||!s,required:ce,disabled:_.disabled,value:Q,palette:{color:L.color,colorDisabled:L.colorDisabled,placeholderColor:L.placeholderColor,placeholderColorDisabled:L.placeholderColorDisabled},onClick:e=>{se&&e.currentTarget.selectionStart!==e.currentTarget.selectionEnd&&e.stopPropagation()},onChange:e=>{V(e.currentTarget.value),Y(!0),re(!0)},onKeyDown:e=>{constants$1.keyboardKeys.Enter.validate(e.key)&&(V(utils.getDropdownInputText(G,I)),re(!1)),!constants$1.keyboardKeys.Space.validate(e.key)||se&&e.currentTarget.selectionStart!==0||(e.preventDefault(),re((e=>!e))),constants$1.keyboardKeys.ArrowDown.validate(e.key)&&ge.current&&(e.preventDefault(),dom.focusFirstFocusable(ge.current))}}),G.map((e=>require$$0.jsx("input",{type:"hidden",name:r,value:e.value,form:N,disabled:_.disabled},e.value)))]}),addon:I&&G.length>0?require$$0.jsx(Chip.Chip,{size:"xs",active:!0,black:!0,marginLeft:12,disabled:_.disabled,cursor:_.disabled?'not-allowed':void 0,text:G.length,textProps:{appearance:'caption',size:'xs'},palette:_.disabled?{color:'content-disabled',colorHover:'content-disabled',backgroundColor:'bg-disabled-small',backgroundColorHover:'bg-disabled-small'}:void 0,onPointerDown:e=>{e.preventDefault()},discardButtonProps:{contrast:!_.disabled,onKeyDown:e=>{constants$1.keyboardKeys.ArrowDown.validate(e.key)&&ge.current&&(e.preventDefault(),dom.focusFirstFocusable(ge.current))},onClick:e=>{e.stopPropagation(),P||(v===void 0&&J([]),$&&$([]),pe.current?.focus(),re(!0))}}}):void 0,dropdown:se?require$$0.jsx(DropdownMenu.DropdownMenu,{...u,ref:be,tabIndex:ae?void 0:0,secondary:!g,elevated:g,disableAutoFocus:!0,palette:{backgroundColor:L.menuBackgroundColor,borderColor:L.menuBorderColor},onFocus:e=>{ge.current&&e.target===e.currentTarget&&(ge.current.contains(e.relatedTarget)?pe.current?.focus():dom.focusFirstFocusable(ge.current))},onKeyDown:e=>{constants$1.keyboardKeys.Enter.validate(e.key)&&(pe.current?.focus(),V(utils.getDropdownInputText(G,I)),re(!1))},children:ae?require$$0.jsx(DropdownMenuNoOptions.DropdownMenuNoOptions,{loading:i,loadingMessage:C,loadingIcon:h,loadingIconProps:{...H,...Z,...l},emptyMessage:j,emptyIcon:S,emptyIconProps:{...H,...Z,...d}}):require$$0.jsx(MenuList.MenuList,I?{ref:ge,children:Q.length===0?require$$0.jsxs(require$$0.Fragment,{children:[a&&require$$0.jsx(ListItem.ListItem,{...H,text:M,disabled:_.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:require$$0.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",name:r,checked:le,indeterminate:de,error:(le||de)&&F==='error',success:(le||de)&&F==='success',onChange:()=>{if(!P){const e=le||de?[]:[...D];v===void 0&&J(e),$&&$(e)}}})}),a&&require$$0.jsx(MenuDivider.MenuDivider,{}),q&&ne[0].map((e=>{const t=e.status??F;const o=t==='error';const n=t==='success';return React.createElement(ListItem.ListItem,{...H,key:e.value,active:!0,text:e.text,danger:o,success:n,disabled:_.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation(),pe.current?.focus()},control:require$$0.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:!0,error:o,success:n,onChange:e=>{if(!P){const t=G.filter((t=>t.value!==e.currentTarget.value));v===void 0&&J(t),$&&$(t)}}})})})),q&&ne[0].length>0&&ne[1].length>0&&require$$0.jsx(MenuDivider.MenuDivider,{}),q&&ne[1].map((e=>React.createElement(ListItem.ListItem,{...H,key:e.value,text:e.text,disabled:_.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation(),pe.current?.focus()},control:require$$0.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:!1,onChange:()=>{if(!P){const t=[...G,e];v===void 0&&J(t),$&&$(t)}}})}))),!q&&D.map((e=>{const t=G.findIndex((t=>t.value===e.value))!==-1;const o=e.status??F;const n=t&&o==='error';const s=t&&o==='success';return React.createElement(ListItem.ListItem,{...H,key:e.value,text:e.text,danger:n,success:s,disabled:_.disabled,active:t,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:require$$0.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:t,error:n,success:s,onChange:o=>{if(!P){const r=t?G.filter((e=>e.value!==o.currentTarget.value)):[...G,e];v===void 0&&J(r),$&&$(r)}}})})}))]}):require$$0.jsx(require$$0.Fragment,{children:ee.map((e=>{const t=G.findIndex((t=>t.value===e.value))!==-1;const o=e.status??F;const n=t&&o==='error';const s=t&&o==='success';return React.createElement(ListItem.ListItem,{...H,key:e.value,text:e.text,danger:n,success:s,disabled:_.disabled,active:t,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:require$$0.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:t,error:n,success:s,onChange:o=>{if(!P){const r=t?G.filter((e=>e.value!==o.currentTarget.value)):[...G,e];v===void 0&&J(r),$&&$(r)}}})})}))})}:{ref:ge,children:(ie&&!W?D:ee).map(((e,t,o)=>{const r=G.findIndex((t=>t.value===e.value))!==-1;return React.createElement(ListItem.ListItem,{...H,key:e.value,text:e.text,active:r,danger:r&&F==='error',success:r&&F==='success',disabled:_.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:t=>{if(t.stopPropagation(),!P){const t=r?null:e;v===void 0&&(V(utils.getDropdownInputText(t)),J(utils.getDropdownSelectedOption(t))),$&&$(t),(t||o===ee)&&pe.current?.focus(),re(!t)}}})}))})}):void 0})})),{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 { focusFirstFocusable } from 'shared/utils/dom'\nimport { keyboardKeys } from 'shared/constants'\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 type { IconProps } from 'components/Icon'\nimport { DropdownMenu } from './DropdownMenu'\nimport { DropdownMenuNoOptions } from './DropdownMenuNoOptions'\nimport { SIZES, SIZES_CHECKBOX, FuseSearchKeys } from './constants'\nimport {\n getDropdownInputText,\n getDropdownInputValue,\n getDropdownInputMultipleValue,\n groupDropdownOptions,\n} 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 optionsMultiToggle = true,\n loading = false,\n iconProps = {},\n menuProps = {},\n autoFocus,\n closeMenuOnScroll,\n contrast,\n selectedOption,\n defaultSelectedOption,\n icon,\n inputMode,\n loadingMessage,\n loadingIcon,\n loadingIconProps,\n maxLength,\n multiple,\n onCloseMenu,\n onOpenMenu,\n onSelectOption,\n options,\n optionsMultiToggleCaption,\n optionsEmptyMessage,\n optionsEmptyIcon,\n optionsEmptyIconProps,\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 size: 24,\n color: rootProps.disabled ? 'content-disabled' : 'content-onmain-tertiary',\n }\n\n const inputLabelId = 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.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 [inputText, setInputText] = useState<string>(() => {\n if (multiple) return ''\n\n if (selectedOption !== undefined) return getDropdownInputText(selectedOption)\n\n return getDropdownInputText(defaultSelectedOption)\n })\n\n const [inputValue, setInputValue] = useState<string>(() => {\n if (selectedOption !== undefined) return getDropdownInputValue(selectedOption)\n\n return getDropdownInputValue(defaultSelectedOption)\n })\n\n const [inputMultipleValue, setInputMultipleValue] = useState<string[]>(() => {\n if (selectedOption !== undefined) return getDropdownInputMultipleValue(selectedOption)\n\n return getDropdownInputMultipleValue(defaultSelectedOption)\n })\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, inputMultipleValue)\n : [[], []]\n\n const menuOpen = menuOpenRequest && !rootProps.disabled\n const menuNoRelevantOptions = menuRelevantOptions.length === 0 || loading\n\n const inputActive = Boolean(menuOpen || inputText)\n const inputValueEmpty = multiple ? inputMultipleValue.length === 0 : inputValue.length === 0\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>(null)\n const menuRef = useRef<HTMLDivElement | null>(null)\n const menuListRef = useRef<HTMLUListElement | null>(null)\n\n const timeoutIdRef = useRef<ReturnType<typeof setTimeout> | null>(null)\n\n const inputTextPrevRef = useRef<string>(inputText)\n const menuOpenPrevRef = useRef<boolean>(menuOpen)\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) {\n setInputMultipleValue(getDropdownInputMultipleValue(selectedOption))\n } else {\n setInputText(getDropdownInputText(selectedOption))\n setInputValue(getDropdownInputValue(selectedOption))\n }\n }, [multiple, selectedOption])\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 const handleScroll = (evt: Event) => {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n\n if (evt.currentTarget) {\n evt.currentTarget.removeEventListener(evt.type, handleScroll)\n }\n }\n\n if (closeMenuOnScroll && menuOpen) {\n document.addEventListener('scroll', handleScroll)\n }\n\n return () => {\n document.removeEventListener('scroll', handleScroll)\n }\n }, [closeMenuOnScroll, menuOpen])\n\n const syncInputTextWithSelectedOption = () => {\n let selectedOptionText = ''\n\n if (!multiple) {\n const selected = options.find((option) => option.value === inputValue)\n selectedOptionText = selected ? selected.text : ''\n }\n\n setInputText(selectedOptionText)\n }\n\n return (\n <FormInputLabel\n {...rootProps}\n {...sizeProps}\n ref={ref}\n labelId={inputLabelId}\n labelPosition={labelPosition}\n active={inputActive}\n onColored={contrast}\n error={status === 'error'}\n success={status === 'success'}\n icon={[icon, <Styled.ChevronIcon key='chevron' up={menuOpen} />]}\n iconProps={{ ...iconBaseProps, ...iconProps }}\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 } else if (menuRef.current && evt.target instanceof Node && !menuRef.current.contains(evt.target)) {\n setMenuOpenRequest(false)\n }\n }}\n onKeyUp={(evt) => {\n if (rootProps.onKeyUp) rootProps.onKeyUp(evt)\n\n if (keyboardKeys.Esc.validate(evt.key)) {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n }}\n onPointerDown={(evt) => {\n if (rootProps.onPointerDown) rootProps.onPointerDown(evt)\n\n if (evt.target !== inputRef.current && evt.target instanceof Node && evt.currentTarget.contains(evt.target)) {\n evt.preventDefault()\n }\n }}\n onBlur={(evt) => {\n if (rootProps.onBlur) rootProps.onBlur(evt)\n\n if (!evt.currentTarget.contains(evt.relatedTarget)) {\n syncInputTextWithSelectedOption()\n setMenuOpenRequest(false)\n }\n }}\n input={\n <>\n <FormInput\n ref={inputRef}\n aria-labelledby={rootProps.label ? inputLabelId : undefined}\n type='text'\n autoComplete='off'\n autoCapitalize='off'\n autoCorrect='off'\n spellCheck='false'\n autoFocus={autoFocus}\n inputMode={inputMode}\n maxLength={maxLength}\n placeholder={placeholder}\n readOnly={readOnly}\n required={required && inputValueEmpty}\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 syncInputTextWithSelectedOption()\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Space.validate(evt.key) && (!menuOpen || evt.currentTarget.selectionStart === 0)) {\n evt.preventDefault()\n setMenuOpenRequest((prev) => !prev)\n }\n\n if (keyboardKeys.ArrowDown.validate(evt.key) && menuListRef.current) {\n evt.preventDefault()\n focusFirstFocusable(menuListRef.current)\n }\n }}\n />\n {multiple\n ? inputMultipleValue.map((value) => (\n <input\n key={value}\n type='hidden'\n name={name}\n value={value}\n form={form}\n disabled={rootProps.disabled}\n />\n ))\n : inputValue.length > 0 && (\n <input type='hidden' name={name} value={inputValue} form={form} disabled={rootProps.disabled} />\n )}\n </>\n }\n addon={\n multiple && inputMultipleValue.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={inputMultipleValue.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 contrast: !rootProps.disabled,\n onKeyDown: (evt) => {\n if (keyboardKeys.ArrowDown.validate(evt.key) && menuListRef.current) {\n evt.preventDefault()\n focusFirstFocusable(menuListRef.current)\n }\n },\n onClick: (evt) => {\n evt.stopPropagation()\n\n if (!readOnly) {\n if (selectedOption === undefined) {\n setInputMultipleValue([])\n }\n\n if (onSelectOption) onSelectOption([])\n\n inputRef.current?.focus()\n setMenuOpenRequest(true)\n }\n },\n }}\n />\n ) : undefined\n }\n dropdown={\n menuOpen ? (\n <DropdownMenu\n {...menuProps}\n ref={menuRef}\n tabIndex={menuNoRelevantOptions ? undefined : 0}\n secondary={!contrast}\n elevated={contrast}\n disableAutoFocus\n palette={{\n backgroundColor: palette.menuBackgroundColor,\n borderColor: palette.menuBorderColor,\n }}\n onFocus={(evt) => {\n if (!menuListRef.current) return\n\n if (evt.target === evt.currentTarget) {\n if (menuListRef.current.contains(evt.relatedTarget)) {\n inputRef.current?.focus()\n } else {\n focusFirstFocusable(menuListRef.current)\n }\n }\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.Enter.validate(evt.key)) {\n inputRef.current?.focus()\n syncInputTextWithSelectedOption()\n setMenuOpenRequest(false)\n }\n }}\n >\n {menuNoRelevantOptions ? (\n <DropdownMenuNoOptions\n loading={loading}\n loadingMessage={loadingMessage}\n loadingIcon={loadingIcon}\n loadingIconProps={{ ...iconBaseProps, ...loadingIconProps }}\n emptyMessage={optionsEmptyMessage}\n emptyIcon={optionsEmptyIcon}\n emptyIconProps={{ ...iconBaseProps, ...optionsEmptyIconProps }}\n />\n ) : multiple ? (\n <MenuList ref={menuListRef}>\n {inputText.length > 0 ? (\n <>\n {menuRelevantOptions.map((option) => {\n const selected = inputMultipleValue.includes(option.value)\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 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 ? inputMultipleValue.filter((value) => value !== evt.currentTarget.value)\n : [...inputMultipleValue, evt.currentTarget.value]\n\n if (selectedOption === undefined) {\n setInputMultipleValue(update)\n }\n\n if (onSelectOption) {\n onSelectOption(options.filter((option) => update.includes(option.value)))\n }\n }\n }}\n />\n }\n />\n )\n })}\n </>\n ) : (\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 if (readOnly) 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 =\n multiToggleChecked || multiToggleIndeterminate\n ? []\n : options.map((option) => option.value)\n\n if (selectedOption === undefined) {\n setInputMultipleValue(update)\n }\n\n if (onSelectOption) onSelectOption(update.length === 0 ? [] : options)\n }\n }}\n />\n }\n />\n )}\n {optionsMultiToggle && <MenuDivider />}\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 if (readOnly) evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n name={name}\n value={option.value}\n checked\n error={optionErrorStatus}\n success={optionSuccessStatus}\n onChange={(evt) => {\n if (!readOnly) {\n const update = inputMultipleValue.filter(\n (value) => value !== evt.currentTarget.value\n )\n\n if (selectedOption === undefined) {\n setInputMultipleValue(update)\n }\n\n if (onSelectOption) {\n onSelectOption(options.filter((option) => update.includes(option.value)))\n }\n }\n }}\n />\n }\n />\n )\n })}\n {menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length > 0 && <MenuDivider />}\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 if (readOnly) evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n name={name}\n value={option.value}\n checked={false}\n onChange={(evt) => {\n if (!readOnly) {\n const update = [...inputMultipleValue, evt.currentTarget.value]\n\n if (selectedOption === undefined) {\n setInputMultipleValue(update)\n }\n\n if (onSelectOption) {\n onSelectOption(options.filter((option) => update.includes(option.value)))\n }\n }\n }}\n />\n }\n />\n ))}\n </>\n )}\n </MenuList>\n ) : (\n <MenuList ref={menuListRef}>\n {menuRelevantOptions.map((option) => {\n const selected = inputValue === option.value\n\n return (\n <ListItem\n {...sizeProps}\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 = selected ? null : option\n\n if (selectedOption === undefined) {\n setInputText(getDropdownInputText(update))\n setInputValue(getDropdownInputValue(update))\n }\n\n if (onSelectOption) onSelectOption(update)\n\n inputRef.current?.focus()\n\n setMenuOpenRequest(!update)\n }\n }}\n />\n )\n })}\n </MenuList>\n )}\n </DropdownMenu>\n ) : undefined\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","optionsMultiToggle","loading","iconProps","menuProps","autoFocus","closeMenuOnScroll","contrast","selectedOption","defaultSelectedOption","icon","inputMode","loadingMessage","loadingIcon","loadingIconProps","maxLength","multiple","onCloseMenu","onOpenMenu","onSelectOption","options","optionsMultiToggleCaption","optionsEmptyMessage","optionsEmptyIcon","optionsEmptyIconProps","palette","placeholder","readOnly","required","status","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","form","rootProps","sizeProps","iconBaseProps","color","disabled","inputLabelId","useMemo","nanoid","getRelevantOptions","fuse","Fuse","default","threshold","ignoreLocation","keys","FuseSearchKeys","text","tags","pattern","length","search","map","result","item","inputText","setInputText","useState","getDropdownInputText","undefined","inputValue","setInputValue","getDropdownInputValue","inputMultipleValue","setInputMultipleValue","getDropdownInputMultipleValue","menuRelevantOptions","setMenuRelevantOptions","menuOpenRequest","setMenuOpenRequest","menuOptionsGroups","groupDropdownOptions","menuOpen","menuNoRelevantOptions","inputActive","Boolean","inputValueEmpty","multiToggleChecked","multiToggleIndeterminate","inputRef","useRef","menuRef","menuListRef","timeoutIdRef","inputTextPrevRef","menuOpenPrevRef","useEffect","current","setTimeout","clearTimeout","useLayoutEffect","handleScroll","evt","focus","currentTarget","removeEventListener","type","document","addEventListener","syncInputTextWithSelectedOption","selectedOptionText","selected","find","option","value","_jsx","FormInputLabel","labelId","active","onColored","error","success","jsx","Styled","up","labelColorDisabled","labelColor","backgroundColor","backgroundColorDisabled","backgroundColorHover","borderColor","borderColorDisabled","onClick","target","Node","contains","onKeyUp","keyboardKeys","Esc","validate","key","onPointerDown","preventDefault","onBlur","relatedTarget","input","_jsxs","jsxs","_Fragment","children","FormInput","label","autoComplete","autoCapitalize","autoCorrect","spellCheck","colorDisabled","placeholderColor","placeholderColorDisabled","selectionStart","selectionEnd","stopPropagation","onChange","onKeyDown","Enter","Space","prev","ArrowDown","focusFirstFocusable","addon","Chip","black","marginLeft","cursor","textProps","appearance","colorHover","discardButtonProps","dropdown","DropdownMenu","tabIndex","secondary","elevated","disableAutoFocus","menuBackgroundColor","menuBorderColor","onFocus","DropdownMenuNoOptions","emptyMessage","emptyIcon","emptyIconProps","MenuList","includes","optionStatus","optionErrorStatus","optionSuccessStatus","_createElement","ListItem","danger","borderRadius","ellipsis","wordBreak","control","InputCheckbox","sizes","SIZES_CHECKBOX","checked","update","filter","indeterminate","MenuDivider","createElement","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 } from 'react'\nimport Fuse from 'fuse.js'\nimport { nanoid } from 'nanoid'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { focusFirstFocusable } from 'shared/utils/dom'\nimport { keyboardKeys } from 'shared/constants'\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 type { IconProps } from 'components/Icon'\nimport { DropdownMenu } from './DropdownMenu'\nimport { DropdownMenuNoOptions } from './DropdownMenuNoOptions'\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 optionsMultiToggle = true,\n loading = false,\n iconProps = {},\n menuProps = {},\n loadingIconProps = {},\n optionsEmptyIconProps = {},\n autoFocus,\n closeMenuOnScroll,\n contrast,\n selectedOption,\n defaultSelectedOption,\n icon,\n inputMode,\n loadingMessage,\n loadingIcon,\n maxLength,\n multiple,\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 inputLabelId = 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 [inputSearched, setInputSearched] = 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 const menuNoRelevantOptions = menuRelevantOptions.length === 0 || loading\n\n const inputSynced = inputText === getDropdownInputText(dropdownSelectedOption)\n const inputRequired = required && dropdownSelectedOption.length === 0\n const inputActive = Boolean(menuOpen || inputText)\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>(null)\n const menuRef = useRef<HTMLDivElement | null>(null)\n const menuListRef = useRef<HTMLUListElement | null>(null)\n\n const timeoutIdRef = useRef<ReturnType<typeof setTimeout> | null>(null)\n\n const inputTextPrevRef = useRef<string>(inputText)\n const menuOpenPrevRef = useRef<boolean>(menuOpen)\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) setInputText(getDropdownInputText(selectedOption))\n setDropdownSelectedOption(getDropdownSelectedOption(selectedOption, multiple))\n }, [multiple, selectedOption])\n\n useEffect(() => {\n if (menuOpen === menuOpenPrevRef.current) return\n\n if (menuOpen && onOpenMenu) onOpenMenu()\n\n if (!menuOpen) {\n setInputSearched(false)\n if (onCloseMenu) onCloseMenu()\n }\n\n menuOpenPrevRef.current = menuOpen\n }, [menuOpen, onCloseMenu, onOpenMenu])\n\n useEffect(() => {\n const handleScroll = (evt: Event) => {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n\n if (evt.currentTarget) {\n evt.currentTarget.removeEventListener(evt.type, handleScroll)\n }\n }\n\n if (closeMenuOnScroll && menuOpen) {\n document.addEventListener('scroll', handleScroll)\n }\n\n return () => {\n document.removeEventListener('scroll', handleScroll)\n }\n }, [closeMenuOnScroll, menuOpen])\n\n return (\n <FormInputLabel\n {...rootProps}\n {...sizeProps}\n ref={ref}\n labelId={inputLabelId}\n labelPosition={labelPosition}\n active={inputActive}\n onColored={contrast}\n error={status === 'error'}\n success={status === 'success'}\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 } else if (menuRef.current && evt.target instanceof Node && !menuRef.current.contains(evt.target)) {\n setMenuOpenRequest(false)\n }\n }}\n onKeyUp={(evt) => {\n if (rootProps.onKeyUp) rootProps.onKeyUp(evt)\n\n if (keyboardKeys.Esc.validate(evt.key)) {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n }}\n onPointerDown={(evt) => {\n if (rootProps.onPointerDown) rootProps.onPointerDown(evt)\n\n if (evt.target !== inputRef.current && evt.target instanceof Node && evt.currentTarget.contains(evt.target)) {\n evt.preventDefault()\n }\n }}\n onBlur={(evt) => {\n if (rootProps.onBlur) rootProps.onBlur(evt)\n\n if (!evt.currentTarget.contains(evt.relatedTarget)) {\n setInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }\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 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 setInputSearched(true)\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 setMenuOpenRequest((prev) => !prev)\n }\n\n if (keyboardKeys.ArrowDown.validate(evt.key) && menuListRef.current) {\n evt.preventDefault()\n focusFirstFocusable(menuListRef.current)\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 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 contrast: !rootProps.disabled,\n onKeyDown: (evt) => {\n if (keyboardKeys.ArrowDown.validate(evt.key) && menuListRef.current) {\n evt.preventDefault()\n focusFirstFocusable(menuListRef.current)\n }\n },\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 setMenuOpenRequest(true)\n }\n },\n }}\n />\n ) : undefined\n }\n dropdown={\n menuOpen ? (\n <DropdownMenu\n {...menuProps}\n ref={menuRef}\n tabIndex={menuNoRelevantOptions ? undefined : 0}\n secondary={!contrast}\n elevated={contrast}\n disableAutoFocus\n palette={{\n backgroundColor: palette.menuBackgroundColor,\n borderColor: palette.menuBorderColor,\n }}\n onFocus={(evt) => {\n if (!menuListRef.current) return\n\n if (evt.target === evt.currentTarget) {\n if (menuListRef.current.contains(evt.relatedTarget)) {\n inputRef.current?.focus()\n } else {\n focusFirstFocusable(menuListRef.current)\n }\n }\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.Enter.validate(evt.key)) {\n inputRef.current?.focus()\n setInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }\n }}\n >\n {menuNoRelevantOptions ? (\n <DropdownMenuNoOptions\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 />\n ) : multiple ? (\n <MenuList ref={menuListRef}>\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 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 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 =\n 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 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(\n (item) => item.value !== evt.currentTarget.value\n )\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 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 ref={menuListRef}>\n {(inputSynced && !inputSearched ? options : menuRelevantOptions).map((option, _, optionsRendered) => {\n const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n return (\n <ListItem\n {...sizeProps}\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 = selected ? null : option\n\n if (selectedOption === undefined) {\n setInputText(getDropdownInputText(update))\n setDropdownSelectedOption(getDropdownSelectedOption(update))\n }\n\n if (onSelectOption) onSelectOption(update)\n\n if (update || optionsRendered === menuRelevantOptions) {\n inputRef.current?.focus()\n }\n\n setMenuOpenRequest(!update)\n }\n }}\n />\n )\n })}\n </MenuList>\n )}\n </DropdownMenu>\n ) : undefined\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","optionsMultiToggle","loading","iconProps","menuProps","loadingIconProps","optionsEmptyIconProps","autoFocus","closeMenuOnScroll","contrast","selectedOption","defaultSelectedOption","icon","inputMode","loadingMessage","loadingIcon","maxLength","multiple","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","inputLabelId","useMemo","nanoid","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","inputSearched","setInputSearched","menuRelevantOptions","setMenuRelevantOptions","menuOpenRequest","setMenuOpenRequest","menuOptionsGroups","groupDropdownOptions","menuOpen","menuNoRelevantOptions","inputSynced","inputRequired","inputActive","Boolean","multiToggleChecked","multiToggleIndeterminate","inputRef","useRef","menuRef","menuListRef","timeoutIdRef","inputTextPrevRef","menuOpenPrevRef","useEffect","current","setTimeout","clearTimeout","useLayoutEffect","handleScroll","evt","focus","currentTarget","removeEventListener","type","document","addEventListener","_jsx","FormInputLabel","labelId","active","onColored","error","success","jsx","Styled","up","labelColorDisabled","labelColor","backgroundColor","backgroundColorDisabled","backgroundColorHover","borderColor","borderColorDisabled","onClick","target","Node","contains","onKeyUp","keyboardKeys","Esc","validate","key","onPointerDown","preventDefault","onBlur","relatedTarget","input","_jsxs","jsxs","_Fragment","children","tabIndex","onFocus","FormInput","autoComplete","autoCapitalize","autoCorrect","spellCheck","value","colorDisabled","placeholderColor","placeholderColorDisabled","selectionStart","selectionEnd","stopPropagation","onChange","onKeyDown","Enter","Space","prev","ArrowDown","focusFirstFocusable","addon","Chip","black","marginLeft","cursor","textProps","appearance","colorHover","discardButtonProps","dropdown","DropdownMenu","secondary","elevated","disableAutoFocus","menuBackgroundColor","menuBorderColor","DropdownMenuNoOptions","emptyMessage","emptyIcon","emptyIconProps","MenuList","ListItem","borderRadius","ellipsis","wordBreak","control","InputCheckbox","SIZES_CHECKBOX","checked","indeterminate","update","MenuDivider","option","optionStatus","optionErrorStatus","optionSuccessStatus","_createElement","danger","filter","createElement","selected","findIndex","_","optionsRendered","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'../../external/.pnpm/fuse.js@7.0.0/node_modules/fuse.js/dist/fuse.mjs';import{nanoid}from'../../external/.pnpm/nanoid@5.0.7/node_modules/nanoid/index.browser.mjs';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{focusFirstFocusable}from'../../shared/utils/dom.mjs';import{keyboardKeys}from'../../shared/constants.mjs';import{DropdownMenu}from'./DropdownMenu.mjs';import{DropdownMenuNoOptions}from'./DropdownMenuNoOptions.mjs';import{SIZES,FuseSearchKeys,SIZES_CHECKBOX}from'./constants.mjs';import{getDropdownInputText,getDropdownInputValue,getDropdownInputMultipleValue,groupDropdownOptions}from'./utils.mjs';import{ChevronIcon}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{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",optionsMultiToggle:s=!0,loading:a=!1,iconProps:l={},menuProps:i={},autoFocus:c,closeMenuOnScroll:d,contrast:u,selectedOption:p,defaultSelectedOption:m,icon:g,inputMode:b,loadingMessage:f,loadingIcon:v,loadingIconProps:C,maxLength:h,multiple:x,onCloseMenu:k,onOpenMenu:w,onSelectOption:y,options:I,optionsMultiToggleCaption:D,optionsEmptyMessage:j,optionsEmptyIcon:M,optionsEmptyIconProps:E,palette:S,placeholder:P,readOnly:F,required:L,status:T,sizeXXS:z,sizeXS:K,sizeS:O,sizeM:B,sizeL:R,sizeXL:X,form:N,...H}=e;const _={size:t,sizeXXS:z,sizeXS:K,sizeS:O,sizeM:B,sizeL:R,sizeXL:X};const V={size:24,color:H.disabled?'content-disabled':'content-onmain-tertiary'};const Z=useMemo((()=>nanoid()),[]);const A=useMemo((()=>{const e=new Fuse(I,{threshold:.4,ignoreLocation:!0,keys:[FuseSearchKeys.text,FuseSearchKeys.tags]});return o=>o.length===0?I:e.search(o).map((e=>e.item))}),[I]);const[U,q]=useState((()=>x?'':getDropdownInputText(p!==void 0?p:m)));const[G,J]=useState((()=>getDropdownInputValue(p!==void 0?p:m)));const[Q,W]=useState((()=>getDropdownInputMultipleValue(p!==void 0?p:m)));const[Y,$]=useState((()=>A(U)));const[ee,oe]=useState(!1);const te=x?groupDropdownOptions(I,Q):[[],[]];const re=ee&&!H.disabled;const ne=Y.length===0||a;const se=Boolean(re||U);const ae=x?Q.length===0:G.length===0;const le=te[0].length>0&&te[1].length===0;const ie=te[0].length>0&&te[1].length>0;const ce=useRef(null);const de=useRef(null);const ue=useRef(null);const pe=useRef(null);const me=useRef(U);const ge=useRef(re);useEffect((()=>(U===me.current?$(A(U)):(me.current=U,pe.current=setTimeout((()=>{$(A(U))}),150)),()=>{pe.current&&clearTimeout(pe.current)})),[A,U]),useLayoutEffect((()=>{p!==void 0&&(x?W(getDropdownInputMultipleValue(p)):(q(getDropdownInputText(p)),J(getDropdownInputValue(p))))}),[x,p]),useEffect((()=>{re!==ge.current&&(re&&w&&w(),!re&&k&&k(),ge.current=re)}),[re,k,w]),useEffect((()=>{const handleScroll=e=>{ce.current?.focus(),oe(!1),e.currentTarget&&e.currentTarget.removeEventListener(e.type,handleScroll)};return d&&re&&document.addEventListener('scroll',handleScroll),()=>{document.removeEventListener('scroll',handleScroll)}}),[d,re]);const syncInputTextWithSelectedOption=()=>{let e='';if(!x){const o=I.find((e=>e.value===G));e=o?o.text:''}q(e)};return jsx(FormInputLabel,{...H,..._,ref:o,labelId:Z,labelPosition:n,active:se,onColored:u,error:T==='error',success:T==='success',icon:[g,jsx(ChevronIcon,{up:re},'chevron')],iconProps:{...V,...l},palette:{color:H.disabled?S.labelColorDisabled:S.labelColor,backgroundColor:H.disabled?S.backgroundColorDisabled:S.backgroundColor,backgroundColorHover:H.disabled?S.backgroundColorDisabled:S.backgroundColorHover,borderColor:H.disabled?S.borderColorDisabled:S.borderColor},onClick:e=>{H.onClick&&H.onClick(e),H.disabled||(ce.current?.focus(),re?de.current&&e.target instanceof Node&&!de.current.contains(e.target)&&oe(!1):oe(!0))},onKeyUp:e=>{H.onKeyUp&&H.onKeyUp(e),keyboardKeys.Esc.validate(e.key)&&(ce.current?.focus(),oe(!1))},onPointerDown:e=>{H.onPointerDown&&H.onPointerDown(e),e.target!==ce.current&&e.target instanceof Node&&e.currentTarget.contains(e.target)&&e.preventDefault()},onBlur:e=>{H.onBlur&&H.onBlur(e),e.currentTarget.contains(e.relatedTarget)||(syncInputTextWithSelectedOption(),oe(!1))},input:jsxs(Fragment,{children:[jsx(FormInput,{ref:ce,"aria-labelledby":H.label?Z:void 0,type:"text",autoComplete:"off",autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",autoFocus:c,inputMode:b,maxLength:h,placeholder:P,readOnly:F,required:L&&ae,disabled:H.disabled,value:U,palette:{color:S.color,colorDisabled:S.colorDisabled,placeholderColor:S.placeholderColor,placeholderColorDisabled:S.placeholderColorDisabled},onClick:e=>{re&&e.currentTarget.selectionStart!==e.currentTarget.selectionEnd&&e.stopPropagation()},onChange:e=>{q(e.currentTarget.value),oe(!0)},onKeyDown:e=>{keyboardKeys.Enter.validate(e.key)&&(syncInputTextWithSelectedOption(),oe(!1)),!keyboardKeys.Space.validate(e.key)||re&&e.currentTarget.selectionStart!==0||(e.preventDefault(),oe((e=>!e))),keyboardKeys.ArrowDown.validate(e.key)&&ue.current&&(e.preventDefault(),focusFirstFocusable(ue.current))}}),x?Q.map((e=>jsx("input",{type:"hidden",name:r,value:e,form:N,disabled:H.disabled},e))):G.length>0&&jsx("input",{type:"hidden",name:r,value:G,form:N,disabled:H.disabled})]}),addon:x&&Q.length>0?jsx(Chip,{size:"xs",active:!0,black:!0,marginLeft:12,disabled:H.disabled,cursor:H.disabled?'not-allowed':void 0,text:Q.length,textProps:{appearance:'caption',size:'xs'},palette:H.disabled?{color:'content-disabled',colorHover:'content-disabled',backgroundColor:'bg-disabled-small',backgroundColorHover:'bg-disabled-small'}:void 0,onPointerDown:e=>{e.preventDefault()},discardButtonProps:{contrast:!H.disabled,onKeyDown:e=>{keyboardKeys.ArrowDown.validate(e.key)&&ue.current&&(e.preventDefault(),focusFirstFocusable(ue.current))},onClick:e=>{e.stopPropagation(),F||(p===void 0&&W([]),y&&y([]),ce.current?.focus(),oe(!0))}}}):void 0,dropdown:re?jsx(DropdownMenu,{...i,ref:de,tabIndex:ne?void 0:0,secondary:!u,elevated:u,disableAutoFocus:!0,palette:{backgroundColor:S.menuBackgroundColor,borderColor:S.menuBorderColor},onFocus:e=>{ue.current&&e.target===e.currentTarget&&(ue.current.contains(e.relatedTarget)?ce.current?.focus():focusFirstFocusable(ue.current))},onKeyDown:e=>{keyboardKeys.Enter.validate(e.key)&&(ce.current?.focus(),syncInputTextWithSelectedOption(),oe(!1))},children:ne?jsx(DropdownMenuNoOptions,{loading:a,loadingMessage:f,loadingIcon:v,loadingIconProps:{...V,...C},emptyMessage:j,emptyIcon:M,emptyIconProps:{...V,...E}}):jsx(MenuList,x?{ref:ue,children:U.length>0?jsx(Fragment,{children:Y.map((e=>{const o=Q.includes(e.value);const t=e.status??T;const n=o&&t==='error';const s=o&&t==='success';return createElement(ListItem,{..._,key:e.value,text:e.text,danger:n,success:s,disabled:H.disabled,active:o,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:o,error:n,success:s,onChange:e=>{if(!F){const t=o?Q.filter((o=>o!==e.currentTarget.value)):[...Q,e.currentTarget.value];p===void 0&&W(t),y&&y(I.filter((e=>t.includes(e.value))))}}})})}))}):jsxs(Fragment,{children:[s&&jsx(ListItem,{..._,text:D,disabled:H.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{F&&e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,checked:le,indeterminate:ie,error:(le||ie)&&T==='error',success:(le||ie)&&T==='success',onChange:()=>{if(!F){const e=le||ie?[]:I.map((e=>e.value));p===void 0&&W(e),y&&y(e.length===0?[]:I)}}})}),s&&jsx(MenuDivider,{}),te[0].map((e=>{const o=e.status??T;const t=o==='error';const n=o==='success';return createElement(ListItem,{..._,key:e.value,active:!0,text:e.text,danger:t,success:n,disabled:H.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{F&&e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:!0,error:t,success:n,onChange:e=>{if(!F){const o=Q.filter((o=>o!==e.currentTarget.value));p===void 0&&W(o),y&&y(I.filter((e=>o.includes(e.value))))}}})})})),te[0].length>0&&te[1].length>0&&jsx(MenuDivider,{}),te[1].map((e=>createElement(ListItem,{..._,key:e.value,text:e.text,disabled:H.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{F&&e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:!1,onChange:e=>{if(!F){const o=[...Q,e.currentTarget.value];p===void 0&&W(o),y&&y(I.filter((e=>o.includes(e.value))))}}})})))]})}:{ref:ue,children:Y.map((e=>{const o=G===e.value;return createElement(ListItem,{..._,key:e.value,text:e.text,active:o,danger:o&&T==='error',success:o&&T==='success',disabled:H.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:t=>{if(t.stopPropagation(),!F){const t=o?null:e;p===void 0&&(q(getDropdownInputText(t)),J(getDropdownInputValue(t))),y&&y(t),ce.current?.focus(),oe(!t)}}})}))})}):void 0})})),{sizes:SIZES,displayName:"Dropdown"});export{COMPONENT_NAME,Dropdown};
|
|
1
|
+
import{forwardRef,useMemo,useState,useRef,useEffect,useLayoutEffect,createElement}from'react';import Fuse from'../../external/.pnpm/fuse.js@7.0.0/node_modules/fuse.js/dist/fuse.mjs';import{nanoid}from'../../external/.pnpm/nanoid@5.0.7/node_modules/nanoid/index.browser.mjs';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{focusFirstFocusable}from'../../shared/utils/dom.mjs';import{keyboardKeys}from'../../shared/constants.mjs';import{DropdownMenu}from'./DropdownMenu.mjs';import{DropdownMenuNoOptions}from'./DropdownMenuNoOptions.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{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,optionsMultiToggle:a=!0,loading:i=!1,iconProps:c={},menuProps:l={},loadingIconProps:d={},optionsEmptyIconProps:u={},autoFocus:p,closeMenuOnScroll:m,contrast:b,selectedOption:g,defaultSelectedOption:f,icon:v,inputMode:x,loadingMessage:C,loadingIcon:h,maxLength:k,multiple:I,onCloseMenu:w,onOpenMenu:y,onSelectOption:D,options:S,groupSelectedOptions:j,optionsMultiToggleCaption:E,optionsEmptyMessage:M,optionsEmptyIcon:P,palette:F,placeholder:L,readOnly:O,required:T,status:z,sizeXXS:K,sizeXS:B,sizeS:R,sizeM:N,sizeL:X,sizeXL:_,form:H,...Z}=e;const A={size:t,sizeXXS:K,sizeXS:B,sizeS:R,sizeM:N,sizeL:X,sizeXL:_};const q={sizes:SIZES_ICON,color:Z.disabled?'content-disabled':'content-onmain-tertiary'};const U=useMemo((()=>nanoid()),[]);const G=useMemo((()=>{const e=new Fuse(S,{threshold:.4,ignoreLocation:!0,keys:[FuseSearchKeys.text,FuseSearchKeys.label,FuseSearchKeys.tags]});return o=>o.length===0?S:e.search(o).map((e=>e.item))}),[S]);const[J,Q]=useState((()=>getDropdownSelectedOption(g!==void 0?g:f,I)));const[V,W]=useState((()=>getDropdownInputText(J,I)));const[Y,$]=useState(!1);const[ee,oe]=useState((()=>G(V)));const[te,re]=useState(!1);const ne=I?groupDropdownOptions(S,J):[[],[]];const se=te&&!Z.disabled;const ae=ee.length===0||i;const ie=V===getDropdownInputText(J);const ce=T&&J.length===0;const le=Boolean(se||V);const de=ne[0].length>0&&ne[1].length===0;const ue=ne[0].length>0&&ne[1].length>0;const pe=useRef(null);const me=useRef(null);const be=useRef(null);const ge=useRef(null);const fe=useRef(V);const ve=useRef(se);return useEffect((()=>(V===fe.current?oe(G(V)):(fe.current=V,ge.current=setTimeout((()=>{oe(G(V))}),150)),()=>{ge.current&&clearTimeout(ge.current)})),[G,V]),useLayoutEffect((()=>{g!==void 0&&(I||W(getDropdownInputText(g)),Q(getDropdownSelectedOption(g,I)))}),[I,g]),useEffect((()=>{se!==ve.current&&(se&&y&&y(),se||($(!1),w&&w()),ve.current=se)}),[se,w,y]),useEffect((()=>{const handleScroll=e=>{pe.current?.focus(),re(!1),e.currentTarget&&e.currentTarget.removeEventListener(e.type,handleScroll)};return m&&se&&document.addEventListener('scroll',handleScroll),()=>{document.removeEventListener('scroll',handleScroll)}}),[m,se]),jsx(FormInputLabel,{...Z,...A,ref:o,labelId:U,labelPosition:n,active:le,onColored:b,error:z==='error',success:z==='success',icon:[v,jsx(ChevronIcon,{up:se},'chevron')],iconProps:{...A,...q,...c},palette:{color:Z.disabled?F.labelColorDisabled:F.labelColor,backgroundColor:Z.disabled?F.backgroundColorDisabled:F.backgroundColor,backgroundColorHover:Z.disabled?F.backgroundColorDisabled:F.backgroundColorHover,borderColor:Z.disabled?F.borderColorDisabled:F.borderColor},onClick:e=>{Z.onClick&&Z.onClick(e),Z.disabled||(pe.current?.focus(),se?me.current&&e.target instanceof Node&&!me.current.contains(e.target)&&re(!1):re(!0))},onKeyUp:e=>{Z.onKeyUp&&Z.onKeyUp(e),keyboardKeys.Esc.validate(e.key)&&(pe.current?.focus(),re(!1))},onPointerDown:e=>{Z.onPointerDown&&Z.onPointerDown(e),e.target!==pe.current&&e.target instanceof Node&&e.currentTarget.contains(e.target)&&e.preventDefault()},onBlur:e=>{Z.onBlur&&Z.onBlur(e),e.currentTarget.contains(e.relatedTarget)||(W(getDropdownInputText(J,I)),re(!1))},input:jsxs(Fragment,{children:[ce&&!s&&!O&&jsx(InputMimic,{required:!0,type:"text",inputMode:"none",form:H,tabIndex:-1,onFocus:()=>{pe.current?.focus()}}),jsx(FormInput,{ref:pe,"aria-labelledby":Z.label?U:void 0,type:"text",autoComplete:"off",autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",form:H,autoFocus:p,inputMode:s?x:'none',maxLength:k,placeholder:L,readOnly:O||!s,required:ce,disabled:Z.disabled,value:V,palette:{color:F.color,colorDisabled:F.colorDisabled,placeholderColor:F.placeholderColor,placeholderColorDisabled:F.placeholderColorDisabled},onClick:e=>{se&&e.currentTarget.selectionStart!==e.currentTarget.selectionEnd&&e.stopPropagation()},onChange:e=>{W(e.currentTarget.value),$(!0),re(!0)},onKeyDown:e=>{keyboardKeys.Enter.validate(e.key)&&(W(getDropdownInputText(J,I)),re(!1)),!keyboardKeys.Space.validate(e.key)||se&&e.currentTarget.selectionStart!==0||(e.preventDefault(),re((e=>!e))),keyboardKeys.ArrowDown.validate(e.key)&&be.current&&(e.preventDefault(),focusFirstFocusable(be.current))}}),J.map((e=>jsx("input",{type:"hidden",name:r,value:e.value,form:H,disabled:Z.disabled},e.value)))]}),addon:I&&J.length>0?jsx(Chip,{size:"xs",active:!0,black:!0,marginLeft:12,disabled:Z.disabled,cursor:Z.disabled?'not-allowed':void 0,text:J.length,textProps:{appearance:'caption',size:'xs'},palette:Z.disabled?{color:'content-disabled',colorHover:'content-disabled',backgroundColor:'bg-disabled-small',backgroundColorHover:'bg-disabled-small'}:void 0,onPointerDown:e=>{e.preventDefault()},discardButtonProps:{contrast:!Z.disabled,onKeyDown:e=>{keyboardKeys.ArrowDown.validate(e.key)&&be.current&&(e.preventDefault(),focusFirstFocusable(be.current))},onClick:e=>{e.stopPropagation(),O||(g===void 0&&Q([]),D&&D([]),pe.current?.focus(),re(!0))}}}):void 0,dropdown:se?jsx(DropdownMenu,{...l,ref:me,tabIndex:ae?void 0:0,secondary:!b,elevated:b,disableAutoFocus:!0,palette:{backgroundColor:F.menuBackgroundColor,borderColor:F.menuBorderColor},onFocus:e=>{be.current&&e.target===e.currentTarget&&(be.current.contains(e.relatedTarget)?pe.current?.focus():focusFirstFocusable(be.current))},onKeyDown:e=>{keyboardKeys.Enter.validate(e.key)&&(pe.current?.focus(),W(getDropdownInputText(J,I)),re(!1))},children:ae?jsx(DropdownMenuNoOptions,{loading:i,loadingMessage:C,loadingIcon:h,loadingIconProps:{...A,...q,...d},emptyMessage:M,emptyIcon:P,emptyIconProps:{...A,...q,...u}}):jsx(MenuList,I?{ref:be,children:V.length===0?jsxs(Fragment,{children:[a&&jsx(ListItem,{...A,text:E,disabled:Z.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,checked:de,indeterminate:ue,error:(de||ue)&&z==='error',success:(de||ue)&&z==='success',onChange:()=>{if(!O){const e=de||ue?[]:[...S];g===void 0&&Q(e),D&&D(e)}}})}),a&&jsx(MenuDivider,{}),j&&ne[0].map((e=>{const o=e.status??z;const t=o==='error';const n=o==='success';return createElement(ListItem,{...A,key:e.value,active:!0,text:e.text,danger:t,success:n,disabled:Z.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation(),pe.current?.focus()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:!0,error:t,success:n,onChange:e=>{if(!O){const o=J.filter((o=>o.value!==e.currentTarget.value));g===void 0&&Q(o),D&&D(o)}}})})})),j&&ne[0].length>0&&ne[1].length>0&&jsx(MenuDivider,{}),j&&ne[1].map((e=>createElement(ListItem,{...A,key:e.value,text:e.text,disabled:Z.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation(),pe.current?.focus()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:!1,onChange:()=>{if(!O){const o=[...J,e];g===void 0&&Q(o),D&&D(o)}}})}))),!j&&S.map((e=>{const o=J.findIndex((o=>o.value===e.value))!==-1;const t=e.status??z;const n=o&&t==='error';const s=o&&t==='success';return createElement(ListItem,{...A,key:e.value,text:e.text,danger:n,success:s,disabled:Z.disabled,active:o,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:o,error:n,success:s,onChange:t=>{if(!O){const r=o?J.filter((e=>e.value!==t.currentTarget.value)):[...J,e];g===void 0&&Q(r),D&&D(r)}}})})}))]}):jsx(Fragment,{children:ee.map((e=>{const o=J.findIndex((o=>o.value===e.value))!==-1;const t=e.status??z;const n=o&&t==='error';const s=o&&t==='success';return createElement(ListItem,{...A,key:e.value,text:e.text,danger:n,success:s,disabled:Z.disabled,active:o,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:o,error:n,success:s,onChange:t=>{if(!O){const r=o?J.filter((e=>e.value!==t.currentTarget.value)):[...J,e];g===void 0&&Q(r),D&&D(r)}}})})}))})}:{ref:be,children:(ie&&!Y?S:ee).map(((e,o,t)=>{const r=J.findIndex((o=>o.value===e.value))!==-1;return createElement(ListItem,{...A,key:e.value,text:e.text,active:r,danger:r&&z==='error',success:r&&z==='success',disabled:Z.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:o=>{if(o.stopPropagation(),!O){const o=r?null:e;g===void 0&&(W(getDropdownInputText(o)),Q(getDropdownSelectedOption(o))),D&&D(o),(o||t===ee)&&pe.current?.focus(),re(!o)}}})}))})}):void 0})})),{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 { focusFirstFocusable } from 'shared/utils/dom'\nimport { keyboardKeys } from 'shared/constants'\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 type { IconProps } from 'components/Icon'\nimport { DropdownMenu } from './DropdownMenu'\nimport { DropdownMenuNoOptions } from './DropdownMenuNoOptions'\nimport { SIZES, SIZES_CHECKBOX, FuseSearchKeys } from './constants'\nimport {\n getDropdownInputText,\n getDropdownInputValue,\n getDropdownInputMultipleValue,\n groupDropdownOptions,\n} 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 optionsMultiToggle = true,\n loading = false,\n iconProps = {},\n menuProps = {},\n autoFocus,\n closeMenuOnScroll,\n contrast,\n selectedOption,\n defaultSelectedOption,\n icon,\n inputMode,\n loadingMessage,\n loadingIcon,\n loadingIconProps,\n maxLength,\n multiple,\n onCloseMenu,\n onOpenMenu,\n onSelectOption,\n options,\n optionsMultiToggleCaption,\n optionsEmptyMessage,\n optionsEmptyIcon,\n optionsEmptyIconProps,\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 size: 24,\n color: rootProps.disabled ? 'content-disabled' : 'content-onmain-tertiary',\n }\n\n const inputLabelId = 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.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 [inputText, setInputText] = useState<string>(() => {\n if (multiple) return ''\n\n if (selectedOption !== undefined) return getDropdownInputText(selectedOption)\n\n return getDropdownInputText(defaultSelectedOption)\n })\n\n const [inputValue, setInputValue] = useState<string>(() => {\n if (selectedOption !== undefined) return getDropdownInputValue(selectedOption)\n\n return getDropdownInputValue(defaultSelectedOption)\n })\n\n const [inputMultipleValue, setInputMultipleValue] = useState<string[]>(() => {\n if (selectedOption !== undefined) return getDropdownInputMultipleValue(selectedOption)\n\n return getDropdownInputMultipleValue(defaultSelectedOption)\n })\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, inputMultipleValue)\n : [[], []]\n\n const menuOpen = menuOpenRequest && !rootProps.disabled\n const menuNoRelevantOptions = menuRelevantOptions.length === 0 || loading\n\n const inputActive = Boolean(menuOpen || inputText)\n const inputValueEmpty = multiple ? inputMultipleValue.length === 0 : inputValue.length === 0\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>(null)\n const menuRef = useRef<HTMLDivElement | null>(null)\n const menuListRef = useRef<HTMLUListElement | null>(null)\n\n const timeoutIdRef = useRef<ReturnType<typeof setTimeout> | null>(null)\n\n const inputTextPrevRef = useRef<string>(inputText)\n const menuOpenPrevRef = useRef<boolean>(menuOpen)\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) {\n setInputMultipleValue(getDropdownInputMultipleValue(selectedOption))\n } else {\n setInputText(getDropdownInputText(selectedOption))\n setInputValue(getDropdownInputValue(selectedOption))\n }\n }, [multiple, selectedOption])\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 const handleScroll = (evt: Event) => {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n\n if (evt.currentTarget) {\n evt.currentTarget.removeEventListener(evt.type, handleScroll)\n }\n }\n\n if (closeMenuOnScroll && menuOpen) {\n document.addEventListener('scroll', handleScroll)\n }\n\n return () => {\n document.removeEventListener('scroll', handleScroll)\n }\n }, [closeMenuOnScroll, menuOpen])\n\n const syncInputTextWithSelectedOption = () => {\n let selectedOptionText = ''\n\n if (!multiple) {\n const selected = options.find((option) => option.value === inputValue)\n selectedOptionText = selected ? selected.text : ''\n }\n\n setInputText(selectedOptionText)\n }\n\n return (\n <FormInputLabel\n {...rootProps}\n {...sizeProps}\n ref={ref}\n labelId={inputLabelId}\n labelPosition={labelPosition}\n active={inputActive}\n onColored={contrast}\n error={status === 'error'}\n success={status === 'success'}\n icon={[icon, <Styled.ChevronIcon key='chevron' up={menuOpen} />]}\n iconProps={{ ...iconBaseProps, ...iconProps }}\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 } else if (menuRef.current && evt.target instanceof Node && !menuRef.current.contains(evt.target)) {\n setMenuOpenRequest(false)\n }\n }}\n onKeyUp={(evt) => {\n if (rootProps.onKeyUp) rootProps.onKeyUp(evt)\n\n if (keyboardKeys.Esc.validate(evt.key)) {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n }}\n onPointerDown={(evt) => {\n if (rootProps.onPointerDown) rootProps.onPointerDown(evt)\n\n if (evt.target !== inputRef.current && evt.target instanceof Node && evt.currentTarget.contains(evt.target)) {\n evt.preventDefault()\n }\n }}\n onBlur={(evt) => {\n if (rootProps.onBlur) rootProps.onBlur(evt)\n\n if (!evt.currentTarget.contains(evt.relatedTarget)) {\n syncInputTextWithSelectedOption()\n setMenuOpenRequest(false)\n }\n }}\n input={\n <>\n <FormInput\n ref={inputRef}\n aria-labelledby={rootProps.label ? inputLabelId : undefined}\n type='text'\n autoComplete='off'\n autoCapitalize='off'\n autoCorrect='off'\n spellCheck='false'\n autoFocus={autoFocus}\n inputMode={inputMode}\n maxLength={maxLength}\n placeholder={placeholder}\n readOnly={readOnly}\n required={required && inputValueEmpty}\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 syncInputTextWithSelectedOption()\n setMenuOpenRequest(false)\n }\n\n if (keyboardKeys.Space.validate(evt.key) && (!menuOpen || evt.currentTarget.selectionStart === 0)) {\n evt.preventDefault()\n setMenuOpenRequest((prev) => !prev)\n }\n\n if (keyboardKeys.ArrowDown.validate(evt.key) && menuListRef.current) {\n evt.preventDefault()\n focusFirstFocusable(menuListRef.current)\n }\n }}\n />\n {multiple\n ? inputMultipleValue.map((value) => (\n <input\n key={value}\n type='hidden'\n name={name}\n value={value}\n form={form}\n disabled={rootProps.disabled}\n />\n ))\n : inputValue.length > 0 && (\n <input type='hidden' name={name} value={inputValue} form={form} disabled={rootProps.disabled} />\n )}\n </>\n }\n addon={\n multiple && inputMultipleValue.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={inputMultipleValue.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 contrast: !rootProps.disabled,\n onKeyDown: (evt) => {\n if (keyboardKeys.ArrowDown.validate(evt.key) && menuListRef.current) {\n evt.preventDefault()\n focusFirstFocusable(menuListRef.current)\n }\n },\n onClick: (evt) => {\n evt.stopPropagation()\n\n if (!readOnly) {\n if (selectedOption === undefined) {\n setInputMultipleValue([])\n }\n\n if (onSelectOption) onSelectOption([])\n\n inputRef.current?.focus()\n setMenuOpenRequest(true)\n }\n },\n }}\n />\n ) : undefined\n }\n dropdown={\n menuOpen ? (\n <DropdownMenu\n {...menuProps}\n ref={menuRef}\n tabIndex={menuNoRelevantOptions ? undefined : 0}\n secondary={!contrast}\n elevated={contrast}\n disableAutoFocus\n palette={{\n backgroundColor: palette.menuBackgroundColor,\n borderColor: palette.menuBorderColor,\n }}\n onFocus={(evt) => {\n if (!menuListRef.current) return\n\n if (evt.target === evt.currentTarget) {\n if (menuListRef.current.contains(evt.relatedTarget)) {\n inputRef.current?.focus()\n } else {\n focusFirstFocusable(menuListRef.current)\n }\n }\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.Enter.validate(evt.key)) {\n inputRef.current?.focus()\n syncInputTextWithSelectedOption()\n setMenuOpenRequest(false)\n }\n }}\n >\n {menuNoRelevantOptions ? (\n <DropdownMenuNoOptions\n loading={loading}\n loadingMessage={loadingMessage}\n loadingIcon={loadingIcon}\n loadingIconProps={{ ...iconBaseProps, ...loadingIconProps }}\n emptyMessage={optionsEmptyMessage}\n emptyIcon={optionsEmptyIcon}\n emptyIconProps={{ ...iconBaseProps, ...optionsEmptyIconProps }}\n />\n ) : multiple ? (\n <MenuList ref={menuListRef}>\n {inputText.length > 0 ? (\n <>\n {menuRelevantOptions.map((option) => {\n const selected = inputMultipleValue.includes(option.value)\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 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 ? inputMultipleValue.filter((value) => value !== evt.currentTarget.value)\n : [...inputMultipleValue, evt.currentTarget.value]\n\n if (selectedOption === undefined) {\n setInputMultipleValue(update)\n }\n\n if (onSelectOption) {\n onSelectOption(options.filter((option) => update.includes(option.value)))\n }\n }\n }}\n />\n }\n />\n )\n })}\n </>\n ) : (\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 if (readOnly) 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 =\n multiToggleChecked || multiToggleIndeterminate\n ? []\n : options.map((option) => option.value)\n\n if (selectedOption === undefined) {\n setInputMultipleValue(update)\n }\n\n if (onSelectOption) onSelectOption(update.length === 0 ? [] : options)\n }\n }}\n />\n }\n />\n )}\n {optionsMultiToggle && <MenuDivider />}\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 if (readOnly) evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n name={name}\n value={option.value}\n checked\n error={optionErrorStatus}\n success={optionSuccessStatus}\n onChange={(evt) => {\n if (!readOnly) {\n const update = inputMultipleValue.filter(\n (value) => value !== evt.currentTarget.value\n )\n\n if (selectedOption === undefined) {\n setInputMultipleValue(update)\n }\n\n if (onSelectOption) {\n onSelectOption(options.filter((option) => update.includes(option.value)))\n }\n }\n }}\n />\n }\n />\n )\n })}\n {menuOptionsGroups[0].length > 0 && menuOptionsGroups[1].length > 0 && <MenuDivider />}\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 if (readOnly) evt.stopPropagation()\n }}\n control={\n <InputCheckbox\n sizes={SIZES_CHECKBOX}\n form='none'\n name={name}\n value={option.value}\n checked={false}\n onChange={(evt) => {\n if (!readOnly) {\n const update = [...inputMultipleValue, evt.currentTarget.value]\n\n if (selectedOption === undefined) {\n setInputMultipleValue(update)\n }\n\n if (onSelectOption) {\n onSelectOption(options.filter((option) => update.includes(option.value)))\n }\n }\n }}\n />\n }\n />\n ))}\n </>\n )}\n </MenuList>\n ) : (\n <MenuList ref={menuListRef}>\n {menuRelevantOptions.map((option) => {\n const selected = inputValue === option.value\n\n return (\n <ListItem\n {...sizeProps}\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 = selected ? null : option\n\n if (selectedOption === undefined) {\n setInputText(getDropdownInputText(update))\n setInputValue(getDropdownInputValue(update))\n }\n\n if (onSelectOption) onSelectOption(update)\n\n inputRef.current?.focus()\n\n setMenuOpenRequest(!update)\n }\n }}\n />\n )\n })}\n </MenuList>\n )}\n </DropdownMenu>\n ) : undefined\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","optionsMultiToggle","loading","iconProps","menuProps","autoFocus","closeMenuOnScroll","contrast","selectedOption","defaultSelectedOption","icon","inputMode","loadingMessage","loadingIcon","loadingIconProps","maxLength","multiple","onCloseMenu","onOpenMenu","onSelectOption","options","optionsMultiToggleCaption","optionsEmptyMessage","optionsEmptyIcon","optionsEmptyIconProps","palette","placeholder","readOnly","required","status","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","form","rootProps","sizeProps","iconBaseProps","color","disabled","inputLabelId","useMemo","nanoid","getRelevantOptions","fuse","Fuse","threshold","ignoreLocation","keys","FuseSearchKeys","text","tags","pattern","length","search","map","result","item","inputText","setInputText","useState","getDropdownInputText","undefined","inputValue","setInputValue","getDropdownInputValue","inputMultipleValue","setInputMultipleValue","getDropdownInputMultipleValue","menuRelevantOptions","setMenuRelevantOptions","menuOpenRequest","setMenuOpenRequest","menuOptionsGroups","groupDropdownOptions","menuOpen","menuNoRelevantOptions","inputActive","Boolean","inputValueEmpty","multiToggleChecked","multiToggleIndeterminate","inputRef","useRef","menuRef","menuListRef","timeoutIdRef","inputTextPrevRef","menuOpenPrevRef","useEffect","current","setTimeout","clearTimeout","useLayoutEffect","handleScroll","evt","focus","currentTarget","removeEventListener","type","document","addEventListener","syncInputTextWithSelectedOption","selectedOptionText","selected","find","option","value","_jsx","FormInputLabel","labelId","active","onColored","error","success","Styled","up","labelColorDisabled","labelColor","backgroundColor","backgroundColorDisabled","backgroundColorHover","borderColor","borderColorDisabled","onClick","target","Node","contains","onKeyUp","keyboardKeys","Esc","validate","key","onPointerDown","preventDefault","onBlur","relatedTarget","input","_jsxs","_Fragment","children","FormInput","label","autoComplete","autoCapitalize","autoCorrect","spellCheck","colorDisabled","placeholderColor","placeholderColorDisabled","selectionStart","selectionEnd","stopPropagation","onChange","onKeyDown","Enter","Space","prev","ArrowDown","focusFirstFocusable","addon","Chip","black","marginLeft","cursor","textProps","appearance","colorHover","discardButtonProps","dropdown","DropdownMenu","tabIndex","secondary","elevated","disableAutoFocus","menuBackgroundColor","menuBorderColor","onFocus","DropdownMenuNoOptions","emptyMessage","emptyIcon","emptyIconProps","MenuList","includes","optionStatus","optionErrorStatus","optionSuccessStatus","_createElement","ListItem","danger","borderRadius","ellipsis","wordBreak","control","InputCheckbox","sizes","SIZES_CHECKBOX","checked","update","filter","indeterminate","MenuDivider","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 } from 'react'\nimport Fuse from 'fuse.js'\nimport { nanoid } from 'nanoid'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { focusFirstFocusable } from 'shared/utils/dom'\nimport { keyboardKeys } from 'shared/constants'\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 type { IconProps } from 'components/Icon'\nimport { DropdownMenu } from './DropdownMenu'\nimport { DropdownMenuNoOptions } from './DropdownMenuNoOptions'\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 optionsMultiToggle = true,\n loading = false,\n iconProps = {},\n menuProps = {},\n loadingIconProps = {},\n optionsEmptyIconProps = {},\n autoFocus,\n closeMenuOnScroll,\n contrast,\n selectedOption,\n defaultSelectedOption,\n icon,\n inputMode,\n loadingMessage,\n loadingIcon,\n maxLength,\n multiple,\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 inputLabelId = 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 [inputSearched, setInputSearched] = 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 const menuNoRelevantOptions = menuRelevantOptions.length === 0 || loading\n\n const inputSynced = inputText === getDropdownInputText(dropdownSelectedOption)\n const inputRequired = required && dropdownSelectedOption.length === 0\n const inputActive = Boolean(menuOpen || inputText)\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>(null)\n const menuRef = useRef<HTMLDivElement | null>(null)\n const menuListRef = useRef<HTMLUListElement | null>(null)\n\n const timeoutIdRef = useRef<ReturnType<typeof setTimeout> | null>(null)\n\n const inputTextPrevRef = useRef<string>(inputText)\n const menuOpenPrevRef = useRef<boolean>(menuOpen)\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) setInputText(getDropdownInputText(selectedOption))\n setDropdownSelectedOption(getDropdownSelectedOption(selectedOption, multiple))\n }, [multiple, selectedOption])\n\n useEffect(() => {\n if (menuOpen === menuOpenPrevRef.current) return\n\n if (menuOpen && onOpenMenu) onOpenMenu()\n\n if (!menuOpen) {\n setInputSearched(false)\n if (onCloseMenu) onCloseMenu()\n }\n\n menuOpenPrevRef.current = menuOpen\n }, [menuOpen, onCloseMenu, onOpenMenu])\n\n useEffect(() => {\n const handleScroll = (evt: Event) => {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n\n if (evt.currentTarget) {\n evt.currentTarget.removeEventListener(evt.type, handleScroll)\n }\n }\n\n if (closeMenuOnScroll && menuOpen) {\n document.addEventListener('scroll', handleScroll)\n }\n\n return () => {\n document.removeEventListener('scroll', handleScroll)\n }\n }, [closeMenuOnScroll, menuOpen])\n\n return (\n <FormInputLabel\n {...rootProps}\n {...sizeProps}\n ref={ref}\n labelId={inputLabelId}\n labelPosition={labelPosition}\n active={inputActive}\n onColored={contrast}\n error={status === 'error'}\n success={status === 'success'}\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 } else if (menuRef.current && evt.target instanceof Node && !menuRef.current.contains(evt.target)) {\n setMenuOpenRequest(false)\n }\n }}\n onKeyUp={(evt) => {\n if (rootProps.onKeyUp) rootProps.onKeyUp(evt)\n\n if (keyboardKeys.Esc.validate(evt.key)) {\n inputRef.current?.focus()\n setMenuOpenRequest(false)\n }\n }}\n onPointerDown={(evt) => {\n if (rootProps.onPointerDown) rootProps.onPointerDown(evt)\n\n if (evt.target !== inputRef.current && evt.target instanceof Node && evt.currentTarget.contains(evt.target)) {\n evt.preventDefault()\n }\n }}\n onBlur={(evt) => {\n if (rootProps.onBlur) rootProps.onBlur(evt)\n\n if (!evt.currentTarget.contains(evt.relatedTarget)) {\n setInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }\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 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 setInputSearched(true)\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 setMenuOpenRequest((prev) => !prev)\n }\n\n if (keyboardKeys.ArrowDown.validate(evt.key) && menuListRef.current) {\n evt.preventDefault()\n focusFirstFocusable(menuListRef.current)\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 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 contrast: !rootProps.disabled,\n onKeyDown: (evt) => {\n if (keyboardKeys.ArrowDown.validate(evt.key) && menuListRef.current) {\n evt.preventDefault()\n focusFirstFocusable(menuListRef.current)\n }\n },\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 setMenuOpenRequest(true)\n }\n },\n }}\n />\n ) : undefined\n }\n dropdown={\n menuOpen ? (\n <DropdownMenu\n {...menuProps}\n ref={menuRef}\n tabIndex={menuNoRelevantOptions ? undefined : 0}\n secondary={!contrast}\n elevated={contrast}\n disableAutoFocus\n palette={{\n backgroundColor: palette.menuBackgroundColor,\n borderColor: palette.menuBorderColor,\n }}\n onFocus={(evt) => {\n if (!menuListRef.current) return\n\n if (evt.target === evt.currentTarget) {\n if (menuListRef.current.contains(evt.relatedTarget)) {\n inputRef.current?.focus()\n } else {\n focusFirstFocusable(menuListRef.current)\n }\n }\n }}\n onKeyDown={(evt) => {\n if (keyboardKeys.Enter.validate(evt.key)) {\n inputRef.current?.focus()\n setInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n setMenuOpenRequest(false)\n }\n }}\n >\n {menuNoRelevantOptions ? (\n <DropdownMenuNoOptions\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 />\n ) : multiple ? (\n <MenuList ref={menuListRef}>\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 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 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 =\n 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 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(\n (item) => item.value !== evt.currentTarget.value\n )\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 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 ref={menuListRef}>\n {(inputSynced && !inputSearched ? options : menuRelevantOptions).map((option, _, optionsRendered) => {\n const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n return (\n <ListItem\n {...sizeProps}\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 = selected ? null : option\n\n if (selectedOption === undefined) {\n setInputText(getDropdownInputText(update))\n setDropdownSelectedOption(getDropdownSelectedOption(update))\n }\n\n if (onSelectOption) onSelectOption(update)\n\n if (update || optionsRendered === menuRelevantOptions) {\n inputRef.current?.focus()\n }\n\n setMenuOpenRequest(!update)\n }\n }}\n />\n )\n })}\n </MenuList>\n )}\n </DropdownMenu>\n ) : undefined\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","optionsMultiToggle","loading","iconProps","menuProps","loadingIconProps","optionsEmptyIconProps","autoFocus","closeMenuOnScroll","contrast","selectedOption","defaultSelectedOption","icon","inputMode","loadingMessage","loadingIcon","maxLength","multiple","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","inputLabelId","useMemo","nanoid","getRelevantOptions","fuse","Fuse","threshold","ignoreLocation","keys","FuseSearchKeys","text","label","tags","pattern","length","search","map","result","item","dropdownSelectedOption","setDropdownSelectedOption","useState","getDropdownSelectedOption","undefined","inputText","setInputText","getDropdownInputText","inputSearched","setInputSearched","menuRelevantOptions","setMenuRelevantOptions","menuOpenRequest","setMenuOpenRequest","menuOptionsGroups","groupDropdownOptions","menuOpen","menuNoRelevantOptions","inputSynced","inputRequired","inputActive","Boolean","multiToggleChecked","multiToggleIndeterminate","inputRef","useRef","menuRef","menuListRef","timeoutIdRef","inputTextPrevRef","menuOpenPrevRef","useEffect","current","setTimeout","clearTimeout","useLayoutEffect","handleScroll","evt","focus","currentTarget","removeEventListener","type","document","addEventListener","_jsx","FormInputLabel","labelId","active","onColored","error","success","Styled","up","labelColorDisabled","labelColor","backgroundColor","backgroundColorDisabled","backgroundColorHover","borderColor","borderColorDisabled","onClick","target","Node","contains","onKeyUp","keyboardKeys","Esc","validate","key","onPointerDown","preventDefault","onBlur","relatedTarget","input","_jsxs","_Fragment","children","tabIndex","onFocus","FormInput","autoComplete","autoCapitalize","autoCorrect","spellCheck","value","colorDisabled","placeholderColor","placeholderColorDisabled","selectionStart","selectionEnd","stopPropagation","onChange","onKeyDown","Enter","Space","prev","ArrowDown","focusFirstFocusable","addon","Chip","black","marginLeft","cursor","textProps","appearance","colorHover","discardButtonProps","dropdown","DropdownMenu","secondary","elevated","disableAutoFocus","menuBackgroundColor","menuBorderColor","DropdownMenuNoOptions","emptyMessage","emptyIcon","emptyIconProps","MenuList","ListItem","borderRadius","ellipsis","wordBreak","control","InputCheckbox","SIZES_CHECKBOX","checked","indeterminate","update","MenuDivider","option","optionStatus","optionErrorStatus","optionSuccessStatus","_createElement","danger","filter","selected","findIndex","_","optionsRendered","SIZES","displayName"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
'use strict';var style=require('./style.js');var require$$0=require('react/jsx-runtime');var MenuContainer=require('../MenuContainer/MenuContainer.js');var Icon=require('../Icon/Icon.js');var Text=require('../Text/Text.js');exports.DropdownMenuNoOptions=e=>{const{loadingIcon:r=require$$0.jsx(style.LoadingIconAnimated,{}),emptyIcon:n="redo",loadingIconProps:i={},emptyIconProps:t={},loading:o,loadingMessage:a,emptyMessage:s}=e;return require$$0.jsxs(MenuContainer.MenuContainer,{children:[require$$0.jsx(style.IconContainer,{children:require$$0.jsx(Icon.Icon,o?{
|
|
1
|
+
'use strict';var style=require('./style.js');var require$$0=require('react/jsx-runtime');var MenuContainer=require('../MenuContainer/MenuContainer.js');var Icon=require('../Icon/Icon.js');var Text=require('../Text/Text.js');exports.DropdownMenuNoOptions=e=>{const{loadingIcon:r=require$$0.jsx(style.LoadingIconAnimated,{}),emptyIcon:n="redo",loadingIconProps:i={},emptyIconProps:t={},loading:o,loadingMessage:a,emptyMessage:s}=e;return require$$0.jsxs(MenuContainer.MenuContainer,{children:[require$$0.jsx(style.IconContainer,{children:require$$0.jsx(Icon.Icon,o?{preset:"brand",name:typeof r=='string'?r:void 0,icon:typeof r!='string'?r:void 0,...i}:{preset:"brand",name:typeof n=='string'?n:void 0,icon:typeof n!='string'?n:void 0,...t})}),o&&a&&require$$0.jsx(Text.Text,{as:"p",appearance:"body",size:"inherit",color:"inherit",textAlign:"center",wordBreak:"break-word",marginRight:12,marginBottom:12,marginLeft:12,children:a}),!o&&s&&require$$0.jsx(Text.Text,{as:"p",appearance:"body",size:"inherit",color:"inherit",textAlign:"center",wordBreak:"break-word",marginRight:12,marginBottom:12,marginLeft:12,children:s})]})};
|
|
2
2
|
//# sourceMappingURL=DropdownMenuNoOptions.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenuNoOptions.js","sources":["../../../../src/components/Dropdown/DropdownMenuNoOptions.tsx"],"sourcesContent":["import { MenuContainer } from 'components/MenuContainer'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport * as Styled from './style'\n\nimport type { DropdownMenuNoOptionsProps } from './types'\n\nconst DropdownMenuNoOptions = (props: DropdownMenuNoOptionsProps) => {\n const {\n loadingIcon = <Styled.LoadingIconAnimated />,\n emptyIcon = 'redo',\n loadingIconProps = {},\n emptyIconProps = {},\n loading,\n loadingMessage,\n emptyMessage,\n } = props\n\n return (\n <MenuContainer>\n <Styled.IconContainer>\n {loading ? (\n <Icon\n
|
|
1
|
+
{"version":3,"file":"DropdownMenuNoOptions.js","sources":["../../../../src/components/Dropdown/DropdownMenuNoOptions.tsx"],"sourcesContent":["import { MenuContainer } from 'components/MenuContainer'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport * as Styled from './style'\n\nimport type { DropdownMenuNoOptionsProps } from './types'\n\nconst DropdownMenuNoOptions = (props: DropdownMenuNoOptionsProps) => {\n const {\n loadingIcon = <Styled.LoadingIconAnimated />,\n emptyIcon = 'redo',\n loadingIconProps = {},\n emptyIconProps = {},\n loading,\n loadingMessage,\n emptyMessage,\n } = props\n\n return (\n <MenuContainer>\n <Styled.IconContainer>\n {loading ? (\n <Icon\n preset='brand'\n name={typeof loadingIcon === 'string' ? loadingIcon : undefined}\n icon={typeof loadingIcon !== 'string' ? loadingIcon : undefined}\n {...loadingIconProps}\n />\n ) : (\n <Icon\n preset='brand'\n name={typeof emptyIcon === 'string' ? emptyIcon : undefined}\n icon={typeof emptyIcon !== 'string' ? emptyIcon : undefined}\n {...emptyIconProps}\n />\n )}\n </Styled.IconContainer>\n {loading && loadingMessage && (\n <Text\n as='p'\n appearance='body'\n size='inherit'\n color='inherit'\n textAlign='center'\n wordBreak='break-word'\n marginRight={12}\n marginBottom={12}\n marginLeft={12}\n >\n {loadingMessage}\n </Text>\n )}\n {!loading && emptyMessage && (\n <Text\n as='p'\n appearance='body'\n size='inherit'\n color='inherit'\n textAlign='center'\n wordBreak='break-word'\n marginRight={12}\n marginBottom={12}\n marginLeft={12}\n >\n {emptyMessage}\n </Text>\n )}\n </MenuContainer>\n )\n}\n\nexport { DropdownMenuNoOptions }\n"],"names":["props","loadingIcon","_jsx","Styled","LoadingIconAnimated","emptyIcon","loadingIconProps","emptyIconProps","loading","loadingMessage","emptyMessage","_jsxs","MenuContainer","children","jsx","Icon","preset","name","undefined","icon","Text","as","appearance","size","color","textAlign","wordBreak","marginRight","marginBottom","marginLeft"],"mappings":"8PAO+BA,IAC7B,MAAMC,YACJA,EAAcC,WAAAA,IAACC,MAA0BC,wBAAGC,UAC5CA,EAAY,OAAMC,iBAClBA,EAAmB,CAAE,EAAAC,eACrBA,EAAiB,CAAE,EAAAC,QACnBA,EAAOC,eACPA,EAAcC,aACdA,GACEV,EAEJ,OACEW,WAAAA,KAACC,cAAAA,cAAa,CAAAC,SACZX,CAAAA,WAAAY,IAACX,oBAAoB,CAAAU,SAEjBX,WAAAY,IAACC,UADFP,EACM,CACHQ,OAAO,QACPC,YAAahB,GAAgB,SAAWA,OAAciB,EACtDC,YAAalB,GAAgB,SAAWA,OAAciB,KAClDZ,GAGD,CACHU,OAAO,QACPC,YAAaZ,GAAc,SAAWA,OAAYa,EAClDC,YAAad,GAAc,SAAWA,OAAYa,KAC9CX,MAITC,GAAWC,GACVP,WAAAA,IAACkB,KAAAA,KAAI,CACHC,GAAG,IACHC,WAAW,OACXC,KAAK,UACLC,MAAM,UACNC,UAAU,SACVC,UAAU,aACVC,YAAa,GACbC,aAAc,GACdC,WAAY,GAAGhB,SAEdJ,KAGHD,GAAWE,GACXR,WAAAA,IAACkB,KAAAA,KAAI,CACHC,GAAG,IACHC,WAAW,OACXC,KAAK,UACLC,MAAM,UACNC,UAAU,SACVC,UAAU,aACVC,YAAa,GACbC,aAAc,GACdC,WAAY,GAAGhB,SAEdH,MAGS"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{IconContainer,LoadingIconAnimated}from'./style.mjs';import{jsxs,jsx}from'react/jsx-runtime';import{MenuContainer}from'../MenuContainer/MenuContainer.mjs';import{Icon}from'../Icon/Icon.mjs';import{Text}from'../Text/Text.mjs';const DropdownMenuNoOptions=n=>{const{loadingIcon:o=jsx(LoadingIconAnimated,{}),emptyIcon:e="redo",loadingIconProps:r={},emptyIconProps:t={},loading:i,loadingMessage:a,emptyMessage:s}=n;return jsxs(MenuContainer,{children:[jsx(IconContainer,{children:jsx(Icon,i?{
|
|
1
|
+
import{IconContainer,LoadingIconAnimated}from'./style.mjs';import{jsxs,jsx}from'react/jsx-runtime';import{MenuContainer}from'../MenuContainer/MenuContainer.mjs';import{Icon}from'../Icon/Icon.mjs';import{Text}from'../Text/Text.mjs';const DropdownMenuNoOptions=n=>{const{loadingIcon:o=jsx(LoadingIconAnimated,{}),emptyIcon:e="redo",loadingIconProps:r={},emptyIconProps:t={},loading:i,loadingMessage:a,emptyMessage:s}=n;return jsxs(MenuContainer,{children:[jsx(IconContainer,{children:jsx(Icon,i?{preset:"brand",name:typeof o=='string'?o:void 0,icon:typeof o!='string'?o:void 0,...r}:{preset:"brand",name:typeof e=='string'?e:void 0,icon:typeof e!='string'?e:void 0,...t})}),i&&a&&jsx(Text,{as:"p",appearance:"body",size:"inherit",color:"inherit",textAlign:"center",wordBreak:"break-word",marginRight:12,marginBottom:12,marginLeft:12,children:a}),!i&&s&&jsx(Text,{as:"p",appearance:"body",size:"inherit",color:"inherit",textAlign:"center",wordBreak:"break-word",marginRight:12,marginBottom:12,marginLeft:12,children:s})]})};export{DropdownMenuNoOptions};
|
|
2
2
|
//# sourceMappingURL=DropdownMenuNoOptions.mjs.map
|