@bikdotai/bik-component-library 0.0.44-4.beta-2 → 0.0.44

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 r,useEffect as i}from"react";import{ZeroState as n}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,v=290,b=b=>{let{options:j,isSearchable:w,isMultiSelect:y,width:x,allowFreeForm:O,height:C,onClose:M,onSelect:D,onSearch:L,version:F,skipSorting:k}=b;const{dropdownOptions:A,search:H,searchedString:B,searchedOptions:Z,onApplyHandler:q,selectAllHandler:z,onMultiSelectClear:I,onFreeFormSelect:K,onMultiSelectApply:N,latestDropdownOptionsRef:P,getSelectedOptions:R}=s(F,j,D,k,y,L),[T,W]=o(null!=x?x:v),[E,G]=o(null),J=r(null);l(J,(()=>{if(G(null),y&&"2.0"===F){const e=R(P.current);null==M||M(e)}else null==M||M(A)}));const Q=null!=C?C:g,U="number"==typeof Q?w&&y?Q-96:w&&!y||!w&&y?Q-48:Q:Q;i((()=>{const e=null!=x?x:v;if(null===E)W(e);else if("number"==typeof e)W(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));W(t)}}),[E]);const V=[],X=(B&&L?Z:A).map((e=>{var t,o;if(B&&!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(B.toLowerCase()))&&(V.push(!B||e.label===B),!0)})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(B.toLowerCase()))||(null===(o=e.searchKey)||void 0===o?void 0:o.toLowerCase().includes(B.toLowerCase()))?(V.push(!B||e.label===B),e):null}return e})).filter((e=>null!==e)),Y=!!w&&B&&0===X.length;return e(h,Object.assign({version:F,ref:J,style:{width:T}},{children:[e("div",Object.assign({style:{width:E?"50%":"100%",display:"flex",flexDirection:"column",background:"white"}},{children:[!!w&&t(f,{onSearch:H,version:F}),X.length||B?e(m,Object.assign({minHeight:Q,maxHeight:U},{children:[!!y&&!Y&&t(u,{version:F,options:B&&L?Z:A,onSelect:z}),!O&&Y&&t(S,{height:U,searchedString:B}),O&&(Y||!!V.length&&V.every((e=>!1===e)))&&t(a,{version:F,isMultiSelect:y,onSelect:K,searchedString:B}),t(p,{version:F,onSelect:q,showDescription:function(e,t){G(e&&t?{title:e,description:t}:null)},isMultiSelect:y,options:X})]})):t("div",Object.assign({style:{height:Q,display:"flex"}},{children:t(n,{title:"No results found",subTitle:"Please try again later or contact us at support@bik.ai if you require further assistance."})})),!!y&&!(!X.length&&!B)&&"2.0"!==F&&t(d,{onClear:I,onApply:N,list:B&&L?Z:A})]})),!!E&&t(c,{title:E.title,description:E.description,version:F})]}))};export{b as OpenedDropdown};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as l,useRef as o,useEffect as n}from"react";import{ZeroState as i}from"../../../zeroState/ZeroState.js";import{useOutside as s}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:x,width:y,allowFreeForm:w,height:F,onClose:M,onSelect:D}=S;const[A,B]=l(null!=v?v:[]),[C,H]=l(null!=y?y:g),[W,Z]=l(""),[k,z]=l(null),E=o(null);s(E,(()=>{z(null),null==M||M()}));const I=null!=F?F:j,L="number"==typeof I?O&&x?I-96:O&&!x||!O&&x?I-48:I:I;function N(e){if(x){const t=r(A,{selected:e.selected},(t=>t.value===e.value));B([...t])}else null==D||D(e)}n((()=>{const e=null!=y?y:g;if(null===k)H(e);else if("number"==typeof e)H(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));H(t)}}),[k]);const T=A.map((e=>{var t;if(W){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.includes(W))})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.includes(W))?e:null}return e})).filter((e=>null!==e)),q=!!O&&W&&0===T.length;return e(m,Object.assign({ref:E,style:{maxWidth:k?800:400,width:C}},{children:[e("div",Object.assign({style:{width:k?"50%":"100%",display:"flex",flexDirection:"column"}},{children:[!!O&&t(h,{onSearch:function(e){Z(e)}}),T.length||W?e(f,Object.assign({minHeight:I,maxHeight:L},{children:[!!x&&!q&&t(p,{options:A,onSelect:function(e){if("selectAll"===e){const e=r(A,{selected:!0},(e=>!e.disabled));B([...e])}else if("notSelected"===e){const e=r(A,{selected:!1},(e=>!e.disabled));B([...e])}}}),!w&&q&&t(b,{searchedString:W}),w&&q&&t(u,{isMultiSelect:x,onSelect:function(e){if(!x)return void N({label:W,value:W,isFreeForm:!0,selected:!0});const t=A.map((t=>t.options?t:Object.assign(Object.assign({},t),{selected:t.label===W&&t.value===W?e:t.selected})));e&&(t.some((e=>e.label===W&&e.value===W))||t.unshift({label:W,value:W,isFreeForm:!0,selected:!0})),B([...t])},searchedString:W}),t(a,{onSelect:N,showDescription:function(e,t){z(e&&t?{title:e,description:t}:null)},isMultiSelect:x,options:T})]})):t("div",Object.assign({style:{height:I,display:"flex"}},{children:t(i,{title:"No options passed",subTitle:"Sorry we could not find any options to show"})})),!!x&&!(!T.length&&!W)&&t(d,{onClear:function(){const e=r(A,{selected:!1});B([...e])},onApply:function(){const e=[];A.forEach((t=>{if(t.options){const l=t.options.filter((e=>!0===e.selected));e.push(Object.assign(Object.assign({},t),{options:[...l]}))}else t.selected&&e.push(Object.assign({},t))})),null==D||D([...e])},list:A})]})),!!k&&t(c,{title:k.title,description:k.description})]}))};export{S as OpenedDropdown};

package/dist/esm/components/dropdown/OpenedDropdown/components/OpennedDropdown.styled.d.ts

@@ -1,6 +1,4 @@
-export declare const OpennedDropdownContainer: import("styled-components").StyledComponent<"div", any, {
-    version?: "1.0" | "2.0" | undefined;
-}, never>;
+export declare const OpennedDropdownContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const ItemContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const MenuListContainer: import("styled-components").StyledComponent<"div", any, {
     maxHeight: number | string;

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

@@ -1,14 +1,11 @@
 import o from"styled-components";import{COLORS as e}from"../../../../constants/Theme.js";const r=o.div`
-	border-radius: ${o=>"2.0"===o.version?8:4}px;
-	border: ${o=>"2.0"===o.version?0:1}px solid
-		${e.stroke.primary};
+	border-radius: 4px;
+	border: 1px solid ${e.stroke.primary};
 	max-height: 640px;
 	overflow: hidden;
 	display: flex;
 	flex-direction: row;
 	position: relative;
-	padding: ${o=>"2.0"===o.version?4:0}px;
-	background-color: ${e.surface.standard};
 `;o.div`
 	padding: 14px 16px 14px 18px;
 	flex-direction: row;
@@ -18,8 +15,12 @@ import o from"styled-components";import{COLORS as e}from"../../../../constants/T
 	border-bottom-color: ${e.stroke.primary};
 	width: 100%;
 	height: 100%;
-`;const i=o.div`
+`;const t=o.div`
 	max-height: ${o=>"number"==typeof o.maxHeight?`${o.maxHeight}px`:o.maxHeight};
+
 	overflow-y: auto;
-	position: relative;
-`;export{i as MenuListContainer,r as OpennedDropdownContainer};
+	flex: 1;
+	display: flex;
+	flex-direction: column;
+	background-color: ${e.surface.standard};
+`;export{t as MenuListContainer,r as OpennedDropdownContainer};

package/dist/esm/components/dropdown/OpenedDropdown/components/description/Description.d.ts

@@ -2,5 +2,4 @@ import React from 'react';
 export declare const Description: React.FC<{
     title: string;
     description: string;
-    version?: '1.0' | '2.0';
 }>;

package/dist/esm/components/dropdown/OpenedDropdown/components/description/Description.js

@@ -1 +1 @@
-import{jsx as t,jsxs as e}from"react/jsx-runtime";import{TitleRegular as r,BodySecondary as o}from"../../../../TypographyStyle.js";import{COLORS as i}from"../../../../../constants/Theme.js";import{DescriptionContainer as n}from"./Description.styled.js";const s=s=>{let{title:c,description:l,version:m}=s;return t(n,Object.assign({version:m},{children:e("div",Object.assign({style:{padding:"2.0"===m?12:24}},{children:[t(r,Object.assign({style:{color:i.content.primary,marginBottom:4}},{children:c})),t(o,Object.assign({style:{color:i.content.secondary}},{children:l}))]}))}))};export{s as Description};
+import{jsx as t,jsxs as r}from"react/jsx-runtime";import{TitleRegular as e,BodySecondary as o}from"../../../../TypographyStyle.js";import{COLORS as i}from"../../../../../constants/Theme.js";import{DescriptionContainer as n}from"./Description.styled.js";const s=s=>{let{title:c,description:l}=s;return t(n,{children:r("div",Object.assign({style:{padding:24}},{children:[t(e,Object.assign({style:{color:i.content.primary,marginBottom:4}},{children:c})),t(o,Object.assign({style:{color:i.content.secondary}},{children:l}))]}))})};export{s as Description};

package/dist/esm/components/dropdown/OpenedDropdown/components/description/Description.styled.d.ts

@@ -1,3 +1 @@
-export declare const DescriptionContainer: import("styled-components").StyledComponent<"div", any, {
-    version?: "1.0" | "2.0" | undefined;
-}, never>;
+export declare const DescriptionContainer: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/esm/components/dropdown/OpenedDropdown/components/description/Description.styled.js

@@ -1,6 +1,5 @@
 import o from"styled-components";import{COLORS as r}from"../../../../../constants/Theme.js";const t=o.div`
 	background: ${r.surface.standard};
-	border-left: ${o=>"2.0"===o.version?.5:1}px solid
-		${r.stroke.primary};
+	border-left: 1px solid ${r.stroke.primary};
 	width: 50%;
 `;export{t as DescriptionContainer};

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/FreeFormMenu.d.ts

@@ -3,5 +3,4 @@ export declare const FreeFormMenu: React.FC<{
     isMultiSelect?: boolean;
     searchedString: string;
     onSelect: (isChecked: boolean) => void;
-    version?: '1.0' | '2.0';
 }>;

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/FreeFormMenu.js

@@ -1 +1 @@
-import{jsx as e,Fragment as t}from"react/jsx-runtime";import{useState as o}from"react";import{CheckBox as r}from"../../../../checkBox/CheckBox.js";import{ListItem as i}from"../../../../list-item/ListItem.js";import{BodyCaption as n}from"../../../../TypographyStyle.js";import{COLORS as s}from"../../../../../constants/Theme.js";import{FreeFormContainer as c}from"./FreeFormMenu.styled.js";const m=m=>{let{searchedString:l,onSelect:a,isMultiSelect:p,version:f}=m;const[h,u]=o(!1);function d(){u(!h),a(!h)}return e(i,{version:f,onClick:e=>{e.preventDefault(),d()},listItem:{label:l,value:l},leadingIcon:p?e(r,{size:"2.0"===f?"SMALL":"DEFAULT",isChecked:h,onValueChange:d}):e(t,{}),trailingIcon:e(c,{children:e(n,Object.assign({style:{color:s.content.secondary}},{children:"Freeform"}))})})};export{m as FreeFormMenu};
+import{jsx as e,Fragment as t}from"react/jsx-runtime";import{useState as o}from"react";import{CheckBox as r}from"../../../../checkBox/CheckBox.js";import{ListItem as n}from"../../../../list-item/ListItem.js";import{BodyCaption as i}from"../../../../TypographyStyle.js";import{COLORS as c}from"../../../../../constants/Theme.js";import{FreeFormContainer as m}from"./FreeFormMenu.styled.js";const s=s=>{let{searchedString:l,onSelect:a,isMultiSelect:p}=s;const[f,h]=o(!1);function u(){h(!f),a(!f)}return e(n,{onClick:e=>{e.preventDefault(),u()},listItem:{label:l,value:l},leadingIcon:p?e(r,{isChecked:f,onValueChange:u}):e(t,{}),trailingIcon:e(m,{children:e(i,Object.assign({style:{color:c.content.secondary}},{children:"Freeform"}))})})};export{s as FreeFormMenu};

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuItem.d.ts

@@ -5,6 +5,4 @@ export declare const MenuItem: React.FC<{
     isMultiSelect?: boolean;
     showDescription: (title?: string, description?: string) => void;
     onSelect: (option: SingleOption) => void;
-    last?: boolean;
-    version?: '1.0' | '2.0';
 }>;

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuItem.js

@@ -1,5 +1,4 @@
-import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import i from"styled-components";import{CheckBox as o}from"../../../../checkBox/CheckBox.js";import{ListItem as s}from"../../../../list-item/ListItem.js";import{BodyCaption as r}from"../../../../TypographyStyle.js";import{COLORS as l}from"../../../../../constants/Theme.js";import{FreeFormContainer as c}from"./FreeFormMenu.styled.js";const a=i(s)`
-	padding: ${e=>"2.0"===e.version?"8px 12px":"14px 16px"} !important;
-	cursor: pointer;
-	margin-top: ${e=>"2.0"===e.version?"2px":"0"};
-`,d=i=>{let{option:s,isMultiSelect:d,showDescription:m,onSelect:p,last:g,version:u}=i;var b;function f(e){s.disabled||p(Object.assign(Object.assign({},s),{selected:e}))}return e(a,{version:u,style:g?{borderBottom:0}:{},onClick:e=>{e.preventDefault(),f(!s.selected)},onMouseOver:function(){s.description?m(s.label,s.description):m()},listItem:{value:s.value,label:s.label},subText:s.subText,leadingIcon:d?t("div",Object.assign({style:{display:"flex",alignContent:"center",justifyContent:"center",gap:8}},{children:[e(o,{size:"2.0"===u?"SMALL":"DEFAULT",isDisabled:null!==(b=s.disabled)&&void 0!==b&&b,isChecked:!!s.selected,onValueChange:f}),e("div",Object.assign({style:{marginRight:"-4px"}},{children:s.leadingIcon}))]})):s.leadingIcon?e(n,{children:s.leadingIcon}):e(n,{}),customComponent:s.customComponent,trailingIcon:s.isFreeForm?e(c,{children:e(r,Object.assign({style:{color:l.content.secondary}},{children:"Freeform"}))}):s.trailingIcon?e(n,{children:s.trailingIcon}):e(n,{}),variant:s.disabled?"inactive":s.selected?"selected":"default"})};export{d as MenuItem};
+import{jsx as e,Fragment as t}from"react/jsx-runtime";import o from"styled-components";import{CheckBox as i}from"../../../../checkBox/CheckBox.js";import{ListItem as n}from"../../../../list-item/ListItem.js";import{BodyCaption as s}from"../../../../TypographyStyle.js";import{COLORS as r}from"../../../../../constants/Theme.js";import{FreeFormContainer as l}from"./FreeFormMenu.styled.js";const c=o(n)`
+	padding: 14px 16px !important;
+	cursor: default;
+`,a=o=>{let{option:n,isMultiSelect:a,showDescription:m,onSelect:d}=o;var p;function u(e){n.disabled||d(Object.assign(Object.assign({},n),{selected:e}))}return e(c,{onClick:e=>{e.preventDefault(),u(!n.selected)},onMouseOver:function(){n.description?m(n.label,n.description):m()},listItem:{value:n.value,label:n.label},subText:n.subText,leadingIcon:a?e(i,{isDisabled:null!==(p=n.disabled)&&void 0!==p&&p,isChecked:!!n.selected,onValueChange:u}):e(t,{}),customComponent:n.customComponent,trailingIcon:n.isFreeForm?e(l,{children:e(s,Object.assign({style:{color:r.content.secondary}},{children:"Freeform"}))}):n.trailingIcon?e(t,{children:n.trailingIcon}):e(t,{}),variant:n.disabled?"inactive":n.selected?"selected":"default"})};export{a as MenuItem};

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuList.d.ts

@@ -5,5 +5,4 @@ export declare const MenuList: React.FC<{
     isMultiSelect?: boolean;
     showDescription: (title?: string, description?: string) => void;
     onSelect: (optionSelect: SingleOption) => void;
-    version?: '1.0' | '2.0';
 }>;

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuList.js

@@ -1 +1 @@
-import{jsx as e,Fragment as t,jsxs as i}from"react/jsx-runtime";import{MenuItem as n}from"./MenuItem.js";import{StyledGroupedLabel as o}from"./MenuList.styled.js";const s=s=>{let{options:r,isMultiSelect:l,showDescription:c,onSelect:p,version:a}=s;return e(t,{children:r.map(((s,m)=>{const g=m===r.length-1;if(s.options){const r=s;return i("div",Object.assign({style:{marginTop:"2.0"===a?2:0}},{children:[i(o,Object.assign({version:a},{children:[r.leadingIcon?e("span",Object.assign({style:{marginRight:8}},{children:r.leadingIcon})):e(t,{}),r.label]})),r.options.map(((t,i)=>e(n,{version:a,last:i===r.options.length-1,onSelect:p,showDescription:c,isMultiSelect:l,option:t},`${m}-${i}`)))]}),m)}return e(n,{version:a,last:g,onSelect:p,showDescription:c,isMultiSelect:l,option:s},m)}))})};export{s as MenuList};
+import{jsx as t,Fragment as e,jsxs as o}from"react/jsx-runtime";import{MenuItem as i}from"./MenuItem.js";import{StyledGroupedLabel as n}from"./MenuList.styled.js";const r=r=>{let{options:s,isMultiSelect:l,showDescription:c,onSelect:p}=r;return t(e,{children:s.map(((e,r)=>{if(e.options){const s=e;return o("div",{children:[t(n,{children:s.label}),s.options.map(((e,o)=>t(i,{onSelect:p,showDescription:c,isMultiSelect:l,option:e},o)))]},r)}return t(i,{onSelect:p,showDescription:c,isMultiSelect:l,option:e},r)}))})};export{r as MenuList};

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuList.styled.d.ts

@@ -1,6 +1 @@
-export declare const StyledGroupedLabel: import("styled-components").StyledComponent<"div", any, {
-    numberOfLines?: number | undefined;
-    color?: string | undefined;
-} & {
-    version?: "1.0" | "2.0" | undefined;
-}, never>;
+export declare const StyledGroupedLabel: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/MenuList.styled.js

@@ -1,6 +1,5 @@
-import o from"styled-components";import{BodyCaption as r}from"../../../../TypographyStyle.js";import{COLORS as n}from"../../../../../constants/Theme.js";const e=o(r)`
-	padding: 8px ${o=>"2.0"===o.version?12:16}px;
-	color: ${o=>"2.0"===o.version?n.content.placeholder:n.content.secondary};
-	background-color: ${o=>"2.0"===o.version?n.surface.standard:n.background.base};
-	font-size: ${o=>"2.0"===o.version?10:12}px;
-`;export{e as StyledGroupedLabel};
+import o from"styled-components";import{BodyCaption as r}from"../../../../TypographyStyle.js";import{COLORS as t}from"../../../../../constants/Theme.js";const n=o(r)`
+	padding: 8px 16px;
+	color: ${t.content.secondary};
+	background-color: ${t.background.base};
+`;export{n as StyledGroupedLabel};

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/SelectAllMenu.d.ts

@@ -4,5 +4,4 @@ export type SelectAllCheckboxState = 'notSelected' | 'selectAll' | 'partiallySel
 export declare const SelectAllMenu: React.FC<{
     options: DropdownOption[];
     onSelect: (newState: SelectAllCheckboxState) => void;
-    version?: '1.0' | '2.0';
 }>;

package/dist/esm/components/dropdown/OpenedDropdown/components/menu/SelectAllMenu.js

@@ -1 +1 @@
-import{jsx as e}from"react/jsx-runtime";import{useState as t,useEffect as l}from"react";import{CheckBox as o}from"../../../../checkBox/CheckBox.js";import{ListItem as i}from"../../../../list-item/ListItem.js";const c=c=>{let{options:n,onSelect:r,version:s}=c;const[a,d]=t("notSelected");function p(){"partiallySelected"===a&&r("notSelected"),"selectAll"===a&&r("notSelected"),"notSelected"===a&&r("selectAll")}return l((()=>{const e=[];n.filter((e=>!e.disabled)).forEach((t=>{t.options?t.options.filter((e=>!e.disabled)).forEach((t=>{e.push(t.selected||!1)})):e.push(t.selected||!1)})),e.every(Boolean)?d("selectAll"):e.filter(Boolean).length>0?d("partiallySelected"):d("notSelected")}),[n]),e(i,{version:s,onClick:e=>{e.preventDefault(),p()},listItem:{label:"Select All",value:"All"},leadingIcon:e("div",Object.assign({style:{width:18}},{children:e(o,{size:"2.0"===s?"SMALL":"DEFAULT",isChecked:"selectAll"===a||"partiallySelected"===a,isPartiallyChecked:"partiallySelected"===a,onValueChange:p})})),variant:"default"})};export{c as SelectAllMenu};
+import{jsx as e}from"react/jsx-runtime";import{useState as t,useEffect as l}from"react";import o from"styled-components";import{CheckBox as c}from"../../../../checkBox/CheckBox.js";import{ListItem as i}from"../../../../list-item/ListItem.js";const r=o(i)``,n=o=>{let{options:i,onSelect:n}=o;const[a,s]=t("notSelected");function d(){"partiallySelected"===a&&n("notSelected"),"selectAll"===a&&n("notSelected"),"notSelected"===a&&n("selectAll")}return l((()=>{const e=[];i.filter((e=>!e.disabled)).forEach((t=>{t.options?t.options.filter((e=>!e.disabled)).forEach((t=>{e.push(t.selected||!1)})):e.push(t.selected||!1)})),e.every(Boolean)?s("selectAll"):e.filter(Boolean).length>0?s("partiallySelected"):s("notSelected")}),[i]),e(r,{onClick:e=>{e.preventDefault(),d()},listItem:{label:"Select All",value:"All"},leadingIcon:e(c,{isChecked:"selectAll"===a||"partiallySelected"===a,isPartiallyChecked:"partiallySelected"===a,onValueChange:d}),variant:"default"})};export{n as SelectAllMenu};

package/dist/esm/components/dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.js

@@ -1 +1 @@
-import{jsxs as t,jsx as e}from"react/jsx-runtime";import{Button as o}from"../../../../button/Button.js";import{BodySecondary as r}from"../../../../TypographyStyle.js";import{COLORS as l}from"../../../../../constants/Theme.js";import{BottomBarContainer as n}from"./MultiSelectDropdownBottomBar.styled.js";const s=s=>{let{onApply:i,onClear:c,list:p}=s;const a=p.reduce(((t,e)=>{if(e.options){return t+e.options.filter((t=>!0===t.selected)).length}return e.selected?t+1:t}),0);return t(n,Object.assign({style:{justifyContent:"space-between"}},{children:[e(r,Object.assign({style:{flex:1,color:l.content.primary}},{children:a?`${a} selected`:""})),t("div",Object.assign({style:{flexDirection:"row",display:"flex",gap:12}},{children:[e(o,{size:"small",buttonType:"tertiaryGray",buttonText:"Clear",onClick:c}),e(o,{size:"small",buttonText:"Apply",onClick:()=>{i()}})]}))]}))};export{s as default};
+import{jsxs as t,jsx as e}from"react/jsx-runtime";import{Button as o}from"../../../../button/Button.js";import{BodySecondary as r}from"../../../../TypographyStyle.js";import{COLORS as l}from"../../../../../constants/Theme.js";import{BottomBarContainer as n}from"./MultiSelectDropdownBottomBar.styled.js";const s=s=>{let{onApply:i,onClear:c,list:p}=s;const a=p.reduce(((t,e)=>{if(e.options){return t+e.options.filter((t=>!0===t.selected)).length}return e.selected?t+1:t}),0);return t(n,Object.assign({style:{justifyContent:"space-between"}},{children:[e(r,Object.assign({style:{flex:1,color:l.content.primary}},{children:a?`${a} selected`:""})),t("div",Object.assign({style:{flexDirection:"row",display:"flex",gap:12}},{children:[e(o,{size:"small",buttonType:"tertiaryGray",buttonText:"Clear",onClick:c}),e(o,{size:"small",buttonText:"Apply",onClick:i})]}))]}))};export{s as default};

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

@@ -1,5 +1,4 @@
 import React from 'react';
 export declare const SearchBox: React.FC<{
     onSearch: (searchString: string) => void;
-    version?: '1.0' | '2.0';
 }>;

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

@@ -1 +1 @@
-import{jsx as o,Fragment as r}from"react/jsx-runtime";import{useState as t}from"react";import{Input as e}from"../../../../input/Input.js";import{InputStyleContext as n}from"../../../../input/context/InputStyleProvider.js";import{COLORS as i}from"../../../../../constants/Theme.js";import s from"../../../../../assets/icons/cross.svg.js";import c from"../../../../../assets/icons/search.svg.js";const p=p=>{let{onSearch:a,version:m}=p;const[l,h]=t(""),[d,g]=t(!1);return o(n.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:`${"2.0"===m?.5:1}px solid ${i.stroke.primary}`,padding:""+("2.0"===m?"6px 8px":"14px 16px"),marginBottom:4},IconHolder:{marginLeft:0},input:{marginLeft:4,minHeight:"100%"}}},{children:o(e,{noKeyDownChange:!0,skipFocus:!0,placeholder:"Search",variant:"2.0"===m?"small":"default",leftIcon:{icon:()=>o(c,{width:"2.0"===m?18:24,height:"2.0"===m?18:24,color:i.content.placeholder})},rightIcon:{icon:()=>l?o(s,{onClick:()=>{g(!0),a(""),h("")},width:24,height:24,color:i.content.placeholder}):o(r,{})},reset:d,onChangeText:o=>{g(!1),h(o),a(o)}})}))};export{p as SearchBox};
+import{jsx as r,Fragment as o}from"react/jsx-runtime";import{createRef as t}from"react";import{Input as e}from"../../../../input/Input.js";import{InputStyleContext as n}from"../../../../input/context/InputStyleProvider.js";import{COLORS as i}from"../../../../../constants/Theme.js";import c from"../../../../../assets/icons/cross.svg.js";import s from"../../../../../assets/icons/search.svg.js";const p=p=>{let{onSearch:a}=p;const l=t();return r(n.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:"1px solid "+i.stroke.primary,padding:"14px 16px"},IconHolder:{marginLeft:0},input:{marginLeft:4,minHeight:"100%"}}},{children:r(e,{ref:l,placeholder:"Search",leftIcon:{icon:()=>r(s,{width:24,height:24,color:i.content.placeholder})},rightIcon:{icon:()=>{var t;return(null===(t=null==l?void 0:l.current)||void 0===t?void 0:t.value)?r(c,{onClick:()=>{l.current&&(l.current.value=""),a("")},width:24,height:24,color:i.content.placeholder}):r(o,{})}},onChangeText:a})}))};export{p as SearchBox};

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

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

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 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};

package/dist/esm/components/dropdown/OpenedDropdown/utils/iterationOnOptions.d.ts

@@ -9,9 +9,7 @@ export declare function iterateOnOptions(options: DropdownOption[], newVal: Part
     isFreeForm?: boolean | undefined;
     subText?: string | undefined;
     trailingIcon?: JSX.Element | undefined;
-    leadingIcon?: JSX.Element | undefined;
     customComponent?: JSX.Element | undefined;
-    searchKey?: string | undefined;
 } | {
     label?: string | undefined;
     value?: string | undefined;
@@ -21,9 +19,6 @@ export declare function iterateOnOptions(options: DropdownOption[], newVal: Part
     isFreeForm?: boolean | undefined;
     subText?: string | undefined;
     trailingIcon?: JSX.Element | undefined;
-    leadingIcon?: JSX.Element | undefined;
     customComponent?: JSX.Element | undefined;
-    searchKey?: string | undefined;
     options: SingleOption[];
 })[];
-export declare function iterateOnOptionsRaw(options: DropdownOption[], cb: (option: SingleOption) => void): void;

package/dist/esm/components/dropdown/OpenedDropdown/utils/iterationOnOptions.js

@@ -1 +1 @@
-function s(s,n,t){return s.map((s=>{if(s.options){const i=s.options.map((s=>!t||t(s)?Object.assign(Object.assign({},s),n):Object.assign({},s)));return Object.assign(Object.assign({},s),{options:[...i]})}return!t||t(s)?Object.assign(Object.assign({},s),n):Object.assign({},s)}))}function n(s,n){s.forEach((s=>{s.options?s.options.forEach(n):n(s)}))}export{s as iterateOnOptions,n as iterateOnOptionsRaw};
+function s(s,n,t){return s.map((s=>{if(s.options){const i=s.options.map((s=>!t||t(s)?Object.assign(Object.assign({},s),n):Object.assign({},s)));return Object.assign(Object.assign({},s),{options:[...i]})}return!t||t(s)?Object.assign(Object.assign({},s),n):Object.assign({},s)}))}export{s as iterateOnOptions};

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

@@ -1,6 +1,3 @@
-import { DropdownPopover } from './DropdownPopover';
 export * from './Dropdown';
-export * from './ChipDropdown';
-export { DropdownPopover };
+export * from './DropdownPopover';
 export * from './OpenedDropdown';
-export * from './MenuItem/MenuItem';

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

@@ -1,5 +1,4 @@
 /// <reference types="react" />
-import { Placement, PositioningStrategy } from '@popperjs/core';
 export interface OpenDropdownProps {
     defaultOptions?: DropdownOption[];
     options: DropdownOption[];
@@ -9,17 +8,11 @@ export interface OpenDropdownProps {
     width?: string;
     height?: number | string;
     allowFreeForm?: boolean;
-    onClose?: (selectedData?: DropdownOption | DropdownOption[]) => void;
+    onClose?: () => void;
     onSelect?: (option: DropdownOption | DropdownOption[]) => void;
-    placement?: Placement;
-    strategy?: PositioningStrategy;
-    onSearch?: (key: string) => Promise<DropdownOption[]>;
-    version?: '1.0' | '2.0';
-    skipSorting?: boolean;
 }
 export type GroupedOption = {
     label?: string;
-    leadingIcon?: JSX.Element;
     options: (SingleOption | MultiSelectOption)[];
 };
 export type SingleOption = {
@@ -31,9 +24,7 @@ export type SingleOption = {
     isFreeForm?: boolean;
     subText?: string;
     trailingIcon?: JSX.Element;
-    leadingIcon?: JSX.Element;
     customComponent?: JSX.Element;
-    searchKey?: string;
 };
 export type MultiSelectOption = SingleOption;
 export type DropdownOption = MultiSelectOption | SingleOption | GroupedOption;

package/dist/esm/components/fab-menu/FABMenu.d.ts

@@ -21,5 +21,4 @@ export declare const FABMenu: React.FC<{
     isRound?: boolean;
     dropPosition?: DROP_POSITION;
     menuAligment?: MENU_ALIGNMENT;
-    version?: '1.0' | '2.0';
 }>;

package/dist/esm/components/fab-menu/FABMenu.js

@@ -1 +1 @@
-import{jsx as t}from"react/jsx-runtime";import{OpenedDropdown as o}from"../dropdown/OpenedDropdown/components/OpennedDropdown.js";import{FloatingActionButton as n}from"../floating-action-button/FloatingActionButton.js";import"../floating-action-button/FloatingActionButton.styles.js";const i=i=>{const{onSelect:e,menuOptions:d,buttonWidth:r,buttonHeight:l,buttonColor:p,buttonPosition:u,menuWidth:s,menuHeight:c,buttonIcon:a,buttonPaddingHorizontal:m,buttonPaddingVertical:g,tooltipPlacement:h,tooltipText:b,zIndex:P,isRound:x,dropPosition:f,menuAligment:j,tooltipWidth:w}=i;return t("div",{children:t(n,Object.assign({icon:a,width:r,height:l,color:p,position:u,buttonPaddingHorizontal:m,buttonPaddingVertical:g,tooltipPlacement:h,tooltipText:b,zIndex:P,isRound:x,dropPosition:f,menuAligment:j,tootipWidth:w},{children:t(o,{options:d,height:c||90,width:`${s}px`,onSelect:e,version:i.version})}))})};export{i as FABMenu};
+import{jsx as t}from"react/jsx-runtime";import{OpenedDropdown as o}from"../dropdown/OpenedDropdown/components/OpennedDropdown.js";import{FloatingActionButton as n}from"../floating-action-button/FloatingActionButton.js";import"../floating-action-button/FloatingActionButton.styles.js";const i=i=>{const{onSelect:e,menuOptions:d,buttonWidth:r,buttonHeight:l,buttonColor:p,buttonPosition:u,menuWidth:c,menuHeight:s,buttonIcon:a,buttonPaddingHorizontal:m,buttonPaddingVertical:g,tooltipPlacement:h,tooltipText:b,zIndex:P,isRound:x,dropPosition:f,menuAligment:j,tooltipWidth:w}=i;return t("div",{children:t(n,Object.assign({icon:a,width:r,height:l,color:p,position:u,buttonPaddingHorizontal:m,buttonPaddingVertical:g,tooltipPlacement:h,tooltipText:b,zIndex:P,isRound:x,dropPosition:f,menuAligment:j,tootipWidth:w},{children:t(o,{options:d,height:s||90,width:`${c}px`,onSelect:e})}))})};export{i as FABMenu};

package/dist/esm/components/helpers/FileUploaderHelper.d.ts

@@ -8,11 +8,5 @@ export declare const SIZE_LIMIT_MAP: {
 };
 export declare const SUPPORTED_FILE_FORMAT: string[];
 export declare class FileUploaderHelper {
-    validate(inputData: {
-        file?: Blob;
-        linkData?: {
-            type: string;
-            size: number;
-        };
-    }): string | undefined;
+    validate(file: Blob): string | undefined;
 }

package/dist/esm/components/helpers/FileUploaderHelper.js

@@ -1 +1 @@
-import{bytesToMB as e}from"../../utils/bytesToMB.js";const i="File type no supported",t=e=>`Max file size of ${e}MB is allowed`,p=e=>`Only ${e.toUpperCase()} format allowed`,l={image:5,video:16,application:100},o=["mp4","png","jpeg","jpg","pdf"];class s{validate(s){const{file:r,linkData:a}=s;let n=0,f="",d="";if(r)n=r.size,f=r.type.split("/")[0],d=r.type.split("/")[1];else{if(!a)return i;n=a.size,f=a.type.split("/")[0],d=a.type.split("/")[1]}if(!l[f])return i;if(e(n)>l[f])return t(l[f]);if(!o.includes(d.toLocaleLowerCase())){if("video"===f)return p("mp4");if("image"===f)return p("png, jpeg, jpg");if("application"===f)return p("pdf")}}}export{t as FILE_SIZE_REACHED,i as FILE_TYPE_NOT_SUPPORT,s as FileUploaderHelper,l as SIZE_LIMIT_MAP,o as SUPPORTED_FILE_FORMAT,p as getFileFormatErrorMessage};
+import{bytesToMB as e}from"../../utils/bytesToMB.js";const i="File type no supported",p=e=>`Max file size of ${e}mb is allowed`,t=e=>`Only ${e.toUpperCase()} format allowed`,o={image:5,video:16,application:100},r=["mp4","png","jpeg","jpg","pdf"];class a{validate(a){const l=a.size,[s,n]=a.type.split("/");if(!o[s])return i;if(e(l)>o[s])return p(o[s]);if(!r.includes(n.toLocaleLowerCase())){if("video"===s)return t("mp4");if("image"===s)return t("png, jpeg, jpg");if("application"===s)return t("pdf")}}}export{p as FILE_SIZE_REACHED,i as FILE_TYPE_NOT_SUPPORT,a as FileUploaderHelper,o as SIZE_LIMIT_MAP,r as SUPPORTED_FILE_FORMAT,t as getFileFormatErrorMessage};

package/dist/esm/components/image-compress/ImageCompress.d.ts

@@ -1,11 +1,7 @@
-export interface CompressImageOptions {
-    maxSizeMB?: number;
-}
 export interface CompressImageReturnType {
     base64: string;
     compressedFile: File;
 }
 export declare class ImageService {
-    static base64ToImage: (base64String: string) => File;
-    static compressImage: (file: File, options?: CompressImageOptions) => Promise<CompressImageReturnType>;
+    static compressImage: (file: File) => Promise<CompressImageReturnType>;
 }

package/dist/esm/components/image-compress/ImageCompress.js

@@ -1 +1 @@
-import{__awaiter as e}from"../../_virtual/_tslib.js";import r from"browser-image-compression";class t{}Object.defineProperty(t,"base64ToImage",{enumerable:!0,configurable:!0,writable:!0,value:e=>{const r=atob(e.split(",")[1]),t=e.split(",")[0].split(":")[1].split(";")[0],i=new ArrayBuffer(r.length),o=new Uint8Array(i);for(let e=0;e<r.length;e++)o[e]=r.charCodeAt(e);const l=new Blob([i],{type:t});return new File([l],"image",{type:t})}}),Object.defineProperty(t,"compressImage",{enumerable:!0,configurable:!0,writable:!0,value:(t,i)=>e(void 0,void 0,void 0,(function*(){let e=t,o="";const l=i?i.maxSizeMB:t.size/1024/1024*.8;try{const i={maxSizeMB:l,maxWidthOrHeight:1920,useWebWorker:!0};t.size/1024/1024>.1&&(e=yield r(t,i)),o=yield r.getDataUrlFromFile(e)}catch(e){console.error(e)}return{base64:o,compressedFile:e}}))});export{t as ImageService};
+import{__awaiter as e}from"../../_virtual/_tslib.js";import r from"browser-image-compression";class i{}Object.defineProperty(i,"compressImage",{enumerable:!0,configurable:!0,writable:!0,value:i=>e(void 0,void 0,void 0,(function*(){let e=i,o="";try{const t={maxSizeMB:i.size/1024/1024*.8,maxWidthOrHeight:1920,useWebWorker:!0};i.size/1024/1024>1&&(e=yield r(i,t)),o=yield r.getDataUrlFromFile(e)}catch(e){console.error(e)}return{base64:o,compressedFile:e}}))});export{i as ImageService};

package/dist/esm/components/input/Input.d.ts

@@ -1,9 +1,8 @@
-import React from 'react';
+/// <reference types="react" />
 export type InputVariant = 'default' | 'small';
 export type InputStateI = 'invalid' | 'active' | 'read-only' | 'disabled' | 'none';
-export type InputTypeI = 'number' | 'email' | 'text' | 'multiline' | 'url' | 'zip' | 'phonenumber' | 'password';
+export type InputTypeI = 'number' | 'email' | 'text' | 'multiline';
 export interface InputProps {
-    'data-test'?: string;
     noErrorHint?: boolean;
     placeholder?: string;
     variant?: InputVariant;
@@ -17,7 +16,6 @@ export interface InputProps {
         icon: React.FC;
         callback?: () => void;
     };
-    labelElement?: React.ReactNode;
     labelText?: string;
     maxCharLimit?: number;
     isRequired?: boolean;
@@ -37,21 +35,9 @@ export interface InputProps {
     suffixText?: string;
     prefixText?: string;
     value?: string;
-    reset?: boolean;
     onBlur?: (e: any) => void;
-    onFocus?: (e: any) => void;
-    onClick?: (e: any) => void;
+    onFocus?: () => void;
     isActive?: boolean;
     id?: string;
-    onReferenceInit?: (element: HTMLInputElement | HTMLTextAreaElement) => void;
-    rangeValidation?: {
-        min: number;
-        max: number;
-    };
-    noKeyDownChange?: boolean;
-    skipFocus?: boolean;
-    version?: '1.0' | '2.0';
-    textControl?: boolean;
-    noMaxCharCheck?: boolean;
 }
-export declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement | HTMLTextAreaElement | null>>;
+export declare const Input: import("react").ForwardRefExoticComponent<InputProps & import("react").RefAttributes<HTMLInputElement | HTMLTextAreaElement>>;

package/dist/esm/components/input/Input.js

@@ -1 +1 @@
-import{jsxs as e,jsx as t,Fragment as n}from"react/jsx-runtime";import{forwardRef as i,useState as l,useContext as r,useRef as o,useEffect as a}from"react";import{Button as s}from"../button/Button.js";import{isFunction as c,validateInput as u}from"./Input-helper.js";import{BodySecondary as d}from"../TypographyStyle.js";import v from"../../assets/icons/errorInfo.svg.js";import{InputStyleContext as h}from"./context/InputStyleProvider.js";import{RootContainer as p,InputFooter as g,InputWrapper as m,IconHolder as f,PrefixHolder as b,InputContainer as x,InputContainerSmall as y,SuffixHolder as j,InputHeader as C,MaxCharStyle as k}from"./Input.styled.js";const w=i(((i,w)=>{var I,O,L,T,E;const{placeholder:z,leftIcon:A,rightIcon:D,labelText:F,maxCharLimit:M,isRequired:B,hintText:S,type:K,state:R,validate:H,variant:q,button:N,suffixText:P,prefixText:V,onChangeText:W,value:G,noErrorHint:J,reset:Q,rangeValidation:U,noKeyDownChange:X,version:Y,noMaxCharCheck:Z,labelElement:$}=Object.assign({maxCharLimit:0,type:"text",variant:"default"},i),_=null==A?void 0:A.icon,ee=null==D?void 0:D.icon,[te,ne]=l(!1),[ie,le]=l(!1),[re,oe]=l(),ae="small"===q?"18px":"22px",se=r(h),[ce,ue]=l(),de=o(null),ve=null!=w?w:de;a((()=>{ue(G)}),[G]),a((()=>{var e;ve.current&&(null===(e=i.onReferenceInit)||void 0===e||e.call(i,ve.current))}),[ve]),a((()=>{const e=ve.current;if(e&&["phonenumber","zip","number"].includes(K))return e.addEventListener("wheel",me,{passive:!1}),()=>{e.removeEventListener("wheel",me)}}),[]),a((()=>{Q&&ue("")}),[Q]),a((()=>{var e;le(!!i.isActive),i.isActive&&(null===(e=ve.current)||void 0===e||e.focus())}),[i.isActive]),a((()=>{oe(i.errorMessage)}),[i.errorMessage]),a((()=>{var e;ne(!1),("invalid"===i.state||re)&&ne(!0),"active"===i.state&&(null===(e=ve.current)||void 0===e||e.focus())}),[i.state,re]),a((()=>{ne(!!re)}),[re]);const he=function(e){if(c(e)){for(var t=arguments.length,n=new Array(t>1?t-1:0),i=1;i<t;i++)n[i-1]=arguments[i];e(...n)}},pe=()=>"zip"===K?6:60,ge=e=>{const t=0!==M?M:pe();if(X||W(G||"",e),Z)return;const n=e.target.value;![8].includes(e.which)&&t>0&&n.length>=t&&e.preventDefault()},me=e=>{e.preventDefault()},fe=e=>{let t=e.target.value;const n=0!==M?M+1:pe();!Z&&n>0&&t.length>=n&&(t=t.substring(0,n-1)),W(t,e),i.textControl||ue(t);const l=H||u;if(!l||!c(l))return;const[r,o]=l(t,K,U);ne(!r),oe(i.errorMessage?i.errorMessage:o)},be=e=>{var t;i.skipFocus||le(!0),he(null===(t=i.onFocus)||void 0===t?void 0:t.call(i,e))},xe=e=>{var t;i.skipFocus||le(!1),he(null===(t=i.onBlur)||void 0===t?void 0:t.call(i,e))},ye=()=>{var l;return e(n,{children:["multiline"!==K&&t("input",{"data-test":i["data-test"],id:i.id,style:null!==(l=null==se?void 0:se.input)&&void 0!==l?l:{},ref:ve,type:["phonenumber","zip","number"].includes(K)?"number":K,value:ce,onFocus:e=>be(e),onBlur:e=>xe(e),placeholder:z||"Enter here",onChange:fe,onClick:e=>he(i.onClick),onKeyDown:e=>ge(e)}),"multiline"===K&&t("textarea",{"data-test":i["data-test"],value:ce,ref:ve,onFocus:e=>be(e),onBlur:e=>xe(e),onClick:e=>he(i.onClick),placeholder:z||"Enter here",onChange:fe,onKeyDown:e=>ge(e),maxLength:M>0?M:void 0})]})};return e(p,Object.assign({width:i.width,height:i.height,state:R,type:K,style:null!==(I=null==se?void 0:se.RootContainer)&&void 0!==I?I:{}},{children:[!J&&(!!S||!!re)&&e(g,Object.assign({invalid:!!re},{children:[!!re&&t(v,{width:16,height:16}),re||S]})),e(m,Object.assign({variant:q,state:R,width:i.width,isActive:"active"===R||ie,isInvalid:te,style:null!==(O=null==se?void 0:se.InputWrapper)&&void 0!==O?O:{},version:Y,height:i.height},{children:[!!_&&t(f,Object.assign({variant:q,iconSize:ae,onClick:()=>he(null==A?void 0:A.callback),isLeft:!0,style:null!==(L=null==se?void 0:se.IconHolder)&&void 0!==L?L:{}},{children:t(_,{})})),!!V&&t(b,Object.assign({variant:q},{children:V})),"default"===q&&t(x,Object.assign({height:i.height,type:i.type},{children:ye()})),"small"===q&&t(y,Object.assign({height:i.height,type:i.type},{children:ye()})),!!ee&&t(f,Object.assign({variant:q,iconSize:ae,onClick:()=>he(null==D?void 0:D.callback),isLeft:!1},{children:t(ee,{})})),!!P&&t(j,Object.assign({variant:q},{children:P})),N&&N.text&&t(s,{buttonText:N.text,onClick:()=>he(null==N?void 0:N.onClick)})]})),(!!F||!!M)&&e(C,Object.assign({invalid:te},{children:[$&&$,e(d,{children:[F,B?t("span",{children:"*"}):""]}),M>0&&e(k,{children:[null!==(E=null===(T=i.value)||void 0===T?void 0:T.length)&&void 0!==E?E:0,"/",M]})]}))]}))}));w.displayName="Input";export{w as Input};
+import{jsxs as e,jsx as t,Fragment as i}from"react/jsx-runtime";import{forwardRef as n,useState as l,useContext as r,useEffect as o}from"react";import{Button as a}from"../button/Button.js";import{BodySecondary as s}from"../TypographyStyle.js";import c from"../../assets/icons/errorInfo.svg.js";import{InputStyleContext as d}from"./context/InputStyleProvider.js";import{RootContainer as u,InputFooter as v,InputWrapper as h,IconHolder as p,PrefixHolder as f,InputContainer as g,InputContainerSmall as m,SuffixHolder as x,InputHeader as y,MaxCharStyle as b}from"./Input.styled.js";const j=e=>e&&"function"==typeof e,C=n(((n,C)=>{var w,I,O,T;const{placeholder:k,leftIcon:A,rightIcon:B,labelText:L,maxCharLimit:S,isRequired:D,hintText:E,type:F,state:z,validate:H,variant:K,button:M,suffixText:R,prefixText:q,onChangeText:N,value:P,noErrorHint:W}=Object.assign({maxCharLimit:0,type:"text",variant:"default"},n),G=null==A?void 0:A.icon,J=null==B?void 0:B.icon,[Q,U]=l(!1),[V,X]=l(!1),[Y,Z]=l(),$="small"===K?"18px":"22px",_=r(d);o((()=>{X(!!n.isActive)}),[n.isActive]),o((()=>{Z(n.errorMessage)}),[n.errorMessage]),o((()=>{U(!1),("invalid"===n.state||Y)&&U(!0)}),[n.state,Y]),o((()=>{U(!!Y)}),[Y]);const ee=function(e){if(j(e)){for(var t=arguments.length,i=new Array(t>1?t-1:0),n=1;n<t;n++)i[n-1]=arguments[n];e(...i)}},te=e=>{N(P||"",e),![8].includes(e.which)&&S>0&&e.target.value.length===S&&e.preventDefault()},ie=e=>{const t=e.target.value;if(N(t,e),!H||!j(H))return;const[i,n]=H(t);U(!i),Z(n)},ne=()=>{var l;return e(i,{children:["multiline"!==F&&t("input",{id:n.id,style:null!==(l=null==_?void 0:_.input)&&void 0!==l?l:{},ref:C,type:F,value:P,onFocus:()=>(X(!0),void ee(n.onFocus)),onBlur:e=>(e=>{var t;X(!1),ee(null===(t=n.onBlur)||void 0===t?void 0:t.call(n,e))})(e),placeholder:k||"Enter here",onChange:ie,onKeyDown:e=>te(e)}),"multiline"===F&&t("textarea",{value:P,ref:C,onFocus:()=>X(!0),onBlur:()=>X(!1),placeholder:k||"Enter here",onChange:ie,onKeyDown:e=>te(e)})]})};return e(u,Object.assign({width:n.width,height:n.height,state:z,type:F,style:null!==(w=null==_?void 0:_.RootContainer)&&void 0!==w?w:{}},{children:[!W&&(!!E||!!Y)&&e(v,Object.assign({invalid:!!Y},{children:[!!Y&&t(c,{width:16,height:16}),Y||E]})),e(h,Object.assign({variant:K,state:z,width:n.width,isActive:"active"===z||V,isInvalid:Q,style:null!==(I=null==_?void 0:_.InputWrapper)&&void 0!==I?I:{}},{children:[!!G&&t(p,Object.assign({variant:K,iconSize:$,onClick:()=>ee(null==A?void 0:A.callback),isLeft:!0,style:null!==(O=null==_?void 0:_.IconHolder)&&void 0!==O?O:{}},{children:t(G,{})})),!!q&&t(f,Object.assign({variant:K},{children:q})),"default"===K&&t(g,{children:ne()}),"small"===K&&t(m,{children:ne()}),!!J&&t(p,Object.assign({variant:K,iconSize:$,onClick:()=>ee(null==B?void 0:B.callback),isLeft:!1},{children:t(J,{})})),!!R&&t(x,Object.assign({variant:K},{children:R})),M&&M.text&&t(a,{buttonText:M.text,onClick:()=>ee(null==M?void 0:M.onClick)})]})),(!!L||!!S)&&"default"===K&&e(y,Object.assign({invalid:Q},{children:[e(s,{children:[L,D?t("span",{children:"*"}):""]}),S>0&&e(b,{children:[null===(T=n.value)||void 0===T?void 0:T.length,"/",S]})]}))]}))}));C.displayName="Input";export{C as Input};

package/dist/esm/components/input/Input.styled.d.ts

@@ -10,7 +10,6 @@ export declare const InputWrapper: import("@emotion/styled").StyledComponent<{
     isInvalid?: boolean | undefined;
     state?: InputStateI | undefined;
     variant?: InputVariant | undefined;
-    version?: "1.0" | "2.0" | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const IconHolder: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
@@ -31,9 +30,6 @@ export declare const InputContainer: import("@emotion/styled").StyledComponent<{
     forwardedAs?: string | import("react").ComponentType<any> | undefined;
 } & {
     theme?: import("@emotion/react").Theme | undefined;
-} & {
-    height?: string | undefined;
-    type?: InputTypeI | undefined;
 }, {}, {}>;
 export declare const InputContainerSmall: import("@emotion/styled").StyledComponent<{
     [x: string]: any;
@@ -46,9 +42,6 @@ export declare const InputContainerSmall: import("@emotion/styled").StyledCompon
     forwardedAs?: string | import("react").ComponentType<any> | undefined;
 } & {
     theme?: import("@emotion/react").Theme | undefined;
-} & {
-    height?: string | undefined;
-    type?: InputTypeI | undefined;
 }, {}, {}>;
 export declare const InputHeader: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;