@bikdotai/bik-component-library 0.0.73 → 0.0.74-beta.1

package/dist/cjs/components/curtain/Curtain.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { ComponentType } from 'react';
 import { CURTAIN_MODE, CURTAIN_TYPES } from "./CurtainHelper";
 export type CurtainProps = {
     type: CURTAIN_TYPES;
@@ -15,5 +15,6 @@ export type CurtainProps = {
     onCloseHandler?: () => void;
     strokeAtTop?: boolean;
     strokeAtBottom?: boolean;
+    customComponent: ComponentType<any>;
 };
 export declare const Curtain: React.FC<CurtainProps>;

package/dist/cjs/components/curtain/Curtain.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),o=require("./Curtain.styled.js"),r=require("./CurtainHelper.js"),s=require("../TypographyStyle.js"),n=require("../../constants/Theme.js"),i=require("../../assets/icons/cross.svg.js");exports.Curtain=c=>{const[l,a]=t.useState(!1);if(l)return e.jsx(e.Fragment,{});return e.jsxs(o.CurtainStyle,Object.assign({mode:c.mode,type:c.type,strokeAtTop:c.strokeAtTop,strokeAtBottom:c.strokeAtBottom},{children:[c.icon&&e.jsx(c.icon,{color:r.COLOR_CONFIG_MAP[c.mode][c.type].textColor,height:16,width:16}),e.jsx(s.BodySecondary,Object.assign({style:{color:r.COLOR_CONFIG_MAP[c.mode][c.type].textColor,marginLeft:8}},{children:c.text})),c.actionButtonText&&e.jsx(s.BodySecondaryLink,Object.assign({onClick:c.actionButtonClickHandler,style:{color:c.mode===r.CURTAIN_MODE.DARK?r.COLOR_CONFIG_MAP[c.mode][c.type].textColor:n.COLORS.content.brand,marginLeft:16,textDecoration:"underline"}},{children:c.actionButtonText})),!c.hideCrossIcon&&e.jsx(i.default,{onClick:()=>{a(!0),c.onCloseHandler&&c.onCloseHandler()},style:{position:"absolute",right:16},cursor:"pointer",height:20,width:20,color:r.COLOR_CONFIG_MAP[c.mode][c.type].crossIconColor})]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),o=require("./Curtain.styled.js"),r=require("./CurtainHelper.js"),s=require("../TypographyStyle.js"),n=require("../../constants/Theme.js"),i=require("../../assets/icons/cross.svg.js");exports.Curtain=c=>{const[l,a]=t.useState(!1);if(l)return e.jsx(e.Fragment,{});return e.jsxs(o.CurtainStyle,Object.assign({mode:c.mode,type:c.type,strokeAtTop:c.strokeAtTop,strokeAtBottom:c.strokeAtBottom},{children:[c.icon&&e.jsx(c.icon,{color:r.COLOR_CONFIG_MAP[c.mode][c.type].textColor,height:16,width:16}),e.jsx(s.BodySecondary,Object.assign({style:{color:r.COLOR_CONFIG_MAP[c.mode][c.type].textColor,marginLeft:8}},{children:c.text})),c.customComponent&&e.jsx(c.customComponent,{}),c.actionButtonText&&e.jsx(s.BodySecondaryLink,Object.assign({onClick:c.actionButtonClickHandler,style:{color:c.mode===r.CURTAIN_MODE.DARK?r.COLOR_CONFIG_MAP[c.mode][c.type].textColor:n.COLORS.content.brand,marginLeft:16,textDecoration:"underline"}},{children:c.actionButtonText})),!c.hideCrossIcon&&e.jsx(i.default,{onClick:()=>{a(!0),c.onCloseHandler&&c.onCloseHandler()},style:{position:"absolute",right:16},cursor:"pointer",height:20,width:20,color:r.COLOR_CONFIG_MAP[c.mode][c.type].crossIconColor})]}))};

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"),s=require("../../../zeroState/ZeroState.js"),n=require("../../../../hooks/useOutside.js"),i=require("../utils/iterationOnOptions.js"),l=require("./description/Description.js"),o=require("./menu/FreeFormMenu.js"),r=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 f=304,h=290;exports.OpenedDropdown=j=>{let{options:S,isSearchable:x,isMultiSelect:O,width:b,allowFreeForm:g,height:m,onClose:v,onSelect:w}=j;const[q,y]=t.useState(null!=S?S:[]);t.useEffect((()=>{y(S)}),[S]);const[M,F]=t.useState(null!=b?b:h),[C,D]=t.useState(""),[L,A]=t.useState(null),B=t.useRef(null);n.useOutside(B,(()=>{A(null),null==v||v()}));const Z=null!=m?m:f,E="number"==typeof Z?x&&O?Z-96:x&&!O||!x&&O?Z-48:Z:Z;function H(e){if(O){const t=i.iterateOnOptions(q,{selected:e.selected},(t=>t.value===e.value));y([...t])}else null==w||w(e)}t.useEffect((()=>{const e=null!=b?b:h;if(null===L)F(e);else if("number"==typeof e)F(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));F(t)}}),[L]);const W=q.map((e=>{var t;if(C){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(C.toLowerCase()))})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(C.toLowerCase()))?e:null}return e})).filter((e=>null!==e)),_=!!x&&C&&0===W.length;return e.jsxs(a.OpennedDropdownContainer,Object.assign({ref:B,style:{maxWidth:L?800:400,width:M}},{children:[e.jsxs("div",Object.assign({style:{width:L?"50%":"100%",display:"flex",flexDirection:"column"}},{children:[!!x&&e.jsx(d.SearchBox,{onSearch:function(e){D(e)}}),W.length||C?e.jsxs(a.MenuListContainer,Object.assign({minHeight:Z,maxHeight:E},{children:[!!O&&!_&&e.jsx(u.SelectAllMenu,{options:q,onSelect:function(e){if("selectAll"===e){const e=i.iterateOnOptions(q,{selected:!0},(e=>!e.disabled));y([...e])}else if("notSelected"===e){const e=i.iterateOnOptions(q,{selected:!1},(e=>!e.disabled));y([...e])}}}),!g&&_&&e.jsx(p.SearchZeroState,{searchedString:C}),g&&_&&e.jsx(o.FreeFormMenu,{isMultiSelect:O,onSelect:function(e){if(!O)return void H({label:C,value:C,isFreeForm:!0,selected:!0});const t=q.map((t=>t.options?t:Object.assign(Object.assign({},t),{selected:t.label===C&&t.value===C?e:t.selected})));e&&(t.some((e=>e.label===C&&e.value===C))||t.unshift({label:C,value:C,isFreeForm:!0,selected:!0})),y([...t])},searchedString:C}),e.jsx(r.MenuList,{onSelect:H,showDescription:function(e,t){A(e&&t?{title:e,description:t}:null)},isMultiSelect:O,options:W})]})):e.jsx("div",Object.assign({style:{height:Z,display:"flex"}},{children:e.jsx(s.ZeroState,{title:"No options passed",subTitle:"Sorry we could not find any options to show"})})),!!O&&!(!W.length&&!C)&&e.jsx(c.default,{onClear:function(){const e=i.iterateOnOptions(q,{selected:!1});y([...e])},onApply:function(){const e=[];q.forEach((t=>{if(t.options){const s=t.options.filter((e=>!0===e.selected));e.push(Object.assign(Object.assign({},t),{options:[...s]}))}else t.selected&&e.push(Object.assign({},t))})),null==w||w([...e])},list:q})]})),!!L&&e.jsx(l.Description,{title:L.title,description:L.description})]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),s=require("../../../zeroState/ZeroState.js"),n=require("../../../../hooks/useOutside.js"),i=require("../utils/iterationOnOptions.js"),l=require("./description/Description.js"),o=require("./menu/FreeFormMenu.js"),r=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 f=304,h=290;exports.OpenedDropdown=j=>{let{options:S,isSearchable:b,isMultiSelect:O,width:x,allowFreeForm:g,height:v,onClose:m,onSelect:w}=j;const[q,y]=t.useState(null!=S?S:[]);t.useEffect((()=>{y(S)}),[S]);const[M,C]=t.useState(null!=x?x:h),[F,L]=t.useState(""),[D,A]=t.useState(null),B=t.useRef(null);n.useOutside(B,(()=>{A(null),null==m||m()}));const Z=null!=v?v:f,E="number"==typeof Z?b&&O?Z-96:b&&!O||!b&&O?Z-48:Z:Z;function H(e){if(O){const t=i.iterateOnOptions(q,{selected:e.selected},(t=>t.value===e.value));y([...t])}else null==w||w(e)}t.useEffect((()=>{const e=null!=x?x:h;if(null===D)C(e);else if("number"==typeof e)C(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));C(t)}}),[D]);const _=q.map((e=>{var t;if(F){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(F.toLowerCase()))})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(F.toLowerCase()))?e:null}return e})).filter((e=>null!==e)),k=!!b&&F&&0===_.length;return e.jsxs(a.OpennedDropdownContainer,Object.assign({ref:B,style:{width:M}},{children:[e.jsxs("div",Object.assign({style:{width:D?"50%":"100%",display:"flex",flexDirection:"column"}},{children:[!!b&&e.jsx(d.SearchBox,{onSearch:function(e){L(e)}}),_.length||F?e.jsxs(a.MenuListContainer,Object.assign({minHeight:Z,maxHeight:E},{children:[!!O&&!k&&e.jsx(u.SelectAllMenu,{options:q,onSelect:function(e){if("selectAll"===e){const e=i.iterateOnOptions(q,{selected:!0},(e=>{var t;return F?(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(F.toLowerCase()))&&!e.disabled:!e.disabled}));y([...e])}else if("notSelected"===e){const e=i.iterateOnOptions(q,{selected:!1},(e=>!e.disabled));y([...e])}}}),!g&&k&&e.jsx(p.SearchZeroState,{searchedString:F}),g&&k&&e.jsx(o.FreeFormMenu,{isMultiSelect:O,onSelect:function(e){if(!O)return void H({label:F,value:F,isFreeForm:!0,selected:!0});const t=q.map((t=>t.options?t:Object.assign(Object.assign({},t),{selected:t.label===F&&t.value===F?e:t.selected})));e&&(t.some((e=>e.label===F&&e.value===F))||t.unshift({label:F,value:F,isFreeForm:!0,selected:!0})),y([...t])},searchedString:F}),e.jsx(r.MenuList,{onSelect:H,showDescription:function(e,t){A(e&&t?{title:e,description:t}:null)},isMultiSelect:O,options:_})]})):e.jsx("div",Object.assign({style:{height:Z,display:"flex"}},{children:e.jsx(s.ZeroState,{title:"No options passed",subTitle:"Sorry we could not find any options to show"})})),!!O&&!(!_.length&&!F)&&e.jsx(c.default,{onClear:function(){const e=i.iterateOnOptions(q,{selected:!1});y([...e])},onApply:function(){const e=[];q.forEach((t=>{if(t.options){const s=t.options.filter((e=>!0===e.selected));e.push(Object.assign(Object.assign({},t),{options:[...s]}))}else t.selected&&e.push(Object.assign({},t))})),null==w||w([...e])},list:q})]})),!!D&&e.jsx(l.Description,{title:D.title,description:D.description})]}))};

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"),r=require("../../../../zeroState/ZeroState.js");exports.SearchZeroState=t=>{let{searchedString:o}=t;return e.jsx(r.ZeroState,{title:"No results found",subTitle:`Sorry we could not find any results for "${null!=o?o:""}"`})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("../../../../zeroState/ZeroState.js");exports.SearchZeroState=t=>{let{searchedString:s}=t;return e.jsx("div",Object.assign({style:{margin:"28px auto"}},{children:e.jsx(r.ZeroState,{title:"No results found",subTitle:`Sorry we could not find any results for "${null!=s?s:""}"`})}))};

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

@@ -14,4 +14,4 @@
 	align-items: center;
 	justify-content: center;
 	border-radius: 24px;
-`;exports.ZeroState=t=>{let{subTitle:l,title:i,IconHolderStyle:a,style:u}=t;return e.jsxs(o,Object.assign({style:null!=u?u:{}},{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}},{children:l}))]}))};
+`;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}))]}))};

package/dist/esm/components/curtain/Curtain.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { ComponentType } from 'react';
 import { CURTAIN_MODE, CURTAIN_TYPES } from "./CurtainHelper";
 export type CurtainProps = {
     type: CURTAIN_TYPES;
@@ -15,5 +15,6 @@ export type CurtainProps = {
     onCloseHandler?: () => void;
     strokeAtTop?: boolean;
     strokeAtBottom?: boolean;
+    customComponent: ComponentType<any>;
 };
 export declare const Curtain: React.FC<CurtainProps>;

package/dist/esm/components/curtain/Curtain.js

@@ -1 +1 @@
-import{jsx as o,Fragment as t,jsxs as e}from"react/jsx-runtime";import{useState as r}from"react";import{CurtainStyle as n}from"./Curtain.styled.js";import{COLOR_CONFIG_MAP as s,CURTAIN_MODE as i}from"./CurtainHelper.js";import{BodySecondary as c,BodySecondaryLink as l}from"../TypographyStyle.js";import{COLORS as m}from"../../constants/Theme.js";import a from"../../assets/icons/cross.svg.js";const p=p=>{const[d,h]=r(!1);if(d)return o(t,{});return e(n,Object.assign({mode:p.mode,type:p.type,strokeAtTop:p.strokeAtTop,strokeAtBottom:p.strokeAtBottom},{children:[p.icon&&o(p.icon,{color:s[p.mode][p.type].textColor,height:16,width:16}),o(c,Object.assign({style:{color:s[p.mode][p.type].textColor,marginLeft:8}},{children:p.text})),p.actionButtonText&&o(l,Object.assign({onClick:p.actionButtonClickHandler,style:{color:p.mode===i.DARK?s[p.mode][p.type].textColor:m.content.brand,marginLeft:16,textDecoration:"underline"}},{children:p.actionButtonText})),!p.hideCrossIcon&&o(a,{onClick:()=>{h(!0),p.onCloseHandler&&p.onCloseHandler()},style:{position:"absolute",right:16},cursor:"pointer",height:20,width:20,color:s[p.mode][p.type].crossIconColor})]}))};export{p as Curtain};
+import{jsx as o,Fragment as t,jsxs as e}from"react/jsx-runtime";import{useState as r}from"react";import{CurtainStyle as n}from"./Curtain.styled.js";import{COLOR_CONFIG_MAP as s,CURTAIN_MODE as i}from"./CurtainHelper.js";import{BodySecondary as c,BodySecondaryLink as m}from"../TypographyStyle.js";import{COLORS as l}from"../../constants/Theme.js";import p from"../../assets/icons/cross.svg.js";const a=a=>{const[d,C]=r(!1);if(d)return o(t,{});return e(n,Object.assign({mode:a.mode,type:a.type,strokeAtTop:a.strokeAtTop,strokeAtBottom:a.strokeAtBottom},{children:[a.icon&&o(a.icon,{color:s[a.mode][a.type].textColor,height:16,width:16}),o(c,Object.assign({style:{color:s[a.mode][a.type].textColor,marginLeft:8}},{children:a.text})),a.customComponent&&o(a.customComponent,{}),a.actionButtonText&&o(m,Object.assign({onClick:a.actionButtonClickHandler,style:{color:a.mode===i.DARK?s[a.mode][a.type].textColor:l.content.brand,marginLeft:16,textDecoration:"underline"}},{children:a.actionButtonText})),!a.hideCrossIcon&&o(p,{onClick:()=>{C(!0),a.onCloseHandler&&a.onCloseHandler()},style:{position:"absolute",right:16},cursor:"pointer",height:20,width:20,color:s[a.mode][a.type].crossIconColor})]}))};export{a as Curtain};

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,useEffect as l,useRef as n}from"react";import{ZeroState as s}from"../../../zeroState/ZeroState.js";import{useOutside as i}from"../../../../hooks/useOutside.js";import{iterateOnOptions as r}from"../utils/iterationOnOptions.js";import{Description as c}from"./description/Description.js";import{FreeFormMenu as u}from"./menu/FreeFormMenu.js";import{MenuList as a}from"./menu/MenuList.js";import{SelectAllMenu as p}from"./menu/SelectAllMenu.js";import d from"./multiSelect/MultiSelectDropdownBottomBar.js";import{OpennedDropdownContainer as m,MenuListContainer as f}from"./OpennedDropdown.styled.js";import{SearchBox as h}from"./searchbox/SearchBox.js";import{SearchZeroState as b}from"./searchbox/SearchZeroState.js";const j=304,g=290,S=S=>{let{options:v,isSearchable:O,isMultiSelect:w,width:x,allowFreeForm:y,height:F,onClose:M,onSelect:C}=S;const[D,L]=o(null!=v?v:[]);l((()=>{L(v)}),[v]);const[A,B]=o(null!=x?x:g),[H,W]=o(""),[Z,k]=o(null),z=n(null);i(z,(()=>{k(null),null==M||M()}));const E=null!=F?F:j,I="number"==typeof E?O&&w?E-96:O&&!w||!O&&w?E-48:E:E;function N(e){if(w){const t=r(D,{selected:e.selected},(t=>t.value===e.value));L([...t])}else null==C||C(e)}l((()=>{const e=null!=x?x:g;if(null===Z)B(e);else if("number"==typeof e)B(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));B(t)}}),[Z]);const T=D.map((e=>{var t;if(H){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(H.toLowerCase()))})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(H.toLowerCase()))?e:null}return e})).filter((e=>null!==e)),q=!!O&&H&&0===T.length;return e(m,Object.assign({ref:z,style:{maxWidth:Z?800:400,width:A}},{children:[e("div",Object.assign({style:{width:Z?"50%":"100%",display:"flex",flexDirection:"column"}},{children:[!!O&&t(h,{onSearch:function(e){W(e)}}),T.length||H?e(f,Object.assign({minHeight:E,maxHeight:I},{children:[!!w&&!q&&t(p,{options:D,onSelect:function(e){if("selectAll"===e){const e=r(D,{selected:!0},(e=>!e.disabled));L([...e])}else if("notSelected"===e){const e=r(D,{selected:!1},(e=>!e.disabled));L([...e])}}}),!y&&q&&t(b,{searchedString:H}),y&&q&&t(u,{isMultiSelect:w,onSelect:function(e){if(!w)return void N({label:H,value:H,isFreeForm:!0,selected:!0});const t=D.map((t=>t.options?t:Object.assign(Object.assign({},t),{selected:t.label===H&&t.value===H?e:t.selected})));e&&(t.some((e=>e.label===H&&e.value===H))||t.unshift({label:H,value:H,isFreeForm:!0,selected:!0})),L([...t])},searchedString:H}),t(a,{onSelect:N,showDescription:function(e,t){k(e&&t?{title:e,description:t}:null)},isMultiSelect:w,options:T})]})):t("div",Object.assign({style:{height:E,display:"flex"}},{children:t(s,{title:"No options passed",subTitle:"Sorry we could not find any options to show"})})),!!w&&!(!T.length&&!H)&&t(d,{onClear:function(){const e=r(D,{selected:!1});L([...e])},onApply:function(){const e=[];D.forEach((t=>{if(t.options){const o=t.options.filter((e=>!0===e.selected));e.push(Object.assign(Object.assign({},t),{options:[...o]}))}else t.selected&&e.push(Object.assign({},t))})),null==C||C([...e])},list:D})]})),!!Z&&t(c,{title:Z.title,description:Z.description})]}))};export{S as OpenedDropdown};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as o,useEffect as l,useRef as n}from"react";import{ZeroState as s}from"../../../zeroState/ZeroState.js";import{useOutside as i}from"../../../../hooks/useOutside.js";import{iterateOnOptions as r}from"../utils/iterationOnOptions.js";import{Description as c}from"./description/Description.js";import{FreeFormMenu as u}from"./menu/FreeFormMenu.js";import{MenuList as a}from"./menu/MenuList.js";import{SelectAllMenu as d}from"./menu/SelectAllMenu.js";import p from"./multiSelect/MultiSelectDropdownBottomBar.js";import{OpennedDropdownContainer as m,MenuListContainer as f}from"./OpennedDropdown.styled.js";import{SearchBox as h}from"./searchbox/SearchBox.js";import{SearchZeroState as b}from"./searchbox/SearchZeroState.js";const j=304,g=290,S=S=>{let{options:v,isSearchable:w,isMultiSelect:O,width:y,allowFreeForm:x,height:C,onClose:F,onSelect:L}=S;const[M,D]=o(null!=v?v:[]);l((()=>{D(v)}),[v]);const[A,B]=o(null!=y?y:g),[H,Z]=o(""),[k,z]=o(null),E=n(null);i(E,(()=>{z(null),null==F||F()}));const I=null!=C?C:j,N="number"==typeof I?w&&O?I-96:w&&!O||!w&&O?I-48:I:I;function T(e){if(O){const t=r(M,{selected:e.selected},(t=>t.value===e.value));D([...t])}else null==L||L(e)}l((()=>{const e=null!=y?y:g;if(null===k)B(e);else if("number"==typeof e)B(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));B(t)}}),[k]);const W=M.map((e=>{var t;if(H){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(H.toLowerCase()))})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(H.toLowerCase()))?e:null}return e})).filter((e=>null!==e)),q=!!w&&H&&0===W.length;return e(m,Object.assign({ref:E,style:{width:A}},{children:[e("div",Object.assign({style:{width:k?"50%":"100%",display:"flex",flexDirection:"column"}},{children:[!!w&&t(h,{onSearch:function(e){Z(e)}}),W.length||H?e(f,Object.assign({minHeight:I,maxHeight:N},{children:[!!O&&!q&&t(d,{options:M,onSelect:function(e){if("selectAll"===e){const e=r(M,{selected:!0},(e=>{var t;return H?(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(H.toLowerCase()))&&!e.disabled:!e.disabled}));D([...e])}else if("notSelected"===e){const e=r(M,{selected:!1},(e=>!e.disabled));D([...e])}}}),!x&&q&&t(b,{searchedString:H}),x&&q&&t(u,{isMultiSelect:O,onSelect:function(e){if(!O)return void T({label:H,value:H,isFreeForm:!0,selected:!0});const t=M.map((t=>t.options?t:Object.assign(Object.assign({},t),{selected:t.label===H&&t.value===H?e:t.selected})));e&&(t.some((e=>e.label===H&&e.value===H))||t.unshift({label:H,value:H,isFreeForm:!0,selected:!0})),D([...t])},searchedString:H}),t(a,{onSelect:T,showDescription:function(e,t){z(e&&t?{title:e,description:t}:null)},isMultiSelect:O,options:W})]})):t("div",Object.assign({style:{height:I,display:"flex"}},{children:t(s,{title:"No options passed",subTitle:"Sorry we could not find any options to show"})})),!!O&&!(!W.length&&!H)&&t(p,{onClear:function(){const e=r(M,{selected:!1});D([...e])},onApply:function(){const e=[];M.forEach((t=>{if(t.options){const o=t.options.filter((e=>!0===e.selected));e.push(Object.assign(Object.assign({},t),{options:[...o]}))}else t.selected&&e.push(Object.assign({},t))})),null==L||L([...e])},list:M})]})),!!k&&t(c,{title:k.title,description:k.description})]}))};export{S as OpenedDropdown};

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

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

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

@@ -1,12 +1,12 @@
-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 s}from"../../constants/Theme.js";import l from"../../assets/icons/alert.svg.js";const i=n.div`
-	background: ${s.surface.standard};
+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`
+	background: ${i.surface.standard};
 	display: flex;
 	flex-direction: column;
 	align-items: center;
 	justify-content: center;
 	flex: 1;
 `,c=n.div`
-	background: ${s.background.base};
+	background: ${i.background.base};
 	width: 48px;
 	height: 48px;
 	display: flex;
@@ -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(i,Object.assign({style:null!=p?p:{}},{children:[t(c,Object.assign({style:null!=m?m:{}},{children:t(l,{color:s.content.placeholder,height:24,width:24})})),t(r,Object.assign({style:{marginTop:8,color:s.content.primary}},{children:null!=d?d:"No results found"})),!!a&&t(o,Object.assign({style:{marginTop:4,color:s.content.secondary}},{children:a}))]}))};export{a as ZeroState};
+`,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};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bikdotai/bik-component-library",
-	"version": "0.0.73",
+	"version": "0.0.74-beta.1",
 	"description": "Bik Component Library",
 	"repository": {
 		"type": "git",
@@ -52,11 +52,11 @@
 		"@tippyjs/react": "^4.2.6",
 		"bootstrap": "^5.1.3",
 		"browser-image-compression": "^2.0.2",
+		"emoji-picker-react": "^4.4.9",
 		"react-bootstrap": "^2.4.0",
 		"react-calendar": "^3.7.0",
 		"react-easy-crop": "^4.7.4",
 		"react-image-crop": "^10.0.9",
-		"emoji-picker-react": "^3.6.5",
 		"react-lottie": "^1.2.3",
 		"react-popper": "^2.3.0",
 		"react-toastify": "^9.1.2"