hrm_ui_lib 0.0.1-beta.0

package/components/Select/MultiSelect/MultiSelectWithTabs/MultiSelectWithTabs.js

@@ -0,0 +1,7 @@
+import{jsxs as T,Fragment as K,jsx as a}from"react/jsx-runtime";import{useState as p,useMemo as u,useCallback as A}from"react";import{Divider as Q}from"../../../Divider/Divider.js";import{Empty as U}from"../../../Empty/Empty.js";import{Tab as Y}from"../../../Tab/Tab.js";import{useGetElemSizes as Z}from"../../../../hooks/useGetElemSizes.js";import"../../../../consts/index.js";import"../../../../context/types.js";import"../../../../hooks/useScreenSize.js";import"react-hook-form";import{OptionItem as D}from"../../../../helperComponents/OptionItem/OptionItem.js";import"classnames";import"../../../Checkbox/Checkbox.js";import"react-dom";import"motion/react";import"dayjs";import"../../../Collapse/CollapseGroup/CollapseGroup.js";import{ContentTop as ee}from"../../SharedComponents/ContentTop.js";import"../../../Input/Input.js";import{DROPDOWN_MAX_HEIGHT as te}from"../../constants.js";const ye=e=>{const{options:t,scrollableContentStyle:s,selectedValues:o,onItemSelect:l,onItemDeselect:i,setSelectedValues:n,labelLeftIconProps:r,optionRightIconComponent:c,labelRightIconComponent:m,helperText:d,translations:h,isSearchAvailable:b,maxSelectCount:f,menuOptions:C,dataIdPrefix:I,closeDropdown:v}=e,{emptyListMainMessage:S,emptyListSecondaryMessage:x}=h,[g,j]=p(null),[y,k]=p(0),{scrollHeight:L}=Z(g),[M,O]=p(!1),[_,z]=p(""),E=t[y].data,w=u(()=>_?E.filter(e=>"string"==typeof e.label&&e.label.toLocaleLowerCase().includes(_.toLocaleLowerCase())):E,[_,E]),G=A(()=>{O(!1);const e=o.filter(e=>-1===E.map(e=>e.value).indexOf(e.value));n(e)},[o,y,E]),P=e=>{O(!1),i(e)},R=A(()=>{O(!0);const e=w.map(e=>{const{value:t,label:a}=e;return{value:t,label:a}});n(o.concat(e))},[y,o,w]),V=u(()=>t.map((e,t)=>({label:e.title,value:t})),[t]),H=u(()=>t.reduce((e,t)=>{const{data:a}=t;return[...e,...a.filter(e=>-1!==o.findIndex(t=>t.value===e.value))]},[]),[t,o]),N=u(()=>({isCheckbox:!0,labelLeftIconProps:r,optionRightIconComponent:c,labelRightIconComponent:m}),[r,c,m]);/* @__PURE__ */
+return T(K,{children:[
+/* @__PURE__ */a("div",{className:"tab_container",style:{padding:"0 20px",width:"100%"},children:/* @__PURE__ */a(Y,{selectedValue:y,tabItems:V,onSelect:e=>{k(e),z("")},size:"small"})}),
+/* @__PURE__ */a(ee,{closeDropdown:v,dataIdPrefix:I,menuOptions:C,isSearchAvailable:b,clearAll:G,selectAll:R,helperText:d,searchValue:_,translations:h,setSearchValue:z,hasLimitation:!!f,isAnySelected:0===o.length,isSelectAllDisabled:M||0===w.length}),
+/* @__PURE__ */T("div",{ref:j,className:"select__options__scroll scrollbar scrollbar--vertical "+(L>te?"mr-6":""),style:s,children:[b&&/* @__PURE__ */a("div",{className:"selected_container",children:H.map(e=>/* @__PURE__ */a(D,{data:e,onClick:P,disabled:e.disabled,isSelected:!0,...N},e.value))}),
+/* @__PURE__ */a(Q,{type:"primary",isHorizontal:!0}),w.map(e=>{const t=-1!==o.findIndex(t=>t.value===e.value);/* @__PURE__ */
+return a(D,{data:e,dataId:e.dataId,onClick:t?P:l,disabled:e.disabled||!t&&o.length===f,isSelected:t,...N},e.value)}),0===w.length?/* @__PURE__ */a(U,{size:"small",mainMessage:S,paragraphMessage:x}):null]})]})};export{ye as MultiSelectWithTabs};

package/components/Select/MultiSelect/OptionsWrapper.d.ts

@@ -0,0 +1,19 @@
+import { ReactElement } from 'react';
+import { TSelectTranslations } from '../types';
+type TProps = {
+    isLoading?: boolean;
+    withTabs?: boolean;
+    isGrouped?: boolean;
+    isOpen: boolean;
+    translations: TSelectTranslations;
+    containerRef: HTMLDivElement | null;
+    setIsOpen: (isOpen: boolean) => void;
+    dropdownRef: HTMLDivElement | null;
+    dropdownWidth?: number;
+    options: TSelectOptions;
+    selectedValues: TSelectedValue[];
+    setSelectedValues: (values: TSelectedValue[]) => void;
+    isMobileFullScreen: boolean;
+};
+export declare const OptionsWrapper: (props: TProps) => ReactElement;
+export {};

package/components/Select/MultiSelect/OptionsWrapper.js

@@ -0,0 +1 @@
+import{jsx as u}from"react/jsx-runtime";import{useRef as v,useCallback as B,useMemo as L}from"react";import"classnames";import"../../Checkbox/Checkbox.js";import"react-dom";import{useGetElemSizes as R}from"../../../hooks/useGetElemSizes.js";import"../../../consts/index.js";import"../../../context/types.js";import"../../../hooks/useScreenSize.js";import{useGetHasBottomSpace as V,useGetHasTopSpace as x}from"../../../hooks/useGetHasBottomSpace.js";import"react-hook-form";import{getStringWidth as y}from"../../../utils/helpers.js";import"../../../helperComponents/ErrorMessage/consts.js";import"../../FileUpload/DropzoneFileUpload/DropzoneFileUpload.js";import"motion/react";import"../../Collapse/CollapseGroup/CollapseGroup.js";import"../SharedComponents/ContentTop.js";import{Loading as D}from"../SharedComponents/Loading.js";import"../../Input/Input.js";import{useIsMobile as H}from"../../../hooks/useGetIsMobile.js";import{MultiSelectGrouped as k}from"./MultiSelectGrouped/MultiSelectGrouped.js";import{MultiBase as N}from"./MultiBase/MultiBase.js";import{MultiSelectWithTabs as j}from"./MultiSelectWithTabs/MultiSelectWithTabs.js";import{SELECTED_VISIBLE_MIN_COUNT as z}from"../constants.js";const ft=e=>{const{isLoading:t,withTabs:o,isGrouped:s,isOpen:r,containerRef:i,options:a,selectedValues:l,setSelectedValues:p,setIsOpen:m,dropdownRef:n,isMobileFullScreen:c,...S}=e,{width:d}=R(i),h=v(null),f=o?j:s?k:N,M=B(e=>y(e,14)>d-80,[d]),b=L(()=>s||o?a.reduce((e,t)=>{const{data:o}=t;return e+o.length},0):a.length,[a]),{hasBottomSpace:C,bottomSpace:G}=V({element:n,input:h.current}),I=x({element:n,input:h.current}),g=H()&&c;return t?/* @__PURE__ */u(D,{}):/* @__PURE__ */u(f,{options:a,isOpen:r,isMobile:g,hasBottomSpace:C,selectedValues:l,onItemSelect:e=>{p([...l,e])},onItemDeselect:e=>{p(l.filter(t=>t.value!==e.value))},setSelectedValues:p,closeDropdown:()=>m(!1),checkIsValueOverflowed:M,isSearchAvailable:b>z,scrollableContentStyle:{...C||I?{}:{maxHeight:G-65-56}},...S})};export{ft as OptionsWrapper};

package/components/Select/NestedSelect/NestedSelect.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { TNestedSelectProps } from '../types';
+export declare const NestedSelect: (props: TNestedSelectProps) => React.ReactElement | null;

package/components/Select/NestedSelect/NestedSelect.js

@@ -0,0 +1,4 @@
+import{jsxs as j,jsx as r}from"react/jsx-runtime";import{useState as p,useRef as q,useId as A,useCallback as H}from"react";import{Input as M}from"../../Input/Input.js";import{OptionItem as T}from"../../../helperComponents/OptionItem/OptionItem.js";import{useGetElemSizes as U}from"../../../hooks/useGetElemSizes.js";import{useGetElemPositions as B}from"../../../hooks/useGetElemPositions.js";import"../../../consts/index.js";import"../../../context/types.js";import{useOnOutsideClick as J}from"../../../hooks/useOnOutsideClick.js";import"../../../hooks/useScreenSize.js";import"react-hook-form";import K from"../../SVGIcons/IconChevronUp.js";import v from"../../SVGIcons/IconChevronDown.js";const Q=10,ce=e=>{const{label:o,options:s,selected:t,placeHolder:l,isRequiredField:n,setSelectedValue:i,initialSelectedFolderIds:a,optionRightIconComponent:c,labelRightIconComponent:d,labelAddons:m}=e,[u,h]=p(!1),[f,I]=p(null),[b,C]=p(a||[]),S=q(null),{bottom:k,left:x}=B(S.current),{width:O}=U(f);J(f,()=>h(!1),u,A());const g=H((e,o)=>{const{value:s}=e;if(!o)return void i(s===(null==t?void 0:t.value)?null:e);const l=-1!==b.findIndex(e=>e===s);C(l?b.filter(e=>e!==s):[...b,s])},[t,b]),_=(e,o)=>e.reduce((e,s)=>{const{value:l,children:n,disabled:i}=s,a=-1!==b.indexOf(s.value),p=s.value===(null==t?void 0:t.value);return e.push(
+/* @__PURE__ */r("div",{style:{paddingLeft:Q*o},children:/* @__PURE__ */r(T,{data:s,isSelected:p,onClick:()=>g({value:l,label:s.label},!!n),disabled:i,OptionRightIconComponent:c,LabelRightIconComponent:d,labelLeftIconProps:n?{Component:v,size:"xsmall"}:void 0},l)})),a&&n&&e.push(..._(n,o+1)),e},[]);/* @__PURE__ */
+return j("div",{className:"select select--multi",ref:I,children:[
+/* @__PURE__ */r("div",{onClick:e=>{const o=null==e?void 0:e.target;e&&o.className&&-1!==o.className.indexOf("icon-")?(h(!u),e.preventDefault()):h(!0)},children:/* @__PURE__ */r(M,{ref:S,className:"select__input",label:o,required:n,rightIconProps:{Component:u?K:v,size:"small"},placeholder:l,currentValue:(null==t?void 0:t.label.toString())||"",readonly:!0,labelAddons:m})}),u&&/* @__PURE__ */r("div",{className:"select__options",style:{left:x,width:O,top:k},children:/* @__PURE__ */r("div",{className:"select__options__scroll scrollbar scrollbar--vertical",children:_(s,0)})})]})};export{ce as NestedSelect};

package/components/Select/ProfileDropdown/index.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { TProfileDropdownProps } from '../types';
+export declare const ProfileDropdown: (props: TProfileDropdownProps) => React.ReactElement;

package/components/Select/ProfileDropdown/index.js

@@ -0,0 +1,10 @@
+import{jsxs as e,jsx as r,Fragment as i}from"react/jsx-runtime";import N,{useRef as x,useId as w}from"react";import{Text as h}from"../../Text/Text.js";import"../../../consts/index.js";import"../../../context/types.js";import{useOnOutsideClick as k}from"../../../hooks/useOnOutsideClick.js";import"../../../hooks/useScreenSize.js";import"react-hook-form";import{Link as m}from"../../Link/Link.js";const z=l=>{const n=x(null),{avatar:o,name:s,email:c,bodyItems:a,footerItems:d,className:t}=l,[p,u]=N.useState(!1),f=()=>u(!1);return k(n.current,f,p,w()),/* @__PURE__ */e("div",{ref:n,className:`relative ${t}`,children:[
+/* @__PURE__ */r("div",{onClick:()=>u(!p),children:o}),p&&/* @__PURE__ */e("div",{className:"profile-dropdown",children:[
+/* @__PURE__ */e("div",{className:"profile-dropdown__top",children:[o,
+/* @__PURE__ */e("div",{className:"pl-12",children:[
+/* @__PURE__ */r(h,{size:"medium",weight:"bold",lineHeight:"large",children:s}),
+/* @__PURE__ */r(h,{type:"tertiary",children:c})]})]}),
+/* @__PURE__ */e("div",{className:"profile-dropdown__menu",children:[
+/* @__PURE__ */r("ul",{className:"profile-dropdown__nav",children:null==a?void 0:a.map((l,n)=>/* @__PURE__ */r("li",{children:l.text?/* @__PURE__ */r(m,{url:l.url,onclick:l.onclick,className:"profile-dropdown__nav__link",children:/* @__PURE__ */e(i,{children:[
+/* @__PURE__ */r("span",{className:"flexbox align-items--center",children:/* @__PURE__ */e(i,{children:[l.icon,l.text]})}),l.rightInfoProps]})}):/* @__PURE__ */r("div",{onClick:f,children:l.children})},n))}),null!=d&&d.length?/* @__PURE__ */r("div",{className:"profile-dropdown__bottom",children:/* @__PURE__ */r("ul",{className:"profile-dropdown__nav",children:null==d?void 0:d.map((l,n)=>/* @__PURE__ */r("li",{children:l.text?/* @__PURE__ */r(m,{url:l.url,onclick:l.onclick,className:"profile-dropdown__nav__link",children:/* @__PURE__ */e(i,{children:[
+/* @__PURE__ */r("span",{className:"flexbox align-items--center",children:/* @__PURE__ */e(i,{children:[l.icon,l.text]})}),l.rightInfoProps]})}):l.children},n))})}):null]})]})]})};export{z as ProfileDropdown};

package/components/Select/Select/Select.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { TSingleSelectPropTypes } from '../types';
+export declare const Select: React.ForwardRefExoticComponent<TSingleSelectPropTypes & React.RefAttributes<unknown>>;

package/components/Select/Select/Select.js

@@ -0,0 +1 @@
+import{jsxs as re,jsx as u}from"react/jsx-runtime";import{forwardRef as le,useRef as U,useState as d,useMemo as ae,useCallback as ce,useEffect as ie}from"react";import{useIsMobile as pe}from"../../../hooks/useGetIsMobile.js";import{SelectDesktop as me}from"./SelectDesktop/index.js";import fe from"classnames";import{Input as ue}from"../../Input/Input.js";import{noop as j}from"../../../utils/helpers.js";import{SELECTED_VISIBLE_MIN_COUNT as de}from"../constants.js";import{SelectMobile as Ie}from"./SelectMobile/index.js";import he from"../../SVGIcons/IconChevronUp.js";import Se from"../../SVGIcons/IconChevronDown.js";import{SELECT_TRANSLATIONS as be}from"../localization.js";import{Button as Ce}from"../../Button/Button.js";import{filterOptions as ge}from"./helpers.js";const De=le((e,t)=>{var l,o;const{labelAddons:s,dataId:n,className:a,size:r,label:i,hasError:c,isValid:p,disabled:m,outerHelperText:f,isRequiredField:I,placeHolder:h,selectRightIconProps:S={Component:Se,size:"small"},selectRightIconOpenedProps:b={Component:he,size:"small"},options:v,withSearch:D=!1,setSelectedItem:C,setFieldValue:g,name:x,selectedItem:w,value:E,isMobileFullScreen:V=!0,language:k="en",translations:R,isButtonSelect:M,...N}=e,O=pe(),A=U(null),T=U(null),[L,_]=d(!1),[y,z]=d(""),[B,F]=d(null),[P,q]=d(0),G=()=>_(!0),H=()=>{_(!1),z("")},$=null!=(l=null==B?void 0:B.optionLeftIcon)&&l.Component?{Component:null==(o=null==B?void 0:B.optionLeftIcon)?void 0:o.Component}:null,K=D&&v.length>de,J=e=>{C&&C(e),x&&g&&g(x,e),H()},Q=()=>J(null),W=E||w,X={...be[k],...R},Y=ae(()=>ge(v,y),[y,v]),Z=ce(()=>{const e=v.findIndex(e=>e.value===W);F(v[e]),q(e)},[W,v]);return ie(()=>{Z()},[Z]),/* @__PURE__ */re("div",{"data-id":`${n}-content`,className:fe(`select select--${r}`,a,{"select--opened":L}),ref:A,children:[!M&&/* @__PURE__ */u(ue,{onClick:m?j:e=>{const t=null==e?void 0:e.target,l=null==t?void 0:t.getAttribute("class");if(e&&l&&(-1!==l.indexOf("icon-")||-1!==l.indexOf("svg-icon")))return _(!L),void e.preventDefault();L&&!K?H():G()},size:"large"===r?"large":"small",dataId:n,hasError:c,className:"select__input",label:i,onChange:e=>{F(null),z(e.target.value)},required:I,leftIconProps:$,rightIconProps:L?b:S,placeholder:h,currentValue:y||(null==B?void 0:B.label.toString())||"",isValid:p,disabled:m,helperText:L?"":f,ref:T,labelAddons:s,autoComplete:"false",readOnly:O&&V||!K,onKeyDown:e=>{if(L)switch(e.key){case"ArrowDown":e.preventDefault(),q(e=>Math.min(e+1,Y.length-1));break;case"ArrowUp":e.preventDefault(),q(e=>Math.max(e-1,0));break;case"Enter":e.preventDefault();const t=Y[P];null!=t&&t.disabled||(J(t.value),H());break;case"Escape":H()}}}),M&&/* @__PURE__ */u(Ce,{size:r,type:"secondary",dataId:n,iconProps:S,buttonText:h||"",onClick:m?j:G,className:"select_button"}),O&&V?/* @__PURE__ */u(Ie,{...N,isOpen:L,filteredData:Y,closeDropdown:H,currentSelection:W,isRequiredField:I,onItemDeselect:Q,onItemSelect:J,translations:X,withSearch:D,searchValue:y,setSearchValue:z}):/* @__PURE__ */u(me,{...N,onItemDeselect:Q,onItemSelect:J,currentSelection:W,isRequiredField:I,filteredData:Y,inputRef:T.current,containerRef:A.current,isOpen:L,closeDropdown:H,setCurrentSelectedLabel:Z,searchValue:y,setSearchValue:z,translations:X,activeIndex:P,setActiveIndex:q})]})});De.displayName="Select";export{De as Select};

package/components/Select/Select/SelectDesktop/index.d.ts

@@ -0,0 +1,3 @@
+import { ReactElement } from 'react';
+import { ISingleSelectDesktopProps } from '../../types';
+export declare const SelectDesktop: (props: ISingleSelectDesktopProps) => ReactElement | null;

package/components/Select/Select/SelectDesktop/index.js

@@ -0,0 +1,2 @@
+import{jsx as e,Fragment as R,jsxs as K}from"react/jsx-runtime";import _ from"classnames";import{useRef as U,useState as X,useEffect as p,useId as Y}from"react";import{FixedSizeList as Z}from"react-window";import{DROPDOWN_AND_INPUT_GAP as $}from"../../../../consts/index.js";import{OptionItem as J}from"../../../../helperComponents/OptionItem/OptionItem.js";import{useGetElemSizes as Q}from"../../../../hooks/useGetElemSizes.js";import{useGetElemPositions as ee}from"../../../../hooks/useGetElemPositions.js";import"../../../../context/types.js";import{useOnOutsideClick as te}from"../../../../hooks/useOnOutsideClick.js";import"../../../../hooks/useScreenSize.js";import{useGetHasBottomSpace as oe,useGetHasTopSpace as ie}from"../../../../hooks/useGetHasBottomSpace.js";import"react-hook-form";import{useChangePositionsOnScroll as ne}from"../../../../hooks/useChangePositionsOnScroll.js";import{Empty as se}from"../../../Empty/Empty.js";import{Text as re}from"../../../Text/Text.js";import"../../../Checkbox/Checkbox.js";import"react-dom";import"motion/react";import"dayjs";import"../../../Collapse/CollapseGroup/CollapseGroup.js";import"../../SharedComponents/ContentTop.js";import{Loading as le}from"../../SharedComponents/Loading.js";import"../../../Input/Input.js";import{DROPDOWN_WIDTH as ce,ITEM_SIZE as d,DROPDOWN_HEIGHT as D}from"../../constants.js";const ke=t=>{const{currentSelection:o,isLoading:s,dataId:n="",innerHelperText:i,isRequiredField:a,labelLeftIconProps:l,labelRightIconComponent:r,optionRightIconComponent:m,tooltipAddons:c,dropdownWidth:u,isOpen:h,closeDropdown:f,inputRef:I,containerRef:S,onItemSelect:j,onItemDeselect:C,searchValue:g,setSearchValue:x,translations:O,filteredData:k,activeIndex:b,setActiveIndex:w,setCurrentSelectedLabel:v}=t,y=U(null),[E,G]=X(null);p(()=>{y.current&&y.current.scrollToItem(b,"smart")},[b]),p(()=>{E&&h&&E&&h&&E.focus()},[E,h]),p(()=>{w(0)},[g]),te(S,()=>{!g&&a&&v(),f()},h,Y());const{bottom:P,left:T,top:N}=ee(I),{width:L}=Q(S),H=e=>({value:t})=>{x(""),e?a||C():j(t)},{hasBottomSpace:z}=oe({element:E,input:I}),A=ie({element:E,input:I});return ne(I,E,z),/* @__PURE__ */e(R,{children:h&&/* @__PURE__ */e("div",{className:"select__options",style:{left:T,width:L,...z||!A?{top:P}:{bottom:window.innerHeight-N+$}},ref:G,children:s?/* @__PURE__ */e(le,{}):/* @__PURE__ */e(R,{children:/* @__PURE__ */K("div",{"data-id":`${n}-options-content`,className:_("select__options__scroll","scrollbar"),children:[i?/* @__PURE__ */e("div",{className:"content-top",children:/* @__PURE__ */e(re,{size:"xsmall",type:"secondary",className:"content-top__label",children:i})}):null,k.length>0&&/* @__PURE__ */e(Z,{ref:y,height:k.length*d>D?D:k.length*d,itemCount:k.length,itemSize:d,width:u||ce,style:{width:u||"100%",overflowX:"hidden",overflowY:"auto",willChange:"auto"},children:({index:t,style:s})=>{const n=k[t],i=n.value===o,a=b===t;/* @__PURE__ */
+return e(J,{tooltipAddons:c,data:n,onClick:H(i),labelLeftIconProps:l,OptionRightIconComponent:m,LabelRightIconComponent:r,disabled:n.disabled,isSelected:i,dataId:n.dataId,style:s,className:_("option",{"option--active":a})},n.value)}}),0===k.length?/* @__PURE__ */e(se,{size:"small",mainMessage:null==O?void 0:O.emptyListMainMessage}):null]})})})})};export{ke as SelectDesktop};

package/components/Select/Select/SelectMobile/MobileTopContent.d.ts

@@ -0,0 +1,9 @@
+import { ReactElement } from 'react';
+type TProps = {
+    searchValue: string;
+    setSearchValue: (value: string) => void;
+    onBack: () => void;
+    withSearch: boolean;
+};
+export declare const MobileTopContent: ({ onBack, setSearchValue, searchValue, withSearch }: TProps) => ReactElement;
+export {};

package/components/Select/Select/SelectMobile/MobileTopContent.js

@@ -0,0 +1,2 @@
+import{jsxs as i,jsx as r}from"react/jsx-runtime";import m from"../../../SVGIcons/IconChevronLeft.js";import{Input as s}from"../../../Input/Input.js";import c from"../../../SVGIcons/IconDismissFilled.js";import p from"../../../SVGIcons/IconSearchFilled.js";const I=({onBack:e,setSearchValue:o,searchValue:n,withSearch:a})=>/* @__PURE__ */i("div",{className:"flexbox mobile_top_content",children:[
+/* @__PURE__ */r(m,{onClick:e,size:"large"}),a&&/* @__PURE__ */r(s,{currentValue:n,handleChange:s=>{o(s.target.value)},className:"ml-8",size:"small",rightIconProps:{Component:n?c:p,size:n?"xsmall":"small",onClick:()=>{o("")}}})]});export{I as MobileTopContent};

package/components/Select/Select/SelectMobile/index.d.ts

@@ -0,0 +1,3 @@
+import { ReactElement } from 'react';
+import { ISingleSelectMobileProps } from '../../types';
+export declare const SelectMobile: (props: ISingleSelectMobileProps) => ReactElement;

package/components/Select/Select/SelectMobile/index.js

@@ -0,0 +1,5 @@
+import{jsxs as m,jsx as e}from"react/jsx-runtime";import{OptionItem as R}from"../../../../helperComponents/OptionItem/OptionItem.js";import{Empty as E}from"../../../Empty/Empty.js";import{Modal as H}from"../../../Modal/Modal.js";import"react";import"classnames";import"../../../../consts/index.js";import"../../../../context/types.js";import"../../../../hooks/useScreenSize.js";import"react-hook-form";import{Text as O}from"../../../Text/Text.js";import{ITEM_SIZE_MOBILE as T}from"../../constants.js";import"../../../Checkbox/Checkbox.js";import"react-dom";import"motion/react";import"dayjs";import"../../../Collapse/CollapseGroup/CollapseGroup.js";import"../../SharedComponents/ContentTop.js";import{Loading as k}from"../../SharedComponents/Loading.js";import"../../../Input/Input.js";import{MobileTopContent as D}from"./MobileTopContent.js";import{FixedSizeList as F}from"react-window";const re=o=>{const{translations:t,currentSelection:n,isOpen:i,closeDropdown:s,isLoading:a,dataId:r,innerHelperText:l,filteredData:p,isRequiredField:d,onItemSelect:c,onItemDeselect:h,tooltipAddons:u,labelLeftIconProps:C,optionRightIconComponent:I,labelRightIconComponent:j,withSearch:g,searchValue:S,setSearchValue:b}=o,f=e=>({value:o})=>{b(""),e?d||h():c(o)},x=window.innerHeight,w=window.innerWidth;/* @__PURE__ */
+return m(H,{isOpen:i,onClose:s,isMobileFullScreen:!0,children:[
+/* @__PURE__ */e(D,{searchValue:S,setSearchValue:b,onBack:()=>{s(),b("")},withSearch:g}),
+/* @__PURE__ */m("div",{className:"mobile_options_content",children:[l?/* @__PURE__ */e(O,{size:"xsmall",type:"secondary",className:"mobile_options_content__label",children:l}):null,a?/* @__PURE__ */e(k,{}):/* @__PURE__ */m("div",{"data-id":`${r}-options-content`,children:[p.length>0&&/* @__PURE__ */e(F,{height:x-30-32-24,itemCount:p.length,itemSize:T,width:w,style:{width:"100%",overflowX:"hidden",overflowY:"auto",willChange:"auto"},children:({index:o,style:t})=>{const i=p[o],s=i.value===n;/* @__PURE__ */
+return e(R,{size:"large",tooltipAddons:u,data:i,onClick:f(s),labelLeftIconProps:C,OptionRightIconComponent:I,LabelRightIconComponent:j,disabled:i.disabled,isSelected:s,dataId:i.dataId,style:t},i.value)}}),0===p.length?/* @__PURE__ */e(E,{size:"small",mainMessage:null==t?void 0:t.emptyListMainMessage}):null]})]})]})};export{re as SelectMobile};

package/components/Select/Select/helpers.d.ts

@@ -0,0 +1 @@
+export declare const filterOptions: (options: TSelectOptions, searchValue: string) => TSelectOptions;

package/components/Select/Select/helpers.js

@@ -0,0 +1 @@
+const l=(e,l)=>l?e.filter(e=>"string"==typeof e.label&&e.label.toLowerCase().includes(l.toLowerCase())):e;export{l as filterOptions};

package/components/Select/SharedComponents/Actions.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { TMenuItem } from '../../Menu/types';
+type TProps = {
+    selectActions: TMenuItem[];
+    innerLabel?: string;
+};
+export declare const Actions: (props: TProps) => React.ReactElement | null;
+export {};

package/components/Select/SharedComponents/Actions.js

@@ -0,0 +1,3 @@
+import{jsxs as i,jsx as t}from"react/jsx-runtime";import{useState as s}from"react";import{Button as u}from"../../Button/Button.js";import{Menu as f}from"../../Menu/Menu.js";import"react-dom";import"../../../consts/index.js";import"../../../context/types.js";import"../../../hooks/useScreenSize.js";import"react-hook-form";import"classnames";import"motion/react";import{Text as b}from"../../Text/Text.js";import"dayjs";import"../../Collapse/CollapseGroup/CollapseGroup.js";import"../../../helperComponents/ErrorMessage/consts.js";import"../../FileUpload/DropzoneFileUpload/DropzoneFileUpload.js";import"../../Checkbox/Checkbox.js";import d from"../../SVGIcons/IconMore.js";const P=o=>{const{selectActions:e,innerLabel:r}=o,[n,a]=s(!1),[l,m]=s(null);return e.length?/* @__PURE__ */i("div",{className:"action-bar",children:[r?/* @__PURE__ */t(b,{size:"xsmall",type:"secondary",className:"action-bar__label",children:r}):null,
+/* @__PURE__ */i("div",{ref:m,className:"action-bar__right",children:[
+/* @__PURE__ */t(u,{type:"tertiary",onClick:()=>a(!0),iconProps:{Component:d},size:"small"}),l?/* @__PURE__ */t(f,{menuItems:e,parentRef:l,onClose:()=>a(!1),position:"bottom-left",isOpen:n}):null]})]}):null};export{P as Actions};

package/components/Select/SharedComponents/ButtonSelectWrapper/Button/Button.d.ts

@@ -0,0 +1,15 @@
+import { LegacyRef, ReactElement } from 'react';
+type TProps = {
+    buttonText: string;
+    size?: 'small' | 'medium' | 'large';
+    className?: string;
+    disabled?: boolean;
+    dataId?: string;
+    onClick: () => void;
+    refHandler?: LegacyRef<HTMLButtonElement> | undefined;
+    selectedItemsLabels: string;
+    isOpen?: boolean;
+    type?: 'primary' | 'secondary' | 'tertiary';
+};
+export declare const Button: (props: TProps) => ReactElement;
+export {};

package/components/Select/SharedComponents/ButtonSelectWrapper/Button/Button.js

@@ -0,0 +1,3 @@
+import{jsx as t,jsxs as p,Fragment as f}from"react/jsx-runtime";import u from"classnames";import{Text as r}from"../../../../Text/Text.js";import x from"../../../../SVGIcons/IconChevronUp.js";import h from"../../../../SVGIcons/IconChevronDown.js";const z=e=>{const{type:s,buttonText:n,size:a="large",className:o="",isOpen:l,disabled:m,dataId:c="",onClick:i,refHandler:d=null,selectedItemsLabels:b}=e;/* @__PURE__ */
+return t("button",{type:"button",ref:d,"data-id":c,disabled:m,className:u("btn",`btn--${s}`,`btn--${a}`,`btn--${a}`,o),onClick:i,children:/* @__PURE__ */p(f,{children:[
+/* @__PURE__ */t(r,{className:"btn__text mr-4",type:b?"tertiary":"secondary",children:`${n}${b?"  |":""}`}),b?/* @__PURE__ */t(r,{className:"btn__text ml-4 mr-4",children:b}):null,/* @__PURE__ */t(l?x:h,{size:"small"})]})})};export{z as Button};

package/components/Select/SharedComponents/ButtonSelectWrapper/ButtonSelectWrapper.d.ts

@@ -0,0 +1,3 @@
+import { ReactElement } from 'react';
+import { TSelectWrapperProps } from '../../types';
+export declare const ButtonSelectWrapper: (props: TSelectWrapperProps) => ReactElement;

package/components/Select/SharedComponents/ButtonSelectWrapper/ButtonSelectWrapper.js

@@ -0,0 +1,3 @@
+import{jsxs as N,jsx as o,Fragment as W}from"react/jsx-runtime";import{useRef as $,useMemo as C}from"react";import H from"classnames";import{Button as M}from"./Button/Button.js";import"../../../../consts/index.js";import"../../../../context/types.js";import"../../../../hooks/useScreenSize.js";import{useGetHasBottomSpace as O}from"../../../../hooks/useGetHasBottomSpace.js";import"react-hook-form";import{noop as j}from"../../../../utils/helpers.js";import{useChangePositionsOnScroll as k}from"../../../../hooks/useChangePositionsOnScroll.js";import{MobileWrapper as T}from"../../MultiSelect/MobileWrapper.js";import{DesktopWrapper as v}from"../../MultiSelect/DesktopWrapper.js";const X=e=>{const{offsets:t,children:s,size:r,className:n,dropdownWidth:l,align:a="left",isOpen:p,setIsOpen:i,containerRef:c,setContainerRef:m,dropdownRef:d,setDropdownRef:u,selectedValues:f,placeHolder:h,dataId:S,disabled:g,modalApplyButtonText:b,type:x="secondary",applySelectedItems:B,isMobile:R}=e,y=$(null),{hasBottomSpace:w}=O({element:d,input:y.current}),I=C(()=>R?f&&f.length>0?f.length.toString():"":f&&0!==(null==f?void 0:f.length)?1===(null==f?void 0:f.length)?`${f[0].label}`:` ${f[0].label} +${f.length-1}`:"",[f]);return k(null==y?void 0:y.current,d,w),/* @__PURE__ */N("div",{className:H(`select select--${r}`,n),ref:m,children:[
+/* @__PURE__ */o(M,{size:r,type:x,dataId:S,isOpen:p,buttonText:h||"",selectedItemsLabels:I,onClick:g?j:()=>i(!0),refHandler:y,className:"select_button"}),
+/* @__PURE__ */o(W,{children:R?/* @__PURE__ */o(T,{applySelectedItems:B,isOpen:p,closeDrodown:()=>i(!1),modalApplyButtonText:b,children:s}):/* @__PURE__ */o(v,{offsets:t,setDropdownRef:u,isOpen:p,align:a,dropdownWidth:l,inputRef:y.current,dropdownRef:d,containerRef:c,children:s})})]})};export{X as ButtonSelectWrapper};

package/components/Select/SharedComponents/ContentTop.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+import { TMenuItem } from '../../Menu/types';
+import { TSelectTranslations } from '../types';
+type TProps = {
+    searchValue?: string;
+    helperText?: string;
+    selectAll?: TCallBackFn;
+    setSearchValue?: (value: string) => void;
+    clearAll?: TCallBackFn;
+    isSelectAllDisabled?: boolean;
+    isAnySelected?: boolean;
+    translations?: TSelectTranslations;
+    isSearchAvailable?: boolean;
+    hasLimitation?: boolean;
+    menuOptions?: TMenuItem[];
+    dataIdPrefix?: string;
+    closeDropdown?: () => void;
+    handleKeyDown?: (e: React.KeyboardEvent) => void;
+};
+export declare const ContentTop: React.NamedExoticComponent<TProps>;
+export {};

package/components/Select/SharedComponents/ContentTop.js

@@ -0,0 +1,3 @@
+import{jsxs as b,jsx as a}from"react/jsx-runtime";import g,{useRef as k,useMemo as z,useEffect as T}from"react";import{Text as _}from"../../Text/Text.js";import{Input as w}from"../../Input/Input.js";import{Actions as F}from"./Actions.js";import I from"../../SVGIcons/IconDismissFilled.js";import M from"../../SVGIcons/IconSearchFilled.js";import R from"../../SVGIcons/IconSelectAllOff.js";import{useIsMobile as V}from"../../../hooks/useGetIsMobile.js";import j from"../../SVGIcons/IconChevronLeft.js";import{noop as B}from"../../../utils/helpers.js";const K=g.memo(e=>{const{clearAll:l,selectAll:s,helperText:o,searchValue:t,translations:n,isAnySelected:r,setSearchValue:c,isSearchAvailable:i=!1,hasLimitation:m=!1,isSelectAllDisabled:p=!1,menuOptions:d=[],dataIdPrefix:u,closeDropdown:h,handleKeyDown:f}=e,x=k(null),{searchInputPlaceHolder:A,innerLabel:S,clearAllLabel:C,selectAllLabel:v}=n||{},g=z(()=>{let e=d;return s&&v&&!m&&(e=[{label:v,value:1,handler:s,disabled:p,iconProps:{Component:R},dataId:u?`${u}-select-all`:""}]),l&&C&&(e=[...e,{label:C,value:2,handler:l,disabled:!r,iconProps:{Component:I},dataId:u?`${u}-clear-all`:""}]),e},[d,v,s,l,C,p,r,u]),y=V();return T(()=>{x&&x.current&&!y&&x.current.focus()},[x,y]),/* @__PURE__ */b("div",{className:"content-top",children:[o&&!y?/* @__PURE__ */a(_,{size:"xsmall",type:"secondary",className:"content-top__label",children:o}):null,
+/* @__PURE__ */b("div",{className:"flexbox search-container",children:[y&&/* @__PURE__ */a(j,{onClick:()=>{h&&h()},size:"large"}),i&&/* @__PURE__ */a(w,{onKeyDown:f||B,ref:x,className:"content-top__search",size:"small",placeholder:A,handleChange:e=>{c&&c(e.target.value)},currentValue:t,rightIconProps:{Component:t?I:M,size:t?"xsmall":"small",onClick:()=>c&&c("")}})]}),
+/* @__PURE__ */a(F,{selectActions:g,innerLabel:S})]})});K.displayName="ContentTop";export{K as ContentTop};

package/components/Select/SharedComponents/Footer.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { TSelectFooterPropTypes } from '../types';
+export declare const Footer: (props: TSelectFooterPropTypes) => React.ReactElement;

package/components/Select/SharedComponents/Footer.js

@@ -0,0 +1,6 @@
+import{jsxs as r,jsx as l}from"react/jsx-runtime";import C from"react";import{Button as c}from"../../Button/Button.js";import{Checkbox as x}from"../../Checkbox/Checkbox.js";import{SELECT_TRANSLATIONS as s}from"../localization.js";const B=e=>{const{language:o,buttonProps:t,onApply:n,onCancel:i,hasChange:a=!0,checkboxInfo:m}=e,[u,d]=C.useState((null==m?void 0:m.isChecked)||!1),h={buttonText:s[o].confirmButtonText,...(null==t?void 0:t.confirm)||{}},p={buttonText:s[o].cancelButtonText,...(null==t?void 0:t.cancel)||{}};/* @__PURE__ */
+return r("div",{className:"select__footer",children:[
+/* @__PURE__ */l("div",{children:m?/* @__PURE__ */l(x,{label:m.label,selectedValue:u,onClick:d}):null}),
+/* @__PURE__ */r("div",{className:"select__footer__right flexbox",children:[
+/* @__PURE__ */l(c,{...p,type:"tertiary",size:"medium",className:"mr-12",onClick:i}),
+/* @__PURE__ */l(c,{disabled:!a&&u===!(null==m||!m.isChecked),...h,type:"primary",size:"medium",onClick:()=>n(u)})]})]})};export{B as Footer};

package/components/Select/SharedComponents/InputSelectWrapper/InputSelectWrapper.d.ts

@@ -0,0 +1,3 @@
+import { ReactElement } from 'react';
+import { TSelectWrapperProps } from '../../types';
+export declare const InputSelectWrapper: (props: TSelectWrapperProps) => ReactElement | null;

package/components/Select/SharedComponents/InputSelectWrapper/InputSelectWrapper.js

@@ -0,0 +1,3 @@
+import{jsxs as A,jsx as l,Fragment as B}from"react/jsx-runtime";import{useRef as M,useCallback as T,useMemo as q}from"react";import F from"classnames";import{Input as G}from"../../../Input/Input.js";import{useGetElemSizes as H}from"../../../../hooks/useGetElemSizes.js";import"../../../../consts/index.js";import"../../../../context/types.js";import"../../../../hooks/useScreenSize.js";import{useGetHasBottomSpace as P}from"../../../../hooks/useGetHasBottomSpace.js";import"react-hook-form";import{getStringWidth as _,setTranslationValue as E,noop as U}from"../../../../utils/helpers.js";import{useChangePositionsOnScroll as J}from"../../../../hooks/useChangePositionsOnScroll.js";import{MobileWrapper as K}from"../../MultiSelect/MobileWrapper.js";import{DesktopWrapper as Q}from"../../MultiSelect/DesktopWrapper.js";import X from"../../../SVGIcons/IconChevronUp.js";import Y from"../../../SVGIcons/IconChevronDown.js";const fe=e=>{const{isMobile:o,children:s,options:t,label:r,placeHolder:n,isRequiredField:i,labelAddons:a,disabled:p,className:c="",dropdownWidth:m,align:d="left",size:u,dropdownRef:f,setDropdownRef:h,containerRef:S,setIsOpen:j,isOpen:g,selectedValues:b,setContainerRef:I,overflowText:x,hasError:v,modalApplyButtonText:w,applySelectedItems:R,hideSelectedOptions:k=!1}=e,O=M(null),{width:C}=H(S),W=T(e=>_(e,14)>C-80,[C]),D=q(()=>{if(!b||!b.length)return"";const e=b.map(e=>e.label).join(", ");return W(e)?E(x||"",b.length):e},[t,b,W]),{hasBottomSpace:y}=P({element:f,input:O.current});return J(null==O?void 0:O.current,f,y),/* @__PURE__ */A("div",{className:F("select select--multi",c),ref:I,children:[
+/* @__PURE__ */l("div",{onClick:p?U:e=>{const o=null==e?void 0:e.target,s=null==o?void 0:o.getAttribute("class");e&&s&&(-1!==s.indexOf("icon-")||-1!==s.indexOf("svg-icon"))?(j(!g),e.preventDefault()):j(!0)},children:/* @__PURE__ */l(G,{readonly:!0,label:r,ref:O,hasError:v,className:"select__input",placeholder:n,required:i,currentValue:k?"":D,rightIconProps:{Component:g?X:Y,size:"small"},labelAddons:a,disabled:p,size:"large"===u?"large":"small"})}),
+/* @__PURE__ */l(B,{children:o?/* @__PURE__ */l(K,{applySelectedItems:R,isOpen:g,closeDrodown:()=>j(!1),modalApplyButtonText:w,children:s}):/* @__PURE__ */l(Q,{setDropdownRef:h,isOpen:g,align:d,dropdownWidth:m,inputRef:O.current,dropdownRef:f,containerRef:S,children:s})})]})};export{fe as InputSelectWrapper};

package/components/Select/SharedComponents/Loading.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+type TLoadingProps = {
+    loadingText?: string;
+};
+export declare const Loading: (props: TLoadingProps) => React.ReactElement;
+export {};

package/components/Select/SharedComponents/Loading.js

@@ -0,0 +1,2 @@
+import{jsx as o}from"react/jsx-runtime";import{Text as n}from"../../Text/Text.js";const e=e=>{const{loadingText:t="Results loading ..."}=e;/* @__PURE__ */
+return o("div",{style:{padding:20},children:/* @__PURE__ */o(n,{children:t})})};export{e as Loading};

package/components/Select/SharedComponents/index.d.ts

@@ -0,0 +1,6 @@
+export * from './Footer';
+export * from './Actions';
+export * from './ContentTop';
+export * from './Loading';
+export * from './InputSelectWrapper/InputSelectWrapper';
+export * from './ButtonSelectWrapper/ButtonSelectWrapper';

package/components/Select/SharedComponents/index.js

@@ -0,0 +1 @@
+import{Footer as t}from"./Footer.js";import{Actions as p}from"./Actions.js";import{ContentTop as m}from"./ContentTop.js";import{Loading as x}from"./Loading.js";import{InputSelectWrapper as c}from"./InputSelectWrapper/InputSelectWrapper.js";import{ButtonSelectWrapper as l}from"./ButtonSelectWrapper/ButtonSelectWrapper.js";export{p as Actions,l as ButtonSelectWrapper,m as ContentTop,t as Footer,c as InputSelectWrapper,x as Loading};

package/components/Select/constants.d.ts

@@ -0,0 +1,7 @@
+export declare const SELECTED_VISIBLE_MIN_COUNT = 7;
+export declare const DROPDOWN_MAX_HEIGHT = 260;
+export declare const DROPDOWN_MAX_HEIGHT_PART = 106;
+export declare const ITEM_SIZE = 32;
+export declare const ITEM_SIZE_MOBILE = 56;
+export declare const DROPDOWN_HEIGHT = 300;
+export declare const DROPDOWN_WIDTH = 400;

package/components/Select/constants.js

@@ -0,0 +1 @@
+const _=7,E=260,I=106,D=32,O=56,T=300,o=400;export{T as DROPDOWN_HEIGHT,E as DROPDOWN_MAX_HEIGHT,I as DROPDOWN_MAX_HEIGHT_PART,o as DROPDOWN_WIDTH,D as ITEM_SIZE,O as ITEM_SIZE_MOBILE,_ as SELECTED_VISIBLE_MIN_COUNT};

package/components/Select/index.d.ts

@@ -0,0 +1,5 @@
+export * from './Select/Select';
+export * from './MultiSelect/MultiSelect';
+export * from './NestedSelect/NestedSelect';
+export * from './ButtonSelect/ButtonSelect';
+export * from './ProfileDropdown';

package/components/Select/index.js

@@ -0,0 +1 @@
+import{Select as t}from"./Select/Select.js";import{MultiSelect as f}from"./MultiSelect/MultiSelect.js";import{NestedSelect as p}from"./NestedSelect/NestedSelect.js";import{ButtonSelect as x}from"./ButtonSelect/ButtonSelect.js";import{ProfileDropdown as S}from"./ProfileDropdown/index.js";export{x as ButtonSelect,f as MultiSelect,p as NestedSelect,S as ProfileDropdown,t as Select};

package/components/Select/localization.d.ts

@@ -0,0 +1,4 @@
+import { TSelectTranslations } from './types';
+export declare const SELECT_TRANSLATIONS: {
+    [key: string]: TSelectTranslations;
+};

package/components/Select/localization.js

@@ -0,0 +1 @@
+const e={en:{emptyListMainMessage:"Sorry, we couldn't find any results",clearAllLabel:"Clear all",selectAllLabel:"Select all",overflowText:"%s selected",innerLabel:" ",confirmButtonText:"Apply",cancelButtonText:"Cancel"},ru:{emptyListMainMessage:"К сожалению, результаты не найдены",clearAllLabel:"Очистить все",selectAllLabel:"Выбрать все",overflowText:"%s Выбрано",innerLabel:" ",confirmButtonText:"Применить",cancelButtonText:"Отменить"},hy:{emptyListMainMessage:"Որևէ արդյունք չի գտնվել",clearAllLabel:"Մաքրել բոլորը",selectAllLabel:"Ընտրել բոլորը",overflowText:"%s Ընտրված",innerLabel:" ",confirmButtonText:"Կիրառել",cancelButtonText:"Չեղարկել"}};export{e as SELECT_TRANSLATIONS};

package/components/Select/types.d.ts

@@ -0,0 +1,279 @@
+import { LegacyRef, ReactElement, ReactNode } from 'react';
+import { TButtonPropTypes } from '../Button/types';
+import { TMenuItem } from '../Menu/types';
+import { TTooltipProps } from '../Tooltip/types';
+interface TSelectBaseProps {
+    dataIdPrefix?: string;
+    error?: string;
+    isLoading?: boolean;
+    disabled?: boolean;
+    label?: string | React.ReactElement;
+    placeHolder?: string;
+    isRequiredField?: boolean;
+    labelLeftIconProps?: {
+        size?: TIconSize;
+        className?: string;
+        onClick?: TClickHandler;
+        Component?: TSVGIconComponent;
+    };
+    optionRightIconComponent?: (value: TItemValue) => ReactElement;
+    labelRightIconComponent?: (value: TItemValue) => ReactElement;
+    selectRightIconProps?: TSelectIconProps;
+    selectRightIconOpenedProps?: TSelectIconProps;
+    size?: 'small' | 'large' | 'medium';
+    className?: string;
+    dropdownWidth?: number;
+    language?: string;
+}
+export interface TNestedSelectProps {
+    options: TSelectOptions;
+    isRequiredField?: boolean;
+    label?: string | ReactElement;
+    placeHolder?: string;
+    initialSelectedFolderIds?: TItemValue[];
+    setSelectedValue: (value: TSelectOption | null) => void;
+    selected?: TSelectOption | null;
+    optionRightIconComponent?: (value: TItemValue) => ReactElement;
+    labelRightIconComponent?: (value: TItemValue) => ReactElement;
+    labelAddons?: ReactElement;
+}
+export type TSelectTranslations = {
+    emptyListMainMessage?: string;
+    overflowText?: string;
+    searchInputPlaceHolder?: string;
+    emptyListSecondaryMessage?: string;
+    selectAllLabel?: string;
+    clearAllLabel?: string;
+    innerLabel?: string;
+    confirmButtonText?: string;
+    cancelButtonText?: string;
+};
+interface TMultiSelectCompProps extends IFormCompProps, TSelectBaseProps {
+    isMobile: boolean;
+    maxSelectCount: number;
+    isSearchAvailable: boolean;
+    helperText?: string;
+    scrollableContentStyle: {
+        maxHeight?: number;
+    };
+    translations: TSelectTranslations;
+    selectedValues: TSelectedValue[];
+    setSelectedValues: (values: TSelectedValue[]) => void;
+    onItemSelect: (item: TSelectedValue) => void;
+    onItemDeselect: (item: TSelectedValue) => void;
+    menuOptions?: TMenuItem[];
+    closeDropdown: () => void;
+}
+export interface TMultiSingleTabPropTypes extends TMultiSelectCompProps {
+    options: TSelectOptions;
+    applySelectedItems: () => void;
+}
+export interface TMultiSelectGroupedProps extends TMultiSelectCompProps {
+    options: TSelectGroupOptions;
+}
+export type TCheckboxInfo = {
+    label: string;
+    isChecked: boolean;
+};
+export interface TMultiSelectPropTypes extends IFormCompProps, TSelectBaseProps {
+    isMobileFullScreen?: boolean;
+    dropdownWidth?: number;
+    align?: 'left' | 'right';
+    helperText?: string;
+    maxSelectCount?: number;
+    isSearchAvailable?: boolean;
+    withTabs?: boolean;
+    isGrouped?: boolean;
+    checkboxInfo?: TCheckboxInfo;
+    selectedItems?: TSelectedValue[];
+    translations?: TSelectTranslations;
+    options: TSelectOptions | TSelectGroupOptions;
+    setSelectedItems?: (items: TSelectedValue[], isChecked: boolean) => void;
+    footerButtonProps?: {
+        cancel: TButtonPropTypes;
+        confirm: TButtonPropTypes;
+    };
+    labelAddons?: React.ReactElement;
+    className?: string;
+    isButtonSelect?: boolean;
+    hideSelectedOptions?: boolean;
+}
+export interface TButtonSelectPropTypes extends IFormCompProps, TSelectBaseProps {
+    isMobileFullScreen?: boolean;
+    dataId?: string;
+    options: TSelectOptions;
+    selectedItem?: TItemValue;
+    setSelectedItem?: (items: TItemValue | undefined) => void;
+    tooltipAddons?: TTooltipProps;
+    dropdownWidth?: number;
+    align?: 'left' | 'right';
+    offsets?: {
+        top?: number;
+        left?: number;
+        right?: number;
+    };
+    type: 'secondary' | 'tertiary';
+}
+export interface TSingleSelectPropTypes extends IFormCompProps, TSelectBaseProps {
+    isButtonSelect?: boolean;
+    isMobileFullScreen?: boolean;
+    options: TSelectOptions;
+    selectedItem?: TItemValue;
+    setSelectedItem?: (items: TItemValue | undefined) => void;
+    withSearch?: boolean;
+    outerHelperText?: string;
+    innerHelperText?: string;
+    labelAddons?: React.ReactElement;
+    tooltipAddons?: TTooltipProps;
+    translations?: {
+        emptyListMainMessage: string;
+    };
+}
+export interface ISingleSelectResponsiveProps {
+    isOpen: boolean;
+    closeDropdown: () => void;
+    isLoading?: boolean;
+    dataId?: string;
+    innerHelperText?: string;
+    labelLeftIconProps?: {
+        size?: TIconSize;
+        className?: string;
+        onClick?: TClickHandler;
+    };
+    filteredData: TSelectOptions;
+    labelRightIconComponent?: (value: TItemValue) => ReactElement;
+    optionRightIconComponent?: (value: TItemValue) => ReactElement;
+    tooltipAddons?: TTooltipProps;
+    onItemSelect: (item: TItemValue) => void;
+    onItemDeselect: () => void;
+    currentSelection: TItemValue | undefined;
+    isRequiredField?: boolean;
+    translations?: TSelectTranslations;
+    language?: string;
+    searchValue: string;
+    setSearchValue: (value: string) => void;
+}
+export interface ISingleSelectMobileProps extends ISingleSelectResponsiveProps {
+    withSearch: boolean;
+}
+export interface ISingleSelectDesktopProps extends ISingleSelectResponsiveProps {
+    withSearch?: boolean;
+    dropdownWidth?: number;
+    inputRef: HTMLInputElement | null;
+    containerRef: HTMLDivElement | null;
+    setCurrentSelectedLabel: () => void;
+    activeIndex: number;
+    setActiveIndex: (index: number) => void;
+}
+export type TSelectFooterPropTypes = {
+    checkboxInfo?: TCheckboxInfo;
+    hasChange?: boolean;
+    buttonProps?: {
+        cancel: TButtonPropTypes;
+        confirm: TButtonPropTypes;
+    };
+    onCancel: () => void;
+    onApply: (isChecked: boolean) => void;
+    language: string;
+};
+export interface TFilterProps extends IFormCompProps, TSelectBaseProps {
+    isLoading?: boolean;
+    withTabs: boolean;
+    isGrouped: boolean;
+    isOpen: boolean;
+    options: TSelectOptions | TSelectGroupOptions;
+    selectedItems: TSelectedValue[];
+    setSelectedItems: (items: TSelectedValue[]) => void;
+    footerButtonProps?: {
+        cancel: TButtonPropTypes;
+        confirm: TButtonPropTypes;
+    };
+    closeHandler: () => void;
+    parentRef: HTMLElement;
+}
+export interface TFilterDropdownContentProps extends IFormCompProps {
+    options: TSelectOptions;
+    labelLeftIconProps?: {
+        size?: TIconSize;
+        className?: string;
+        onClick?: TClickHandler;
+    };
+    footerButtonProps?: {
+        cancel: TButtonPropTypes;
+        confirm: TButtonPropTypes;
+    };
+    optionRightIconComponent?: (value: TItemValue) => ReactElement;
+    labelRightIconComponent?: (value: TItemValue) => ReactElement;
+    filterValue: string;
+    onItemSelect: (item: TSelectedValue) => void;
+    onItemDeselect: (item: TSelectedValue) => void;
+    checkIsSelected: (item: TItemValue) => boolean;
+}
+export interface TFilterGroupDropdownContentProps extends IFormCompProps {
+    options: TSelectGroupOptions;
+    labelLeftIconProps?: {
+        size?: TIconSize;
+        className?: string;
+        onClick?: TClickHandler;
+    };
+    footerButtonProps?: {
+        cancel: TButtonPropTypes;
+        confirm: TButtonPropTypes;
+    };
+    optionRightIconComponent?: (value: TItemValue) => ReactElement;
+    labelRightIconComponent?: (value: TItemValue) => ReactElement;
+    filterValue: string;
+    onItemSelect: (item: TSelectedValue) => void;
+    onItemDeselect: (item: TSelectedValue) => void;
+    checkIsSelected: (item: TItemValue) => boolean;
+}
+export type TSelectWrapperProps = {
+    isMobile: boolean;
+    applySelectedItems: (isChecked: boolean) => void;
+    hasError?: boolean;
+    children: ReactElement;
+    size?: 'small' | 'large' | 'medium';
+    className?: string;
+    dropdownWidth?: number;
+    align?: 'left' | 'right';
+    offsets?: {
+        top?: number;
+        left?: number;
+        right?: number;
+    };
+    isOpen: boolean;
+    setIsOpen: (isOpen: boolean) => void;
+    containerRef: HTMLDivElement | null;
+    setContainerRef: (value: HTMLDivElement | null) => void;
+    options?: TSelectOptions;
+    label?: string | React.ReactElement;
+    placeHolder?: string;
+    isRequiredField?: boolean;
+    overflowText?: string;
+    labelAddons?: React.ReactElement;
+    disabled?: boolean;
+    dropdownRef: HTMLDivElement | null;
+    setDropdownRef: LegacyRef<HTMLDivElement>;
+    selectedValues?: TSelectedValue[];
+    dataId?: string;
+    type?: 'primary' | 'secondary' | 'tertiary';
+    modalApplyButtonText?: string;
+    hideSelectedOptions?: boolean;
+};
+declare type TNavItemValue = {
+    icon?: TSVGIconComponent;
+    text: string;
+    url?: string;
+    onclick?: () => void;
+    rightInfoProps?: ReactElement;
+    children: ReactNode;
+};
+export type TProfileDropdownProps = {
+    avatar: ReactElement;
+    email: string;
+    name: string;
+    bodyItems: TNavItemValue[];
+    footerItems: TNavItemValue[];
+    className?: string;
+};
+export {};