@activecollab/components 1.0.147 → 1.0.150

package/dist/esm/components/Autocomplete/Autocomplete.js

@@ -6,6 +6,9 @@ import { handleKeyboardMovement } from "./HandleKeyboard";
 import { Option } from "../Select/Option";
 import { OptionGroup } from "../Select/OptionGroup";
 import { StyledAutocompleteBody, StyledAutocompleteNewItem, StyledAutocompleteNoResult, StyledAutocompleteScrollShadow } from "./Styles";
+export function isOptionGroup(item) {
+  return item.options !== undefined;
+}
 export var Autocomplete = function Autocomplete(_ref) {
   var type = _ref.type,
       _ref$options = _ref.options,
@@ -100,14 +103,9 @@ export var Autocomplete = function Autocomplete(_ref) {
       by: "mouse"
     });
   }, []);
-
-  function isGroup(item) {
-    return item.options !== undefined;
-  }
-
   var showAddNew = useMemo(function () {
     return !!(emptyValue && filter.trim() && options.every(function (option) {
-      if (isGroup(option)) {
+      if (isOptionGroup(option)) {
         return option.options.every(function (v) {
           return v.name.toLowerCase() !== filter.trim().toLowerCase();
         });
@@ -127,7 +125,7 @@ export var Autocomplete = function Autocomplete(_ref) {
   }, [emptyValue, handleEmpty, hover, onAddNewMouseEnter]);
   var filterOptions = useCallback(function (options, filter) {
     var trimmedFilter = filter.trim();
-    var isGrouped = options[0] && isGroup(options[0]);
+    var isGrouped = options[0] && isOptionGroup(options[0]);
 
     if (isGrouped) {
       var hovered = false;
@@ -182,7 +180,7 @@ export var Autocomplete = function Autocomplete(_ref) {
   }, [defaultValue, filter]);
   var flatOptions = useMemo(function () {
     var options = list.reduce(function (acc, option) {
-      if (!isGroup(option)) {
+      if (!isOptionGroup(option)) {
         return [].concat(acc, [option]);
       }
 
@@ -251,7 +249,7 @@ export var Autocomplete = function Autocomplete(_ref) {
     toggleSelected(hover.item);
   }, [toggleSelected, hover]);
   var handleRenderOption = useCallback(function (item, index) {
-    if (isGroup(item)) {
+    if (isOptionGroup(item)) {
       return /*#__PURE__*/React.createElement(OptionGroup, {
         checked: selectedOptions,
         name: item.name,

package/dist/esm/components/Autocomplete/Autocomplete.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Autocomplete/Autocomplete.tsx"],"names":["React","useCallback","useState","useMemo","useEffect","useRef","Scrollbars","highlightText","handleKeyboardMovement","Option","OptionGroup","StyledAutocompleteBody","StyledAutocompleteNewItem","StyledAutocompleteNoResult","StyledAutocompleteScrollShadow","Autocomplete","type","options","inputEl","selected","emptyValue","noResultText","renderOption","option","name","defaultValue","sortDirection","handleChange","optionClassName","handleEmptyAction","disabledInternalSort","AutocompleteClassName","handleDefaultOptionChange","preselectDefaultValue","keepSameOptionsOrder","autoHeightMax","itemRef","listRef","selectedOptions","Array","isArray","handleSort","opts","sort","a","b","includes","id","sortList","localeCompare","sortedList","item","undefined","by","hover","setHover","filter","setFilter","handleEmpty","e","button","focus","onAddNewMouseEnter","isGroup","showAddNew","trim","every","v","toLowerCase","renderAddNew","filterOptions","trimmedFilter","isGrouped","hovered","reduce","acc","groupedOption","filteredOptions","length","list","showDefaultOption","flatOptions","handleInputChange","target","key","value","handleHoverCallback","toggleSelected","result","_id","handleMouseEnter","handleClick","preventDefault","handleRenderOption","index","checked","onChange","handleOnMouseLeave","handleScroll","itemOffset","getClientHeight","getScrollTop","scrollTop","current","offsetTop","handleOnKeyDown","onkeydown","onkeyup","isDefaultOptionSelected","showNoResult","renderNoResult","onScroll","map","displayName"],"mappings":";AAAA,OAAOA,KAAP,IAEEC,WAFF,EAGEC,QAHF,EAIEC,OAJF,EAKEC,SALF,EAMEC,MANF,QASO,OATP;AAUA,SAASC,UAAT,QAA2B,yBAA3B;AACA,OAAOC,aAAP,MAA0B,8BAA1B;AACA,SAASC,sBAAT,QAAuC,kBAAvC;AACA,SAA2BC,MAA3B,QAAyC,kBAAzC;AACA,SAA4BC,WAA5B,QAA+C,uBAA/C;AACA,SACEC,sBADF,EAEEC,yBAFF,EAGEC,0BAHF,EAIEC,8BAJF,QAKO,UALP;AAwDA,OAAO,IAAMC,YAAoC,GAAG,SAAvCA,YAAuC,OAmB9C;AAAA,MAlBJC,IAkBI,QAlBJA,IAkBI;AAAA,0BAjBJC,OAiBI;AAAA,MAjBJA,OAiBI,6BAjBM,EAiBN;AAAA,MAhBJC,OAgBI,QAhBJA,OAgBI;AAAA,2BAfJC,QAeI;AAAA,MAfJA,QAeI,8BAfO,EAeP;AAAA,MAdJC,UAcI,QAdJA,UAcI;AAAA,MAbJC,YAaI,QAbJA,YAaI;AAAA,+BAZJC,YAYI;AAAA,MAZJA,YAYI,kCAZW,UAACC,MAAD;AAAA,WAAYA,MAAZ,oBAAYA,MAAM,CAAEC,IAApB;AAAA,GAYX;AAAA,MAXJC,YAWI,QAXJA,YAWI;AAAA,gCAVJC,aAUI;AAAA,MAVJA,aAUI,mCAVY,KAUZ;AAAA,MATJC,YASI,QATJA,YASI;AAAA,MARJC,eAQI,QARJA,eAQI;AAAA,MAPJC,iBAOI,QAPJA,iBAOI;AAAA,MANJC,oBAMI,QANJA,oBAMI;AAAA,MALJC,qBAKI,QALJA,qBAKI;AAAA,MAJJC,yBAII,QAJJA,yBAII;AAAA,MAHJC,qBAGI,QAHJA,qBAGI;AAAA,mCAFJC,oBAEI;AAAA,MAFJA,oBAEI,sCAFmB,KAEnB;AAAA,gCADJC,aACI;AAAA,MADJA,aACI,mCADY,GACZ;AACJ,MAAMC,OAAO,GAAG/B,MAAM,CAAgB,IAAhB,CAAtB;AACA,MAAMgC,OAAO,GAAGhC,MAAM,CAAa,IAAb,CAAtB;AAEA,MAAMiC,eAAe,GAAGnC,OAAO,CAAC,YAAM;AACpC,QAAIoC,KAAK,CAACC,OAAN,CAAcrB,QAAd,CAAJ,EAA6B;AAC3B,aAAOA,QAAP;AACD;;AACD,WAAO,CAACA,QAAD,CAAP;AACD,GAL8B,EAK5B,CAACA,QAAD,CAL4B,CAA/B;AAOA,MAAMsB,UAAU,GAAGxC,WAAW,CAAC,UAACyC,IAAD,EAAU;AACvC,QAAIR,oBAAJ,EAA0B;AACxB,aAAOQ,IAAP;AACD;;AACD,WAAOA,IAAI,CAACC,IAAL,CAAU,UAACC,CAAD,EAAsBC,CAAtB,EAA8C;AAC7D,UAAIP,eAAe,CAACQ,QAAhB,CAAyBD,CAAC,CAACE,EAA3B,KAAkC,CAACT,eAAe,CAACQ,QAAhB,CAAyBF,CAAC,CAACG,EAA3B,CAAvC,EAAuE;AACrE,eAAO,CAAP;AACD;;AACD,UAAIT,eAAe,CAACQ,QAAhB,CAAyBF,CAAC,CAACG,EAA3B,KAAkC,CAACT,eAAe,CAACQ,QAAhB,CAAyBD,CAAC,CAACE,EAA3B,CAAvC,EAAuE;AACrE,eAAO,CAAC,CAAR;AACD;;AACD,aAAO,CAAP;AACD,KARM,CAAP,CAJuC,CAavC;AACD,GAd6B,EAc3B,EAd2B,CAA9B;AAgBA,MAAMC,QAAQ,GAAG/C,WAAW,CAC1B,UAACgB,OAAD,EAAa;AACX,QAAIa,oBAAJ,EAA0B;AACxB,aAAOW,UAAU,WAAKxB,OAAL,EAAjB;AACD;;AACD,WAAOwB,UAAU,CACf,UAAIxB,OAAJ,EAAa0B,IAAb,CAAkB,UAACC,CAAD,EAAsBC,CAAtB;AAAA,aAChBnB,aAAa,KAAK,KAAlB,GACIkB,CAAC,CAACpB,IAAF,CAAOyB,aAAP,CAAqBJ,CAAC,CAACrB,IAAvB,CADJ,GAEIqB,CAAC,CAACrB,IAAF,CAAOyB,aAAP,CAAqBL,CAAC,CAACpB,IAAvB,CAHY;AAAA,KAAlB,CADe,CAAjB;AAOD,GAZyB,EAa1B,CAACE,aAAD,EAAgBI,oBAAhB,EAAsCW,UAAtC,CAb0B,CAA5B;AAgBA,MAAMS,UAAU,GAAG/C,OAAO,CAAC;AAAA,WAAM6C,QAAQ,CAAC/B,OAAD,CAAd;AAAA,GAAD,EAA0B,CAACA,OAAD,EAAU+B,QAAV,CAA1B,CAA1B;;AAEA,kBAA0B9C,QAAQ,CAAS;AACzCiD,IAAAA,IAAI,EAAEC,SADmC;AAEzCC,IAAAA,EAAE,EAAED;AAFqC,GAAT,CAAlC;AAAA,MAAOE,KAAP;AAAA,MAAcC,QAAd;;AAIA,mBAA4BrD,QAAQ,CAAC,EAAD,CAApC;AAAA,MAAOsD,MAAP;AAAA,MAAeC,SAAf;;AAEA,MAAMC,WAAW,GAAGzD,WAAW,CAC7B,UAAC0D,CAAD,EAAO;AACL,QAAIA,CAAC,IAAIA,CAAC,CAACC,MAAF,KAAa,CAAtB,EAAyB;AACvB;AACD;;AACD,QAAI/B,iBAAJ,EAAuB;AACrBX,MAAAA,OAAO,QAAP,YAAAA,OAAO,CAAE2C,KAAT;AACAJ,MAAAA,SAAS,CAAC,EAAD,CAAT;AACA5B,MAAAA,iBAAiB,CAAC2B,MAAD,CAAjB;AACD;AACF,GAV4B,EAW7B,CAACA,MAAD,EAAS3B,iBAAT,EAA4BX,OAA5B,CAX6B,CAA/B;AAcA,MAAM4C,kBAAkB,GAAG7D,WAAW,CACpC;AAAA,WAAMsD,QAAQ,CAAC;AAAEJ,MAAAA,IAAI,EAAE,QAAR;AAAkBE,MAAAA,EAAE,EAAE;AAAtB,KAAD,CAAd;AAAA,GADoC,EAEpC,EAFoC,CAAtC;;AAKA,WAASU,OAAT,CACEZ,IADF,EAE6B;AAC3B,WAAQA,IAAD,CAA4BlC,OAA5B,KAAwCmC,SAA/C;AACD;;AAED,MAAMY,UAAU,GAAG7D,OAAO,CAAC,YAAM;AAC/B,WAAO,CAAC,EACNiB,UAAU,IACVoC,MAAM,CAACS,IAAP,EADA,IAEAhD,OAAO,CAACiD,KAAR,CAAc,UAAC3C,MAAD,EAAY;AACxB,UAAIwC,OAAO,CAACxC,MAAD,CAAX,EAAqB;AACnB,eAAOA,MAAM,CAACN,OAAP,CAAeiD,KAAf,CACL,UAACC,CAAD;AAAA,iBAAOA,CAAC,CAAC3C,IAAF,CAAO4C,WAAP,OAAyBZ,MAAM,CAACS,IAAP,GAAcG,WAAd,EAAhC;AAAA,SADK,CAAP;AAGD;;AACD,aAAO7C,MAAM,CAACC,IAAP,CAAY4C,WAAZ,OAA8BZ,MAAM,CAACS,IAAP,GAAcG,WAAd,EAArC;AACD,KAPD,CAHM,CAAR;AAYD,GAbyB,EAavB,CAAChD,UAAD,EAAaoC,MAAb,EAAqBvC,OAArB,CAbuB,CAA1B;AAeA,MAAMoD,YAAY,GAAGlE,OAAO,CAAC,YAAM;AACjC,wBACE,oBAAC,yBAAD;AACE,MAAA,GAAG,EAAEmD,KAAK,CAACH,IAAN,KAAe,QAAf,GAA0Bf,OAA1B,GAAoC,IAD3C;AAEE,MAAA,GAAG,EAAC,YAFN;AAGE,MAAA,KAAK,EAAEkB,KAAK,CAACH,IAAN,KAAe,QAHxB;AAIE,MAAA,WAAW,EAAEO,WAJf;AAKE,MAAA,YAAY,EAAEI;AALhB,OAOG1C,UAPH,CADF;AAWD,GAZ2B,EAYzB,CAACA,UAAD,EAAasC,WAAb,EAA0BJ,KAA1B,EAAiCQ,kBAAjC,CAZyB,CAA5B;AAcA,MAAMQ,aAAa,GAAGrE,WAAW,CAC/B,UAACgB,OAAD,EAAUuC,MAAV,EAAqB;AACnB,QAAMe,aAAa,GAAGf,MAAM,CAACS,IAAP,EAAtB;AACA,QAAMO,SAAS,GAAGvD,OAAO,CAAC,CAAD,CAAP,IAAc8C,OAAO,CAAC9C,OAAO,CAAC,CAAD,CAAR,CAAvC;;AACA,QAAIuD,SAAJ,EAAe;AACb,UAAIC,OAAO,GAAG,KAAd;AACA,aAAOxD,OAAO,CAACyD,MAAR,CAAe,UAACC,GAAD,EAAMC,aAAN,EAAwB;AAC5C,YAAMC,eAAe,GAAGD,aAAa,CAAC3D,OAAd,CAAsBuC,MAAtB,CAA6B,UAACW,CAAD;AAAA,iBACnDA,CAAC,CAAC3C,IAAF,CAAO4C,WAAP,GAAqBtB,QAArB,CAA8ByB,aAAa,CAACH,WAAd,EAA9B,CADmD;AAAA,SAA7B,CAAxB;;AAGA,YAAIS,eAAe,CAACC,MAAhB,GAAyB,CAA7B,EAAgC;AAC9B,cAAI,CAACL,OAAD,IAAYjB,MAAhB,EAAwB;AACtBD,YAAAA,QAAQ,CAAC;AAAEJ,cAAAA,IAAI,EAAE0B,eAAe,CAAC,CAAD,CAAf,CAAmB9B,EAA3B;AAA+BM,cAAAA,EAAE,EAAE;AAAnC,aAAD,CAAR;AACD;;AACDoB,UAAAA,OAAO,GAAG,IAAV;AACA,2BAAWE,GAAX,gBAAqBC,aAArB;AAAoC3D,YAAAA,OAAO,EAAE4D;AAA7C;AACD;;AACD,yBAAWF,GAAX;AACD,OAZM,EAYJ,EAZI,CAAP;AAaD,KAfD,MAeO;AACL,UAAME,eAAe,GAAG5D,OAAO,CAACuC,MAAR,CAAe,UAACW,CAAD;AAAA,eACrCA,CAAC,CAAC3C,IAAF,CAAO4C,WAAP,GAAqBtB,QAArB,CAA8ByB,aAAa,CAACH,WAAd,EAA9B,CADqC;AAAA,OAAf,CAAxB;;AAGA,UAAIZ,MAAM,IAAIqB,eAAe,CAACC,MAAhB,GAAyB,CAAvC,EAA0C;AACxCvB,QAAAA,QAAQ,CAAC;AAAEJ,UAAAA,IAAI,EAAE0B,eAAe,CAAC,CAAD,CAAf,CAAmB9B,EAA3B;AAA+BM,UAAAA,EAAE,EAAE;AAAnC,SAAD,CAAR;AACD;;AACD,UAAIwB,eAAe,CAACC,MAAhB,KAA2B,CAA3B,IAAgC1D,UAApC,EAAgD;AAC9CmC,QAAAA,QAAQ,CAAC;AAAEJ,UAAAA,IAAI,EAAE,QAAR;AAAkBE,UAAAA,EAAE,EAAE;AAAtB,SAAD,CAAR;AACD;;AACD,aAAOwB,eAAP;AACD;AACF,GA/B8B,EAgC/B,CAACzD,UAAD,CAhC+B,CAAjC;AAmCA,MAAM2D,IAAI,GAAG5E,OAAO,CAClB;AAAA,WAAMmE,aAAa,CAACpB,UAAD,EAAaM,MAAb,CAAnB;AAAA,GADkB,EAElB,CAACA,MAAD,EAASc,aAAT,EAAwBpB,UAAxB,CAFkB,CAApB;AAKA,MAAM8B,iBAAiB,GAAG7E,OAAO,CAC/B;AAAA,WAAM,CAAC,CAACsB,YAAF,IAAkB,CAAC+B,MAAzB;AAAA,GAD+B,EAE/B,CAAC/B,YAAD,EAAe+B,MAAf,CAF+B,CAAjC;AAKA,MAAMyB,WAAW,GAAG9E,OAAO,CAAC,YAAM;AAChC,QAAMc,OAAO,GAAG8D,IAAI,CAACL,MAAL,CACd,UACEC,GADF,EAEEpD,MAFF,EAGK;AACH,UAAI,CAACwC,OAAO,CAACxC,MAAD,CAAZ,EAAsB;AACpB,yBAAWoD,GAAX,GAAgBpD,MAAhB;AACD;;AACD,uBAAWoD,GAAX,EAAmBpD,MAAM,CAACN,OAA1B;AACD,KATa,EAUd,EAVc,CAAhB;AAYA,WAAOqD,aAAa,CAACrD,OAAD,EAAUuC,MAAV,CAApB;AACD,GAd0B,EAcxB,CAACA,MAAD,EAASc,aAAT,EAAwBS,IAAxB,CAdwB,CAA3B;AAgBA,MAAMG,iBAAiB,GAAGjF,WAAW,CAAC,UAAC0D,CAAD,EAAO;AAC3C,QACEA,CAAC,CAACwB,MAAF,IACA,EAAExB,CAAC,CAACyB,GAAF,KAAU,WAAZ,CADA,IAEA,EAAEzB,CAAC,CAACyB,GAAF,KAAU,SAAZ,CAFA,IAGA,EAAEzB,CAAC,CAACyB,GAAF,KAAU,OAAZ,CAJF,EAKE;AACA3B,MAAAA,SAAS,CAACE,CAAC,CAACwB,MAAF,CAASE,KAAV,CAAT;AACD;AACF,GAToC,EASlC,EATkC,CAArC;AAWA,MAAMC,mBAAmB,GAAGrF,WAAW,CACrC,UAAC0D,CAAD,EAA0C;AACxCJ,IAAAA,QAAQ,CAAC;AAAEJ,MAAAA,IAAI,EAAEQ,CAAR;AAAWN,MAAAA,EAAE,EAAE;AAAf,KAAD,CAAR;AACD,GAHoC,EAIrC,EAJqC,CAAvC;AAOA,MAAMkC,cAAc,GAAGtF,WAAW,CAChC,UAAC8C,EAAD,EAAQ;AACN,QAAIyC,MAAJ;;AAEA,QAAIzC,EAAE,KAAK,IAAX,EAAiB;AACf,UAAI/B,IAAI,KAAK,UAAb,EAAyB;AACvB,YAAIsB,eAAe,CAACQ,QAAhB,CAAyBC,EAAzB,CAAJ,EAAkC;AAChCyC,UAAAA,MAAM,GAAGlD,eAAe,CAACkB,MAAhB,CAAuB,UAACiC,GAAD;AAAA,mBAASA,GAAG,KAAK1C,EAAjB;AAAA,WAAvB,CAAT;AACD,SAFD,MAEO;AACLyC,UAAAA,MAAM,aAAOlD,eAAP,GAAwBS,EAAxB,EAAN;AACD;AACF,OAND,MAMO;AACL,YAAIT,eAAe,CAACQ,QAAhB,CAAyBC,EAAzB,CAAJ,EAAkC;AAChCyC,UAAAA,MAAM,GAAG,IAAT;AACD,SAFD,MAEO;AACLA,UAAAA,MAAM,GAAGzC,EAAT;AACD;AACF;;AACDU,MAAAA,SAAS,CAAC,EAAD,CAAT;AACD,KAfD,MAeO;AACL,UAAI,OAAOzB,yBAAP,KAAqC,UAAzC,EAAqD;AACnDA,QAAAA,yBAAyB;AACzB;AACD;AACF;;AAED,QAAI,OAAOL,YAAP,KAAwB,UAA5B,EAAwC;AACtCA,MAAAA,YAAY,CAAC6D,MAAD,CAAZ;AACD;AACF,GA7B+B,EA8BhC,CAAC7D,YAAD,EAAeK,yBAAf,EAA0CM,eAA1C,EAA2DtB,IAA3D,CA9BgC,CAAlC;AAiCA,MAAM0E,gBAAgB,GAAGzF,WAAW,CAAC,UAAC0D,CAAD,EAAO;AAC1C,QAAIA,CAAC,KAAKP,SAAN,IAAmBO,CAAC,KAAK,IAA7B,EAAmC;AACjC,aAAOJ,QAAQ,CAAC;AAAEJ,QAAAA,IAAI,EAAE,IAAR;AAAcE,QAAAA,EAAE,EAAE;AAAlB,OAAD,CAAf;AACD;;AACDE,IAAAA,QAAQ,CAAC;AAAEJ,MAAAA,IAAI,EAAEQ,CAAR;AAAWN,MAAAA,EAAE,EAAE;AAAf,KAAD,CAAR;AACD,GALmC,EAKjC,EALiC,CAApC;AAOA,MAAMsC,WAAW,GAAG1F,WAAW,CAC7B,UAAC0D,CAAD,EAAO;AACLA,IAAAA,CAAC,CAACiC,cAAF;AACAL,IAAAA,cAAc,CAACjC,KAAK,CAACH,IAAP,CAAd;AACD,GAJ4B,EAK7B,CAACoC,cAAD,EAAiBjC,KAAjB,CAL6B,CAA/B;AAQA,MAAMuC,kBAAkB,GAAG5F,WAAW,CACpC,UAACkD,IAAD,EAA6C2C,KAA7C,EAAuD;AACrD,QAAI/B,OAAO,CAACZ,IAAD,CAAX,EAAmB;AACjB,0BACE,oBAAC,WAAD;AACE,QAAA,OAAO,EAAEb,eADX;AAEE,QAAA,IAAI,EAAEa,IAAI,CAAC3B,IAFb;AAGE,QAAA,GAAG,EAAE2B,IAAI,CAACJ,EAHZ;AAIE,QAAA,QAAQ,EAAEuC,mBAJZ;AAKE,QAAA,EAAE,EAAEnC,IAAI,CAACJ,EALX;AAME,QAAA,KAAK,EAAEO,KAAK,CAACH,IANf;AAOE,QAAA,OAAO,EAAEA,IAAI,CAAClC,OAPhB;AAQE,QAAA,aAAa,EAAE4E,kBARjB;AASE,QAAA,IAAI,EAAE7E,IATR;AAUE,QAAA,QAAQ,EAAEW,YAVZ;AAWE,QAAA,MAAM,EAAE6B;AAXV,QADF;AAeD;;AACD,wBACE,oBAAC,MAAD;AACE,MAAA,IAAI,EAAEL,IAAI,CAAC3B,IADb;AAEE,MAAA,GAAG,EAAEY,OAFP;AAGE,MAAA,GAAG,EAAE0D,KAHP;AAIE,MAAA,YAAY,EAAEJ,gBAJhB;AAKE,MAAA,OAAO,EAAEC,WALX;AAME,MAAA,EAAE,EAAExC,IAAI,CAACJ,EANX;AAOE,MAAA,KAAK,EAAEI,IAAI,CAACJ,EAAL,KAAYO,KAAK,CAACH,IAP3B;AAQE,MAAA,SAAS,EAAEvB,eARb;AASE,MAAA,YAAY,EAAEN,YAAY,cACnB6B,IADmB;AACb3B,QAAAA,IAAI,EAAEjB,aAAa,CAAC4C,IAAI,CAAC3B,IAAN,EAAYgC,MAAZ;AADN,UAExB;AACET,QAAAA,EAAE,cAAYI,IAAI,CAACJ,EADrB;AAEEgD,QAAAA,OAAO,EAAEzD,eAAe,IAAIA,eAAe,CAACQ,QAAhB,CAAyBK,IAAI,CAACJ,EAA9B,CAF9B;AAGEO,QAAAA,KAAK,EAAEA,KAAK,CAACH,IAAN,KAAeA,IAAI,CAACJ,EAH7B;AAIEiD,QAAAA,QAAQ,EAAE;AAAA,iBAAM,IAAN;AAAA;AAJZ,OAFwB;AAT5B,MADF;AAqBD,GAxCmC,EAyCpC,CACEL,WADF,EAEED,gBAFF,EAGEpC,KAAK,CAACH,IAHR,EAIEvB,eAJF,EAKEN,YALF,EAMEkC,MANF,EAOElB,eAPF,EAQEgD,mBARF,EASEtE,IATF,EAUEW,YAVF,CAzCoC,CAAtC;AAuDA,MAAMsE,kBAAkB,GAAGhG,WAAW,CAAC,YAAM;AAC3CsD,IAAAA,QAAQ,CAAC;AAAEJ,MAAAA,IAAI,EAAEC,SAAR;AAAmBC,MAAAA,EAAE,EAAE;AAAvB,KAAD,CAAR;AACD,GAFqC,EAEnC,EAFmC,CAAtC;AAIA,MAAM6C,YAAY,GAAGjG,WAAW,CAAC,UAAC8E,IAAD,EAAmBoB,UAAnB,EAA0C;AACzE,QAAIpB,IAAI,CAACqB,eAAL,KAAyBrB,IAAI,CAACsB,YAAL,EAAzB,GAA+CF,UAAU,GAAG,EAAhE,EAAoE;AAClE,aAAOpB,IAAI,CAACuB,SAAL,CAAeH,UAAU,GAAGpB,IAAI,CAACqB,eAAL,EAAb,GAAsC,EAArD,CAAP;AACD;;AACD,QAAIrB,IAAI,CAACsB,YAAL,KAAsBF,UAA1B,EAAsC;AACpC,aAAOpB,IAAI,CAACuB,SAAL,CAAeH,UAAf,CAAP;AACD;AACF,GAP+B,EAO7B,EAP6B,CAAhC;AASA/F,EAAAA,SAAS,CAAC,YAAM;AACd,QAAIkD,KAAK,CAACD,EAAN,KAAa,UAAb,IAA2BC,KAAK,CAACH,IAAN,KAAeC,SAA9C,EAAyD;AACvD,UAAMD,IAA0B,GAAGf,OAAO,CAACmE,OAA3C;AACA,UAAMxB,KAAI,GAAG1C,OAAO,CAACkE,OAArB;;AACA,UAAInE,OAAO,IAAIe,IAAX,IAAmB4B,KAAvB,EAA6B;AAC3BmB,QAAAA,YAAY,CAACnB,KAAD,EAAO5B,IAAI,CAACqD,SAAZ,CAAZ;AACD;AACF;AACF,GARQ,EAQN,CAACN,YAAD,EAAe5C,KAAf,CARM,CAAT;AAUA,MAAMmD,eAAe,GAAGxG,WAAW,CACjC,UAAC0D,CAAD,EAAO;AACL,QAAIA,CAAC,CAACyB,GAAF,KAAU,OAAd,EAAuB;AACrBzB,MAAAA,CAAC,CAACiC,cAAF;;AAEA,UAAItC,KAAK,CAACH,IAAN,KAAeC,SAAf,IAA4BI,MAAM,KAAK,EAA3C,EAA+C;AAC7C;AACD;;AACD,UAAIF,KAAK,CAACH,IAAN,KAAe,QAAnB,EAA6B;AAC3BO,QAAAA,WAAW,CAAC,IAAD,CAAX;AACA;AACD;;AACD,UAAIJ,KAAK,CAACH,IAAN,KAAe,IAAf,IAAuBnB,yBAA3B,EAAsD;AACpDA,QAAAA,yBAAyB;AACzB;AACD;;AAED,UAAIsB,KAAK,CAACH,IAAV,EAAgB;AACdoC,QAAAA,cAAc,CAACjC,KAAK,CAACH,IAAP,CAAd;AACAM,QAAAA,SAAS,CAAC,EAAD,CAAT;AACD;;AACD;AACD;;AACDF,IAAAA,QAAQ,CAAC;AACPJ,MAAAA,IAAI,EAAE3C,sBAAsB,CAC1BmD,CAD0B,EAE1BL,KAAK,CAACH,IAFoB,EAG1B8B,WAH0B,EAI1BjB,UAJ0B,EAK1BgB,iBAL0B,CADrB;AAQP3B,MAAAA,EAAE,EAAE;AARG,KAAD,CAAR;AAUD,GAjCgC,EAkCjC,CACEG,MADF,EAEEyB,WAFF,EAGEM,cAHF,EAIEvD,yBAJF,EAKE0B,WALF,EAMEJ,KANF,EAOEU,UAPF,EAQEgB,iBARF,CAlCiC,CAAnC;AA8CA5E,EAAAA,SAAS,CAAC,YAAM;AACd,QAAIc,OAAJ,EAAa;AACXA,MAAAA,OAAO,CAACwF,SAAR,GAAoBD,eAApB;AACAvF,MAAAA,OAAO,CAACyF,OAAR,GAAkBzB,iBAAlB;AACD;AACF,GALQ,EAKN,CAACA,iBAAD,EAAoBuB,eAApB,EAAqCvF,OAArC,CALM,CAAT;AAOA,MAAM0F,uBAAuB,GAAG3G,WAAW,CAAC,YAAM;AAChD,QAAIgC,qBAAJ,EAA2B;AACzB,aAAOK,eAAe,CAACwC,MAAhB,GAAyB,CAAzB,IAA8BxC,eAAe,CAAC,CAAD,CAAf,KAAuB,EAA5D;AACD,KAFD,MAEO;AACL,aACEA,eAAe,CAAC,CAAD,CAAf,KAAuB,IAAvB,IACAA,eAAe,CAACwC,MAAhB,KAA2BG,WAAW,CAACH,MAFzC;AAID;AACF,GAT0C,EASxC,CAACG,WAAW,CAACH,MAAb,EAAqB7C,qBAArB,EAA4CK,eAA5C,CATwC,CAA3C;AAWA,MAAMuE,YAAY,GAAG1G,OAAO,CAC1B;AAAA,WAAMkB,YAAY,IAAI,CAAC2C,UAAjB,IAA+Be,IAAI,CAACD,MAAL,GAAc,CAAnD;AAAA,GAD0B,EAE1B,CAACC,IAAI,CAACD,MAAN,EAAczD,YAAd,EAA4B2C,UAA5B,CAF0B,CAA5B;AAKA,MAAM8C,cAAc,GAAG3G,OAAO,CAC5B;AAAA,wBACE,oBAAC,0BAAD,QAA6BkB,YAA7B,CADF;AAAA,GAD4B,EAI5B,CAACA,YAAD,CAJ4B,CAA9B;AAOA,sBACE,oBAAC,8BAAD;AACE,IAAA,SAAS,EAAEU,qBADb;AAEE,IAAA,SAAS,EACP,CAACN,YAAD,IAAiB,CAACL,UAAlB,IAAgC,CAACC,YAAjC,IAAiD0D,IAAI,CAACD,MAAL,GAAc;AAHnE,KAMG;AAAA,QAAGiC,QAAH,SAAGA,QAAH;AAAA,wBACC,oBAAC,sBAAD;AAAwB,MAAA,GAAG,EAAC,MAA5B;AAAmC,MAAA,YAAY,EAAEd;AAAjD,oBACE,oBAAC,UAAD;AACE,MAAA,GAAG,EAAE5D,OADP;AAEE,MAAA,GAAG,EAAC,WAFN;AAGE,MAAA,UAAU,MAHZ;AAIE,MAAA,aAAa,EAAEF,aAJjB;AAKE,MAAA,QAAQ,EAAE4E;AALZ,OAOGtF,YAAY,IAAI,CAAC+B,MAAjB,iBACC,oBAAC,MAAD;AACE,MAAA,IAAI,EAAE/B,YADR;AAEE,MAAA,GAAG,EAAEW,OAFP;AAGE,MAAA,KAAK,EAAEkB,KAAK,CAACH,IAAN,KAAe,IAHxB;AAIE,MAAA,YAAY,EAAEuC,gBAJhB;AAKE,MAAA,OAAO,EAAE,iBAAC/B,CAAD,EAAO;AACdA,QAAAA,CAAC,CAACiC,cAAF;AACAL,QAAAA,cAAc,CAAC,IAAD,CAAd;AACD,OARH;AASE,MAAA,YAAY,EAAEjE,YAAY,CACxB;AAAEE,QAAAA,IAAI,EAAEC,YAAR;AAAsBsB,QAAAA,EAAE,EAAE;AAA1B,OADwB,EAExB;AACEgD,QAAAA,OAAO,EAAEa,uBAAuB,EADlC;AAEEtD,QAAAA,KAAK,EAAEA,KAAK,CAACH,IAAN,KAAe,IAFxB;AAGE6C,QAAAA,QAAQ,EAAE;AAAA,iBAAM,IAAN;AAAA;AAHZ,OAFwB;AAT5B,MARJ,EA2BGjB,IAAI,CAACiC,GAAL,CAAS,UAAC7D,IAAD,EAAyB2C,KAAzB;AAAA,aACRD,kBAAkB,CAAC1C,IAAD,EAAO2C,KAAP,CADV;AAAA,KAAT,CA3BH,EA8BGe,YAAY,IAAIC,cA9BnB,EA+BG9C,UAAU,IAAIK,YA/BjB,CADF,CADD;AAAA,GANH,CADF;AA8CD,CAncM;AAqcPtD,YAAY,CAACkG,WAAb,GAA2B,cAA3B","sourcesContent":["import React, {\n  FC,\n  useCallback,\n  useState,\n  useMemo,\n  useEffect,\n  useRef,\n  ReactNode,\n  ReactElement,\n} from \"react\";\nimport { Scrollbars } from \"react-custom-scrollbars\";\nimport highlightText from \"../../hooks/useHighlightText\";\nimport { handleKeyboardMovement } from \"./HandleKeyboard\";\nimport { IOptionItemProps, Option } from \"../Select/Option\";\nimport { IOptionGroupProps, OptionGroup } from \"../Select/OptionGroup\";\nimport {\n  StyledAutocompleteBody,\n  StyledAutocompleteNewItem,\n  StyledAutocompleteNoResult,\n  StyledAutocompleteScrollShadow,\n} from \"./Styles\";\n\nexport interface IAutocompleteProps {\n  /** Select type: single or multiple */\n  type?: \"single\" | \"multiple\";\n  /** List of options or group options */\n  options?: (IOptionGroupProps | IOptionItemProps)[];\n  /** Selected values */\n  selected?: (string | number)[] | string | number;\n  /** Input Element. */\n  inputEl?: HTMLInputElement | null;\n  /** Text for empty value */\n  emptyValue?: string;\n  /** Text for No result */\n  noResultText?: string;\n  /** Render option */\n  renderOption?: (\n    option: Record<string, ReactNode>,\n    data: Record<string, unknown>\n  ) => string | ReactElement;\n  /** Default value that renders on top of list */\n  defaultValue?: string;\n  /** Sort direction for labels */\n  sortDirection?: \"asc\" | \"desc\";\n  /** handleChange callback */\n  handleChange?: (\n    e: (string | number)[] | string | number | null | undefined\n  ) => void;\n  /** ClassName for single option */\n  optionClassName?: string;\n  /** handleEmptyAction */\n  handleEmptyAction?: (e: string | number) => void;\n  /** Disable sorting options */\n  disabledInternalSort?: boolean;\n  /** ClassName for Autocomplete component */\n  AutocompleteClassName?: string;\n  /** handleDefaultOptionChange callback */\n  handleDefaultOptionChange?: () => void;\n  /** Should default value be selected */\n  preselectDefaultValue?: boolean;\n  /** Should order stay the same after choosing an option */\n  keepSameOptionsOrder?: boolean;\n  /** Set max height property for scrollbars */\n  autoHeightMax?: number;\n}\n\ninterface IHover {\n  item: number | string | undefined | null;\n  by: \"mouse\" | \"keyboard\" | undefined;\n}\n\nexport const Autocomplete: FC<IAutocompleteProps> = ({\n  type,\n  options = [],\n  inputEl,\n  selected = [],\n  emptyValue,\n  noResultText,\n  renderOption = (option) => option?.name,\n  defaultValue,\n  sortDirection = \"asc\",\n  handleChange,\n  optionClassName,\n  handleEmptyAction,\n  disabledInternalSort,\n  AutocompleteClassName,\n  handleDefaultOptionChange,\n  preselectDefaultValue,\n  keepSameOptionsOrder = false,\n  autoHeightMax = 340,\n}) => {\n  const itemRef = useRef<HTMLLIElement>(null);\n  const listRef = useRef<Scrollbars>(null);\n\n  const selectedOptions = useMemo(() => {\n    if (Array.isArray(selected)) {\n      return selected;\n    }\n    return [selected];\n  }, [selected]);\n\n  const handleSort = useCallback((opts) => {\n    if (keepSameOptionsOrder) {\n      return opts;\n    }\n    return opts.sort((a: IOptionItemProps, b: IOptionItemProps) => {\n      if (selectedOptions.includes(b.id) && !selectedOptions.includes(a.id)) {\n        return 1;\n      }\n      if (selectedOptions.includes(a.id) && !selectedOptions.includes(b.id)) {\n        return -1;\n      }\n      return 0;\n    });\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const sortList = useCallback(\n    (options) => {\n      if (disabledInternalSort) {\n        return handleSort([...options]);\n      }\n      return handleSort(\n        [...options].sort((a: IOptionItemProps, b: IOptionItemProps) =>\n          sortDirection === \"asc\"\n            ? a.name.localeCompare(b.name)\n            : b.name.localeCompare(a.name)\n        )\n      );\n    },\n    [sortDirection, disabledInternalSort, handleSort]\n  );\n\n  const sortedList = useMemo(() => sortList(options), [options, sortList]);\n\n  const [hover, setHover] = useState<IHover>({\n    item: undefined,\n    by: undefined,\n  });\n  const [filter, setFilter] = useState(\"\");\n\n  const handleEmpty = useCallback(\n    (e) => {\n      if (e && e.button !== 0) {\n        return;\n      }\n      if (handleEmptyAction) {\n        inputEl?.focus();\n        setFilter(\"\");\n        handleEmptyAction(filter);\n      }\n    },\n    [filter, handleEmptyAction, inputEl]\n  );\n\n  const onAddNewMouseEnter = useCallback(\n    () => setHover({ item: \"addNew\", by: \"mouse\" }),\n    []\n  );\n\n  function isGroup(\n    item: IOptionGroupProps | IOptionItemProps\n  ): item is IOptionGroupProps {\n    return (item as IOptionGroupProps).options !== undefined;\n  }\n\n  const showAddNew = useMemo(() => {\n    return !!(\n      emptyValue &&\n      filter.trim() &&\n      options.every((option) => {\n        if (isGroup(option)) {\n          return option.options.every(\n            (v) => v.name.toLowerCase() !== filter.trim().toLowerCase()\n          );\n        }\n        return option.name.toLowerCase() !== filter.trim().toLowerCase();\n      })\n    );\n  }, [emptyValue, filter, options]);\n\n  const renderAddNew = useMemo(() => {\n    return (\n      <StyledAutocompleteNewItem\n        ref={hover.item === \"addNew\" ? itemRef : null}\n        key=\"emptyValue\"\n        hover={hover.item === \"addNew\"}\n        onMouseDown={handleEmpty}\n        onMouseEnter={onAddNewMouseEnter}\n      >\n        {emptyValue}\n      </StyledAutocompleteNewItem>\n    );\n  }, [emptyValue, handleEmpty, hover, onAddNewMouseEnter]);\n\n  const filterOptions = useCallback(\n    (options, filter) => {\n      const trimmedFilter = filter.trim();\n      const isGrouped = options[0] && isGroup(options[0]);\n      if (isGrouped) {\n        let hovered = false;\n        return options.reduce((acc, groupedOption) => {\n          const filteredOptions = groupedOption.options.filter((v) =>\n            v.name.toLowerCase().includes(trimmedFilter.toLowerCase())\n          );\n          if (filteredOptions.length > 0) {\n            if (!hovered && filter) {\n              setHover({ item: filteredOptions[0].id, by: \"keyboard\" });\n            }\n            hovered = true;\n            return [...acc, { ...groupedOption, options: filteredOptions }];\n          }\n          return [...acc];\n        }, []);\n      } else {\n        const filteredOptions = options.filter((v) =>\n          v.name.toLowerCase().includes(trimmedFilter.toLowerCase())\n        );\n        if (filter && filteredOptions.length > 0) {\n          setHover({ item: filteredOptions[0].id, by: \"keyboard\" });\n        }\n        if (filteredOptions.length === 0 && emptyValue) {\n          setHover({ item: \"addNew\", by: \"keyboard\" });\n        }\n        return filteredOptions;\n      }\n    },\n    [emptyValue]\n  );\n\n  const list = useMemo(\n    () => filterOptions(sortedList, filter),\n    [filter, filterOptions, sortedList]\n  );\n\n  const showDefaultOption = useMemo(\n    () => !!defaultValue && !filter,\n    [defaultValue, filter]\n  );\n\n  const flatOptions = useMemo(() => {\n    const options = list.reduce(\n      (\n        acc: (IOptionItemProps | IOptionGroupProps | [])[],\n        option: IOptionItemProps | IOptionGroupProps\n      ) => {\n        if (!isGroup(option)) {\n          return [...acc, option];\n        }\n        return [...acc, ...option.options];\n      },\n      []\n    );\n    return filterOptions(options, filter);\n  }, [filter, filterOptions, list]);\n\n  const handleInputChange = useCallback((e) => {\n    if (\n      e.target &&\n      !(e.key === \"ArrowDown\") &&\n      !(e.key === \"ArrowUp\") &&\n      !(e.key === \"Enter\")\n    ) {\n      setFilter(e.target.value);\n    }\n  }, []);\n\n  const handleHoverCallback = useCallback(\n    (e: number | string | undefined): void => {\n      setHover({ item: e, by: \"mouse\" });\n    },\n    []\n  );\n\n  const toggleSelected = useCallback(\n    (id) => {\n      let result;\n\n      if (id !== null) {\n        if (type === \"multiple\") {\n          if (selectedOptions.includes(id)) {\n            result = selectedOptions.filter((_id) => _id !== id);\n          } else {\n            result = [...selectedOptions, id];\n          }\n        } else {\n          if (selectedOptions.includes(id)) {\n            result = null;\n          } else {\n            result = id;\n          }\n        }\n        setFilter(\"\");\n      } else {\n        if (typeof handleDefaultOptionChange === \"function\") {\n          handleDefaultOptionChange();\n          return;\n        }\n      }\n\n      if (typeof handleChange === \"function\") {\n        handleChange(result);\n      }\n    },\n    [handleChange, handleDefaultOptionChange, selectedOptions, type]\n  );\n\n  const handleMouseEnter = useCallback((e) => {\n    if (e === undefined || e === null) {\n      return setHover({ item: null, by: \"mouse\" });\n    }\n    setHover({ item: e, by: \"mouse\" });\n  }, []);\n\n  const handleClick = useCallback(\n    (e) => {\n      e.preventDefault();\n      toggleSelected(hover.item);\n    },\n    [toggleSelected, hover]\n  );\n\n  const handleRenderOption = useCallback(\n    (item: IOptionItemProps | IOptionGroupProps, index) => {\n      if (isGroup(item)) {\n        return (\n          <OptionGroup\n            checked={selectedOptions}\n            name={item.name}\n            key={item.id}\n            setHover={handleHoverCallback}\n            id={item.id}\n            hover={hover.item}\n            options={item.options}\n            renderOptions={handleRenderOption}\n            type={type}\n            onChange={handleChange}\n            filter={filter}\n          />\n        );\n      }\n      return (\n        <Option\n          name={item.name}\n          ref={itemRef}\n          key={index}\n          onMouseEnter={handleMouseEnter}\n          onClick={handleClick}\n          id={item.id}\n          hover={item.id === hover.item}\n          className={optionClassName}\n          renderOption={renderOption(\n            { ...item, name: highlightText(item.name, filter) },\n            {\n              id: `option_${item.id}`,\n              checked: selectedOptions && selectedOptions.includes(item.id),\n              hover: hover.item === item.id,\n              onChange: () => null,\n            }\n          )}\n        />\n      );\n    },\n    [\n      handleClick,\n      handleMouseEnter,\n      hover.item,\n      optionClassName,\n      renderOption,\n      filter,\n      selectedOptions,\n      handleHoverCallback,\n      type,\n      handleChange,\n    ]\n  );\n\n  const handleOnMouseLeave = useCallback(() => {\n    setHover({ item: undefined, by: \"mouse\" });\n  }, []);\n\n  const handleScroll = useCallback((list: Scrollbars, itemOffset: number) => {\n    if (list.getClientHeight() + list.getScrollTop() < itemOffset + 40) {\n      return list.scrollTop(itemOffset - list.getClientHeight() + 30);\n    }\n    if (list.getScrollTop() > itemOffset) {\n      return list.scrollTop(itemOffset);\n    }\n  }, []);\n\n  useEffect(() => {\n    if (hover.by === \"keyboard\" && hover.item !== undefined) {\n      const item: HTMLLIElement | null = itemRef.current;\n      const list = listRef.current;\n      if (itemRef && item && list) {\n        handleScroll(list, item.offsetTop);\n      }\n    }\n  }, [handleScroll, hover]);\n\n  const handleOnKeyDown = useCallback(\n    (e) => {\n      if (e.key === \"Enter\") {\n        e.preventDefault();\n\n        if (hover.item === undefined && filter === \"\") {\n          return;\n        }\n        if (hover.item === \"addNew\") {\n          handleEmpty(null);\n          return;\n        }\n        if (hover.item === null && handleDefaultOptionChange) {\n          handleDefaultOptionChange();\n          return;\n        }\n\n        if (hover.item) {\n          toggleSelected(hover.item);\n          setFilter(\"\");\n        }\n        return;\n      }\n      setHover({\n        item: handleKeyboardMovement(\n          e,\n          hover.item,\n          flatOptions,\n          showAddNew,\n          showDefaultOption\n        ),\n        by: \"keyboard\",\n      });\n    },\n    [\n      filter,\n      flatOptions,\n      toggleSelected,\n      handleDefaultOptionChange,\n      handleEmpty,\n      hover,\n      showAddNew,\n      showDefaultOption,\n    ]\n  );\n\n  useEffect(() => {\n    if (inputEl) {\n      inputEl.onkeydown = handleOnKeyDown;\n      inputEl.onkeyup = handleInputChange;\n    }\n  }, [handleInputChange, handleOnKeyDown, inputEl]);\n\n  const isDefaultOptionSelected = useCallback(() => {\n    if (preselectDefaultValue) {\n      return selectedOptions.length < 1 || selectedOptions[0] === \"\";\n    } else {\n      return (\n        selectedOptions[0] === null ||\n        selectedOptions.length === flatOptions.length\n      );\n    }\n  }, [flatOptions.length, preselectDefaultValue, selectedOptions]);\n\n  const showNoResult = useMemo(\n    () => noResultText && !showAddNew && list.length < 1,\n    [list.length, noResultText, showAddNew]\n  );\n\n  const renderNoResult = useMemo(\n    () => (\n      <StyledAutocompleteNoResult>{noResultText}</StyledAutocompleteNoResult>\n    ),\n    [noResultText]\n  );\n\n  return (\n    <StyledAutocompleteScrollShadow\n      className={AutocompleteClassName}\n      $isHidden={\n        !defaultValue && !emptyValue && !noResultText && list.length < 1\n      }\n    >\n      {({ onScroll }): JSX.Element => (\n        <StyledAutocompleteBody key=\"body\" onMouseLeave={handleOnMouseLeave}>\n          <Scrollbars\n            ref={listRef}\n            key=\"scrollBar\"\n            autoHeight\n            autoHeightMax={autoHeightMax}\n            onScroll={onScroll}\n          >\n            {defaultValue && !filter && (\n              <Option\n                name={defaultValue}\n                ref={itemRef}\n                hover={hover.item === null}\n                onMouseEnter={handleMouseEnter}\n                onClick={(e) => {\n                  e.preventDefault();\n                  toggleSelected(null);\n                }}\n                renderOption={renderOption(\n                  { name: defaultValue, id: null },\n                  {\n                    checked: isDefaultOptionSelected(),\n                    hover: hover.item === null,\n                    onChange: () => null,\n                  }\n                )}\n              />\n            )}\n            {list.map((item: IOptionItemProps, index) =>\n              handleRenderOption(item, index)\n            )}\n            {showNoResult && renderNoResult}\n            {showAddNew && renderAddNew}\n          </Scrollbars>\n        </StyledAutocompleteBody>\n      )}\n    </StyledAutocompleteScrollShadow>\n  );\n};\n\nAutocomplete.displayName = \"Autocomplete\";\n"],"file":"Autocomplete.js"}
+{"version":3,"sources":["../../../../src/components/Autocomplete/Autocomplete.tsx"],"names":["React","useCallback","useState","useMemo","useEffect","useRef","Scrollbars","highlightText","handleKeyboardMovement","Option","OptionGroup","StyledAutocompleteBody","StyledAutocompleteNewItem","StyledAutocompleteNoResult","StyledAutocompleteScrollShadow","isOptionGroup","item","options","undefined","Autocomplete","type","inputEl","selected","emptyValue","noResultText","renderOption","option","name","defaultValue","sortDirection","handleChange","optionClassName","handleEmptyAction","disabledInternalSort","AutocompleteClassName","handleDefaultOptionChange","preselectDefaultValue","keepSameOptionsOrder","autoHeightMax","itemRef","listRef","selectedOptions","Array","isArray","handleSort","opts","sort","a","b","includes","id","sortList","localeCompare","sortedList","by","hover","setHover","filter","setFilter","handleEmpty","e","button","focus","onAddNewMouseEnter","showAddNew","trim","every","v","toLowerCase","renderAddNew","filterOptions","trimmedFilter","isGrouped","hovered","reduce","acc","groupedOption","filteredOptions","length","list","showDefaultOption","flatOptions","handleInputChange","target","key","value","handleHoverCallback","toggleSelected","result","_id","handleMouseEnter","handleClick","preventDefault","handleRenderOption","index","checked","onChange","handleOnMouseLeave","handleScroll","itemOffset","getClientHeight","getScrollTop","scrollTop","current","offsetTop","handleOnKeyDown","onkeydown","onkeyup","isDefaultOptionSelected","showNoResult","renderNoResult","onScroll","map","displayName"],"mappings":"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","sourcesContent":["import React, {\n  FC,\n  useCallback,\n  useState,\n  useMemo,\n  useEffect,\n  useRef,\n  ReactNode,\n  ReactElement,\n} from \"react\";\nimport { Scrollbars } from \"react-custom-scrollbars\";\nimport highlightText from \"../../hooks/useHighlightText\";\nimport { handleKeyboardMovement } from \"./HandleKeyboard\";\nimport { IOptionItemProps, Option } from \"../Select/Option\";\nimport { IOptionGroupProps, OptionGroup } from \"../Select/OptionGroup\";\nimport {\n  StyledAutocompleteBody,\n  StyledAutocompleteNewItem,\n  StyledAutocompleteNoResult,\n  StyledAutocompleteScrollShadow,\n} from \"./Styles\";\n\nexport function isOptionGroup(\n  item: IOptionGroupProps | IOptionItemProps\n): item is IOptionGroupProps {\n  return (item as IOptionGroupProps).options !== undefined;\n}\n\nexport interface IAutocompleteProps {\n  /** Select type: single or multiple */\n  type?: \"single\" | \"multiple\";\n  /** List of options or group options */\n  options?: (IOptionGroupProps | IOptionItemProps)[];\n  /** Selected values */\n  selected?: (string | number)[] | string | number;\n  /** Input Element. */\n  inputEl?: HTMLInputElement | null;\n  /** Text for empty value */\n  emptyValue?: string;\n  /** Text for No result */\n  noResultText?: string;\n  /** Render option */\n  renderOption?: (\n    option: Record<string, ReactNode>,\n    data: Record<string, unknown>\n  ) => string | ReactElement;\n  /** Default value that renders on top of list */\n  defaultValue?: string;\n  /** Sort direction for labels */\n  sortDirection?: \"asc\" | \"desc\";\n  /** handleChange callback */\n  handleChange?: (\n    e: (string | number)[] | string | number | null | undefined\n  ) => void;\n  /** ClassName for single option */\n  optionClassName?: string;\n  /** handleEmptyAction */\n  handleEmptyAction?: (e: string | number) => void;\n  /** Disable sorting options */\n  disabledInternalSort?: boolean;\n  /** ClassName for Autocomplete component */\n  AutocompleteClassName?: string;\n  /** handleDefaultOptionChange callback */\n  handleDefaultOptionChange?: () => void;\n  /** Should default value be selected */\n  preselectDefaultValue?: boolean;\n  /** Should order stay the same after choosing an option */\n  keepSameOptionsOrder?: boolean;\n  /** Set max height property for scrollbars */\n  autoHeightMax?: number;\n}\n\ninterface IHover {\n  item: number | string | undefined | null;\n  by: \"mouse\" | \"keyboard\" | undefined;\n}\n\nexport const Autocomplete: FC<IAutocompleteProps> = ({\n  type,\n  options = [],\n  inputEl,\n  selected = [],\n  emptyValue,\n  noResultText,\n  renderOption = (option) => option?.name,\n  defaultValue,\n  sortDirection = \"asc\",\n  handleChange,\n  optionClassName,\n  handleEmptyAction,\n  disabledInternalSort,\n  AutocompleteClassName,\n  handleDefaultOptionChange,\n  preselectDefaultValue,\n  keepSameOptionsOrder = false,\n  autoHeightMax = 340,\n}) => {\n  const itemRef = useRef<HTMLLIElement>(null);\n  const listRef = useRef<Scrollbars>(null);\n\n  const selectedOptions = useMemo(() => {\n    if (Array.isArray(selected)) {\n      return selected;\n    }\n    return [selected];\n  }, [selected]);\n\n  const handleSort = useCallback((opts) => {\n    if (keepSameOptionsOrder) {\n      return opts;\n    }\n    return opts.sort((a: IOptionItemProps, b: IOptionItemProps) => {\n      if (selectedOptions.includes(b.id) && !selectedOptions.includes(a.id)) {\n        return 1;\n      }\n      if (selectedOptions.includes(a.id) && !selectedOptions.includes(b.id)) {\n        return -1;\n      }\n      return 0;\n    });\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const sortList = useCallback(\n    (options) => {\n      if (disabledInternalSort) {\n        return handleSort([...options]);\n      }\n      return handleSort(\n        [...options].sort((a: IOptionItemProps, b: IOptionItemProps) =>\n          sortDirection === \"asc\"\n            ? a.name.localeCompare(b.name)\n            : b.name.localeCompare(a.name)\n        )\n      );\n    },\n    [sortDirection, disabledInternalSort, handleSort]\n  );\n\n  const sortedList = useMemo(() => sortList(options), [options, sortList]);\n\n  const [hover, setHover] = useState<IHover>({\n    item: undefined,\n    by: undefined,\n  });\n  const [filter, setFilter] = useState(\"\");\n\n  const handleEmpty = useCallback(\n    (e) => {\n      if (e && e.button !== 0) {\n        return;\n      }\n      if (handleEmptyAction) {\n        inputEl?.focus();\n        setFilter(\"\");\n        handleEmptyAction(filter);\n      }\n    },\n    [filter, handleEmptyAction, inputEl]\n  );\n\n  const onAddNewMouseEnter = useCallback(\n    () => setHover({ item: \"addNew\", by: \"mouse\" }),\n    []\n  );\n\n  const showAddNew = useMemo(() => {\n    return !!(\n      emptyValue &&\n      filter.trim() &&\n      options.every((option) => {\n        if (isOptionGroup(option)) {\n          return option.options.every(\n            (v) => v.name.toLowerCase() !== filter.trim().toLowerCase()\n          );\n        }\n        return option.name.toLowerCase() !== filter.trim().toLowerCase();\n      })\n    );\n  }, [emptyValue, filter, options]);\n\n  const renderAddNew = useMemo(() => {\n    return (\n      <StyledAutocompleteNewItem\n        ref={hover.item === \"addNew\" ? itemRef : null}\n        key=\"emptyValue\"\n        hover={hover.item === \"addNew\"}\n        onMouseDown={handleEmpty}\n        onMouseEnter={onAddNewMouseEnter}\n      >\n        {emptyValue}\n      </StyledAutocompleteNewItem>\n    );\n  }, [emptyValue, handleEmpty, hover, onAddNewMouseEnter]);\n\n  const filterOptions = useCallback(\n    (options, filter) => {\n      const trimmedFilter = filter.trim();\n      const isGrouped = options[0] && isOptionGroup(options[0]);\n      if (isGrouped) {\n        let hovered = false;\n        return options.reduce((acc, groupedOption) => {\n          const filteredOptions = groupedOption.options.filter((v) =>\n            v.name.toLowerCase().includes(trimmedFilter.toLowerCase())\n          );\n          if (filteredOptions.length > 0) {\n            if (!hovered && filter) {\n              setHover({ item: filteredOptions[0].id, by: \"keyboard\" });\n            }\n            hovered = true;\n            return [...acc, { ...groupedOption, options: filteredOptions }];\n          }\n          return [...acc];\n        }, []);\n      } else {\n        const filteredOptions = options.filter((v) =>\n          v.name.toLowerCase().includes(trimmedFilter.toLowerCase())\n        );\n        if (filter && filteredOptions.length > 0) {\n          setHover({ item: filteredOptions[0].id, by: \"keyboard\" });\n        }\n        if (filteredOptions.length === 0 && emptyValue) {\n          setHover({ item: \"addNew\", by: \"keyboard\" });\n        }\n        return filteredOptions;\n      }\n    },\n    [emptyValue]\n  );\n\n  const list = useMemo(\n    () => filterOptions(sortedList, filter),\n    [filter, filterOptions, sortedList]\n  );\n\n  const showDefaultOption = useMemo(\n    () => !!defaultValue && !filter,\n    [defaultValue, filter]\n  );\n\n  const flatOptions = useMemo(() => {\n    const options = list.reduce(\n      (\n        acc: (IOptionItemProps | IOptionGroupProps | [])[],\n        option: IOptionItemProps | IOptionGroupProps\n      ) => {\n        if (!isOptionGroup(option)) {\n          return [...acc, option];\n        }\n        return [...acc, ...option.options];\n      },\n      []\n    );\n    return filterOptions(options, filter);\n  }, [filter, filterOptions, list]);\n\n  const handleInputChange = useCallback((e) => {\n    if (\n      e.target &&\n      !(e.key === \"ArrowDown\") &&\n      !(e.key === \"ArrowUp\") &&\n      !(e.key === \"Enter\")\n    ) {\n      setFilter(e.target.value);\n    }\n  }, []);\n\n  const handleHoverCallback = useCallback(\n    (e: number | string | undefined): void => {\n      setHover({ item: e, by: \"mouse\" });\n    },\n    []\n  );\n\n  const toggleSelected = useCallback(\n    (id) => {\n      let result;\n\n      if (id !== null) {\n        if (type === \"multiple\") {\n          if (selectedOptions.includes(id)) {\n            result = selectedOptions.filter((_id) => _id !== id);\n          } else {\n            result = [...selectedOptions, id];\n          }\n        } else {\n          if (selectedOptions.includes(id)) {\n            result = null;\n          } else {\n            result = id;\n          }\n        }\n        setFilter(\"\");\n      } else {\n        if (typeof handleDefaultOptionChange === \"function\") {\n          handleDefaultOptionChange();\n          return;\n        }\n      }\n\n      if (typeof handleChange === \"function\") {\n        handleChange(result);\n      }\n    },\n    [handleChange, handleDefaultOptionChange, selectedOptions, type]\n  );\n\n  const handleMouseEnter = useCallback((e) => {\n    if (e === undefined || e === null) {\n      return setHover({ item: null, by: \"mouse\" });\n    }\n    setHover({ item: e, by: \"mouse\" });\n  }, []);\n\n  const handleClick = useCallback(\n    (e) => {\n      e.preventDefault();\n      toggleSelected(hover.item);\n    },\n    [toggleSelected, hover]\n  );\n\n  const handleRenderOption = useCallback(\n    (item: IOptionItemProps | IOptionGroupProps, index) => {\n      if (isOptionGroup(item)) {\n        return (\n          <OptionGroup\n            checked={selectedOptions}\n            name={item.name}\n            key={item.id}\n            setHover={handleHoverCallback}\n            id={item.id}\n            hover={hover.item}\n            options={item.options}\n            renderOptions={handleRenderOption}\n            type={type}\n            onChange={handleChange}\n            filter={filter}\n          />\n        );\n      }\n      return (\n        <Option\n          name={item.name}\n          ref={itemRef}\n          key={index}\n          onMouseEnter={handleMouseEnter}\n          onClick={handleClick}\n          id={item.id}\n          hover={item.id === hover.item}\n          className={optionClassName}\n          renderOption={renderOption(\n            { ...item, name: highlightText(item.name, filter) },\n            {\n              id: `option_${item.id}`,\n              checked: selectedOptions && selectedOptions.includes(item.id),\n              hover: hover.item === item.id,\n              onChange: () => null,\n            }\n          )}\n        />\n      );\n    },\n    [\n      handleClick,\n      handleMouseEnter,\n      hover.item,\n      optionClassName,\n      renderOption,\n      filter,\n      selectedOptions,\n      handleHoverCallback,\n      type,\n      handleChange,\n    ]\n  );\n\n  const handleOnMouseLeave = useCallback(() => {\n    setHover({ item: undefined, by: \"mouse\" });\n  }, []);\n\n  const handleScroll = useCallback((list: Scrollbars, itemOffset: number) => {\n    if (list.getClientHeight() + list.getScrollTop() < itemOffset + 40) {\n      return list.scrollTop(itemOffset - list.getClientHeight() + 30);\n    }\n    if (list.getScrollTop() > itemOffset) {\n      return list.scrollTop(itemOffset);\n    }\n  }, []);\n\n  useEffect(() => {\n    if (hover.by === \"keyboard\" && hover.item !== undefined) {\n      const item: HTMLLIElement | null = itemRef.current;\n      const list = listRef.current;\n      if (itemRef && item && list) {\n        handleScroll(list, item.offsetTop);\n      }\n    }\n  }, [handleScroll, hover]);\n\n  const handleOnKeyDown = useCallback(\n    (e) => {\n      if (e.key === \"Enter\") {\n        e.preventDefault();\n\n        if (hover.item === undefined && filter === \"\") {\n          return;\n        }\n        if (hover.item === \"addNew\") {\n          handleEmpty(null);\n          return;\n        }\n        if (hover.item === null && handleDefaultOptionChange) {\n          handleDefaultOptionChange();\n          return;\n        }\n\n        if (hover.item) {\n          toggleSelected(hover.item);\n          setFilter(\"\");\n        }\n        return;\n      }\n      setHover({\n        item: handleKeyboardMovement(\n          e,\n          hover.item,\n          flatOptions,\n          showAddNew,\n          showDefaultOption\n        ),\n        by: \"keyboard\",\n      });\n    },\n    [\n      filter,\n      flatOptions,\n      toggleSelected,\n      handleDefaultOptionChange,\n      handleEmpty,\n      hover,\n      showAddNew,\n      showDefaultOption,\n    ]\n  );\n\n  useEffect(() => {\n    if (inputEl) {\n      inputEl.onkeydown = handleOnKeyDown;\n      inputEl.onkeyup = handleInputChange;\n    }\n  }, [handleInputChange, handleOnKeyDown, inputEl]);\n\n  const isDefaultOptionSelected = useCallback(() => {\n    if (preselectDefaultValue) {\n      return selectedOptions.length < 1 || selectedOptions[0] === \"\";\n    } else {\n      return (\n        selectedOptions[0] === null ||\n        selectedOptions.length === flatOptions.length\n      );\n    }\n  }, [flatOptions.length, preselectDefaultValue, selectedOptions]);\n\n  const showNoResult = useMemo(\n    () => noResultText && !showAddNew && list.length < 1,\n    [list.length, noResultText, showAddNew]\n  );\n\n  const renderNoResult = useMemo(\n    () => (\n      <StyledAutocompleteNoResult>{noResultText}</StyledAutocompleteNoResult>\n    ),\n    [noResultText]\n  );\n\n  return (\n    <StyledAutocompleteScrollShadow\n      className={AutocompleteClassName}\n      $isHidden={\n        !defaultValue && !emptyValue && !noResultText && list.length < 1\n      }\n    >\n      {({ onScroll }): JSX.Element => (\n        <StyledAutocompleteBody key=\"body\" onMouseLeave={handleOnMouseLeave}>\n          <Scrollbars\n            ref={listRef}\n            key=\"scrollBar\"\n            autoHeight\n            autoHeightMax={autoHeightMax}\n            onScroll={onScroll}\n          >\n            {defaultValue && !filter && (\n              <Option\n                name={defaultValue}\n                ref={itemRef}\n                hover={hover.item === null}\n                onMouseEnter={handleMouseEnter}\n                onClick={(e) => {\n                  e.preventDefault();\n                  toggleSelected(null);\n                }}\n                renderOption={renderOption(\n                  { name: defaultValue, id: null },\n                  {\n                    checked: isDefaultOptionSelected(),\n                    hover: hover.item === null,\n                    onChange: () => null,\n                  }\n                )}\n              />\n            )}\n            {list.map((item: IOptionItemProps, index) =>\n              handleRenderOption(item, index)\n            )}\n            {showNoResult && renderNoResult}\n            {showAddNew && renderAddNew}\n          </Scrollbars>\n        </StyledAutocompleteBody>\n      )}\n    </StyledAutocompleteScrollShadow>\n  );\n};\n\nAutocomplete.displayName = \"Autocomplete\";\n"],"file":"Autocomplete.js"}

package/dist/esm/components/Chip/Chip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Chip.d.ts","sourceRoot":"","sources":["../../../../src/components/Chip/Chip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAW,MAAM,OAAO,CAAC;AAElD,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAG3C,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACrD,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED,eAAO,MAAM,IAAI,mPA0Bf,CAAC"}
+{"version":3,"file":"Chip.d.ts","sourceRoot":"","sources":["../../../../src/components/Chip/Chip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAW,MAAM,OAAO,CAAC;AAElD,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAG3C,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACrD,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED,eAAO,MAAM,IAAI,mPA4Bf,CAAC"}

package/dist/esm/components/Chip/Chip.js

@@ -30,10 +30,12 @@ export var Chip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     $size: size,
     $showClose: showClose
   }), leftAdornment, /*#__PURE__*/React.createElement(Typography, {
-    variant: variant
+    variant: variant,
+    className: "tw-flex-1 tw-truncate"
   }, label), showClose ? /*#__PURE__*/React.createElement(ChipTrigger, {
     $size: size,
-    onClick: onClose
+    onClick: onClose,
+    className: "tw-ml-0.5"
   }, /*#__PURE__*/React.createElement(ChipCloseIcon, {
     fill: "currentColor"
   })) : null);

package/dist/esm/components/Chip/Chip.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Chip/Chip.tsx"],"names":["React","useMemo","ChipCloseIcon","ChipContainer","ChipTrigger","Typography","Chip","forwardRef","ref","leftAdornment","label","onClose","size","rest","showClose","variant","displayName"],"mappings":";;;AAAA,OAAOA,KAAP,IAA2BC,OAA3B,QAA0C,OAA1C;AACA,SAASC,aAAT,EAAwBC,aAAxB,EAAuCC,WAAvC,QAA0D,UAA1D;AAEA,SAASC,UAAT,QAA2B,0BAA3B;AASA,OAAO,IAAMC,IAAI,gBAAGN,KAAK,CAACO,UAAN,CAGlB,gBAA+DC,GAA/D,EAAuE;AAAA,MAApEC,aAAoE,QAApEA,aAAoE;AAAA,MAArDC,KAAqD,QAArDA,KAAqD;AAAA,MAA9CC,OAA8C,QAA9CA,OAA8C;AAAA,uBAArCC,IAAqC;AAAA,MAArCA,IAAqC,0BAA9B,SAA8B;AAAA,MAAhBC,IAAgB;;AACvE,MAAMC,SAAS,GAAG,OAAOH,OAAP,KAAmB,UAArC;AACA,MAAMI,OAAO,GAAGd,OAAO,CAAC,YAAM;AAC5B,YAAQW,IAAR;AACE,WAAK,SAAL;AACE,eAAO,QAAP;;AACF,WAAK,KAAL;AACE,eAAO,QAAP;;AACF;AACE,eAAO,WAAP;AANJ;AAQD,GATsB,EASpB,CAACA,IAAD,CAToB,CAAvB;AAUA,sBACE,oBAAC,aAAD,eAAmBC,IAAnB;AAAyB,IAAA,GAAG,EAAEL,GAA9B;AAAmC,IAAA,KAAK,EAAEI,IAA1C;AAAgD,IAAA,UAAU,EAAEE;AAA5D,MACGL,aADH,eAEE,oBAAC,UAAD;AAAY,IAAA,OAAO,EAAEM;AAArB,KAA+BL,KAA/B,CAFF,EAGGI,SAAS,gBACR,oBAAC,WAAD;AAAa,IAAA,KAAK,EAAEF,IAApB;AAA0B,IAAA,OAAO,EAAED;AAAnC,kBACE,oBAAC,aAAD;AAAe,IAAA,IAAI,EAAC;AAApB,IADF,CADQ,GAIN,IAPN,CADF;AAWD,CA1BmB,CAAb;AA4BPL,IAAI,CAACU,WAAL,GAAmB,MAAnB","sourcesContent":["import React, { ReactNode, useMemo } from \"react\";\nimport { ChipCloseIcon, ChipContainer, ChipTrigger } from \"./Styles\";\nimport { InputSize } from \"../Input/types\";\nimport { Typography } from \"../Typography/Typography\";\n\nexport interface ChipProps {\n  label: string;\n  onClose?: React.MouseEventHandler<HTMLButtonElement>;\n  leftAdornment?: ReactNode;\n  size?: InputSize;\n}\n\nexport const Chip = React.forwardRef<\n  HTMLDivElement,\n  ChipProps & Omit<React.ComponentPropsWithoutRef<\"div\">, keyof ChipProps>\n>(({ leftAdornment, label, onClose, size = \"regular\", ...rest }, ref) => {\n  const showClose = typeof onClose === \"function\";\n  const variant = useMemo(() => {\n    switch (size) {\n      case \"regular\":\n        return \"Body 2\";\n      case \"big\":\n        return \"Body 1\";\n      default:\n        return \"Caption 1\";\n    }\n  }, [size]);\n  return (\n    <ChipContainer {...rest} ref={ref} $size={size} $showClose={showClose}>\n      {leftAdornment}\n      <Typography variant={variant}>{label}</Typography>\n      {showClose ? (\n        <ChipTrigger $size={size} onClick={onClose}>\n          <ChipCloseIcon fill=\"currentColor\" />\n        </ChipTrigger>\n      ) : null}\n    </ChipContainer>\n  );\n});\n\nChip.displayName = \"Chip\";\n"],"file":"Chip.js"}
+{"version":3,"sources":["../../../../src/components/Chip/Chip.tsx"],"names":["React","useMemo","ChipCloseIcon","ChipContainer","ChipTrigger","Typography","Chip","forwardRef","ref","leftAdornment","label","onClose","size","rest","showClose","variant","displayName"],"mappings":";;;AAAA,OAAOA,KAAP,IAA2BC,OAA3B,QAA0C,OAA1C;AACA,SAASC,aAAT,EAAwBC,aAAxB,EAAuCC,WAAvC,QAA0D,UAA1D;AAEA,SAASC,UAAT,QAA2B,0BAA3B;AASA,OAAO,IAAMC,IAAI,gBAAGN,KAAK,CAACO,UAAN,CAGlB,gBAA+DC,GAA/D,EAAuE;AAAA,MAApEC,aAAoE,QAApEA,aAAoE;AAAA,MAArDC,KAAqD,QAArDA,KAAqD;AAAA,MAA9CC,OAA8C,QAA9CA,OAA8C;AAAA,uBAArCC,IAAqC;AAAA,MAArCA,IAAqC,0BAA9B,SAA8B;AAAA,MAAhBC,IAAgB;;AACvE,MAAMC,SAAS,GAAG,OAAOH,OAAP,KAAmB,UAArC;AACA,MAAMI,OAAO,GAAGd,OAAO,CAAC,YAAM;AAC5B,YAAQW,IAAR;AACE,WAAK,SAAL;AACE,eAAO,QAAP;;AACF,WAAK,KAAL;AACE,eAAO,QAAP;;AACF;AACE,eAAO,WAAP;AANJ;AAQD,GATsB,EASpB,CAACA,IAAD,CAToB,CAAvB;AAUA,sBACE,oBAAC,aAAD,eAAmBC,IAAnB;AAAyB,IAAA,GAAG,EAAEL,GAA9B;AAAmC,IAAA,KAAK,EAAEI,IAA1C;AAAgD,IAAA,UAAU,EAAEE;AAA5D,MACGL,aADH,eAEE,oBAAC,UAAD;AAAY,IAAA,OAAO,EAAEM,OAArB;AAA8B,IAAA,SAAS,EAAE;AAAzC,KACGL,KADH,CAFF,EAKGI,SAAS,gBACR,oBAAC,WAAD;AAAa,IAAA,KAAK,EAAEF,IAApB;AAA0B,IAAA,OAAO,EAAED,OAAnC;AAA4C,IAAA,SAAS,EAAE;AAAvD,kBACE,oBAAC,aAAD;AAAe,IAAA,IAAI,EAAC;AAApB,IADF,CADQ,GAIN,IATN,CADF;AAaD,CA5BmB,CAAb;AA8BPL,IAAI,CAACU,WAAL,GAAmB,MAAnB","sourcesContent":["import React, { ReactNode, useMemo } from \"react\";\nimport { ChipCloseIcon, ChipContainer, ChipTrigger } from \"./Styles\";\nimport { InputSize } from \"../Input/types\";\nimport { Typography } from \"../Typography/Typography\";\n\nexport interface ChipProps {\n  label: string;\n  onClose?: React.MouseEventHandler<HTMLButtonElement>;\n  leftAdornment?: ReactNode;\n  size?: InputSize;\n}\n\nexport const Chip = React.forwardRef<\n  HTMLDivElement,\n  ChipProps & Omit<React.ComponentPropsWithoutRef<\"div\">, keyof ChipProps>\n>(({ leftAdornment, label, onClose, size = \"regular\", ...rest }, ref) => {\n  const showClose = typeof onClose === \"function\";\n  const variant = useMemo(() => {\n    switch (size) {\n      case \"regular\":\n        return \"Body 2\";\n      case \"big\":\n        return \"Body 1\";\n      default:\n        return \"Caption 1\";\n    }\n  }, [size]);\n  return (\n    <ChipContainer {...rest} ref={ref} $size={size} $showClose={showClose}>\n      {leftAdornment}\n      <Typography variant={variant} className={\"tw-flex-1 tw-truncate\"}>\n        {label}\n      </Typography>\n      {showClose ? (\n        <ChipTrigger $size={size} onClick={onClose} className={\"tw-ml-0.5\"}>\n          <ChipCloseIcon fill=\"currentColor\" />\n        </ChipTrigger>\n      ) : null}\n    </ChipContainer>\n  );\n});\n\nChip.displayName = \"Chip\";\n"],"file":"Chip.js"}

package/dist/esm/components/Chip/Styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Chip/Styles.ts"],"names":[],"mappings":";AAOA,eAAO,MAAM,aAAa;;;SAoDzB,CAAC;AAIF,eAAO,MAAM,SAAS,qEAGrB,CAAC;AAIF,eAAO,MAAM,WAAW;;SA6BvB,CAAC;AAIF,eAAO,MAAM,aAAa,wqPAEzB,CAAC"}
+{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Chip/Styles.ts"],"names":[],"mappings":";AAOA,eAAO,MAAM,aAAa;;;SAkDzB,CAAC;AAIF,eAAO,MAAM,SAAS,qEAGrB,CAAC;AAIF,eAAO,MAAM,WAAW;;SA6BvB,CAAC;AAIF,eAAO,MAAM,aAAa,wqPAEzB,CAAC"}

package/dist/esm/components/Chip/Styles.js

@@ -6,18 +6,14 @@ import { FontStyle } from "../FontStyle";
 export var ChipContainer = styled.div.withConfig({
   displayName: "Styles__ChipContainer",
   componentId: "sc-7s0bd1-0"
-})(["min-width:80px;max-width:220px;", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", ""], {
+})(["min-width:44px;max-width:220px;", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", ""], {
   "height": "1.5rem"
 }, {
   "borderRadius": "0.25rem"
 }, {
-  "display": "inline-flex"
+  "display": "flex"
 }, {
   "alignItems": "center"
-}, {
-  "justifyContent": "center"
-}, {
-  "gap": "0.25rem"
 }, {
   "paddingLeft": "0.375rem"
 }, {

package/dist/esm/components/Chip/Styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Chip/Styles.ts"],"names":["styled","css","CloseSmallIcon","BoxSizingStyle","Trigger","FontStyle","ChipContainer","div","props","$showClose","$size","displayName","ChipLabel","span","ChipTrigger","ChipCloseIcon"],"mappings":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AAEA,SAASC,cAAT,QAA+B,UAA/B;AACA,SAASC,cAAT,QAA+B,mBAA/B;AACA,SAASC,OAAT,QAAwB,YAAxB;AACA,SAASC,SAAT,QAA0B,cAA1B;AAEA,OAAO,IAAMC,aAAa,GAAGN,MAAM,CAACO,GAAV;AAAA;AAAA;AAAA,2IAMpB;AAAA;AAAA,CANoB,EAOpB;AAAA;AAAA,CAPoB,EAQpB;AAAA;AAAA,CARoB,EASpB;AAAA;AAAA,CAToB,EAUpB;AAAA;AAAA,CAVoB,EAWpB;AAAA;AAAA,CAXoB,EAYpB;AAAA;AAAA,CAZoB,EAapB;AAAA;AAAA,CAboB,EAetBF,SAfsB,EAgBtBF,cAhBsB,EAmBpB;AAAA;AAAA,CAnBoB,EAoBpB;AAAA;AAAA,CApBoB,EAqBpB;AAAA;AAAA,CArBoB,EAsBpB;AAAA;AAAA,CAtBoB,EAuBpB;AAAA;AAAA,CAvBoB,EA0BpB;AAAA;AAAA,CA1BoB,EA4BtB,UAACK,KAAD;AAAA,SACAA,KAAK,CAACC,UAAN,GACI,IADJ,GAEIR,GAFJ,WAGU;AAAA;AAAA,GAHV,CADA;AAAA,CA5BsB,EAmCtB,UAACO,KAAD;AAAA,SACAA,KAAK,CAACE,KAAN,KAAgB,SAAhB,IACAT,GADA,kBADA;AAAA,CAnCsB,EAyCtB,UAACO,KAAD;AAAA,SACAA,KAAK,CAACE,KAAN,KAAgB,OAAhB,IACAT,GADA,kBADA;AAAA,CAzCsB,EA+CtB,UAACO,KAAD;AAAA,SACAA,KAAK,CAACE,KAAN,KAAgB,KAAhB,IACAT,GADA,kBADA;AAAA,CA/CsB,CAAnB;AAsDPK,aAAa,CAACK,WAAd,GAA4B,eAA5B;AAEA,OAAO,IAAMC,SAAS,GAAGZ,MAAM,CAACa,IAAV;AAAA;AAAA;AAAA,kBAChB;AAAA;AAAA,CADgB,EAEhB;AAAA;AAAA;AAAA;AAAA,CAFgB,CAAf;AAKPD,SAAS,CAACD,WAAV,GAAwB,WAAxB;AAEA,OAAO,IAAMG,WAAW,GAAGd,MAAM,CAACI,OAAD,CAAT;AAAA;AAAA;AAAA,mDAClB;AAAA;AAAA,CADkB,EAElB;AAAA;AAAA,CAFkB,EAGlB;AAAA;AAAA,CAHkB,EAMhB;AAAA;AAAA,CANgB,EASpB,UAACI,KAAD;AAAA,SACAA,KAAK,CAACE,KAAN,KAAgB,SAAhB,IACAT,GADA,6BADA;AAAA,CAToB,EAgBpB,UAACO,KAAD;AAAA,SACAA,KAAK,CAACE,KAAN,KAAgB,OAAhB,IACAT,GADA,6BADA;AAAA,CAhBoB,EAuBpB,UAACO,KAAD;AAAA,SACAA,KAAK,CAACE,KAAN,KAAgB,KAAhB,IACAT,GADA,6BADA;AAAA,CAvBoB,CAAjB;AA+BPa,WAAW,CAACH,WAAZ,GAA0B,aAA1B;AAEA,OAAO,IAAMI,aAAa,GAAGf,MAAM,CAACE,cAAD,CAAT;AAAA;AAAA;AAAA,aACpB;AAAA;AAAA,CADoB,CAAnB;AAIPa,aAAa,CAACJ,WAAd,GAA4B,eAA5B","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { CloseSmallIcon } from \"../Icons\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { Trigger } from \"../Trigger\";\nimport { FontStyle } from \"../FontStyle\";\n\nexport const ChipContainer = styled.div<{\n  $showClose?: boolean;\n  $size?: string;\n}>`\n  min-width: 80px;\n  max-width: 220px;\n  ${tw`tw-h-6`}\n  ${tw`tw-rounded`}\n  ${tw`tw-inline-flex`}\n  ${tw`tw-items-center`}\n  ${tw`tw-justify-center`}\n  ${tw`tw-gap-1`}\n  ${tw`tw-pl-1.5`}\n  ${tw`tw-overflow-hidden`}\n\n  ${FontStyle}\n  ${BoxSizingStyle}\n\n  // font\n  ${tw`tw-text-body-2`}\n  ${tw`tw-text-theme-900`}\n  ${tw`tw-leading-regular`}\n  ${tw`tw-tracking-regular`}\n  ${tw`tw-font-regular`}\n\n  // background\n  ${tw`tw-bg-theme-400`}\n\n  ${(props) =>\n    props.$showClose\n      ? null\n      : css`\n          ${tw`tw-pr-1.5`}\n        `}\n\n  ${(props) =>\n    props.$size === \"regular\" &&\n    css`\n      height: 24px;\n    `}\n\n  ${(props) =>\n    props.$size === \"small\" &&\n    css`\n      height: 18px;\n    `}\n\n  ${(props) =>\n    props.$size === \"big\" &&\n    css`\n      height: 30px;\n    `}\n`;\n\nChipContainer.displayName = \"ChipContainer\";\n\nexport const ChipLabel = styled.span`\n  ${tw`tw-w-full`}\n  ${tw`tw-truncate`}\n`;\n\nChipLabel.displayName = \"ChipLabel\";\n\nexport const ChipTrigger = styled(Trigger)<{ $size?: string }>`\n  ${tw`tw-flex`}\n  ${tw`tw-items-center`}\n  ${tw`tw-justify-center`}\n\n  &:hover {\n    ${tw`tw-bg-theme-transparent-400`}\n  }\n\n  ${(props) =>\n    props.$size === \"regular\" &&\n    css`\n      height: 24px;\n      width: 24px;\n    `}\n\n  ${(props) =>\n    props.$size === \"small\" &&\n    css`\n      height: 18px;\n      width: 18px;\n    `}\n\n  ${(props) =>\n    props.$size === \"big\" &&\n    css`\n      height: 30px;\n      width: 30px;\n    `}\n`;\n\nChipTrigger.displayName = \"ChipTrigger\";\n\nexport const ChipCloseIcon = styled(CloseSmallIcon)`\n  ${tw`tw-text-theme-700`}\n`;\n\nChipCloseIcon.displayName = \"ChipCloseIcon\";\n"],"file":"Styles.js"}
+{"version":3,"sources":["../../../../src/components/Chip/Styles.ts"],"names":["styled","css","CloseSmallIcon","BoxSizingStyle","Trigger","FontStyle","ChipContainer","div","props","$showClose","$size","displayName","ChipLabel","span","ChipTrigger","ChipCloseIcon"],"mappings":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AAEA,SAASC,cAAT,QAA+B,UAA/B;AACA,SAASC,cAAT,QAA+B,mBAA/B;AACA,SAASC,OAAT,QAAwB,YAAxB;AACA,SAASC,SAAT,QAA0B,cAA1B;AAEA,OAAO,IAAMC,aAAa,GAAGN,MAAM,CAACO,GAAV;AAAA;AAAA;AAAA,iIAMpB;AAAA;AAAA,CANoB,EAOpB;AAAA;AAAA,CAPoB,EAQpB;AAAA;AAAA,CARoB,EASpB;AAAA;AAAA,CAToB,EAUpB;AAAA;AAAA,CAVoB,EAWpB;AAAA;AAAA,CAXoB,EAatBF,SAbsB,EActBF,cAdsB,EAiBpB;AAAA;AAAA,CAjBoB,EAkBpB;AAAA;AAAA,CAlBoB,EAmBpB;AAAA;AAAA,CAnBoB,EAoBpB;AAAA;AAAA,CApBoB,EAqBpB;AAAA;AAAA,CArBoB,EAwBpB;AAAA;AAAA,CAxBoB,EA0BtB,UAACK,KAAD;AAAA,SACAA,KAAK,CAACC,UAAN,GACI,IADJ,GAEIR,GAFJ,WAGU;AAAA;AAAA,GAHV,CADA;AAAA,CA1BsB,EAiCtB,UAACO,KAAD;AAAA,SACAA,KAAK,CAACE,KAAN,KAAgB,SAAhB,IACAT,GADA,kBADA;AAAA,CAjCsB,EAuCtB,UAACO,KAAD;AAAA,SACAA,KAAK,CAACE,KAAN,KAAgB,OAAhB,IACAT,GADA,kBADA;AAAA,CAvCsB,EA6CtB,UAACO,KAAD;AAAA,SACAA,KAAK,CAACE,KAAN,KAAgB,KAAhB,IACAT,GADA,kBADA;AAAA,CA7CsB,CAAnB;AAoDPK,aAAa,CAACK,WAAd,GAA4B,eAA5B;AAEA,OAAO,IAAMC,SAAS,GAAGZ,MAAM,CAACa,IAAV;AAAA;AAAA;AAAA,kBAChB;AAAA;AAAA,CADgB,EAEhB;AAAA;AAAA;AAAA;AAAA,CAFgB,CAAf;AAKPD,SAAS,CAACD,WAAV,GAAwB,WAAxB;AAEA,OAAO,IAAMG,WAAW,GAAGd,MAAM,CAACI,OAAD,CAAT;AAAA;AAAA;AAAA,mDAClB;AAAA;AAAA,CADkB,EAElB;AAAA;AAAA,CAFkB,EAGlB;AAAA;AAAA,CAHkB,EAMhB;AAAA;AAAA,CANgB,EASpB,UAACI,KAAD;AAAA,SACAA,KAAK,CAACE,KAAN,KAAgB,SAAhB,IACAT,GADA,6BADA;AAAA,CAToB,EAgBpB,UAACO,KAAD;AAAA,SACAA,KAAK,CAACE,KAAN,KAAgB,OAAhB,IACAT,GADA,6BADA;AAAA,CAhBoB,EAuBpB,UAACO,KAAD;AAAA,SACAA,KAAK,CAACE,KAAN,KAAgB,KAAhB,IACAT,GADA,6BADA;AAAA,CAvBoB,CAAjB;AA+BPa,WAAW,CAACH,WAAZ,GAA0B,aAA1B;AAEA,OAAO,IAAMI,aAAa,GAAGf,MAAM,CAACE,cAAD,CAAT;AAAA;AAAA;AAAA,aACpB;AAAA;AAAA,CADoB,CAAnB;AAIPa,aAAa,CAACJ,WAAd,GAA4B,eAA5B","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { CloseSmallIcon } from \"../Icons\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { Trigger } from \"../Trigger\";\nimport { FontStyle } from \"../FontStyle\";\n\nexport const ChipContainer = styled.div<{\n  $showClose?: boolean;\n  $size?: string;\n}>`\n  min-width: 44px;\n  max-width: 220px;\n  ${tw`tw-h-6`}\n  ${tw`tw-rounded`}\n  ${tw`tw-flex`}\n  ${tw`tw-items-center`}\n  ${tw`tw-pl-1.5`}\n  ${tw`tw-overflow-hidden`}\n\n  ${FontStyle}\n  ${BoxSizingStyle}\n\n  // font\n  ${tw`tw-text-body-2`}\n  ${tw`tw-text-theme-900`}\n  ${tw`tw-leading-regular`}\n  ${tw`tw-tracking-regular`}\n  ${tw`tw-font-regular`}\n\n  // background\n  ${tw`tw-bg-theme-400`}\n\n  ${(props) =>\n    props.$showClose\n      ? null\n      : css`\n          ${tw`tw-pr-1.5`}\n        `}\n\n  ${(props) =>\n    props.$size === \"regular\" &&\n    css`\n      height: 24px;\n    `}\n\n  ${(props) =>\n    props.$size === \"small\" &&\n    css`\n      height: 18px;\n    `}\n\n  ${(props) =>\n    props.$size === \"big\" &&\n    css`\n      height: 30px;\n    `}\n`;\n\nChipContainer.displayName = \"ChipContainer\";\n\nexport const ChipLabel = styled.span`\n  ${tw`tw-w-full`}\n  ${tw`tw-truncate`}\n`;\n\nChipLabel.displayName = \"ChipLabel\";\n\nexport const ChipTrigger = styled(Trigger)<{ $size?: string }>`\n  ${tw`tw-flex`}\n  ${tw`tw-items-center`}\n  ${tw`tw-justify-center`}\n\n  &:hover {\n    ${tw`tw-bg-theme-transparent-400`}\n  }\n\n  ${(props) =>\n    props.$size === \"regular\" &&\n    css`\n      height: 24px;\n      width: 24px;\n    `}\n\n  ${(props) =>\n    props.$size === \"small\" &&\n    css`\n      height: 18px;\n      width: 18px;\n    `}\n\n  ${(props) =>\n    props.$size === \"big\" &&\n    css`\n      height: 30px;\n      width: 30px;\n    `}\n`;\n\nChipTrigger.displayName = \"ChipTrigger\";\n\nexport const ChipCloseIcon = styled(CloseSmallIcon)`\n  ${tw`tw-text-theme-700`}\n`;\n\nChipCloseIcon.displayName = \"ChipCloseIcon\";\n"],"file":"Styles.js"}

package/dist/esm/components/ComboBox/ComboBox.d.ts

@@ -1,15 +1,19 @@
 import { FC } from "react";
 import { IAutocompleteProps } from "../Autocomplete/Autocomplete";
+import { IOptionItemProps } from "../Select";
 import { InputSize } from "../Input/types";
-export interface IComboBoxProps {
-    selected?: string | number;
+export interface IComboBoxProps extends Omit<IAutocompleteProps, "handleChange" | "inputEl"> {
     loading?: boolean;
     loadingText?: string;
-    onChange?: (e: string | number) => void;
+    onChange?: (e: (string | number)[] | string | number | null | undefined) => void;
     placeholder?: string;
     disabled?: boolean;
     size?: InputSize;
     invalid?: boolean;
+    renderChip?: <T extends IOptionItemProps>(item: T, key?: string | number) => JSX.Element;
+    forceCloseMenu?: boolean;
+    limitChips?: number;
+    hiddenNumberText?: (hidden: number) => string;
 }
-export declare const ComboBox: FC<IComboBoxProps & Omit<IAutocompleteProps, keyof IComboBoxProps>>;
+export declare const ComboBox: FC<IComboBoxProps>;
 //# sourceMappingURL=ComboBox.d.ts.map

package/dist/esm/components/ComboBox/ComboBox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ComboBox.d.ts","sourceRoot":"","sources":["../../../../src/components/ComboBox/ComboBox.tsx"],"names":[],"mappings":"AAAA,OAAc,EACZ,EAAE,EAMH,MAAM,OAAO,CAAC;AAIf,OAAO,EAAE,kBAAkB,EAAE,MAAM,8BAA8B,CAAC;AAalE,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAG3C,MAAM,WAAW,cAAc;IAE7B,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAExC,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,QAAQ,EAAE,EAAE,CACvB,cAAc,GAAG,IAAI,CAAC,kBAAkB,EAAE,MAAM,cAAc,CAAC,CAiMhE,CAAC"}
+{"version":3,"file":"ComboBox.d.ts","sourceRoot":"","sources":["../../../../src/components/ComboBox/ComboBox.tsx"],"names":[],"mappings":"AAAA,OAAc,EACZ,EAAE,EAOH,MAAM,OAAO,CAAC;AAIf,OAAO,EACL,kBAAkB,EAEnB,MAAM,8BAA8B,CAAC;AAGtC,OAAO,EAAqB,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAUhE,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAW3C,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,kBAAkB,EAAE,cAAc,GAAG,SAAS,CAAC;IAE5D,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,QAAQ,CAAC,EAAE,CACT,CAAC,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,GAAG,MAAM,GAAG,MAAM,GAAG,IAAI,GAAG,SAAS,KACxD,IAAI,CAAC;IAEV,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,UAAU,CAAC,EAAE,CAAC,CAAC,SAAS,gBAAgB,EACtC,IAAI,EAAE,CAAC,EACP,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,KAClB,GAAG,CAAC,OAAO,CAAC;IAEjB,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,MAAM,CAAC;CAC/C;AAED,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,cAAc,CAoavC,CAAC"}

package/dist/esm/components/ComboBox/ComboBox.js

@@ -1,10 +1,11 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-var _excluded = ["options", "selected", "loading", "loadingText", "onChange", "placeholder", "handleEmptyAction", "disabled", "size", "invalid"];
-import React, { useCallback, useState, useEffect, useRef, useMemo } from "react";
+var _excluded = ["options", "selected", "loading", "loadingText", "onChange", "placeholder", "handleEmptyAction", "disabled", "size", "invalid", "type", "renderChip", "forceCloseMenu", "renderOption", "limitChips", "hiddenNumberText"];
+import React, { useCallback, useState, useEffect, useRef, useMemo, Fragment } from "react";
 import { RadioButton } from "../RadioButton";
 import { Autocomplete } from "../Autocomplete";
 import { Button } from "../Button/Button";
+import { isOptionGroup } from "../Autocomplete/Autocomplete";
 import useForkRef from "../../utils/useForkRef";
 import { Popper } from "../Popper";
 import { RemoveScroll } from "react-remove-scroll";
@@ -12,6 +13,14 @@ import { SpinnerLoader } from "../Loaders/Spinner/SpinnerLoader";
 import { OptionContent } from "../Select/OptionContent/OptionContent";
 import { StyledComboBoxCloseSmallIcon, StyledComboBoxCollapseExpandSingleIcon, StyledComboBoxInput, StyledComboBoxList } from "./Styles";
 import { InputAdornment } from "../Input/InputAdornment";
+import { Checkbox } from "../Checkbox";
+import { Chip } from "../Chip";
+import { StyledInputWrapper, StyledInput } from "../Input/Styles";
+import classNames from "classnames";
+import { Typography } from "../Typography/Typography";
+import { Trigger } from "../Trigger";
+import { useOnClickOutside } from "../../hooks/useOnClickOutside";
+import { Avatar } from "../Avatar";
 export var ComboBox = function ComboBox(_ref) {
   var _comboBoxRef$current;
 
@@ -30,9 +39,17 @@ export var ComboBox = function ComboBox(_ref) {
       size = _ref$size === void 0 ? "regular" : _ref$size,
       _ref$invalid = _ref.invalid,
       invalid = _ref$invalid === void 0 ? false : _ref$invalid,
+      _ref$type = _ref.type,
+      type = _ref$type === void 0 ? "single" : _ref$type,
+      renderChip = _ref.renderChip,
+      _ref$forceCloseMenu = _ref.forceCloseMenu,
+      forceCloseMenu = _ref$forceCloseMenu === void 0 ? type === "single" : _ref$forceCloseMenu,
+      renderOption = _ref.renderOption,
+      _ref$limitChips = _ref.limitChips,
+      limitChips = _ref$limitChips === void 0 ? 2 : _ref$limitChips,
+      hiddenNumberText = _ref.hiddenNumberText,
       prop = _objectWithoutPropertiesLoose(_ref, _excluded);
 
-  var timeoutRef = useRef();
   var selectedName = useMemo(function () {
     var value = "";
 
@@ -72,18 +89,27 @@ export var ComboBox = function ComboBox(_ref) {
 
   var elementRef = useRef(null);
   var handleRef = useForkRef(setChildNode, elementRef);
+  var wrapperRef = useRef(null);
+  var chipWrapper = useRef(null);
 
   var _useState3 = useState(false),
       open = _useState3[0],
       setOpen = _useState3[1];
 
+  useOnClickOutside(wrapperRef, function () {
+    return setOpen(false);
+  });
   var handleOnKeyDown = useCallback(function (e) {
     if (e.key === "Escape" && open) {
       setOpen(false);
       setValue(selectedName);
       e.stopPropagation();
     }
-  }, [open, selectedName]);
+
+    if (e.key === "Enter" && type === "multiple") {
+      setValue("");
+    }
+  }, [open, selectedName, type]);
   useEffect(function () {
     open && (childNode == null ? void 0 : childNode.focus());
     !open && (childNode == null ? void 0 : childNode.blur());
@@ -96,46 +122,191 @@ export var ComboBox = function ComboBox(_ref) {
     setOpen(false);
   }, [handleEmptyAction]);
   var handleChange = useCallback(function (selectedValue) {
-    if (selectedValue) {
-      onChange == null ? void 0 : onChange(selectedValue);
+    onChange == null ? void 0 : onChange(selectedValue);
+
+    if (forceCloseMenu) {
       setOpen(false);
     }
-  }, [onChange]);
+  }, [forceCloseMenu, onChange]);
   var onOpen = useCallback(function () {
     if (!disabled) {
       setOpen(true);
     }
   }, [disabled]);
   var handleRenderOption = useCallback(function (option, props) {
+    if (typeof renderOption === "function") {
+      return renderOption(option, props);
+    }
+
+    if (type === "multiple") {
+      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(OptionContent, {
+        imageUrl: option.image,
+        color: option.color,
+        textColor: option.textColor,
+        name: option.name
+      }), /*#__PURE__*/React.createElement(Checkbox, props));
+    }
+
     return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(OptionContent, {
       imageUrl: option.image,
       color: option.color,
       textColor: option.textColor,
       name: option.name
     }), /*#__PURE__*/React.createElement(RadioButton, props));
-  }, []);
+  }, [type, renderOption]);
   var handleDeselect = useCallback(function (e) {
     e.stopPropagation();
-    onChange == null ? void 0 : onChange("");
+
+    if (type === "multiple") {
+      onChange == null ? void 0 : onChange([]);
+    } else {
+      onChange == null ? void 0 : onChange("");
+    }
+
     setOpen(false);
-  }, [onChange]);
+  }, [type, onChange]);
   var handleMouseDown = useCallback(function (e) {
     e.preventDefault();
   }, []);
   var comboBoxRef = useRef(null);
   var handleBlur = useCallback(function () {
     setValue(selectedName);
-    timeoutRef.current = setTimeout(function () {
-      setOpen(false);
-    }, 200);
   }, [selectedName]);
-  useEffect(function () {
-    return function () {
-      timeoutRef.current && clearTimeout(timeoutRef.current);
+  var renderChipAdornment = useCallback(function (option, index) {
+    if (typeof renderChip === "function") {
+      return renderChip(option, index);
+    }
+
+    var avatarProps = {
+      className: "tw-my-0.5 tw-mr-0.5",
+      size: 18
     };
-  }, []);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(StyledComboBoxInput, {
+
+    switch (size) {
+      case "big":
+        avatarProps.size = 22;
+        break;
+
+      case "small":
+        avatarProps.size = 14;
+        break;
+    }
+
+    var leftAdornment = option.image ? /*#__PURE__*/React.createElement(Avatar, _extends({
+      url: option.image
+    }, avatarProps)) : undefined;
+    return /*#__PURE__*/React.createElement(Chip, {
+      className: "c-combo-box-chip",
+      leftAdornment: leftAdornment,
+      label: option.name,
+      key: index,
+      onClose: !disabled ? function (e) {
+        e.preventDefault();
+        e.stopPropagation();
+
+        if (Array.isArray(selected) && selected.includes(option.id)) {
+          if (typeof onChange === "function") {
+            var newSelected = selected.filter(function (item) {
+              return item !== option.id;
+            });
+            onChange(newSelected);
+          }
+        }
+      } : undefined,
+      size: size
+    });
+  }, [disabled, onChange, renderChip, selected, size]);
+  var autoSize = useMemo(function () {
+    if (type === "multiple" && open && Array.isArray(selected) && selected.length > 1) {
+      return "auto";
+    }
+
+    return size;
+  }, [open, selected, size, type]);
+  var startAdornment = useMemo(function () {
+    if (type === "multiple" && Array.isArray(selected) && selected.length > 0) {
+      var elements = [];
+      var total = 0;
+      options.forEach(function (option, index) {
+        var isGrouped = isOptionGroup(option);
+
+        if (selected.includes(option.id) && !isGrouped) {
+          total = total + 1;
+          elements.push(renderChipAdornment(option, index));
+        } else if (isGrouped) {
+          var groupedOptions = option.options.filter(function (o) {
+            return selected.includes(o.id);
+          });
+          total = total + groupedOptions.length;
+
+          if (groupedOptions.length > 0) {
+            groupedOptions.forEach(function (o, _index) {
+              elements.push(renderChipAdornment(o, index + "_" + _index));
+            });
+          }
+        }
+      });
+      var _hidden = 0;
+
+      if (!open && limitChips > 0 && elements.length > limitChips) {
+        _hidden = elements.splice(limitChips, elements.length - limitChips).length;
+      }
+
+      return /*#__PURE__*/React.createElement(Fragment, null, elements, _hidden > 0 && /*#__PURE__*/React.createElement(Typography, {
+        variant: size === "small" ? "Caption 1" : size === "regular" ? "Body 2" : "Body 1",
+        className: "tw-flex tw-items-center tw-shrink-0",
+        key: "hidden"
+      }, typeof hiddenNumberText === "function" ? hiddenNumberText(_hidden) : "+" + _hidden));
+    }
+
+    return undefined;
+  }, [type, selected, options, open, limitChips, hiddenNumberText, renderChipAdornment, size]);
+  var showXIcon = Array.isArray(selected) && type === "multiple" && selected.length > 0;
+  var hasSelected = type === "multiple" && Array.isArray(selected) && selected.length > 0;
+  return /*#__PURE__*/React.createElement("div", {
     className: "c-combo-box",
+    ref: wrapperRef
+  }, type === "multiple" ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(StyledInputWrapper, {
+    $size: size,
+    $invalid: invalid,
+    className: classNames("tw-flex tw-space-between tw-flex-1", {
+      "tw-h-auto": autoSize === "auto"
+    }),
+    onClick: function onClick() {
+      var _elementRef$current;
+
+      (_elementRef$current = elementRef.current) == null ? void 0 : _elementRef$current.focus();
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classNames("tw-flex tw-gap-1 tw-flex-1", {
+      "tw-flex-wrap tw-w-full": autoSize === "auto",
+      "tw-items-center": autoSize !== "auto",
+      "tw-overflow-hidden": !open
+    }),
+    ref: chipWrapper
+  }, startAdornment, /*#__PURE__*/React.createElement(StyledInput, {
+    className: classNames("tw-flex tw-flex-1 tw-self-center tw-m-0", {
+      "tw-w-full": !selected || Array.isArray(selected) && selected.length === 0,
+      "tw-w-auto": autoSize === "auto"
+    }),
+    onBlur: handleBlur,
+    onFocus: onOpen,
+    ref: handleRef,
+    value: loading && loadingText ? loadingText : value,
+    onKeyDown: handleOnKeyDown,
+    onChange: handleOnChange,
+    placeholder: !hasSelected ? placeholder : undefined,
+    disabled: disabled,
+    $size: size,
+    $loading: loading
+  })), !disabled && /*#__PURE__*/React.createElement(React.Fragment, null, loading ? /*#__PURE__*/React.createElement(SpinnerLoader, null) : /*#__PURE__*/React.createElement(React.Fragment, null, showXIcon && /*#__PURE__*/React.createElement(Trigger, {
+    onMouseDown: handleMouseDown,
+    onClick: handleDeselect,
+    className: "tw-flex tw-justify-content-center",
+    "data-testid": "deselect-all"
+  }, /*#__PURE__*/React.createElement(StyledComboBoxCloseSmallIcon, null)), /*#__PURE__*/React.createElement(StyledComboBoxCollapseExpandSingleIcon, {
+    $open: open
+  }))))) : /*#__PURE__*/React.createElement(StyledComboBoxInput, {
     onBlur: handleBlur,
     onFocus: onOpen,
     wrapRef: comboBoxRef,
@@ -148,6 +319,7 @@ export var ComboBox = function ComboBox(_ref) {
     size: size,
     invalid: invalid,
     $loading: loading,
+    startAdornment: startAdornment,
     endAdornment: !disabled ? /*#__PURE__*/React.createElement(InputAdornment, {
       disablePointerEvents: disabled
     }, loading ? /*#__PURE__*/React.createElement(SpinnerLoader, null) : selected ? /*#__PURE__*/React.createElement(Button, {
@@ -177,7 +349,7 @@ export var ComboBox = function ComboBox(_ref) {
     handleChange: handleChange,
     renderOption: handleRenderOption,
     options: options,
-    type: "single",
+    type: type,
     handleEmptyAction: emptyAction
   }))))) : null);
 };