@bikdotai/bik-component-library 0.0.552-beta.4 → 0.0.552-beta.6

package/dist/cjs/components/dropdown/ChipInput.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../../constants/Theme.js"),t=require("../../assets/icons/chevronDown.svg.js"),r=require("../../assets/icons/cross.svg.js"),l=require("../tag/Tag.js"),i=require("../TypographyStyle.js"),n=require("./Common.styled.js");exports.default=a=>{let{chips:c,onDeleteChip:o,containerStyle:d={},sizeToUse:h="default",isDropdownOpened:j,placeholder:g="Select.."}=a;return e.jsxs(n.ChipInputWrapper,Object.assign({style:Object.assign({},d)},{children:[e.jsxs("div",Object.assign({className:"chips-container"},{children:[c.slice(0,2).map(((s,t)=>e.jsx("div",Object.assign({style:{zIndex:10}},{children:e.jsx(l.Tag,Object.assign({tagText:s.selectedLabel||s.label,TrailingIcon:()=>e.jsx(r.default,{width:12,height:12,style:{cursor:"pointer"},onClick:()=>{o(s)}})},{children:s.selectedLabel||s.label}))}),t))),c.length>2&&e.jsx(i.BodyCaption,Object.assign({color:s.COLORS.content.placeholder},{children:`+${c.length-2} more`})),0===c.length&&e.jsx("div",Object.assign({style:{color:s.COLORS.content.placeholder}},{children:g}))]})),e.jsx("div",{children:e.jsx(t.default,{style:{transform:j?"rotate(180deg)":"rotate(0deg)"},width:"small"===h?20:24,height:"small"===h?20:24,color:s.COLORS.content.primary})})]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../../constants/Theme.js"),t=require("../../assets/icons/chevronDown.svg.js"),r=require("../../assets/icons/cross.svg.js"),l=require("../tag/Tag.js"),i=require("../TypographyStyle.js"),n=require("./Common.styled.js");exports.default=o=>{let{chips:c,onDeleteChip:a,containerStyle:d={},sizeToUse:h="default",isDropdownOpened:j,placeholder:g="Select.."}=o;return e.jsxs(n.ChipInputWrapper,Object.assign({style:Object.assign({},d)},{children:[e.jsxs("div",Object.assign({className:"chips-container"},{children:[c.slice(0,2).map(((s,t)=>e.jsx("div",Object.assign({style:{zIndex:2}},{children:e.jsx(l.Tag,Object.assign({tagText:s.selectedLabel||s.label,TrailingIcon:()=>e.jsx(r.default,{width:12,height:12,style:{cursor:"pointer"},onClick:()=>{a(s),console.log("onDeleteChip",s)}})},{children:s.selectedLabel||s.label}))}),t))),c.length>2&&e.jsx(i.BodyCaption,Object.assign({color:s.COLORS.content.placeholder},{children:`+${c.length-2} more`})),0===c.length&&e.jsx("div",Object.assign({style:{color:s.COLORS.content.placeholder}},{children:g}))]})),e.jsx("div",{children:e.jsx(t.default,{style:{transform:j?"rotate(180deg)":"rotate(0deg)"},width:"small"===h?20:24,height:"small"===h?20:24,color:s.COLORS.content.primary})})]}))};

package/dist/cjs/components/dropdown/OpenedDropdown/components/OpennedDropdown.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("../../../zeroState/ZeroState.js"),r=require("../../../../hooks/useOutside.js"),o=require("../../hooks/useDropdown.js"),s=require("./description/Description.js"),i=require("./menu/FreeFormMenu.js"),l=require("./menu/MenuList.js"),u=require("./menu/SelectAllMenu.js"),c=require("./multiSelect/MultiSelectDropdownBottomBar.js"),a=require("./OpennedDropdown.styled.js"),p=require("./searchbox/SearchBox.js"),d=require("./searchbox/SearchZeroState.js");const h=304,S=290;exports.OpenedDropdown=j=>{let{options:f,isSearchable:x,isMultiSelect:g,width:w,allowFreeForm:b,height:v,onClose:m,onSelect:y,onSearch:O,version:M,skipSorting:q,headerRef:C,hideSelectAll:D,primaryButtonText:L,onInfiniteScroll:F,onMultiSelectClear:k,onDropdownItemClick:A,buttonOptions:B}=j;const{dropdownOptions:I,search:H,searchedString:Z,searchedOptions:R,onApplyHandler:T,selectAllHandler:P,onMultiSelectClear:_,onFreeFormSelect:z,onMultiSelectApply:E,latestDropdownOptionsRef:K,getSelectedOptions:N}=o.useDropdown(M,f,y,q,g,O),[W,G]=t.useState(null!=w?w:S),[J,Q]=t.useState(null),U=t.useRef(null);r.useOutside(U,(()=>{if(Q(null),g&&"2.0"===M){const e=N(K.current);null==m||m(e)}else null==m||m(I)}),[C]);const V=null!=v?v:h,X="number"==typeof V?x&&g?V-96:x&&!g||!x&&g?V-48:V:V;t.useEffect((()=>{const e=null!=w?w:S;if(null===J)G(e);else if("number"==typeof e)G(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));G(t)}}),[J]);const Y=[],$=(Z&&O?R:I).map((e=>{var t,n;if(Z&&!O){if(e.options){const t=Object.assign({},e);return t.options=t.options.filter((e=>{var t;return!!(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(Z.toLowerCase()))&&(Y.push(!Z||e.label===Z),!0)})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(Z.toLowerCase()))||(null===(n=e.searchKey)||void 0===n?void 0:n.toLowerCase().includes(Z.toLowerCase()))?(Y.push(!Z||e.label===Z),e):null}return e})).filter((e=>null!==e)),ee=!!x&&Z&&0===$.length;return e.jsxs(a.OpennedDropdownContainer,Object.assign({version:M,ref:U,style:{width:W}},{children:[e.jsxs("div",Object.assign({style:{width:J?"50%":"100%",display:"flex",flexDirection:"column",background:"white"}},{children:[!!x&&e.jsx(p.SearchBox,{onSearch:H,version:M}),$.length||Z?e.jsxs(a.MenuListContainer,Object.assign({minHeight:V,maxHeight:X},{children:[!!g&&!ee&&!D&&e.jsx(u.SelectAllMenu,{version:M,options:Z&&O?R:I,onSelect:P}),!b&&ee&&e.jsx(d.SearchZeroState,{height:X,searchedString:Z}),b&&(ee||!!Y.length&&Y.every((e=>!1===e)))&&e.jsx(i.FreeFormMenu,{version:M,isMultiSelect:g,onSelect:z,searchedString:Z}),e.jsx(l.MenuList,{onInfiniteScroll:F,onDropdownItemClick:A,version:M,onSelect:T,showDescription:function(e,t){Q(e&&t?{title:e,description:t}:null)},isMultiSelect:g,options:$})]})):e.jsx("div",Object.assign({style:{height:V,display:"flex"}},{children:e.jsx(n.ZeroState,{title:"No results found",subTitle:"Please try again later or contact us at support@bik.ai if you require further assistance."})})),!!g&&!(!$.length&&!Z)&&"2.0"!==M&&e.jsx(c.default,{onClear:()=>{_(),null==k||k()},onApply:E,list:Z&&O?R:I,buttonText:L,buttonOptions:B})]})),!!J&&e.jsx(s.Description,{title:J.title,description:J.description,version:M})]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("../../../zeroState/ZeroState.js"),r=require("../../../../hooks/useOutside.js"),o=require("../../hooks/useDropdown.js"),s=require("./description/Description.js"),i=require("./menu/FreeFormMenu.js"),l=require("./menu/MenuList.js"),u=require("./menu/SelectAllMenu.js"),c=require("./multiSelect/MultiSelectDropdownBottomBar.js"),a=require("./OpennedDropdown.styled.js"),d=require("./searchbox/SearchBox.js"),p=require("./searchbox/SearchZeroState.js");const h=304,S=290;exports.OpenedDropdown=j=>{let{options:f,isSearchable:x,isMultiSelect:g,width:w,allowFreeForm:b,height:v,onClose:m,onSelect:y,onSearch:O,version:M,skipSorting:q,headerRef:C,hideSelectAll:D,primaryButtonText:L,onInfiniteScroll:F,onMultiSelectClear:k,onDropdownItemClick:A,buttonOptions:B,isSearchLoading:I}=j;const{dropdownOptions:H,search:Z,searchedString:R,searchedOptions:T,onApplyHandler:P,selectAllHandler:_,onMultiSelectClear:z,onFreeFormSelect:E,onMultiSelectApply:K,latestDropdownOptionsRef:N,getSelectedOptions:W}=o.useDropdown(M,f,y,q,g,O),[G,J]=t.useState(null!=w?w:S),[Q,U]=t.useState(null),V=t.useRef(null);r.useOutside(V,(()=>{if(U(null),g&&"2.0"===M){const e=W(N.current);null==m||m(e)}else null==m||m(H)}),[C]);const X=null!=v?v:h,Y="number"==typeof X?x&&g?X-96:x&&!g||!x&&g?X-48:X:X;t.useEffect((()=>{const e=null!=w?w:S;if(null===Q)J(e);else if("number"==typeof e)J(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));J(t)}}),[Q]);const $=[],ee=(R&&O?T:H).map((e=>{var t,n;if(R&&!O){if(e.options){const t=Object.assign({},e);return t.options=t.options.filter((e=>{var t;return!!(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(R.toLowerCase()))&&($.push(!R||e.label===R),!0)})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(R.toLowerCase()))||(null===(n=e.searchKey)||void 0===n?void 0:n.toLowerCase().includes(R.toLowerCase()))?($.push(!R||e.label===R),e):null}return e})).filter((e=>null!==e)),te=!!x&&R&&0===ee.length;return e.jsxs(a.OpennedDropdownContainer,Object.assign({version:M,ref:V,style:{width:G}},{children:[e.jsxs("div",Object.assign({style:{width:Q?"50%":"100%",display:"flex",flexDirection:"column",background:"white"}},{children:[!!x&&e.jsx(d.SearchBox,{onSearch:Z,version:M}),ee.length||R?e.jsxs(a.MenuListContainer,Object.assign({minHeight:X,maxHeight:Y},{children:[!!g&&!te&&!D&&e.jsx(u.SelectAllMenu,{version:M,options:R&&O?T:H,onSelect:_}),!b&&te&&e.jsx(p.SearchZeroState,{isLoading:I,height:Y,searchedString:R}),b&&(te||!!$.length&&$.every((e=>!1===e)))&&e.jsx(i.FreeFormMenu,{version:M,isMultiSelect:g,onSelect:E,searchedString:R}),e.jsx(l.MenuList,{onInfiniteScroll:F,onDropdownItemClick:A,version:M,onSelect:P,showDescription:function(e,t){U(e&&t?{title:e,description:t}:null)},isMultiSelect:g,options:ee})]})):e.jsx("div",Object.assign({style:{height:X,display:"flex"}},{children:e.jsx(n.ZeroState,{title:"No results found",subTitle:"Please try again later or contact us at support@bik.ai if you require further assistance."})})),!!g&&!(!ee.length&&!R)&&"2.0"!==M&&e.jsx(c.default,{onClear:()=>{z(),null==k||k()},onApply:K,list:R&&O?T:H,buttonText:L,buttonOptions:B})]})),!!Q&&e.jsx(s.Description,{title:Q.title,description:Q.description,version:M})]}))};

package/dist/cjs/components/dropdown/OpenedDropdown/components/searchbox/SearchZeroState.d.ts

@@ -2,4 +2,5 @@ import React from 'react';
 export declare const SearchZeroState: React.FC<{
     searchedString: string;
     height: number;
+    isLoading?: boolean;
 }>;

package/dist/cjs/components/dropdown/OpenedDropdown/components/searchbox/SearchZeroState.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../../zeroState/ZeroState.js");exports.SearchZeroState=r=>{let{searchedString:s,height:i}=r;return e.jsx("div",Object.assign({style:{height:i,display:"flex",alignItems:"center"}},{children:e.jsx(t.ZeroState,{title:"No results found",subTitle:`Sorry we could not find any results for "${null!=s?s:""}"`})}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../../zeroState/ZeroState.js");exports.SearchZeroState=r=>{let{searchedString:s,height:i,isLoading:o}=r;return e.jsx("div",Object.assign({style:{height:i,display:"flex",alignItems:"center"}},{children:e.jsx(t.ZeroState,{isLoading:o,title:"No results found",subTitle:`Sorry we could not find any results for "${null!=s?s:""}"`})}))};

package/dist/cjs/components/dropdown/type.d.ts

@@ -24,6 +24,7 @@ export interface OpenDropdownProps {
     onMultiSelectClear?: () => void;
     onDropdownItemClick?: (option: DropdownOption) => void;
     buttonOptions?: ButtonOptions;
+    isSearchLoading?: boolean;
 }
 export type GroupedOption = {
     label?: string;

package/dist/cjs/components/zeroState/ZeroState.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
 export declare const ZeroState: React.FC<{
+    isLoading?: boolean;
     title: string;
     subTitle?: string;
     IconHolderStyle?: React.CSSProperties;

package/dist/cjs/components/zeroState/ZeroState.js

@@ -1,12 +1,12 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("styled-components"),r=require("../TypographyStyle.js"),n=require("../../constants/Theme.js"),s=require("../../assets/icons/alert.svg.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=l(t);const o=i.default.div`
-	background: ${n.COLORS.surface.standard};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("styled-components"),n=require("../TypographyStyle.js"),r=require("../../constants/Theme.js"),s=require("../../assets/icons/alert.svg.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=i(t);const o=l.default.div`
+	background: ${r.COLORS.surface.standard};
 	display: flex;
 	flex-direction: column;
 	align-items: center;
 	justify-content: center;
 	flex: 1;
-`,c=i.default.div`
-	background: ${n.COLORS.background.base};
+`,c=l.default.div`
+	background: ${r.COLORS.background.base};
 	width: 48px;
 	height: 48px;
 	display: flex;
@@ -14,4 +14,4 @@
 	align-items: center;
 	justify-content: center;
 	border-radius: 24px;
-`;exports.ZeroState=t=>{let{subTitle:l,title:i,IconHolderStyle:a,style:d}=t;return e.jsxs(o,Object.assign({style:null!=d?d:{}},{children:[e.jsx(c,Object.assign({style:null!=a?a:{}},{children:e.jsx(s.default,{color:n.COLORS.content.placeholder,height:24,width:24})})),e.jsx(r.TitleRegular,Object.assign({style:{marginTop:8,color:n.COLORS.content.primary}},{children:null!=i?i:"No results found"})),!!l&&e.jsx(r.BodyCaption,Object.assign({style:{marginTop:4,color:n.COLORS.content.secondary,textAlign:"center",maxWidth:184}},{children:l}))]}))};
+`;exports.ZeroState=t=>{let{subTitle:i,title:l,IconHolderStyle:a,style:d,isLoading:u}=t;return e.jsxs(o,Object.assign({style:null!=d?d:{}},{children:[e.jsx(c,Object.assign({style:null!=a?a:{}},{children:e.jsx(s.default,{color:r.COLORS.content.placeholder,height:24,width:24})})),e.jsx(n.TitleRegular,Object.assign({style:{marginTop:8,color:r.COLORS.content.primary}},{children:u?"Loading...":l||"No results found"})),!!i&&!u&&e.jsx(n.BodyCaption,Object.assign({style:{marginTop:4,color:r.COLORS.content.secondary,textAlign:"center",maxWidth:184}},{children:i}))]}))};

package/dist/esm/components/dropdown/ChipInput.js

@@ -1 +1 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import{COLORS as s}from"../../constants/Theme.js";import o from"../../assets/icons/chevronDown.svg.js";import r from"../../assets/icons/cross.svg.js";import{Tag as l}from"../tag/Tag.js";import{BodyCaption as n}from"../TypographyStyle.js";import{ChipInputWrapper as i}from"./Common.styled.js";const c=c=>{let{chips:a,onDeleteChip:d,containerStyle:h={},sizeToUse:m="default",isDropdownOpened:g,placeholder:p="Select.."}=c;return e(i,Object.assign({style:Object.assign({},h)},{children:[e("div",Object.assign({className:"chips-container"},{children:[a.slice(0,2).map(((e,s)=>t("div",Object.assign({style:{zIndex:10}},{children:t(l,Object.assign({tagText:e.selectedLabel||e.label,TrailingIcon:()=>t(r,{width:12,height:12,style:{cursor:"pointer"},onClick:()=>{d(e)}})},{children:e.selectedLabel||e.label}))}),s))),a.length>2&&t(n,Object.assign({color:s.content.placeholder},{children:`+${a.length-2} more`})),0===a.length&&t("div",Object.assign({style:{color:s.content.placeholder}},{children:p}))]})),t("div",{children:t(o,{style:{transform:g?"rotate(180deg)":"rotate(0deg)"},width:"small"===m?20:24,height:"small"===m?20:24,color:s.content.primary})})]}))};export{c as default};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import{COLORS as s}from"../../constants/Theme.js";import o from"../../assets/icons/chevronDown.svg.js";import l from"../../assets/icons/cross.svg.js";import{Tag as r}from"../tag/Tag.js";import{BodyCaption as n}from"../TypographyStyle.js";import{ChipInputWrapper as i}from"./Common.styled.js";const c=c=>{let{chips:a,onDeleteChip:d,containerStyle:h={},sizeToUse:m="default",isDropdownOpened:g,placeholder:p="Select.."}=c;return e(i,Object.assign({style:Object.assign({},h)},{children:[e("div",Object.assign({className:"chips-container"},{children:[a.slice(0,2).map(((e,s)=>t("div",Object.assign({style:{zIndex:2}},{children:t(r,Object.assign({tagText:e.selectedLabel||e.label,TrailingIcon:()=>t(l,{width:12,height:12,style:{cursor:"pointer"},onClick:()=>{d(e),console.log("onDeleteChip",e)}})},{children:e.selectedLabel||e.label}))}),s))),a.length>2&&t(n,Object.assign({color:s.content.placeholder},{children:`+${a.length-2} more`})),0===a.length&&t("div",Object.assign({style:{color:s.content.placeholder}},{children:p}))]})),t("div",{children:t(o,{style:{transform:g?"rotate(180deg)":"rotate(0deg)"},width:"small"===m?20:24,height:"small"===m?20:24,color:s.content.primary})})]}))};export{c as default};

package/dist/esm/components/dropdown/OpenedDropdown/components/OpennedDropdown.js

@@ -1 +1 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as o,useRef as n,useEffect as r}from"react";import{ZeroState as i}from"../../../zeroState/ZeroState.js";import{useOutside as l}from"../../../../hooks/useOutside.js";import{useDropdown as s}from"../../hooks/useDropdown.js";import{Description as c}from"./description/Description.js";import{FreeFormMenu as p}from"./menu/FreeFormMenu.js";import{MenuList as u}from"./menu/MenuList.js";import{SelectAllMenu as a}from"./menu/SelectAllMenu.js";import d from"./multiSelect/MultiSelectDropdownBottomBar.js";import{OpennedDropdownContainer as m,MenuListContainer as h}from"./OpennedDropdown.styled.js";import{SearchBox as f}from"./searchbox/SearchBox.js";import{SearchZeroState as S}from"./searchbox/SearchZeroState.js";const g=304,b=290,w=w=>{let{options:v,isSearchable:j,isMultiSelect:y,width:x,allowFreeForm:O,height:C,onClose:M,onSelect:D,onSearch:k,version:L,skipSorting:A,headerRef:F,hideSelectAll:I,primaryButtonText:B,onInfiniteScroll:H,onMultiSelectClear:T,onDropdownItemClick:R,buttonOptions:Z}=w;const{dropdownOptions:q,search:z,searchedString:K,searchedOptions:N,onApplyHandler:P,selectAllHandler:W,onMultiSelectClear:E,onFreeFormSelect:G,onMultiSelectApply:J,latestDropdownOptionsRef:Q,getSelectedOptions:U}=s(L,v,D,A,y,k),[V,X]=o(null!=x?x:b),[Y,$]=o(null),_=n(null);l(_,(()=>{if($(null),y&&"2.0"===L){const e=U(Q.current);null==M||M(e)}else null==M||M(q)}),[F]);const ee=null!=C?C:g,te="number"==typeof ee?j&&y?ee-96:j&&!y||!j&&y?ee-48:ee:ee;r((()=>{const e=null!=x?x:b;if(null===Y)X(e);else if("number"==typeof e)X(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));X(t)}}),[Y]);const oe=[],ne=(K&&k?N:q).map((e=>{var t,o;if(K&&!k){if(e.options){const t=Object.assign({},e);return t.options=t.options.filter((e=>{var t;return!!(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(K.toLowerCase()))&&(oe.push(!K||e.label===K),!0)})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(K.toLowerCase()))||(null===(o=e.searchKey)||void 0===o?void 0:o.toLowerCase().includes(K.toLowerCase()))?(oe.push(!K||e.label===K),e):null}return e})).filter((e=>null!==e)),re=!!j&&K&&0===ne.length;return e(m,Object.assign({version:L,ref:_,style:{width:V}},{children:[e("div",Object.assign({style:{width:Y?"50%":"100%",display:"flex",flexDirection:"column",background:"white"}},{children:[!!j&&t(f,{onSearch:z,version:L}),ne.length||K?e(h,Object.assign({minHeight:ee,maxHeight:te},{children:[!!y&&!re&&!I&&t(a,{version:L,options:K&&k?N:q,onSelect:W}),!O&&re&&t(S,{height:te,searchedString:K}),O&&(re||!!oe.length&&oe.every((e=>!1===e)))&&t(p,{version:L,isMultiSelect:y,onSelect:G,searchedString:K}),t(u,{onInfiniteScroll:H,onDropdownItemClick:R,version:L,onSelect:P,showDescription:function(e,t){$(e&&t?{title:e,description:t}:null)},isMultiSelect:y,options:ne})]})):t("div",Object.assign({style:{height:ee,display:"flex"}},{children:t(i,{title:"No results found",subTitle:"Please try again later or contact us at support@bik.ai if you require further assistance."})})),!!y&&!(!ne.length&&!K)&&"2.0"!==L&&t(d,{onClear:()=>{E(),null==T||T()},onApply:J,list:K&&k?N:q,buttonText:B,buttonOptions:Z})]})),!!Y&&t(c,{title:Y.title,description:Y.description,version:L})]}))};export{w as OpenedDropdown};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as o,useRef as n,useEffect as i}from"react";import{ZeroState as r}from"../../../zeroState/ZeroState.js";import{useOutside as l}from"../../../../hooks/useOutside.js";import{useDropdown as s}from"../../hooks/useDropdown.js";import{Description as c}from"./description/Description.js";import{FreeFormMenu as a}from"./menu/FreeFormMenu.js";import{MenuList as p}from"./menu/MenuList.js";import{SelectAllMenu as u}from"./menu/SelectAllMenu.js";import d from"./multiSelect/MultiSelectDropdownBottomBar.js";import{OpennedDropdownContainer as h,MenuListContainer as m}from"./OpennedDropdown.styled.js";import{SearchBox as f}from"./searchbox/SearchBox.js";import{SearchZeroState as S}from"./searchbox/SearchZeroState.js";const g=304,b=290,w=w=>{let{options:v,isSearchable:j,isMultiSelect:y,width:x,allowFreeForm:O,height:C,onClose:M,onSelect:D,onSearch:L,version:k,skipSorting:A,headerRef:F,hideSelectAll:I,primaryButtonText:B,onInfiniteScroll:H,onMultiSelectClear:T,onDropdownItemClick:R,buttonOptions:Z,isSearchLoading:q}=w;const{dropdownOptions:z,search:K,searchedString:N,searchedOptions:P,onApplyHandler:W,selectAllHandler:E,onMultiSelectClear:G,onFreeFormSelect:J,onMultiSelectApply:Q,latestDropdownOptionsRef:U,getSelectedOptions:V}=s(k,v,D,A,y,L),[X,Y]=o(null!=x?x:b),[$,_]=o(null),ee=n(null);l(ee,(()=>{if(_(null),y&&"2.0"===k){const e=V(U.current);null==M||M(e)}else null==M||M(z)}),[F]);const te=null!=C?C:g,oe="number"==typeof te?j&&y?te-96:j&&!y||!j&&y?te-48:te:te;i((()=>{const e=null!=x?x:b;if(null===$)Y(e);else if("number"==typeof e)Y(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));Y(t)}}),[$]);const ne=[],ie=(N&&L?P:z).map((e=>{var t,o;if(N&&!L){if(e.options){const t=Object.assign({},e);return t.options=t.options.filter((e=>{var t;return!!(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(N.toLowerCase()))&&(ne.push(!N||e.label===N),!0)})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(N.toLowerCase()))||(null===(o=e.searchKey)||void 0===o?void 0:o.toLowerCase().includes(N.toLowerCase()))?(ne.push(!N||e.label===N),e):null}return e})).filter((e=>null!==e)),re=!!j&&N&&0===ie.length;return e(h,Object.assign({version:k,ref:ee,style:{width:X}},{children:[e("div",Object.assign({style:{width:$?"50%":"100%",display:"flex",flexDirection:"column",background:"white"}},{children:[!!j&&t(f,{onSearch:K,version:k}),ie.length||N?e(m,Object.assign({minHeight:te,maxHeight:oe},{children:[!!y&&!re&&!I&&t(u,{version:k,options:N&&L?P:z,onSelect:E}),!O&&re&&t(S,{isLoading:q,height:oe,searchedString:N}),O&&(re||!!ne.length&&ne.every((e=>!1===e)))&&t(a,{version:k,isMultiSelect:y,onSelect:J,searchedString:N}),t(p,{onInfiniteScroll:H,onDropdownItemClick:R,version:k,onSelect:W,showDescription:function(e,t){_(e&&t?{title:e,description:t}:null)},isMultiSelect:y,options:ie})]})):t("div",Object.assign({style:{height:te,display:"flex"}},{children:t(r,{title:"No results found",subTitle:"Please try again later or contact us at support@bik.ai if you require further assistance."})})),!!y&&!(!ie.length&&!N)&&"2.0"!==k&&t(d,{onClear:()=>{G(),null==T||T()},onApply:Q,list:N&&L?P:z,buttonText:B,buttonOptions:Z})]})),!!$&&t(c,{title:$.title,description:$.description,version:k})]}))};export{w as OpenedDropdown};

package/dist/esm/components/dropdown/OpenedDropdown/components/searchbox/SearchZeroState.d.ts

@@ -2,4 +2,5 @@ import React from 'react';
 export declare const SearchZeroState: React.FC<{
     searchedString: string;
     height: number;
+    isLoading?: boolean;
 }>;

package/dist/esm/components/dropdown/OpenedDropdown/components/searchbox/SearchZeroState.js

@@ -1 +1 @@
-import{jsx as e}from"react/jsx-runtime";import{ZeroState as t}from"../../../../zeroState/ZeroState.js";const r=r=>{let{searchedString:i,height:o}=r;return e("div",Object.assign({style:{height:o,display:"flex",alignItems:"center"}},{children:e(t,{title:"No results found",subTitle:`Sorry we could not find any results for "${null!=i?i:""}"`})}))};export{r as SearchZeroState};
+import{jsx as e}from"react/jsx-runtime";import{ZeroState as t}from"../../../../zeroState/ZeroState.js";const r=r=>{let{searchedString:i,height:o,isLoading:s}=r;return e("div",Object.assign({style:{height:o,display:"flex",alignItems:"center"}},{children:e(t,{isLoading:s,title:"No results found",subTitle:`Sorry we could not find any results for "${null!=i?i:""}"`})}))};export{r as SearchZeroState};

package/dist/esm/components/dropdown/type.d.ts

@@ -24,6 +24,7 @@ export interface OpenDropdownProps {
     onMultiSelectClear?: () => void;
     onDropdownItemClick?: (option: DropdownOption) => void;
     buttonOptions?: ButtonOptions;
+    isSearchLoading?: boolean;
 }
 export type GroupedOption = {
     label?: string;

package/dist/esm/components/zeroState/ZeroState.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
 export declare const ZeroState: React.FC<{
+    isLoading?: boolean;
     title: string;
     subTitle?: string;
     IconHolderStyle?: React.CSSProperties;

package/dist/esm/components/zeroState/ZeroState.js

@@ -1,4 +1,4 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import n from"styled-components";import{TitleRegular as r,BodyCaption as o}from"../TypographyStyle.js";import{COLORS as i}from"../../constants/Theme.js";import l from"../../assets/icons/alert.svg.js";const s=n.div`
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import n from"styled-components";import{TitleRegular as r,BodyCaption as o}from"../TypographyStyle.js";import{COLORS as i}from"../../constants/Theme.js";import s from"../../assets/icons/alert.svg.js";const l=n.div`
 	background: ${i.surface.standard};
 	display: flex;
 	flex-direction: column;
@@ -14,4 +14,4 @@ import{jsxs as e,jsx as t}from"react/jsx-runtime";import n from"styled-component
 	align-items: center;
 	justify-content: center;
 	border-radius: 24px;
-`,a=n=>{let{subTitle:a,title:d,IconHolderStyle:m,style:p}=n;return e(s,Object.assign({style:null!=p?p:{}},{children:[t(c,Object.assign({style:null!=m?m:{}},{children:t(l,{color:i.content.placeholder,height:24,width:24})})),t(r,Object.assign({style:{marginTop:8,color:i.content.primary}},{children:null!=d?d:"No results found"})),!!a&&t(o,Object.assign({style:{marginTop:4,color:i.content.secondary,textAlign:"center",maxWidth:184}},{children:a}))]}))};export{a as ZeroState};
+`,a=n=>{let{subTitle:a,title:d,IconHolderStyle:m,style:g,isLoading:p}=n;return e(l,Object.assign({style:null!=g?g:{}},{children:[t(c,Object.assign({style:null!=m?m:{}},{children:t(s,{color:i.content.placeholder,height:24,width:24})})),t(r,Object.assign({style:{marginTop:8,color:i.content.primary}},{children:p?"Loading...":d||"No results found"})),!!a&&!p&&t(o,Object.assign({style:{marginTop:4,color:i.content.secondary,textAlign:"center",maxWidth:184}},{children:a}))]}))};export{a as ZeroState};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bikdotai/bik-component-library",
-	"version": "0.0.552-beta.4",
+	"version": "0.0.552-beta.6",
 	"description": "Bik Component Library",
 	"repository": {
 		"type": "git",