@foxford/ui 2.53.0 → 2.54.0-beta-1aa2896-20241202

package/components/Dropdown/Dropdown.mjs

@@ -1,2 +1,2 @@
-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};
+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,primary:a=!0,optionsMultiToggle:c=!0,loading:i=!1,iconProps:l={},menuProps:u={},loadingIconProps:d={},optionsEmptyIconProps:p={},autoFocus:m,disableAutoScrollToSelectedOption:g,closeMenuOnScroll:b,contrast:f,selectedOption:v,defaultSelectedOption:C,icon:x,inputMode:h,loadingMessage:k,loadingIcon:I,maxLength:y,multiple:w,onCloseMenu:D,onOpenMenu:S,onSelectOption:E,options:j,groupSelectedOptions:M,optionsMultiToggleCaption:F,optionsEmptyMessage:P,optionsEmptyIcon:T,palette:L,placeholder:O,readOnly:z,required:K,status:B,sizeXXS:R,sizeXS:N,sizeS:X,sizeM:_,sizeL:H,sizeXL:Z,form:A,...q}=e;const U={size:t,sizeXXS:R,sizeXS:N,sizeS:X,sizeM:_,sizeL:H,sizeXL:Z};const G={sizes:SIZES_ICON,color:q.disabled?'content-disabled':'content-onmain-tertiary'};const J=useMemo((()=>nanoid()),[]);const Q=useMemo((()=>{const e=new Fuse(j,{threshold:.4,ignoreLocation:!0,keys:[FuseSearchKeys.text,FuseSearchKeys.label,FuseSearchKeys.tags]});return o=>o.length===0?j:e.search(o).map((e=>e.item))}),[j]);const[V,W]=useState((()=>getDropdownSelectedOption(v!==void 0?v:C,w)));const[Y,$]=useState((()=>getDropdownInputText(V,w)));const[ee,oe]=useState(!1);const[te,re]=useState((()=>Q(Y)));const[ne,se]=useState(!1);const ae=w?groupDropdownOptions(j,V):[[],[]];const ce=ne&&!q.disabled;const ie=te.length===0||i;const le=Y===getDropdownInputText(V);const ue=K&&V.length===0;const de=Boolean(ce||Y||ee);const pe=ae[0].length>0&&ae[1].length===0;const me=ae[0].length>0&&ae[1].length>0;const ge=useRef(null);const be=useRef(null);const fe=useRef(null);const ve=useRef(null);const Ce=useRef(null);const xe=useRef(Y);const he=useRef(ce);return useEffect((()=>(Y===xe.current?re(Q(Y)):(xe.current=Y,Ce.current=setTimeout((()=>{re(Q(Y))}),150)),()=>{Ce.current&&clearTimeout(Ce.current)})),[Q,Y]),useLayoutEffect((()=>{v!==void 0&&(w||$(getDropdownInputText(v)),W(getDropdownSelectedOption(v,w)))}),[w,v]),useEffect((()=>{ce!==he.current&&(ce&&S&&S(),!ce&&D&&D(),he.current=ce)}),[ce,D,S]),useEffect((()=>{if(!w&&!g&&ce&&be.current&&ve.current){const e=be.current.getBoundingClientRect();const o=ve.current.getBoundingClientRect();(o.top<e.top||o.bottom>e.bottom)&&be.current.scrollTo(0,ve.current.offsetTop)}}),[w,g,ce]),useEffect((()=>{const handleScroll=e=>{ge.current?.focus(),se(!1),e.currentTarget&&e.currentTarget.removeEventListener(e.type,handleScroll)};return b&&ce&&document.addEventListener('scroll',handleScroll),()=>{document.removeEventListener('scroll',handleScroll)}}),[b,ce]),jsx(FormInputLabel,{...q,...U,ref:o,labelId:J,labelPosition:n,active:de,onColored:f,primary:a,error:B==='error',success:B==='success',icon:[x,jsx(ChevronIcon,{up:ce},'chevron')],iconProps:{...U,...G,...l},palette:{color:q.disabled?L.labelColorDisabled:L.labelColor,backgroundColor:q.disabled?L.backgroundColorDisabled:L.backgroundColor,backgroundColorHover:q.disabled?L.backgroundColorDisabled:L.backgroundColorHover,borderColor:q.disabled?L.borderColorDisabled:L.borderColor},onClick:e=>{q.onClick&&q.onClick(e),q.disabled||(ge.current?.focus(),ce?be.current&&e.target instanceof Node&&!be.current.contains(e.target)&&se(!1):(se(!0),s&&!w&&le&&($(''),re(Q('')))))},onKeyUp:e=>{q.onKeyUp&&q.onKeyUp(e),keyboardKeys.Esc.validate(e.key)&&(ge.current?.focus(),se(!1))},onPointerDown:e=>{q.onPointerDown&&q.onPointerDown(e),e.target!==ge.current&&e.target instanceof Node&&e.currentTarget.contains(e.target)&&e.preventDefault()},onFocus:e=>{q.onFocus&&q.onFocus(e),ge.current&&e.target===ge.current&&(oe(!0),s&&!w&&le&&!ce&&($(''),re(Q(''))))},onBlur:e=>{q.onBlur&&q.onBlur(e),ge.current&&e.target===ge.current&&oe(!1),e.currentTarget.contains(e.relatedTarget)||($(getDropdownInputText(V,w)),se(!1))},input:jsxs(Fragment,{children:[ue&&!s&&!z&&jsx(InputMimic,{required:!0,type:"text",inputMode:"none",form:A,tabIndex:-1,onFocus:()=>{ge.current?.focus()}}),jsx(FormInput,{ref:ge,"aria-labelledby":q.label?J:void 0,type:"text",autoComplete:"off",autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",form:A,autoFocus:m,inputMode:s?h:'none',maxLength:y,placeholder:O,readOnly:z||!s,required:ue,disabled:q.disabled,value:Y,palette:{color:L.color,colorDisabled:L.colorDisabled,placeholderColor:L.placeholderColor,placeholderColorDisabled:L.placeholderColorDisabled},onClick:e=>{ce&&e.currentTarget.selectionStart!==e.currentTarget.selectionEnd&&e.stopPropagation()},onChange:e=>{$(e.currentTarget.value),se(!0)},onKeyDown:e=>{keyboardKeys.Enter.validate(e.key)&&($(getDropdownInputText(V,w)),se(!1)),!keyboardKeys.Space.validate(e.key)||ce&&e.currentTarget.selectionStart!==0||(e.preventDefault(),s&&!w&&le&&!ce&&($(''),re(Q(''))),se((e=>!e))),keyboardKeys.ArrowDown.validate(e.key)&&fe.current&&(e.preventDefault(),focusFirstFocusable(fe.current))}}),V.map((e=>jsx("input",{type:"hidden",name:r,value:e.value,form:A,disabled:q.disabled},e.value)))]}),addon:w&&V.length>0?jsx(Chip,{size:"xs",active:!0,black:!0,marginLeft:12,disabled:q.disabled,cursor:q.disabled?'not-allowed':void 0,text:V.length,textProps:{appearance:'caption',size:'xs'},palette:q.disabled?{color:'content-disabled',colorHover:'content-disabled',backgroundColor:'bg-disabled-small',backgroundColorHover:'bg-disabled-small'}:void 0,onPointerDown:e=>{e.preventDefault()},discardButtonProps:{contrast:!q.disabled,onKeyDown:e=>{keyboardKeys.ArrowDown.validate(e.key)&&fe.current&&(e.preventDefault(),focusFirstFocusable(fe.current))},onClick:e=>{e.stopPropagation(),z||(v===void 0&&W([]),E&&E([]),ge.current?.focus(),se(!0))}}}):void 0,dropdown:ce?jsx(DropdownMenu,{...u,ref:be,tabIndex:ie?void 0:0,secondary:!f,elevated:f,disableAutoFocus:!0,palette:{backgroundColor:L.menuBackgroundColor,borderColor:L.menuBorderColor},onFocus:e=>{fe.current&&e.target===e.currentTarget&&(fe.current.contains(e.relatedTarget)?ge.current?.focus():focusFirstFocusable(fe.current))},onKeyDown:e=>{keyboardKeys.Enter.validate(e.key)&&(ge.current?.focus(),$(getDropdownInputText(V,w)),se(!1))},children:ie?jsx(DropdownMenuNoOptions,{loading:i,loadingMessage:k,loadingIcon:I,loadingIconProps:{...U,...G,...d},emptyMessage:P,emptyIcon:T,emptyIconProps:{...U,...G,...p}}):jsx(MenuList,w?{ref:fe,children:Y.length===0?jsxs(Fragment,{children:[c&&jsx(ListItem,{...U,text:F,disabled:q.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,checked:pe,indeterminate:me,error:(pe||me)&&B==='error',success:(pe||me)&&B==='success',onChange:()=>{if(!z){const e=pe||me?[]:[...j];v===void 0&&W(e),E&&E(e)}}})}),c&&jsx(MenuDivider,{}),M&&ae[0].map((e=>{const o=e.status??B;const t=o==='error';const n=o==='success';return createElement(ListItem,{...U,key:e.value,active:!0,text:e.text,danger:t,success:n,disabled:q.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation(),ge.current?.focus()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:!0,error:t,success:n,onChange:e=>{if(!z){const o=V.filter((o=>o.value!==e.currentTarget.value));v===void 0&&W(o),E&&E(o)}}})})})),M&&ae[0].length>0&&ae[1].length>0&&jsx(MenuDivider,{}),M&&ae[1].map((e=>createElement(ListItem,{...U,key:e.value,text:e.text,disabled:q.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation(),ge.current?.focus()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:!1,onChange:()=>{if(!z){const o=[...V,e];v===void 0&&W(o),E&&E(o)}}})}))),!M&&j.map((e=>{const o=V.findIndex((o=>o.value===e.value))!==-1;const t=e.status??B;const n=o&&t==='error';const s=o&&t==='success';return createElement(ListItem,{...U,key:e.value,text:e.text,danger:n,success:s,disabled:q.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(!z){const r=o?V.filter((e=>e.value!==t.currentTarget.value)):[...V,e];v===void 0&&W(r),E&&E(r)}}})})}))]}):jsx(Fragment,{children:te.map((e=>{const o=V.findIndex((o=>o.value===e.value))!==-1;const t=e.status??B;const n=o&&t==='error';const s=o&&t==='success';return createElement(ListItem,{...U,key:e.value,text:e.text,danger:n,success:s,disabled:q.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(!z){const r=o?V.filter((e=>e.value!==t.currentTarget.value)):[...V,e];v===void 0&&W(r),E&&E(r)}}})})}))})}:{ref:fe,children:(s?te:j).map(((e,o,t)=>{const r=V.findIndex((o=>o.value===e.value))!==-1;return createElement(ListItem,{...U,ref:r?ve:void 0,key:e.value,text:e.text,active:r,danger:r&&B==='error',success:r&&B==='success',disabled:q.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:o=>{if(o.stopPropagation(),!z){const o=r?null:e;v===void 0&&($(getDropdownInputText(o)),W(getDropdownSelectedOption(o))),E&&E(o),(o||t===te)&&ge.current?.focus(),se(!o)}}})}))})}):void 0})})),{sizes:SIZES,displayName:"Dropdown"});export{COMPONENT_NAME,Dropdown};
 //# sourceMappingURL=Dropdown.mjs.map

package/components/Dropdown/Dropdown.mjs.map

@@ -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, 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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"}
+{"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      primary = true,\n      optionsMultiToggle = true,\n      loading = false,\n      iconProps = {},\n      menuProps = {},\n      loadingIconProps = {},\n      optionsEmptyIconProps = {},\n      autoFocus,\n      disableAutoScrollToSelectedOption,\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 [inputFocused, setInputFocused] = 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 || inputFocused)\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    const selectedOptionRef = useRef<HTMLElement | 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      if (!menuOpen && onCloseMenu) onCloseMenu()\n\n      menuOpenPrevRef.current = menuOpen\n    }, [menuOpen, onCloseMenu, onOpenMenu])\n\n    useEffect(() => {\n      if (!multiple && !disableAutoScrollToSelectedOption && menuOpen && menuRef.current && selectedOptionRef.current) {\n        const menuRect = menuRef.current.getBoundingClientRect()\n        const selectedOptionRect = selectedOptionRef.current.getBoundingClientRect()\n\n        if (selectedOptionRect.top < menuRect.top || selectedOptionRect.bottom > menuRect.bottom) {\n          menuRef.current.scrollTo(0, selectedOptionRef.current.offsetTop)\n        }\n      }\n    }, [multiple, disableAutoScrollToSelectedOption, menuOpen])\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        primary={primary}\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\n            if (searchable && !multiple && inputSynced) {\n              setInputText('')\n              setMenuRelevantOptions(getRelevantOptions(''))\n            }\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        onFocus={(evt) => {\n          if (rootProps.onFocus) rootProps.onFocus(evt)\n\n          if (inputRef.current && evt.target === inputRef.current) {\n            setInputFocused(true)\n\n            if (searchable && !multiple && inputSynced && !menuOpen) {\n              setInputText('')\n              setMenuRelevantOptions(getRelevantOptions(''))\n            }\n          }\n        }}\n        onBlur={(evt) => {\n          if (rootProps.onBlur) rootProps.onBlur(evt)\n\n          if (inputRef.current && evt.target === inputRef.current) {\n            setInputFocused(false)\n          }\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                setMenuOpenRequest(true)\n              }}\n              onKeyDown={(evt) => {\n                if (keyboardKeys.Enter.validate(evt.key)) {\n                  setInputText(getDropdownInputText(dropdownSelectedOption, multiple))\n                  setMenuOpenRequest(false)\n                }\n\n                if (keyboardKeys.Space.validate(evt.key) && (!menuOpen || evt.currentTarget.selectionStart === 0)) {\n                  evt.preventDefault()\n\n                  if (searchable && !multiple && inputSynced && !menuOpen) {\n                    setInputText('')\n                    setMenuRelevantOptions(getRelevantOptions(''))\n                  }\n\n                  setMenuOpenRequest((prev) => !prev)\n                }\n\n                if (keyboardKeys.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                  {(searchable ? menuRelevantOptions : options).map((option, _, optionsRendered) => {\n                    const selected = dropdownSelectedOption.findIndex((item) => item.value === option.value) !== -1\n\n                    return (\n                      <ListItem\n                        {...sizeProps}\n                        ref={selected ? selectedOptionRef : undefined}\n                        key={option.value}\n                        text={option.text}\n                        active={selected}\n                        danger={selected && status === 'error'}\n                        success={selected && status === 'success'}\n                        disabled={rootProps.disabled}\n                        borderRadius={8}\n                        ellipsis={false}\n                        textProps={{ wordBreak: 'break-word' }}\n                        onClick={(evt) => {\n                          evt.stopPropagation()\n\n                          if (!readOnly) {\n                            const update = 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","primary","optionsMultiToggle","loading","iconProps","menuProps","loadingIconProps","optionsEmptyIconProps","autoFocus","disableAutoScrollToSelectedOption","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","inputFocused","setInputFocused","menuRelevantOptions","setMenuRelevantOptions","menuOpenRequest","setMenuOpenRequest","menuOptionsGroups","groupDropdownOptions","menuOpen","menuNoRelevantOptions","inputSynced","inputRequired","inputActive","Boolean","multiToggleChecked","multiToggleIndeterminate","inputRef","useRef","menuRef","menuListRef","selectedOptionRef","timeoutIdRef","inputTextPrevRef","menuOpenPrevRef","useEffect","current","setTimeout","clearTimeout","useLayoutEffect","menuRect","getBoundingClientRect","selectedOptionRect","top","bottom","scrollTo","offsetTop","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","onFocus","onBlur","relatedTarget","input","_jsxs","_Fragment","children","tabIndex","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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"}

package/components/Input/Input.js

@@ -1,2 +1,2 @@
-'use strict';var React=require('react');var styled=require('styled-components');var index_browser=require('../../external/.pnpm/nanoid@5.0.7/node_modules/nanoid/index.browser.js');var withMergedProps=require('../../hocs/withMergedProps.js');var constants$1=require('./constants.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');var Input_Phone=require('../Input.Phone/Input.Phone.js');var constants=require('../FormInputLabel/constants.js');var FormInputLabel=require('../FormInputLabel/FormInputLabel.js');var FormInput=require('../FormInput/FormInput.js');var IconButton=require('../IconButton/IconButton.js');const Input=Object.assign(withMergedProps.withMergedProps(React.forwardRef(((e,r)=>{const t=styled.useTheme();const{size:o="m",rounded:n=!0,color:a="mineShaft",placeholderColor:i="silver",width:s=t.defaultInputControlsWidth,type:l="text",labelPosition:c="dynamic",iconProps:u={},controls:m={},addonButtonProps:d={},preset:g,className:p,style:b,sizeXXS:f,sizeXS:h,sizeS:S,sizeM:X,sizeL:v,sizeXL:L,sizeUnits:C,sizes:y,margin:I,marginXXS:R,marginXS:B,marginS:w,marginM:k,marginL:T,marginXL:z,marginTop:M,marginTopXXS:x,marginTopXS:P,marginTopS:$,marginTopM:F,marginTopL:q,marginTopXL:j,marginRight:D,marginRightXXS:E,marginRightXS:O,marginRightS:N,marginRightM:_,marginRightL:A,marginRightXL:H,marginBottom:Z,marginBottomXXS:U,marginBottomXS:V,marginBottomS:W,marginBottomM:G,marginBottomL:J,marginBottomXL:K,marginLeft:Q,marginLeftXXS:Y,marginLeftXS:ee,marginLeftS:re,marginLeftM:te,marginLeftL:oe,marginLeftXL:ne,palette:ae,widthXXS:ie,widthXS:se,widthS:le,widthM:ce,widthL:ue,widthXL:me,error:de,success:ge,label:pe,icon:be,text:fe,primary:he,secondary:Se,contrast:Xe,onColored:ve,fluid:Le,disabled:Ce,inline:ye,inputRef:Ie,...Re}=e;const Be={size:o,sizeXXS:f,sizeXS:h,sizeS:S,sizeM:X,sizeL:v,sizeXL:L};const{icon:we,buttonProps:ke={}}=m.additional??{};const[Te,ze=(ke.onClick?void 0:we)]=Array.isArray(be)?be:[be];const Me=Boolean(Re.mask&&Re.alwaysShowMask);const xe={color:ae.controlsColor,colorHover:ae.controlsColorHover,colorActive:ae.controlsColorActive,colorDisabled:ae.controlsColorDisabled,backgroundColor:ae.controlsBackgroundColor,backgroundColorHover:ae.controlsBackgroundColorHover,backgroundColorActive:ae.controlsBackgroundColorActive,backgroundColorDisabled:ae.controlsBackgroundColorDisabled};const Pe=React.useRef(null);React.useImperativeHandle(r,(()=>Pe.current),[]);const $e=React.useRef(null);const Fe=React.useRef(null);const qe=React.useRef(null);const je=React.useMemo((()=>index_browser.nanoid()),[]);const[De,Ee]=React.useState((()=>{if(Me)return!0;const e=Re.value??Re.defaultValue;return typeof e=='string'&&e.length>0||typeof e=='number'}));const[Oe,Ne]=React.useState((()=>{if(l!=='number'||Re.min===void 0)return!1;const{value:e=1/0,defaultValue:r=1/0}=Re;const t=typeof e=='number'?e:parseFloat(e);const o=typeof r=='number'?r:parseFloat(r);const n=typeof Re.min=='number'?Re.min:parseFloat(Re.min);return Math.min(t,o)<=n}));const[_e,Ae]=React.useState((()=>{if(l!=='number'||Re.max===void 0)return!1;const{value:e=-1/0,defaultValue:r=-1/0}=Re;const t=typeof e=='number'?e:parseFloat(e);const o=typeof r=='number'?r:parseFloat(r);const n=typeof Re.max=='number'?Re.max:parseFloat(Re.max);return Math.max(t,o)>=n}));return React.useLayoutEffect((()=>{Me?Ee(!0):Re.value!==void 0&&Re.value!==null&&Pe.current&&Pe.current!==document.activeElement&&Ee(typeof Re.value=='string'&&Re.value.length>0||typeof Re.value=='number')}),[Me,Re.value]),g!=='brand'?require$$0.jsx(style.Root,{...Re,inputRef:Ie??(e=>{Pe.current=e}),className:p,style:b,size:typeof o=='number'?o:void 0,rounded:n,color:a,placeholderColor:i,width:s,widthXXS:ie,widthXS:se,widthS:le,widthM:ce,widthL:ue,widthXL:me,error:de,type:l,fluid:Le,disabled:Ce}):require$$0.jsx(FormInputLabel.FormInputLabel,{...Be,className:p,style:b,sizeUnits:C,sizes:y,margin:I,marginXXS:R,marginXS:B,marginS:w,marginM:k,marginL:T,marginXL:z,marginTop:M,marginTopXXS:x,marginTopXS:P,marginTopS:$,marginTopM:F,marginTopL:q,marginTopXL:j,marginRight:D,marginRightXXS:E,marginRightXS:O,marginRightS:N,marginRightM:_,marginRightL:A,marginRightXL:H,marginBottom:Z,marginBottomXXS:U,marginBottomXS:V,marginBottomS:W,marginBottomM:G,marginBottomL:J,marginBottomXL:K,marginLeft:Q,marginLeftXXS:Y,marginLeftXS:ee,marginLeftS:re,marginLeftM:te,marginLeftL:oe,marginLeftXL:ne,error:de,success:ge,label:pe,labelId:je,labelPosition:c,icon:[Te,ze],text:fe,primary:he,secondary:Se,contrast:Xe,onColored:ve,disabled:Ce,inline:ye,active:De,palette:{color:Ce?ae.colorDisabled:ae.color,backgroundColor:Ce?ae.backgroundColorDisabled:ae.backgroundColor,backgroundColorHover:Ce?ae.backgroundColorDisabled:ae.backgroundColorHover,borderColor:Ce?ae.borderColorDisabled:ae.borderColor},iconProps:{color:Ce?'content-disabled':'content-onmain-tertiary',sizes:constants$1.SIZES_ICON,...Be,...u},onClick:()=>{Pe.current&&Pe.current.focus()},onFocus:e=>{e.target!==e.currentTarget&&Ee(!0)},onPointerDown:e=>{e.target!==Pe.current&&e.target instanceof Node&&!$e.current?.contains(e.target)&&!Fe.current?.contains(e.target)&&!qe.current?.contains(e.target)&&e.preventDefault()},onBlur:e=>{Me||!Pe.current||e.currentTarget.contains(e.relatedTarget)||Ee(Boolean(Pe.current.value))},input:require$$0.jsx(FormInput.FormInput,{...Re,"aria-labelledby":pe?je:void 0,ref:Pe,type:l,disabled:Ce,palette:{color:ae.inputColor,placeholderColor:ae.inputPlaceholderColor,colorDisabled:ae.inputColorDisabled,placeholderColorDisabled:ae.inputPlaceholderColorDisabled},onChange:e=>{if(Re.onChange&&Re.onChange(e),l==='number'){const r=parseFloat(e.currentTarget.value);const t=r<=parseFloat(e.currentTarget.min);const o=r>=parseFloat(e.currentTarget.max);Ne(t),Ae(o),(t||o)&&e.currentTarget.focus()}}}),addon:d.onClick||ke.onClick?require$$0.jsx(IconButton.IconButton,{ref:$e,sizes:constants$1.SIZES_CONTROL,palette:xe,...Be,...ke,...d,icon:d.icon||we,disabled:Ce||d.disabled||ke.disabled,marginLeft:12,onClick:e=>{e.stopPropagation(),Re.readOnly||(d.onClick&&d.onClick(e),ke.onClick&&ke.onClick(e))}}):void 0,controls:l==='number'?require$$0.jsxs(require$$0.Fragment,{children:[require$$0.jsx(IconButton.IconButton,{...Be,ref:Fe,icon:"minus",sizes:constants$1.SIZES_CONTROL,palette:xe,disabled:Ce||Oe,marginLeft:12,onClick:e=>{if(e.stopPropagation(),!Re.readOnly)try{if(Pe.current){Ee(!0);const e=Pe.current.value;if(Pe.current.stepDown(),e!==Pe.current.value){const e=new Event('input',{bubbles:!0});Pe.current.dispatchEvent(e)}}}catch(e){console.error(e)}}}),require$$0.jsx(style.IconButtonSeparated,{...Be,ref:qe,icon:"plus",sizes:constants$1.SIZES_CONTROL,palette:xe,disabled:Ce||_e,onClick:e=>{if(e.stopPropagation(),!Re.readOnly)try{if(Pe.current){Ee(!0);const e=Pe.current.value;if(Pe.current.stepUp(),e!==Pe.current.value){const e=new Event('input',{bubbles:!0});Pe.current.dispatchEvent(e)}}}catch(e){console.error(e)}}})]}):void 0})})),{sizes:constants.SIZES,displayName:"Input"}),{Phone:Input_Phone.InputPhone});exports.COMPONENT_NAME="Input",exports.Input=Input;
+'use strict';var React=require('react');var styled=require('styled-components');var index_browser=require('../../external/.pnpm/nanoid@5.0.7/node_modules/nanoid/index.browser.js');var withMergedProps=require('../../hocs/withMergedProps.js');var constants$1=require('./constants.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');var Input_Phone=require('../Input.Phone/Input.Phone.js');var constants=require('../FormInputLabel/constants.js');var FormInputLabel=require('../FormInputLabel/FormInputLabel.js');var FormInput=require('../FormInput/FormInput.js');var IconButton=require('../IconButton/IconButton.js');const Input=Object.assign(withMergedProps.withMergedProps(React.forwardRef(((e,r)=>{const o=styled.useTheme();const{size:t="m",rounded:n=!0,primary:a=!0,color:i="mineShaft",placeholderColor:s="silver",width:l=o.defaultInputControlsWidth,type:c="text",labelPosition:u="dynamic",iconProps:m={},controls:d={},addonButtonProps:g={},preset:p,className:b,style:f,sizeXXS:h,sizeXS:S,sizeS:X,sizeM:v,sizeL:L,sizeXL:C,sizeUnits:y,sizes:I,margin:R,marginXXS:B,marginXS:w,marginS:k,marginM:T,marginL:z,marginXL:M,marginTop:x,marginTopXXS:P,marginTopXS:$,marginTopS:F,marginTopM:q,marginTopL:j,marginTopXL:D,marginRight:E,marginRightXXS:O,marginRightXS:N,marginRightS:_,marginRightM:A,marginRightL:H,marginRightXL:Z,marginBottom:U,marginBottomXXS:V,marginBottomXS:W,marginBottomS:G,marginBottomM:J,marginBottomL:K,marginBottomXL:Q,marginLeft:Y,marginLeftXXS:ee,marginLeftXS:re,marginLeftS:oe,marginLeftM:te,marginLeftL:ne,marginLeftXL:ae,palette:ie,widthXXS:se,widthXS:le,widthS:ce,widthM:ue,widthL:me,widthXL:de,error:ge,success:pe,label:be,icon:fe,text:he,secondary:Se,contrast:Xe,onColored:ve,fluid:Le,disabled:Ce,inline:ye,inputRef:Ie,...Re}=e;const Be={size:t,sizeXXS:h,sizeXS:S,sizeS:X,sizeM:v,sizeL:L,sizeXL:C};const{icon:we,buttonProps:ke={}}=d.additional??{};const[Te,ze=(ke.onClick?void 0:we)]=Array.isArray(fe)?fe:[fe];const Me=Boolean(Re.mask&&Re.alwaysShowMask);const xe={color:ie.controlsColor,colorHover:ie.controlsColorHover,colorActive:ie.controlsColorActive,colorDisabled:ie.controlsColorDisabled,backgroundColor:ie.controlsBackgroundColor,backgroundColorHover:ie.controlsBackgroundColorHover,backgroundColorActive:ie.controlsBackgroundColorActive,backgroundColorDisabled:ie.controlsBackgroundColorDisabled};const Pe=React.useRef(null);React.useImperativeHandle(r,(()=>Pe.current),[]);const $e=React.useRef(null);const Fe=React.useRef(null);const qe=React.useRef(null);const je=React.useMemo((()=>index_browser.nanoid()),[]);const[De,Ee]=React.useState((()=>{if(Me)return!0;const e=Re.value??Re.defaultValue;return typeof e=='string'&&e.length>0||typeof e=='number'}));const[Oe,Ne]=React.useState((()=>{if(c!=='number'||Re.min===void 0)return!1;const{value:e=1/0,defaultValue:r=1/0}=Re;const o=typeof e=='number'?e:parseFloat(e);const t=typeof r=='number'?r:parseFloat(r);const n=typeof Re.min=='number'?Re.min:parseFloat(Re.min);return Math.min(o,t)<=n}));const[_e,Ae]=React.useState((()=>{if(c!=='number'||Re.max===void 0)return!1;const{value:e=-1/0,defaultValue:r=-1/0}=Re;const o=typeof e=='number'?e:parseFloat(e);const t=typeof r=='number'?r:parseFloat(r);const n=typeof Re.max=='number'?Re.max:parseFloat(Re.max);return Math.max(o,t)>=n}));return React.useLayoutEffect((()=>{Me?Ee(!0):Re.value!==void 0&&Re.value!==null&&Pe.current&&Pe.current!==document.activeElement&&Ee(typeof Re.value=='string'&&Re.value.length>0||typeof Re.value=='number')}),[Me,Re.value]),p!=='brand'?require$$0.jsx(style.Root,{...Re,inputRef:Ie??(e=>{Pe.current=e}),className:b,style:f,size:typeof t=='number'?t:void 0,rounded:n,color:i,placeholderColor:s,width:l,widthXXS:se,widthXS:le,widthS:ce,widthM:ue,widthL:me,widthXL:de,error:ge,type:c,fluid:Le,disabled:Ce}):require$$0.jsx(FormInputLabel.FormInputLabel,{...Be,className:b,style:f,sizeUnits:y,sizes:I,margin:R,marginXXS:B,marginXS:w,marginS:k,marginM:T,marginL:z,marginXL:M,marginTop:x,marginTopXXS:P,marginTopXS:$,marginTopS:F,marginTopM:q,marginTopL:j,marginTopXL:D,marginRight:E,marginRightXXS:O,marginRightXS:N,marginRightS:_,marginRightM:A,marginRightL:H,marginRightXL:Z,marginBottom:U,marginBottomXXS:V,marginBottomXS:W,marginBottomS:G,marginBottomM:J,marginBottomL:K,marginBottomXL:Q,marginLeft:Y,marginLeftXXS:ee,marginLeftXS:re,marginLeftS:oe,marginLeftM:te,marginLeftL:ne,marginLeftXL:ae,error:ge,success:pe,label:be,labelId:je,labelPosition:u,icon:[Te,ze],text:he,primary:a,secondary:Se,contrast:Xe,onColored:ve,disabled:Ce,inline:ye,active:De,palette:{color:Ce?ie.colorDisabled:ie.color,backgroundColor:Ce?ie.backgroundColorDisabled:ie.backgroundColor,backgroundColorHover:Ce?ie.backgroundColorDisabled:ie.backgroundColorHover,borderColor:Ce?ie.borderColorDisabled:ie.borderColor},iconProps:{color:Ce?'content-disabled':'content-onmain-tertiary',sizes:constants$1.SIZES_ICON,...Be,...m},onClick:()=>{Pe.current&&Pe.current.focus()},onFocus:e=>{e.target!==e.currentTarget&&Ee(!0)},onPointerDown:e=>{e.target!==Pe.current&&e.target instanceof Node&&!$e.current?.contains(e.target)&&!Fe.current?.contains(e.target)&&!qe.current?.contains(e.target)&&e.preventDefault()},onBlur:e=>{Me||!Pe.current||e.currentTarget.contains(e.relatedTarget)||Ee(Boolean(Pe.current.value))},input:require$$0.jsx(FormInput.FormInput,{...Re,"aria-labelledby":be?je:void 0,ref:Pe,type:c,disabled:Ce,palette:{color:ie.inputColor,placeholderColor:ie.inputPlaceholderColor,colorDisabled:ie.inputColorDisabled,placeholderColorDisabled:ie.inputPlaceholderColorDisabled},onChange:e=>{if(Re.onChange&&Re.onChange(e),c==='number'){const r=parseFloat(e.currentTarget.value);const o=r<=parseFloat(e.currentTarget.min);const t=r>=parseFloat(e.currentTarget.max);Ne(o),Ae(t),(o||t)&&e.currentTarget.focus()}}}),addon:g.onClick||ke.onClick?require$$0.jsx(IconButton.IconButton,{ref:$e,sizes:constants$1.SIZES_CONTROL,palette:xe,...Be,...ke,...g,icon:g.icon||we||'unknown',disabled:Ce||g.disabled||ke.disabled,marginLeft:12,onClick:e=>{e.stopPropagation(),Re.readOnly||(g.onClick&&g.onClick(e),ke.onClick&&ke.onClick(e))}}):void 0,controls:c==='number'?require$$0.jsxs(require$$0.Fragment,{children:[require$$0.jsx(IconButton.IconButton,{...Be,ref:Fe,icon:"minus",sizes:constants$1.SIZES_CONTROL,palette:xe,disabled:Ce||Oe,marginLeft:12,onClick:e=>{if(e.stopPropagation(),!Re.readOnly)try{if(Pe.current){Ee(!0);const e=Pe.current.value;if(Pe.current.stepDown(),e!==Pe.current.value){const e=new Event('input',{bubbles:!0});Pe.current.dispatchEvent(e)}}}catch(e){console.error(e)}}}),require$$0.jsx(style.IconButtonSeparated,{...Be,ref:qe,icon:"plus",sizes:constants$1.SIZES_CONTROL,palette:xe,disabled:Ce||_e,onClick:e=>{if(e.stopPropagation(),!Re.readOnly)try{if(Pe.current){Ee(!0);const e=Pe.current.value;if(Pe.current.stepUp(),e!==Pe.current.value){const e=new Event('input',{bubbles:!0});Pe.current.dispatchEvent(e)}}}catch(e){console.error(e)}}})]}):void 0})})),{sizes:constants.SIZES,displayName:"Input"}),{Phone:Input_Phone.InputPhone});exports.COMPONENT_NAME="Input",exports.Input=Input;
 //# sourceMappingURL=Input.js.map

package/components/Input/Input.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.js","sources":["../../../../src/components/Input/Input.tsx"],"sourcesContent":["import { forwardRef, useState, useImperativeHandle, useRef, useLayoutEffect, useMemo } from 'react'\nimport { useTheme } from 'styled-components'\nimport { nanoid } from 'nanoid'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { FormInputLabel, SIZES } from 'components/FormInputLabel'\nimport { FormInput } from 'components/FormInput'\nimport { InputPhone } from 'components/Input.Phone'\nimport { IconButton } from 'components/IconButton'\nimport { SIZES_ICON, SIZES_CONTROL } from './constants'\nimport * as Styled from './style'\nimport type { InputProps } from './types'\n\nconst COMPONENT_NAME = 'Input'\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<input\\> элемента и пропсы \"react-input-mask\" [v2.0.4](https://www.npmjs.com/package/react-input-mask/v/2.0.4?activeTab=readme).\n *\n * Поддерживаются пропсы определения размеров и внешних отступов в зависимости от ширины вьюпорта.\n *\n * Можно передать \"ref\", который будет ассоциирован с \\<input\\>.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/Input/types.ts).\n */\nconst Input: React.ForwardRefExoticComponent<InputProps> & { Phone: typeof InputPhone } = Object.assign(\n  withMergedProps<InputProps, HTMLInputElement>(\n    forwardRef((props, forwardedRef) => {\n      const theme = useTheme()\n\n      const {\n        size = 'm',\n        rounded = true,\n        color = 'mineShaft',\n        placeholderColor = 'silver',\n        width = theme.defaultInputControlsWidth,\n        type = 'text',\n        labelPosition = 'dynamic',\n        iconProps = {},\n        controls = {},\n        addonButtonProps = {},\n        preset,\n        className,\n        style,\n        sizeXXS,\n        sizeXS,\n        sizeS,\n        sizeM,\n        sizeL,\n        sizeXL,\n        sizeUnits,\n        sizes,\n        margin,\n        marginXXS,\n        marginXS,\n        marginS,\n        marginM,\n        marginL,\n        marginXL,\n        marginTop,\n        marginTopXXS,\n        marginTopXS,\n        marginTopS,\n        marginTopM,\n        marginTopL,\n        marginTopXL,\n        marginRight,\n        marginRightXXS,\n        marginRightXS,\n        marginRightS,\n        marginRightM,\n        marginRightL,\n        marginRightXL,\n        marginBottom,\n        marginBottomXXS,\n        marginBottomXS,\n        marginBottomS,\n        marginBottomM,\n        marginBottomL,\n        marginBottomXL,\n        marginLeft,\n        marginLeftXXS,\n        marginLeftXS,\n        marginLeftS,\n        marginLeftM,\n        marginLeftL,\n        marginLeftXL,\n        palette,\n        widthXXS,\n        widthXS,\n        widthS,\n        widthM,\n        widthL,\n        widthXL,\n        error,\n        success,\n        label,\n        icon,\n        text,\n        primary,\n        secondary,\n        contrast,\n        onColored,\n        fluid,\n        disabled,\n        inline,\n        inputRef,\n        ...inputProps\n      } = props\n\n      const sizeProps = {\n        size,\n        sizeXXS,\n        sizeXS,\n        sizeS,\n        sizeM,\n        sizeL,\n        sizeXL,\n      }\n\n      const { icon: additionalControlIcon, buttonProps: additionalControlButtonProps = {} } = controls.additional ?? {}\n\n      const [iconBefore, iconAfter = !additionalControlButtonProps.onClick ? additionalControlIcon : undefined] =\n        Array.isArray(icon) ? icon : [icon]\n\n      const inputAlwaysActive = Boolean(inputProps.mask && inputProps.alwaysShowMask)\n\n      const controlPalette = {\n        color: palette.controlsColor,\n        colorHover: palette.controlsColorHover,\n        colorActive: palette.controlsColorActive,\n        colorDisabled: palette.controlsColorDisabled,\n        backgroundColor: palette.controlsBackgroundColor,\n        backgroundColorHover: palette.controlsBackgroundColorHover,\n        backgroundColorActive: palette.controlsBackgroundColorActive,\n        backgroundColorDisabled: palette.controlsBackgroundColorDisabled,\n      }\n\n      const ref = useRef<HTMLInputElement | null>(null)\n      useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(forwardedRef, () => ref.current, [])\n\n      const addonRef = useRef<HTMLButtonElement | null>(null)\n      const minusRef = useRef<HTMLButtonElement | null>(null)\n      const plusRef = useRef<HTMLButtonElement | null>(null)\n\n      const inputLabelId = useMemo(() => nanoid(), [])\n\n      const [inputActive, setInputActive] = useState(() => {\n        if (inputAlwaysActive) return true\n\n        const initValue = inputProps.value ?? inputProps.defaultValue\n\n        return (typeof initValue === 'string' && initValue.length > 0) || typeof initValue === 'number'\n      })\n\n      const [minusDisabled, setMinusDisabled] = useState(() => {\n        if (type !== 'number' || inputProps.min === undefined) return false\n\n        const { value = Infinity, defaultValue = Infinity } = inputProps\n\n        const initValue = typeof value === 'number' ? value : parseFloat(value)\n        const initDefaultValue = typeof defaultValue === 'number' ? defaultValue : parseFloat(defaultValue)\n        const minValue = typeof inputProps.min === 'number' ? inputProps.min : parseFloat(inputProps.min)\n\n        return Math.min(initValue, initDefaultValue) <= minValue\n      })\n\n      const [plusDisabled, setPlusDisabled] = useState(() => {\n        if (type !== 'number' || inputProps.max === undefined) return false\n\n        const { value = -Infinity, defaultValue = -Infinity } = inputProps\n\n        const initValue = typeof value === 'number' ? value : parseFloat(value)\n        const initDefaultValue = typeof defaultValue === 'number' ? defaultValue : parseFloat(defaultValue)\n        const maxValue = typeof inputProps.max === 'number' ? inputProps.max : parseFloat(inputProps.max)\n\n        return Math.max(initValue, initDefaultValue) >= maxValue\n      })\n\n      useLayoutEffect(() => {\n        if (inputAlwaysActive) {\n          setInputActive(true)\n        } else if (\n          inputProps.value !== undefined &&\n          inputProps.value !== null &&\n          ref.current &&\n          ref.current !== document.activeElement\n        ) {\n          setInputActive(\n            (typeof inputProps.value === 'string' && inputProps.value.length > 0) ||\n              typeof inputProps.value === 'number'\n          )\n        }\n      }, [inputAlwaysActive, inputProps.value])\n\n      if (preset !== 'brand') {\n        return (\n          <Styled.Root\n            {...inputProps}\n            inputRef={\n              inputRef ??\n              ((input) => {\n                ref.current = input\n              })\n            }\n            className={className}\n            style={style}\n            size={typeof size === 'number' ? size : undefined}\n            rounded={rounded}\n            color={color}\n            placeholderColor={placeholderColor}\n            width={width}\n            widthXXS={widthXXS}\n            widthXS={widthXS}\n            widthS={widthS}\n            widthM={widthM}\n            widthL={widthL}\n            widthXL={widthXL}\n            error={error}\n            type={type}\n            fluid={fluid}\n            disabled={disabled}\n          />\n        )\n      }\n\n      return (\n        <FormInputLabel\n          {...sizeProps}\n          className={className}\n          style={style}\n          sizeUnits={sizeUnits}\n          sizes={sizes}\n          margin={margin}\n          marginXXS={marginXXS}\n          marginXS={marginXS}\n          marginS={marginS}\n          marginM={marginM}\n          marginL={marginL}\n          marginXL={marginXL}\n          marginTop={marginTop}\n          marginTopXXS={marginTopXXS}\n          marginTopXS={marginTopXS}\n          marginTopS={marginTopS}\n          marginTopM={marginTopM}\n          marginTopL={marginTopL}\n          marginTopXL={marginTopXL}\n          marginRight={marginRight}\n          marginRightXXS={marginRightXXS}\n          marginRightXS={marginRightXS}\n          marginRightS={marginRightS}\n          marginRightM={marginRightM}\n          marginRightL={marginRightL}\n          marginRightXL={marginRightXL}\n          marginBottom={marginBottom}\n          marginBottomXXS={marginBottomXXS}\n          marginBottomXS={marginBottomXS}\n          marginBottomS={marginBottomS}\n          marginBottomM={marginBottomM}\n          marginBottomL={marginBottomL}\n          marginBottomXL={marginBottomXL}\n          marginLeft={marginLeft}\n          marginLeftXXS={marginLeftXXS}\n          marginLeftXS={marginLeftXS}\n          marginLeftS={marginLeftS}\n          marginLeftM={marginLeftM}\n          marginLeftL={marginLeftL}\n          marginLeftXL={marginLeftXL}\n          error={error}\n          success={success}\n          label={label}\n          labelId={inputLabelId}\n          labelPosition={labelPosition}\n          icon={[iconBefore, iconAfter]}\n          text={text}\n          primary={primary}\n          secondary={secondary}\n          contrast={contrast}\n          onColored={onColored}\n          disabled={disabled}\n          inline={inline}\n          active={inputActive}\n          palette={{\n            color: disabled ? palette.colorDisabled : palette.color,\n            backgroundColor: disabled ? palette.backgroundColorDisabled : palette.backgroundColor,\n            backgroundColorHover: disabled ? palette.backgroundColorDisabled : palette.backgroundColorHover,\n            borderColor: disabled ? palette.borderColorDisabled : palette.borderColor,\n          }}\n          iconProps={{\n            color: disabled ? 'content-disabled' : 'content-onmain-tertiary',\n            sizes: SIZES_ICON,\n            ...sizeProps,\n            ...iconProps,\n          }}\n          onClick={() => {\n            if (ref.current) {\n              ref.current.focus()\n            }\n          }}\n          onFocus={(evt) => {\n            if (evt.target !== evt.currentTarget) {\n              setInputActive(true)\n            }\n          }}\n          onPointerDown={(evt) => {\n            if (\n              evt.target === ref.current ||\n              !(evt.target instanceof Node) ||\n              addonRef.current?.contains(evt.target) ||\n              minusRef.current?.contains(evt.target) ||\n              plusRef.current?.contains(evt.target)\n            ) {\n              return\n            }\n            evt.preventDefault()\n          }}\n          onBlur={(evt) => {\n            if (!inputAlwaysActive && ref.current && !evt.currentTarget.contains(evt.relatedTarget)) {\n              setInputActive(Boolean(ref.current.value))\n            }\n          }}\n          input={\n            <FormInput\n              {...inputProps}\n              aria-labelledby={label ? inputLabelId : undefined}\n              ref={ref}\n              type={type}\n              disabled={disabled}\n              palette={{\n                color: palette.inputColor,\n                placeholderColor: palette.inputPlaceholderColor,\n                colorDisabled: palette.inputColorDisabled,\n                placeholderColorDisabled: palette.inputPlaceholderColorDisabled,\n              }}\n              onChange={(evt) => {\n                if (inputProps.onChange) {\n                  inputProps.onChange(evt)\n                }\n\n                if (type === 'number') {\n                  const currentValue = parseFloat(evt.currentTarget.value)\n\n                  const minValueReached = currentValue <= parseFloat(evt.currentTarget.min)\n                  const maxValueReached = currentValue >= parseFloat(evt.currentTarget.max)\n\n                  setMinusDisabled(minValueReached)\n                  setPlusDisabled(maxValueReached)\n\n                  if (minValueReached || maxValueReached) {\n                    evt.currentTarget.focus()\n                  }\n                }\n              }}\n            />\n          }\n          addon={\n            addonButtonProps.onClick || additionalControlButtonProps.onClick ? (\n              <IconButton\n                ref={addonRef}\n                sizes={SIZES_CONTROL}\n                palette={controlPalette}\n                {...sizeProps}\n                {...additionalControlButtonProps}\n                {...addonButtonProps}\n                icon={addonButtonProps.icon || additionalControlIcon}\n                disabled={disabled || addonButtonProps.disabled || additionalControlButtonProps.disabled}\n                marginLeft={12}\n                onClick={(evt) => {\n                  evt.stopPropagation()\n                  if (inputProps.readOnly) return\n\n                  if (addonButtonProps.onClick) addonButtonProps.onClick(evt)\n                  if (additionalControlButtonProps.onClick) additionalControlButtonProps.onClick(evt)\n                }}\n              />\n            ) : undefined\n          }\n          controls={\n            type === 'number' ? (\n              <>\n                <IconButton\n                  {...sizeProps}\n                  ref={minusRef}\n                  icon='minus'\n                  sizes={SIZES_CONTROL}\n                  palette={controlPalette}\n                  disabled={disabled || minusDisabled}\n                  marginLeft={12}\n                  onClick={(evt) => {\n                    evt.stopPropagation()\n                    if (inputProps.readOnly) return\n\n                    try {\n                      if (ref.current) {\n                        setInputActive(true)\n\n                        const prev = ref.current.value\n                        ref.current.stepDown()\n\n                        const decremented = ref.current.value\n                        if (prev !== decremented) {\n                          const event = new Event('input', { bubbles: true })\n                          ref.current.dispatchEvent(event)\n                        }\n                      }\n                    } catch (err) {\n                      // eslint-disable-next-line no-console\n                      console.error(err)\n                    }\n                  }}\n                />\n                <Styled.IconButtonSeparated\n                  {...sizeProps}\n                  ref={plusRef}\n                  icon='plus'\n                  sizes={SIZES_CONTROL}\n                  palette={controlPalette}\n                  disabled={disabled || plusDisabled}\n                  onClick={(evt) => {\n                    evt.stopPropagation()\n                    if (inputProps.readOnly) return\n\n                    try {\n                      if (ref.current) {\n                        setInputActive(true)\n\n                        const prev = ref.current.value\n                        ref.current.stepUp()\n\n                        const incremented = ref.current.value\n                        if (prev !== incremented) {\n                          const event = new Event('input', { bubbles: true })\n                          ref.current.dispatchEvent(event)\n                        }\n                      }\n                    } catch (err) {\n                      // eslint-disable-next-line no-console\n                      console.error(err)\n                    }\n                  }}\n                />\n              </>\n            ) : undefined\n          }\n        />\n      )\n    }),\n    {\n      sizes: SIZES,\n      displayName: COMPONENT_NAME,\n    }\n  ),\n  {\n    Phone: InputPhone,\n  }\n)\n\nexport { Input, COMPONENT_NAME }\n"],"names":["Input","Object","assign","withMergedProps","forwardRef","props","forwardedRef","theme","useTheme","size","rounded","color","placeholderColor","width","defaultInputControlsWidth","type","labelPosition","iconProps","controls","addonButtonProps","preset","className","style","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","sizeUnits","sizes","margin","marginXXS","marginXS","marginS","marginM","marginL","marginXL","marginTop","marginTopXXS","marginTopXS","marginTopS","marginTopM","marginTopL","marginTopXL","marginRight","marginRightXXS","marginRightXS","marginRightS","marginRightM","marginRightL","marginRightXL","marginBottom","marginBottomXXS","marginBottomXS","marginBottomS","marginBottomM","marginBottomL","marginBottomXL","marginLeft","marginLeftXXS","marginLeftXS","marginLeftS","marginLeftM","marginLeftL","marginLeftXL","palette","widthXXS","widthXS","widthS","widthM","widthL","widthXL","error","success","label","icon","text","primary","secondary","contrast","onColored","fluid","disabled","inline","inputRef","inputProps","sizeProps","additionalControlIcon","buttonProps","additionalControlButtonProps","additional","iconBefore","iconAfter","onClick","undefined","Array","isArray","inputAlwaysActive","Boolean","mask","alwaysShowMask","controlPalette","controlsColor","colorHover","controlsColorHover","colorActive","controlsColorActive","colorDisabled","controlsColorDisabled","backgroundColor","controlsBackgroundColor","backgroundColorHover","controlsBackgroundColorHover","backgroundColorActive","controlsBackgroundColorActive","backgroundColorDisabled","controlsBackgroundColorDisabled","ref","useRef","useImperativeHandle","current","addonRef","minusRef","plusRef","inputLabelId","useMemo","nanoid","inputActive","setInputActive","useState","initValue","value","defaultValue","length","minusDisabled","setMinusDisabled","min","Infinity","parseFloat","initDefaultValue","minValue","Math","plusDisabled","setPlusDisabled","max","maxValue","useLayoutEffect","document","activeElement","_jsx","Styled","input","FormInputLabel","labelId","active","borderColor","borderColorDisabled","SIZES_ICON","focus","onFocus","evt","target","currentTarget","onPointerDown","Node","contains","preventDefault","onBlur","relatedTarget","jsx","FormInput","inputColor","inputPlaceholderColor","inputColorDisabled","placeholderColorDisabled","inputPlaceholderColorDisabled","onChange","currentValue","minValueReached","maxValueReached","addon","IconButton","SIZES_CONTROL","stopPropagation","readOnly","_jsxs","_Fragment","children","prev","stepDown","event","Event","bubbles","dispatchEvent","err","console","stepUp","SIZES","displayName","Phone","InputPhone"],"mappings":"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"}
+{"version":3,"file":"Input.js","sources":["../../../../src/components/Input/Input.tsx"],"sourcesContent":["import { forwardRef, useState, useImperativeHandle, useRef, useLayoutEffect, useMemo } from 'react'\nimport { useTheme } from 'styled-components'\nimport { nanoid } from 'nanoid'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { FormInputLabel, SIZES } from 'components/FormInputLabel'\nimport { FormInput } from 'components/FormInput'\nimport { InputPhone } from 'components/Input.Phone'\nimport { IconButton } from 'components/IconButton'\nimport { SIZES_ICON, SIZES_CONTROL } from './constants'\nimport * as Styled from './style'\nimport type { InputProps } from './types'\n\nconst COMPONENT_NAME = 'Input'\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<input\\> элемента и пропсы \"react-input-mask\" [v2.0.4](https://www.npmjs.com/package/react-input-mask/v/2.0.4?activeTab=readme).\n *\n * Поддерживаются пропсы определения размеров и внешних отступов в зависимости от ширины вьюпорта.\n *\n * Можно передать \"ref\", который будет ассоциирован с \\<input\\>.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/Input/types.ts).\n */\nconst Input: React.ForwardRefExoticComponent<InputProps> & { Phone: typeof InputPhone } = Object.assign(\n  withMergedProps<InputProps, HTMLInputElement>(\n    forwardRef((props, forwardedRef) => {\n      const theme = useTheme()\n\n      const {\n        size = 'm',\n        rounded = true,\n        primary = true,\n        color = 'mineShaft',\n        placeholderColor = 'silver',\n        width = theme.defaultInputControlsWidth,\n        type = 'text',\n        labelPosition = 'dynamic',\n        iconProps = {},\n        controls = {},\n        addonButtonProps = {},\n        preset,\n        className,\n        style,\n        sizeXXS,\n        sizeXS,\n        sizeS,\n        sizeM,\n        sizeL,\n        sizeXL,\n        sizeUnits,\n        sizes,\n        margin,\n        marginXXS,\n        marginXS,\n        marginS,\n        marginM,\n        marginL,\n        marginXL,\n        marginTop,\n        marginTopXXS,\n        marginTopXS,\n        marginTopS,\n        marginTopM,\n        marginTopL,\n        marginTopXL,\n        marginRight,\n        marginRightXXS,\n        marginRightXS,\n        marginRightS,\n        marginRightM,\n        marginRightL,\n        marginRightXL,\n        marginBottom,\n        marginBottomXXS,\n        marginBottomXS,\n        marginBottomS,\n        marginBottomM,\n        marginBottomL,\n        marginBottomXL,\n        marginLeft,\n        marginLeftXXS,\n        marginLeftXS,\n        marginLeftS,\n        marginLeftM,\n        marginLeftL,\n        marginLeftXL,\n        palette,\n        widthXXS,\n        widthXS,\n        widthS,\n        widthM,\n        widthL,\n        widthXL,\n        error,\n        success,\n        label,\n        icon,\n        text,\n        secondary,\n        contrast,\n        onColored,\n        fluid,\n        disabled,\n        inline,\n        inputRef,\n        ...inputProps\n      } = props\n\n      const sizeProps = {\n        size,\n        sizeXXS,\n        sizeXS,\n        sizeS,\n        sizeM,\n        sizeL,\n        sizeXL,\n      }\n\n      const { icon: additionalControlIcon, buttonProps: additionalControlButtonProps = {} } = controls.additional ?? {}\n\n      const [iconBefore, iconAfter = !additionalControlButtonProps.onClick ? additionalControlIcon : undefined] =\n        Array.isArray(icon) ? icon : [icon]\n\n      const inputAlwaysActive = Boolean(inputProps.mask && inputProps.alwaysShowMask)\n\n      const controlPalette = {\n        color: palette.controlsColor,\n        colorHover: palette.controlsColorHover,\n        colorActive: palette.controlsColorActive,\n        colorDisabled: palette.controlsColorDisabled,\n        backgroundColor: palette.controlsBackgroundColor,\n        backgroundColorHover: palette.controlsBackgroundColorHover,\n        backgroundColorActive: palette.controlsBackgroundColorActive,\n        backgroundColorDisabled: palette.controlsBackgroundColorDisabled,\n      }\n\n      const ref = useRef<HTMLInputElement | null>(null)\n      useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(forwardedRef, () => ref.current, [])\n\n      const addonRef = useRef<HTMLButtonElement | null>(null)\n      const minusRef = useRef<HTMLButtonElement | null>(null)\n      const plusRef = useRef<HTMLButtonElement | null>(null)\n\n      const inputLabelId = useMemo(() => nanoid(), [])\n\n      const [inputActive, setInputActive] = useState(() => {\n        if (inputAlwaysActive) return true\n\n        const initValue = inputProps.value ?? inputProps.defaultValue\n\n        return (typeof initValue === 'string' && initValue.length > 0) || typeof initValue === 'number'\n      })\n\n      const [minusDisabled, setMinusDisabled] = useState(() => {\n        if (type !== 'number' || inputProps.min === undefined) return false\n\n        const { value = Infinity, defaultValue = Infinity } = inputProps\n\n        const initValue = typeof value === 'number' ? value : parseFloat(value)\n        const initDefaultValue = typeof defaultValue === 'number' ? defaultValue : parseFloat(defaultValue)\n        const minValue = typeof inputProps.min === 'number' ? inputProps.min : parseFloat(inputProps.min)\n\n        return Math.min(initValue, initDefaultValue) <= minValue\n      })\n\n      const [plusDisabled, setPlusDisabled] = useState(() => {\n        if (type !== 'number' || inputProps.max === undefined) return false\n\n        const { value = -Infinity, defaultValue = -Infinity } = inputProps\n\n        const initValue = typeof value === 'number' ? value : parseFloat(value)\n        const initDefaultValue = typeof defaultValue === 'number' ? defaultValue : parseFloat(defaultValue)\n        const maxValue = typeof inputProps.max === 'number' ? inputProps.max : parseFloat(inputProps.max)\n\n        return Math.max(initValue, initDefaultValue) >= maxValue\n      })\n\n      useLayoutEffect(() => {\n        if (inputAlwaysActive) {\n          setInputActive(true)\n        } else if (\n          inputProps.value !== undefined &&\n          inputProps.value !== null &&\n          ref.current &&\n          ref.current !== document.activeElement\n        ) {\n          setInputActive(\n            (typeof inputProps.value === 'string' && inputProps.value.length > 0) ||\n              typeof inputProps.value === 'number'\n          )\n        }\n      }, [inputAlwaysActive, inputProps.value])\n\n      if (preset !== 'brand') {\n        return (\n          <Styled.Root\n            {...inputProps}\n            inputRef={\n              inputRef ??\n              ((input) => {\n                ref.current = input\n              })\n            }\n            className={className}\n            style={style}\n            size={typeof size === 'number' ? size : undefined}\n            rounded={rounded}\n            color={color}\n            placeholderColor={placeholderColor}\n            width={width}\n            widthXXS={widthXXS}\n            widthXS={widthXS}\n            widthS={widthS}\n            widthM={widthM}\n            widthL={widthL}\n            widthXL={widthXL}\n            error={error}\n            type={type}\n            fluid={fluid}\n            disabled={disabled}\n          />\n        )\n      }\n\n      return (\n        <FormInputLabel\n          {...sizeProps}\n          className={className}\n          style={style}\n          sizeUnits={sizeUnits}\n          sizes={sizes}\n          margin={margin}\n          marginXXS={marginXXS}\n          marginXS={marginXS}\n          marginS={marginS}\n          marginM={marginM}\n          marginL={marginL}\n          marginXL={marginXL}\n          marginTop={marginTop}\n          marginTopXXS={marginTopXXS}\n          marginTopXS={marginTopXS}\n          marginTopS={marginTopS}\n          marginTopM={marginTopM}\n          marginTopL={marginTopL}\n          marginTopXL={marginTopXL}\n          marginRight={marginRight}\n          marginRightXXS={marginRightXXS}\n          marginRightXS={marginRightXS}\n          marginRightS={marginRightS}\n          marginRightM={marginRightM}\n          marginRightL={marginRightL}\n          marginRightXL={marginRightXL}\n          marginBottom={marginBottom}\n          marginBottomXXS={marginBottomXXS}\n          marginBottomXS={marginBottomXS}\n          marginBottomS={marginBottomS}\n          marginBottomM={marginBottomM}\n          marginBottomL={marginBottomL}\n          marginBottomXL={marginBottomXL}\n          marginLeft={marginLeft}\n          marginLeftXXS={marginLeftXXS}\n          marginLeftXS={marginLeftXS}\n          marginLeftS={marginLeftS}\n          marginLeftM={marginLeftM}\n          marginLeftL={marginLeftL}\n          marginLeftXL={marginLeftXL}\n          error={error}\n          success={success}\n          label={label}\n          labelId={inputLabelId}\n          labelPosition={labelPosition}\n          icon={[iconBefore, iconAfter]}\n          text={text}\n          primary={primary}\n          secondary={secondary}\n          contrast={contrast}\n          onColored={onColored}\n          disabled={disabled}\n          inline={inline}\n          active={inputActive}\n          palette={{\n            color: disabled ? palette.colorDisabled : palette.color,\n            backgroundColor: disabled ? palette.backgroundColorDisabled : palette.backgroundColor,\n            backgroundColorHover: disabled ? palette.backgroundColorDisabled : palette.backgroundColorHover,\n            borderColor: disabled ? palette.borderColorDisabled : palette.borderColor,\n          }}\n          iconProps={{\n            color: disabled ? 'content-disabled' : 'content-onmain-tertiary',\n            sizes: SIZES_ICON,\n            ...sizeProps,\n            ...iconProps,\n          }}\n          onClick={() => {\n            if (ref.current) {\n              ref.current.focus()\n            }\n          }}\n          onFocus={(evt) => {\n            if (evt.target !== evt.currentTarget) {\n              setInputActive(true)\n            }\n          }}\n          onPointerDown={(evt) => {\n            if (\n              evt.target === ref.current ||\n              !(evt.target instanceof Node) ||\n              addonRef.current?.contains(evt.target) ||\n              minusRef.current?.contains(evt.target) ||\n              plusRef.current?.contains(evt.target)\n            ) {\n              return\n            }\n            evt.preventDefault()\n          }}\n          onBlur={(evt) => {\n            if (!inputAlwaysActive && ref.current && !evt.currentTarget.contains(evt.relatedTarget)) {\n              setInputActive(Boolean(ref.current.value))\n            }\n          }}\n          input={\n            <FormInput\n              {...inputProps}\n              aria-labelledby={label ? inputLabelId : undefined}\n              ref={ref}\n              type={type}\n              disabled={disabled}\n              palette={{\n                color: palette.inputColor,\n                placeholderColor: palette.inputPlaceholderColor,\n                colorDisabled: palette.inputColorDisabled,\n                placeholderColorDisabled: palette.inputPlaceholderColorDisabled,\n              }}\n              onChange={(evt) => {\n                if (inputProps.onChange) {\n                  inputProps.onChange(evt)\n                }\n\n                if (type === 'number') {\n                  const currentValue = parseFloat(evt.currentTarget.value)\n\n                  const minValueReached = currentValue <= parseFloat(evt.currentTarget.min)\n                  const maxValueReached = currentValue >= parseFloat(evt.currentTarget.max)\n\n                  setMinusDisabled(minValueReached)\n                  setPlusDisabled(maxValueReached)\n\n                  if (minValueReached || maxValueReached) {\n                    evt.currentTarget.focus()\n                  }\n                }\n              }}\n            />\n          }\n          addon={\n            addonButtonProps.onClick || additionalControlButtonProps.onClick ? (\n              <IconButton\n                ref={addonRef}\n                sizes={SIZES_CONTROL}\n                palette={controlPalette}\n                {...sizeProps}\n                {...additionalControlButtonProps}\n                {...addonButtonProps}\n                icon={addonButtonProps.icon || additionalControlIcon || 'unknown'}\n                disabled={disabled || addonButtonProps.disabled || additionalControlButtonProps.disabled}\n                marginLeft={12}\n                onClick={(evt) => {\n                  evt.stopPropagation()\n                  if (inputProps.readOnly) return\n\n                  if (addonButtonProps.onClick) addonButtonProps.onClick(evt)\n                  if (additionalControlButtonProps.onClick) additionalControlButtonProps.onClick(evt)\n                }}\n              />\n            ) : undefined\n          }\n          controls={\n            type === 'number' ? (\n              <>\n                <IconButton\n                  {...sizeProps}\n                  ref={minusRef}\n                  icon='minus'\n                  sizes={SIZES_CONTROL}\n                  palette={controlPalette}\n                  disabled={disabled || minusDisabled}\n                  marginLeft={12}\n                  onClick={(evt) => {\n                    evt.stopPropagation()\n                    if (inputProps.readOnly) return\n\n                    try {\n                      if (ref.current) {\n                        setInputActive(true)\n\n                        const prev = ref.current.value\n                        ref.current.stepDown()\n\n                        const decremented = ref.current.value\n                        if (prev !== decremented) {\n                          const event = new Event('input', { bubbles: true })\n                          ref.current.dispatchEvent(event)\n                        }\n                      }\n                    } catch (err) {\n                      // eslint-disable-next-line no-console\n                      console.error(err)\n                    }\n                  }}\n                />\n                <Styled.IconButtonSeparated\n                  {...sizeProps}\n                  ref={plusRef}\n                  icon='plus'\n                  sizes={SIZES_CONTROL}\n                  palette={controlPalette}\n                  disabled={disabled || plusDisabled}\n                  onClick={(evt) => {\n                    evt.stopPropagation()\n                    if (inputProps.readOnly) return\n\n                    try {\n                      if (ref.current) {\n                        setInputActive(true)\n\n                        const prev = ref.current.value\n                        ref.current.stepUp()\n\n                        const incremented = ref.current.value\n                        if (prev !== incremented) {\n                          const event = new Event('input', { bubbles: true })\n                          ref.current.dispatchEvent(event)\n                        }\n                      }\n                    } catch (err) {\n                      // eslint-disable-next-line no-console\n                      console.error(err)\n                    }\n                  }}\n                />\n              </>\n            ) : undefined\n          }\n        />\n      )\n    }),\n    {\n      sizes: SIZES,\n      displayName: COMPONENT_NAME,\n    }\n  ),\n  {\n    Phone: InputPhone,\n  }\n)\n\nexport { Input, COMPONENT_NAME }\n"],"names":["Input","Object","assign","withMergedProps","forwardRef","props","forwardedRef","theme","useTheme","size","rounded","primary","color","placeholderColor","width","defaultInputControlsWidth","type","labelPosition","iconProps","controls","addonButtonProps","preset","className","style","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","sizeUnits","sizes","margin","marginXXS","marginXS","marginS","marginM","marginL","marginXL","marginTop","marginTopXXS","marginTopXS","marginTopS","marginTopM","marginTopL","marginTopXL","marginRight","marginRightXXS","marginRightXS","marginRightS","marginRightM","marginRightL","marginRightXL","marginBottom","marginBottomXXS","marginBottomXS","marginBottomS","marginBottomM","marginBottomL","marginBottomXL","marginLeft","marginLeftXXS","marginLeftXS","marginLeftS","marginLeftM","marginLeftL","marginLeftXL","palette","widthXXS","widthXS","widthS","widthM","widthL","widthXL","error","success","label","icon","text","secondary","contrast","onColored","fluid","disabled","inline","inputRef","inputProps","sizeProps","additionalControlIcon","buttonProps","additionalControlButtonProps","additional","iconBefore","iconAfter","onClick","undefined","Array","isArray","inputAlwaysActive","Boolean","mask","alwaysShowMask","controlPalette","controlsColor","colorHover","controlsColorHover","colorActive","controlsColorActive","colorDisabled","controlsColorDisabled","backgroundColor","controlsBackgroundColor","backgroundColorHover","controlsBackgroundColorHover","backgroundColorActive","controlsBackgroundColorActive","backgroundColorDisabled","controlsBackgroundColorDisabled","ref","useRef","useImperativeHandle","current","addonRef","minusRef","plusRef","inputLabelId","useMemo","nanoid","inputActive","setInputActive","useState","initValue","value","defaultValue","length","minusDisabled","setMinusDisabled","min","Infinity","parseFloat","initDefaultValue","minValue","Math","plusDisabled","setPlusDisabled","max","maxValue","useLayoutEffect","document","activeElement","_jsx","Styled","input","FormInputLabel","labelId","active","borderColor","borderColorDisabled","SIZES_ICON","focus","onFocus","evt","target","currentTarget","onPointerDown","Node","contains","preventDefault","onBlur","relatedTarget","jsx","FormInput","inputColor","inputPlaceholderColor","inputColorDisabled","placeholderColorDisabled","inputPlaceholderColorDisabled","onChange","currentValue","minValueReached","maxValueReached","addon","IconButton","SIZES_CONTROL","stopPropagation","readOnly","_jsxs","_Fragment","children","prev","stepDown","event","Event","bubbles","dispatchEvent","err","console","stepUp","SIZES","displayName","Phone","InputPhone"],"mappings":"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"}

package/components/Input/Input.mjs

@@ -1,2 +1,2 @@
-import{forwardRef,useRef,useImperativeHandle,useMemo,useState,useLayoutEffect}from'react';import{useTheme}from'styled-components';import{nanoid}from'../../external/.pnpm/nanoid@5.0.7/node_modules/nanoid/index.browser.mjs';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{SIZES_ICON,SIZES_CONTROL}from'./constants.mjs';import{Root,IconButtonSeparated}from'./style.mjs';import{jsx,jsxs,Fragment}from'react/jsx-runtime';import{InputPhone}from'../Input.Phone/Input.Phone.mjs';import{SIZES}from'../FormInputLabel/constants.mjs';import{FormInputLabel}from'../FormInputLabel/FormInputLabel.mjs';import{FormInput}from'../FormInput/FormInput.mjs';import{IconButton}from'../IconButton/IconButton.mjs';const COMPONENT_NAME='Input';const Input=Object.assign(withMergedProps(forwardRef(((o,r)=>{const t=useTheme();const{size:e="m",rounded:n=!0,color:a="mineShaft",placeholderColor:i="silver",width:s=t.defaultInputControlsWidth,type:l="text",labelPosition:m="dynamic",iconProps:c={},controls:u={},addonButtonProps:d={},preset:g,className:p,style:f,sizeXXS:b,sizeXS:S,sizeS:h,sizeM:X,sizeL:L,sizeXL:C,sizeUnits:v,sizes:I,margin:y,marginXXS:B,marginXS:R,marginS:T,marginM:k,marginL:w,marginXL:M,marginTop:z,marginTopXXS:x,marginTopXS:P,marginTopS:F,marginTopM:j,marginTopL:E,marginTopXL:O,marginRight:N,marginRightXXS:D,marginRightXS:_,marginRightS:A,marginRightM:H,marginRightL:Z,marginRightXL:U,marginBottom:V,marginBottomXXS:W,marginBottomXS:q,marginBottomS:G,marginBottomM:J,marginBottomL:K,marginBottomXL:Q,marginLeft:Y,marginLeftXXS:$,marginLeftXS:oo,marginLeftS:ro,marginLeftM:to,marginLeftL:eo,marginLeftXL:no,palette:ao,widthXXS:io,widthXS:so,widthS:lo,widthM:mo,widthL:co,widthXL:uo,error:go,success:po,label:fo,icon:bo,text:So,primary:ho,secondary:Xo,contrast:Lo,onColored:Co,fluid:vo,disabled:Io,inline:yo,inputRef:Bo,...Ro}=o;const To={size:e,sizeXXS:b,sizeXS:S,sizeS:h,sizeM:X,sizeL:L,sizeXL:C};const{icon:ko,buttonProps:wo={}}=u.additional??{};const[Mo,zo=(wo.onClick?void 0:ko)]=Array.isArray(bo)?bo:[bo];const xo=Boolean(Ro.mask&&Ro.alwaysShowMask);const Po={color:ao.controlsColor,colorHover:ao.controlsColorHover,colorActive:ao.controlsColorActive,colorDisabled:ao.controlsColorDisabled,backgroundColor:ao.controlsBackgroundColor,backgroundColorHover:ao.controlsBackgroundColorHover,backgroundColorActive:ao.controlsBackgroundColorActive,backgroundColorDisabled:ao.controlsBackgroundColorDisabled};const Fo=useRef(null);useImperativeHandle(r,(()=>Fo.current),[]);const jo=useRef(null);const Eo=useRef(null);const Oo=useRef(null);const No=useMemo((()=>nanoid()),[]);const[Do,_o]=useState((()=>{if(xo)return!0;const o=Ro.value??Ro.defaultValue;return typeof o=='string'&&o.length>0||typeof o=='number'}));const[Ao,Ho]=useState((()=>{if(l!=='number'||Ro.min===void 0)return!1;const{value:o=1/0,defaultValue:r=1/0}=Ro;const t=typeof o=='number'?o:parseFloat(o);const e=typeof r=='number'?r:parseFloat(r);const n=typeof Ro.min=='number'?Ro.min:parseFloat(Ro.min);return Math.min(t,e)<=n}));const[Zo,Uo]=useState((()=>{if(l!=='number'||Ro.max===void 0)return!1;const{value:o=-1/0,defaultValue:r=-1/0}=Ro;const t=typeof o=='number'?o:parseFloat(o);const e=typeof r=='number'?r:parseFloat(r);const n=typeof Ro.max=='number'?Ro.max:parseFloat(Ro.max);return Math.max(t,e)>=n}));return useLayoutEffect((()=>{xo?_o(!0):Ro.value!==void 0&&Ro.value!==null&&Fo.current&&Fo.current!==document.activeElement&&_o(typeof Ro.value=='string'&&Ro.value.length>0||typeof Ro.value=='number')}),[xo,Ro.value]),g!=='brand'?jsx(Root,{...Ro,inputRef:Bo??(o=>{Fo.current=o}),className:p,style:f,size:typeof e=='number'?e:void 0,rounded:n,color:a,placeholderColor:i,width:s,widthXXS:io,widthXS:so,widthS:lo,widthM:mo,widthL:co,widthXL:uo,error:go,type:l,fluid:vo,disabled:Io}):jsx(FormInputLabel,{...To,className:p,style:f,sizeUnits:v,sizes:I,margin:y,marginXXS:B,marginXS:R,marginS:T,marginM:k,marginL:w,marginXL:M,marginTop:z,marginTopXXS:x,marginTopXS:P,marginTopS:F,marginTopM:j,marginTopL:E,marginTopXL:O,marginRight:N,marginRightXXS:D,marginRightXS:_,marginRightS:A,marginRightM:H,marginRightL:Z,marginRightXL:U,marginBottom:V,marginBottomXXS:W,marginBottomXS:q,marginBottomS:G,marginBottomM:J,marginBottomL:K,marginBottomXL:Q,marginLeft:Y,marginLeftXXS:$,marginLeftXS:oo,marginLeftS:ro,marginLeftM:to,marginLeftL:eo,marginLeftXL:no,error:go,success:po,label:fo,labelId:No,labelPosition:m,icon:[Mo,zo],text:So,primary:ho,secondary:Xo,contrast:Lo,onColored:Co,disabled:Io,inline:yo,active:Do,palette:{color:Io?ao.colorDisabled:ao.color,backgroundColor:Io?ao.backgroundColorDisabled:ao.backgroundColor,backgroundColorHover:Io?ao.backgroundColorDisabled:ao.backgroundColorHover,borderColor:Io?ao.borderColorDisabled:ao.borderColor},iconProps:{color:Io?'content-disabled':'content-onmain-tertiary',sizes:SIZES_ICON,...To,...c},onClick:()=>{Fo.current&&Fo.current.focus()},onFocus:o=>{o.target!==o.currentTarget&&_o(!0)},onPointerDown:o=>{o.target!==Fo.current&&o.target instanceof Node&&!jo.current?.contains(o.target)&&!Eo.current?.contains(o.target)&&!Oo.current?.contains(o.target)&&o.preventDefault()},onBlur:o=>{xo||!Fo.current||o.currentTarget.contains(o.relatedTarget)||_o(Boolean(Fo.current.value))},input:jsx(FormInput,{...Ro,"aria-labelledby":fo?No:void 0,ref:Fo,type:l,disabled:Io,palette:{color:ao.inputColor,placeholderColor:ao.inputPlaceholderColor,colorDisabled:ao.inputColorDisabled,placeholderColorDisabled:ao.inputPlaceholderColorDisabled},onChange:o=>{if(Ro.onChange&&Ro.onChange(o),l==='number'){const r=parseFloat(o.currentTarget.value);const t=r<=parseFloat(o.currentTarget.min);const e=r>=parseFloat(o.currentTarget.max);Ho(t),Uo(e),(t||e)&&o.currentTarget.focus()}}}),addon:d.onClick||wo.onClick?jsx(IconButton,{ref:jo,sizes:SIZES_CONTROL,palette:Po,...To,...wo,...d,icon:d.icon||ko,disabled:Io||d.disabled||wo.disabled,marginLeft:12,onClick:o=>{o.stopPropagation(),Ro.readOnly||(d.onClick&&d.onClick(o),wo.onClick&&wo.onClick(o))}}):void 0,controls:l==='number'?jsxs(Fragment,{children:[jsx(IconButton,{...To,ref:Eo,icon:"minus",sizes:SIZES_CONTROL,palette:Po,disabled:Io||Ao,marginLeft:12,onClick:o=>{if(o.stopPropagation(),!Ro.readOnly)try{if(Fo.current){_o(!0);const o=Fo.current.value;if(Fo.current.stepDown(),o!==Fo.current.value){const o=new Event('input',{bubbles:!0});Fo.current.dispatchEvent(o)}}}catch(o){console.error(o)}}}),jsx(IconButtonSeparated,{...To,ref:Oo,icon:"plus",sizes:SIZES_CONTROL,palette:Po,disabled:Io||Zo,onClick:o=>{if(o.stopPropagation(),!Ro.readOnly)try{if(Fo.current){_o(!0);const o=Fo.current.value;if(Fo.current.stepUp(),o!==Fo.current.value){const o=new Event('input',{bubbles:!0});Fo.current.dispatchEvent(o)}}}catch(o){console.error(o)}}})]}):void 0})})),{sizes:SIZES,displayName:"Input"}),{Phone:InputPhone});export{COMPONENT_NAME,Input};
+import{forwardRef,useRef,useImperativeHandle,useMemo,useState,useLayoutEffect}from'react';import{useTheme}from'styled-components';import{nanoid}from'../../external/.pnpm/nanoid@5.0.7/node_modules/nanoid/index.browser.mjs';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{SIZES_ICON,SIZES_CONTROL}from'./constants.mjs';import{Root,IconButtonSeparated}from'./style.mjs';import{jsx,jsxs,Fragment}from'react/jsx-runtime';import{InputPhone}from'../Input.Phone/Input.Phone.mjs';import{SIZES}from'../FormInputLabel/constants.mjs';import{FormInputLabel}from'../FormInputLabel/FormInputLabel.mjs';import{FormInput}from'../FormInput/FormInput.mjs';import{IconButton}from'../IconButton/IconButton.mjs';const COMPONENT_NAME='Input';const Input=Object.assign(withMergedProps(forwardRef(((o,r)=>{const t=useTheme();const{size:e="m",rounded:n=!0,primary:a=!0,color:i="mineShaft",placeholderColor:s="silver",width:l=t.defaultInputControlsWidth,type:m="text",labelPosition:c="dynamic",iconProps:u={},controls:d={},addonButtonProps:g={},preset:p,className:f,style:b,sizeXXS:S,sizeXS:h,sizeS:X,sizeM:L,sizeL:C,sizeXL:v,sizeUnits:I,sizes:y,margin:B,marginXXS:R,marginXS:T,marginS:k,marginM:w,marginL:M,marginXL:z,marginTop:x,marginTopXXS:P,marginTopXS:F,marginTopS:j,marginTopM:E,marginTopL:O,marginTopXL:N,marginRight:D,marginRightXXS:_,marginRightXS:A,marginRightS:H,marginRightM:Z,marginRightL:U,marginRightXL:V,marginBottom:W,marginBottomXXS:q,marginBottomXS:G,marginBottomS:J,marginBottomM:K,marginBottomL:Q,marginBottomXL:Y,marginLeft:$,marginLeftXXS:oo,marginLeftXS:ro,marginLeftS:to,marginLeftM:eo,marginLeftL:no,marginLeftXL:ao,palette:io,widthXXS:so,widthXS:lo,widthS:mo,widthM:co,widthL:uo,widthXL:go,error:po,success:fo,label:bo,icon:So,text:ho,secondary:Xo,contrast:Lo,onColored:Co,fluid:vo,disabled:Io,inline:yo,inputRef:Bo,...Ro}=o;const To={size:e,sizeXXS:S,sizeXS:h,sizeS:X,sizeM:L,sizeL:C,sizeXL:v};const{icon:ko,buttonProps:wo={}}=d.additional??{};const[Mo,zo=(wo.onClick?void 0:ko)]=Array.isArray(So)?So:[So];const xo=Boolean(Ro.mask&&Ro.alwaysShowMask);const Po={color:io.controlsColor,colorHover:io.controlsColorHover,colorActive:io.controlsColorActive,colorDisabled:io.controlsColorDisabled,backgroundColor:io.controlsBackgroundColor,backgroundColorHover:io.controlsBackgroundColorHover,backgroundColorActive:io.controlsBackgroundColorActive,backgroundColorDisabled:io.controlsBackgroundColorDisabled};const Fo=useRef(null);useImperativeHandle(r,(()=>Fo.current),[]);const jo=useRef(null);const Eo=useRef(null);const Oo=useRef(null);const No=useMemo((()=>nanoid()),[]);const[Do,_o]=useState((()=>{if(xo)return!0;const o=Ro.value??Ro.defaultValue;return typeof o=='string'&&o.length>0||typeof o=='number'}));const[Ao,Ho]=useState((()=>{if(m!=='number'||Ro.min===void 0)return!1;const{value:o=1/0,defaultValue:r=1/0}=Ro;const t=typeof o=='number'?o:parseFloat(o);const e=typeof r=='number'?r:parseFloat(r);const n=typeof Ro.min=='number'?Ro.min:parseFloat(Ro.min);return Math.min(t,e)<=n}));const[Zo,Uo]=useState((()=>{if(m!=='number'||Ro.max===void 0)return!1;const{value:o=-1/0,defaultValue:r=-1/0}=Ro;const t=typeof o=='number'?o:parseFloat(o);const e=typeof r=='number'?r:parseFloat(r);const n=typeof Ro.max=='number'?Ro.max:parseFloat(Ro.max);return Math.max(t,e)>=n}));return useLayoutEffect((()=>{xo?_o(!0):Ro.value!==void 0&&Ro.value!==null&&Fo.current&&Fo.current!==document.activeElement&&_o(typeof Ro.value=='string'&&Ro.value.length>0||typeof Ro.value=='number')}),[xo,Ro.value]),p!=='brand'?jsx(Root,{...Ro,inputRef:Bo??(o=>{Fo.current=o}),className:f,style:b,size:typeof e=='number'?e:void 0,rounded:n,color:i,placeholderColor:s,width:l,widthXXS:so,widthXS:lo,widthS:mo,widthM:co,widthL:uo,widthXL:go,error:po,type:m,fluid:vo,disabled:Io}):jsx(FormInputLabel,{...To,className:f,style:b,sizeUnits:I,sizes:y,margin:B,marginXXS:R,marginXS:T,marginS:k,marginM:w,marginL:M,marginXL:z,marginTop:x,marginTopXXS:P,marginTopXS:F,marginTopS:j,marginTopM:E,marginTopL:O,marginTopXL:N,marginRight:D,marginRightXXS:_,marginRightXS:A,marginRightS:H,marginRightM:Z,marginRightL:U,marginRightXL:V,marginBottom:W,marginBottomXXS:q,marginBottomXS:G,marginBottomS:J,marginBottomM:K,marginBottomL:Q,marginBottomXL:Y,marginLeft:$,marginLeftXXS:oo,marginLeftXS:ro,marginLeftS:to,marginLeftM:eo,marginLeftL:no,marginLeftXL:ao,error:po,success:fo,label:bo,labelId:No,labelPosition:c,icon:[Mo,zo],text:ho,primary:a,secondary:Xo,contrast:Lo,onColored:Co,disabled:Io,inline:yo,active:Do,palette:{color:Io?io.colorDisabled:io.color,backgroundColor:Io?io.backgroundColorDisabled:io.backgroundColor,backgroundColorHover:Io?io.backgroundColorDisabled:io.backgroundColorHover,borderColor:Io?io.borderColorDisabled:io.borderColor},iconProps:{color:Io?'content-disabled':'content-onmain-tertiary',sizes:SIZES_ICON,...To,...u},onClick:()=>{Fo.current&&Fo.current.focus()},onFocus:o=>{o.target!==o.currentTarget&&_o(!0)},onPointerDown:o=>{o.target!==Fo.current&&o.target instanceof Node&&!jo.current?.contains(o.target)&&!Eo.current?.contains(o.target)&&!Oo.current?.contains(o.target)&&o.preventDefault()},onBlur:o=>{xo||!Fo.current||o.currentTarget.contains(o.relatedTarget)||_o(Boolean(Fo.current.value))},input:jsx(FormInput,{...Ro,"aria-labelledby":bo?No:void 0,ref:Fo,type:m,disabled:Io,palette:{color:io.inputColor,placeholderColor:io.inputPlaceholderColor,colorDisabled:io.inputColorDisabled,placeholderColorDisabled:io.inputPlaceholderColorDisabled},onChange:o=>{if(Ro.onChange&&Ro.onChange(o),m==='number'){const r=parseFloat(o.currentTarget.value);const t=r<=parseFloat(o.currentTarget.min);const e=r>=parseFloat(o.currentTarget.max);Ho(t),Uo(e),(t||e)&&o.currentTarget.focus()}}}),addon:g.onClick||wo.onClick?jsx(IconButton,{ref:jo,sizes:SIZES_CONTROL,palette:Po,...To,...wo,...g,icon:g.icon||ko||'unknown',disabled:Io||g.disabled||wo.disabled,marginLeft:12,onClick:o=>{o.stopPropagation(),Ro.readOnly||(g.onClick&&g.onClick(o),wo.onClick&&wo.onClick(o))}}):void 0,controls:m==='number'?jsxs(Fragment,{children:[jsx(IconButton,{...To,ref:Eo,icon:"minus",sizes:SIZES_CONTROL,palette:Po,disabled:Io||Ao,marginLeft:12,onClick:o=>{if(o.stopPropagation(),!Ro.readOnly)try{if(Fo.current){_o(!0);const o=Fo.current.value;if(Fo.current.stepDown(),o!==Fo.current.value){const o=new Event('input',{bubbles:!0});Fo.current.dispatchEvent(o)}}}catch(o){console.error(o)}}}),jsx(IconButtonSeparated,{...To,ref:Oo,icon:"plus",sizes:SIZES_CONTROL,palette:Po,disabled:Io||Zo,onClick:o=>{if(o.stopPropagation(),!Ro.readOnly)try{if(Fo.current){_o(!0);const o=Fo.current.value;if(Fo.current.stepUp(),o!==Fo.current.value){const o=new Event('input',{bubbles:!0});Fo.current.dispatchEvent(o)}}}catch(o){console.error(o)}}})]}):void 0})})),{sizes:SIZES,displayName:"Input"}),{Phone:InputPhone});export{COMPONENT_NAME,Input};
 //# sourceMappingURL=Input.mjs.map