@bikdotai/bik-component-library 0.0.5584-tooltip-beta → 0.0.9994--beta-chatbot

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

@@ -1,5 +1,3 @@
-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,onDropdownItemClick:b}=i;var f;function h(e){s.disabled||p(Object.assign(Object.assign({},s),{selected:e}))}return e(a,{version:u,style:g?{borderBottom:0}:{},onClick:e=>{e.preventDefault(),h(!s.selected),null==b||b(s)},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!==(f=s.disabled)&&void 0!==f&&f,isChecked:!!s.selected,onValueChange:h}),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;
+`,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.descriptions?m(n.label,n.descriptions):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

@@ -1,13 +1,8 @@
 import React from 'react';
 import { DropdownOption, SingleOption } from '../../../type';
-interface MenuListProps {
+export declare const MenuList: React.FC<{
     options: DropdownOption[];
     isMultiSelect?: boolean;
     showDescription: (title?: string, description?: string) => void;
     onSelect: (optionSelect: SingleOption) => void;
-    version?: '1.0' | '2.0';
-    onInfiniteScroll?: () => void;
-    onDropdownItemClick?: (option: DropdownOption) => void;
-}
-export declare const MenuList: React.FC<MenuListProps>;
-export {};
+}>;

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

@@ -1 +1 @@
-import{jsx as n,Fragment as e,jsxs as t}from"react/jsx-runtime";import{useRef as r,useCallback as o,useEffect as i}from"react";import{MenuItem as s}from"./MenuItem.js";import{StyledGroupedLabel as c}from"./MenuList.styled.js";const l=l=>{let{options:p,isMultiSelect:u,showDescription:a,onSelect:m,version:d,onInfiniteScroll:g,onDropdownItemClick:h}=l;const I=r(null),f=r(null),v=o((()=>{I.current&&I.current.disconnect(),I.current=new IntersectionObserver((n=>{n[0].isIntersecting&&(null==g||g())})),f.current&&I.current.observe(f.current)}),[g]);return i((()=>(v(),()=>{I.current&&I.current.disconnect()})),[v,p]),n(e,{children:p.map(((r,o)=>{const i=o===p.length-1;if(r.options){const l=r;return t("div",Object.assign({style:{marginTop:"2.0"===d?2:0}},{children:[t(c,Object.assign({version:d},{children:[l.leadingIcon?n("span",Object.assign({style:{marginRight:8}},{children:l.leadingIcon})):n(e,{}),l.label]})),l.options.map(((e,t)=>n(s,{version:d,last:t===l.options.length-1,onSelect:m,showDescription:a,onDropdownItemClick:h,isMultiSelect:u,option:e},`${o}-${t}`))),i?n("span",{ref:f}):null]}),o)}return t("div",{children:[n(s,{version:d,last:i,onSelect:m,showDescription:a,onDropdownItemClick:h,isMultiSelect:u,option:r},o),i?n("span",{ref:f}):null]},o)}))})};export{l 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.d.ts

@@ -1,11 +1,8 @@
 import React from 'react';
-import { ButtonOptions, DropdownOption } from '../../../type';
-interface MultiSelectDropdownBottomBarProps {
+import { DropdownOption } from '../../../type';
+declare const MultiSelectDropdownBottomBar: React.FC<{
     onClear?: () => void;
     onApply: () => void;
     list: DropdownOption[];
-    buttonText?: string;
-    buttonOptions?: ButtonOptions;
-}
-declare const MultiSelectDropdownBottomBar: React.FC<MultiSelectDropdownBottomBarProps>;
+}>;
 export default MultiSelectDropdownBottomBar;

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 n}from"../../../../TypographyStyle.js";import{COLORS as r}from"../../../../../constants/Theme.js";import{BottomBarContainer as s}from"./MultiSelectDropdownBottomBar.styled.js";const l=l=>{const{onClear:i,onApply:p,list:a,buttonText:c,buttonOptions:y}=l,{primaryButtonText:u,primaryButtonType:m,secondaryButtonText:d,secondaryButtonType:f}=null!=y?y:{},b=a.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(s,Object.assign({style:{justifyContent:"space-between"}},{children:[e(n,Object.assign({style:{flex:1,color:r.content.primary}},{children:b?`${b} selected`:""})),t("div",Object.assign({style:{flexDirection:"row",display:"flex",gap:12}},{children:[e(o,{size:"small",buttonType:f||"primary",buttonText:d||"Clear",onClick:i}),e(o,{size:"small",buttonText:u||c||"Apply",buttonType:m||"primary",onClick:()=>{p()}})]}))]}))};export{l 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,6 +1,4 @@
 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,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};
+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

@@ -3,31 +3,22 @@ import { DropdownOption, SingleOption } from '../../type';
 export declare function iterateOnOptions(options: DropdownOption[], newVal: Partial<SingleOption>, checkCB?: (optionForValidation: SingleOption) => boolean): ({
     label: string;
     value: string;
-    description?: string | null | undefined;
+    descriptions?: string | null | undefined;
     selected?: boolean | undefined;
     disabled?: boolean | undefined;
     isFreeForm?: boolean | undefined;
     subText?: string | undefined;
     trailingIcon?: JSX.Element | undefined;
-    leadingIcon?: JSX.Element | undefined;
     customComponent?: JSX.Element | undefined;
-    searchKey?: string | undefined;
-    selectedLabel?: string | undefined;
 } | {
     label?: string | undefined;
     value?: string | undefined;
-    description?: string | null | undefined;
+    descriptions?: string | null | undefined;
     selected?: boolean | undefined;
     disabled?: boolean | undefined;
     isFreeForm?: boolean | undefined;
     subText?: string | undefined;
     trailingIcon?: JSX.Element | undefined;
-    leadingIcon?: JSX.Element | undefined;
     customComponent?: JSX.Element | undefined;
-    searchKey?: string | undefined;
-    selectedLabel?: string | undefined;
     options: SingleOption[];
 })[];
-export declare function iterateOnOptionsRaw(options: DropdownOption[], cb: (option: SingleOption) => void): void;
-export declare function getSelectedOptionsAsText(selectedOption: DropdownOption[]): string | undefined;
-export declare function getSelectedOptionsAsArray(selectedOption: DropdownOption[]): string[];

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

@@ -1 +1 @@
-function n(n,t,s){return n.map((n=>{if(n.options){const e=n.options.map((n=>!s||s(n)?Object.assign(Object.assign({},n),t):Object.assign({},n)));return Object.assign(Object.assign({},n),{options:[...e]})}return!s||s(n)?Object.assign(Object.assign({},n),t):Object.assign({},n)}))}function t(n,t){n.forEach((n=>{n.options?n.options.forEach(t):t(n)}))}function s(n){if(n&&n.length)return n.map((n=>{var t;const s=n;return null!==(t=s.selectedLabel)&&void 0!==t?t:s.label})).join(", ")}export{s as getSelectedOptionsAsText,n as iterateOnOptions,t 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,6 +1,4 @@
 /// <reference types="react" />
-import { Placement, PositioningStrategy } from '@popperjs/core';
-import { Type } from '../button/model';
 export interface OpenDropdownProps {
     defaultOptions?: DropdownOption[];
     options: DropdownOption[];
@@ -10,47 +8,23 @@ 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;
-    headerRef?: any;
-    hideSelectAll?: boolean;
-    primaryButtonText?: string;
-    onInfiniteScroll?: () => void;
-    onMultiSelectClear?: () => void;
-    onDropdownItemClick?: (option: DropdownOption) => void;
-    buttonOptions?: ButtonOptions;
-    isSearchLoading?: boolean;
 }
 export type GroupedOption = {
     label?: string;
-    leadingIcon?: JSX.Element;
     options: (SingleOption | MultiSelectOption)[];
 };
 export type SingleOption = {
     label: string;
     value: string;
-    description?: string | null;
+    descriptions?: string | null;
     selected?: boolean;
     disabled?: boolean;
     isFreeForm?: boolean;
     subText?: string;
     trailingIcon?: JSX.Element;
-    leadingIcon?: JSX.Element;
     customComponent?: JSX.Element;
-    searchKey?: string;
-    selectedLabel?: string;
 };
 export type MultiSelectOption = SingleOption;
 export type DropdownOption = MultiSelectOption | SingleOption | GroupedOption;
-export interface ButtonOptions {
-    primaryButtonText?: string;
-    primaryButtonType?: Type;
-    secondaryButtonText?: string;
-    secondaryButtonType?: Type;
-}
-export type { Placement };

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import { DropdownOption } from '../dropdown/type';
 import { DROP_POSITION, FAB_POSITION, MENU_ALIGNMENT } from '../floating-action-button/FloatingActionButton.styles';
-import { Placement } from '../tooltips';
+import { TooltipPlacement } from '../tooltips';
 export declare const FABMenu: React.FC<{
     onSelect: (selected: DropdownOption | DropdownOption[]) => void;
     menuOptions: DropdownOption[];
@@ -14,12 +14,10 @@ export declare const FABMenu: React.FC<{
     buttonIcon?: JSX.Element;
     buttonPaddingHorizontal?: number;
     buttonPaddingVertical?: number;
-    tooltipPlacement?: Placement;
+    tooltipPlacement?: TooltipPlacement;
     tooltipText?: string;
-    tooltipWidth?: number;
     zIndex?: number;
     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:u,buttonPosition:p,menuWidth:c,menuHeight:s,buttonIcon:a,buttonPaddingHorizontal:m,buttonPaddingVertical:g,tooltipPlacement:b,tooltipText:h,zIndex:P,isRound:x,dropPosition:f,menuAligment:j}=i;return t("div",{children:t(n,Object.assign({icon:a,width:r,height:l,color:u,position:p,buttonPaddingHorizontal:m,buttonPaddingVertical:g,tooltipPlacement:b,tooltipText:h,zIndex:P,isRound:x,dropPosition:f,menuAligment:j},{children:t(o,{options:d,height:s||90,width:`${c}px`,onSelect:e})}))})};export{i as FABMenu};

package/dist/esm/components/floating-action-button/FloatingActionButton.d.ts

@@ -1,6 +1,6 @@
 import 'bootstrap/dist/css/bootstrap.min.css';
 import React from 'react';
-import { Placement } from '../tooltips';
+import { TooltipPlacement } from '../tooltips/CustomisedTooltip';
 import { DROP_POSITION, FAB_POSITION, MENU_ALIGNMENT } from './FloatingActionButton.styles';
 export declare const FloatingActionButton: React.FC<{
     onClick?: () => void;
@@ -13,10 +13,9 @@ export declare const FloatingActionButton: React.FC<{
     buttonPaddingHorizontal?: number;
     buttonPaddingVertical?: number;
     tooltipText?: string;
-    tooltipPlacement?: Placement;
+    tooltipPlacement?: TooltipPlacement;
     zIndex?: number;
     isRound?: boolean;
     dropPosition?: DROP_POSITION;
     menuAligment?: MENU_ALIGNMENT;
-    tootipWidth?: number;
 }>;

package/dist/esm/components/floating-action-button/FloatingActionButton.js

@@ -1 +1 @@
-import{jsx as t,Fragment as o,jsxs as i}from"react/jsx-runtime";import{useState as n}from"react";import{Dropdown as e}from"react-bootstrap";import{COLORS as r}from"../../constants/Theme.js";import{Tooltip as c}from"../tooltips/Tooltip.js";import{BodyCaption as l}from"../TypographyStyle.js";import s from"../../assets/icons/question-mark.svg.js";import{FAB_POSITION as d,DROP_POSITION as h,MENU_ALIGNMENT as p,FloatingActionButtonOuterContainer as a,StyledDropdown as g,DropdownToggleContainer as m,TooltipStyled as u,FloatingActionButtonContainer as b}from"./FloatingActionButton.styles.js";const j=i=>{const{width:n,height:e,color:d,onClick:h,icon:p,tooltipPlacement:a,tooltipText:g,tootipWidth:m,isRound:j}=i;return g?t(c,Object.assign({tooltipContent:t(u,Object.assign({tooltipWidth:m},{children:t(l,Object.assign({color:r.content.primaryInverse},{children:i.tooltipText}))})),placement:a,body:""},{children:t(b,Object.assign({width:n,height:e,color:d,onClick:h,isRound:j},{children:p||t(s,{width:22,height:22})}))})):t(o,{children:t(b,Object.assign({width:n,height:e,color:d,onClick:h,isRound:j},{children:p||t(s,{width:22,height:22})}))})},O=c=>{const{icon:l,onClick:s,children:u,tooltipText:b,isRound:O=!0,width:w=48,height:T=48,color:P=r.background.inverse,position:x=d.TOP_LEFT,buttonPaddingHorizontal:f=20,buttonPaddingVertical:k=20,zIndex:C=1,tooltipPlacement:y="right",dropPosition:R=h.DOWN,menuAligment:W=p.END,tootipWidth:z}=c,[D,v]=n(!1);return t(o,{children:t(a,Object.assign({width:w,height:T,color:P,position:x,buttonPaddingHorizontal:f,buttonPaddingVertical:k,zIndex:C},{children:t(g,Object.assign({onToggle:(t,o)=>{v(t)},drop:R,align:W},{children:u?i(o,{children:[t(m,Object.assign({drop:R},{children:t(j,{width:w,height:T,color:P,tooltipPlacement:y,onClick:s,tooltipText:b,icon:l,position:x,isRound:O,isDropdownOpen:D,tootipWidth:z})})),t(e.Menu,{children:u})]}):t(j,{width:w,height:T,color:P,tooltipPlacement:y,onClick:s,tooltipText:b,icon:l,position:x,isRound:O,isDropdownOpen:D,tootipWidth:z})}))}))})};export{O as FloatingActionButton};
+import{jsx as o,Fragment as t,jsxs as i}from"react/jsx-runtime";import{useState as n}from"react";import{Dropdown as e}from"react-bootstrap";import{COLORS as r}from"../../constants/Theme.js";import{TooltipPlacement as l,CustomisedTooltip as c}from"../tooltips/CustomisedTooltip.js";import s from"../../assets/icons/question-mark.svg.js";import{FAB_POSITION as d,DROP_POSITION as h,MENU_ALIGNMENT as p,FloatingActionButtonOuterContainer as a,StyledDropdown as g,DropdownToggleContainer as m,FloatingActionButtonContainer as u}from"./FloatingActionButton.styles.js";const w=i=>{const{width:n,height:e,color:r,onClick:l,icon:d,tooltipPlacement:h,tooltipText:p,isRound:a,isDropdownOpen:g}=i;return p?o(c,{isTooltipVisible:!g,tooltipContent:o(t,{children:p}),tooltipTriggerContent:o(u,Object.assign({width:n,height:e,color:r,onClick:l,isRound:a},{children:d||o(s,{width:22,height:22})})),tooltipPlacement:h,showOnHover:!0}):o(t,{children:o(u,Object.assign({width:n,height:e,color:r,onClick:l,isRound:a},{children:d||o(s,{width:22,height:22})}))})},b=c=>{const{icon:s,onClick:u,children:b,tooltipText:O,isRound:P=!0,width:T=48,height:j=48,color:C=r.background.inverse,position:k=d.TOP_LEFT,buttonPaddingHorizontal:x=20,buttonPaddingVertical:f=20,zIndex:R=1,tooltipPlacement:D=l.Auto,dropPosition:z=h.DOWN,menuAligment:v=p.END}=c,[A,H]=n(!1);return o(t,{children:o(a,Object.assign({width:T,height:j,color:C,position:k,buttonPaddingHorizontal:x,buttonPaddingVertical:f,zIndex:R},{children:o(g,Object.assign({onToggle:(o,t)=>{H(o)},drop:z,align:v},{children:b?i(t,{children:[o(m,Object.assign({drop:z},{children:o(w,{width:T,height:j,color:C,tooltipPlacement:D,onClick:u,tooltipText:O,icon:s,position:k,isRound:P,isDropdownOpen:A})})),o(e.Menu,{children:b})]}):o(w,{width:T,height:j,color:C,tooltipPlacement:D,onClick:u,tooltipText:O,icon:s,position:k,isRound:P,isDropdownOpen:A})}))}))})};export{b as FloatingActionButton};

package/dist/esm/components/floating-action-button/FloatingActionButton.styles.d.ts

@@ -21,7 +21,7 @@ export declare const FloatingActionButtonContainer: import("styled-components").
     width: number;
     height: number;
     color: string;
-    isRound?: boolean | undefined;
+    isRound: boolean;
 }, never>;
 export declare const FloatingActionButtonOuterContainer: import("styled-components").StyledComponent<"div", any, {
     width: number;
@@ -45,6 +45,3 @@ export declare const StyledDropdown: import("styled-components").StyledComponent
     height?: string | undefined;
 }, never>;
 export declare const DropdownToggleContainer: import("styled-components").StyledComponent<import("react-bootstrap/esm/helpers").BsPrefixRefForwardingComponent<"button", import("react-bootstrap/esm/DropdownToggle").DropdownToggleProps>, any, {}, never>;
-export declare const TooltipStyled: import("styled-components").StyledComponent<"div", any, {
-    tooltipWidth?: number | undefined;
-}, never>;

package/dist/esm/components/floating-action-button/FloatingActionButton.styles.js

@@ -1,4 +1,4 @@
-import{Dropdown as t}from"react-bootstrap";import o from"styled-components";import{COLORS as i}from"../../constants/Theme.js";var r,e,n;!function(t){t.TOP_LEFT="top left",t.TOP_RIGHT="top right",t.BOTTOM_LEFT="bottom left",t.BOTTOM_RIGHT="botton right"}(r||(r={})),function(t){t.UP="up",t.UP_CENTERED="up-centered",t.START="start",t.END="end",t.DOWN="down",t.DOWN_CENTERED="down-centered"}(e||(e={})),function(t){t.START="start",t.END="end"}(n||(n={}));const d=o.div`
+import{Dropdown as t}from"react-bootstrap";import o from"styled-components";import{COLORS as e}from"../../constants/Theme.js";var i,r,n;!function(t){t.TOP_LEFT="top left",t.TOP_RIGHT="top right",t.BOTTOM_LEFT="bottom left",t.BOTTOM_RIGHT="botton right"}(i||(i={})),function(t){t.UP="up",t.UP_CENTERED="up-centered",t.START="start",t.END="end",t.DOWN="down",t.DOWN_CENTERED="down-centered"}(r||(r={})),function(t){t.START="start",t.END="end"}(n||(n={}));const d=o.div`
 	width: ${t=>t.width}px;
 	height: ${t=>t.height}px;
 	background: ${t=>t.color};
@@ -7,7 +7,7 @@ import{Dropdown as t}from"react-bootstrap";import o from"styled-components";impo
 	align-items: center;
 	cursor: pointer;
 	display: flex;
-`,p=o.div`
+`,a=o.div`
 	display: flex;
 	border-radius: 50%;
 	flex-direction: column;
@@ -16,8 +16,8 @@ import{Dropdown as t}from"react-bootstrap";import o from"styled-components";impo
 	width: ${t=>t.width}px;
 	height: ${t=>t.height}px;
 	z-index: ${t=>t.zIndex};
-	${t=>t.position===r.BOTTOM_RIGHT?`right: ${t.buttonPaddingHorizontal}px; bottom: ${t.buttonPaddingVertical}px`:t.position===r.BOTTOM_LEFT?`left: ${t.buttonPaddingHorizontal}px; bottom: ${t.buttonPaddingVertical}px`:t.position===r.TOP_LEFT?`left: ${t.buttonPaddingHorizontal}px; top: ${t.buttonPaddingVertical}px`:t.position===r.TOP_RIGHT?`right: ${t.buttonPaddingHorizontal}px; top: ${t.buttonPaddingVertical}px`:""};
-`,a=o(t)`
+	${t=>t.position===i.BOTTOM_RIGHT?`right: ${t.buttonPaddingHorizontal}px; bottom: ${t.buttonPaddingVertical}px`:t.position===i.BOTTOM_LEFT?`left: ${t.buttonPaddingHorizontal}px; bottom: ${t.buttonPaddingVertical}px`:t.position===i.TOP_LEFT?`left: ${t.buttonPaddingHorizontal}px; top: ${t.buttonPaddingVertical}px`:t.position===i.TOP_RIGHT?`right: ${t.buttonPaddingHorizontal}px; top: ${t.buttonPaddingVertical}px`:""};
+`,p=o(t)`
 	.filter-container {
 		.single-row {
 			display: flex;
@@ -26,7 +26,7 @@ import{Dropdown as t}from"react-bootstrap";import o from"styled-components";impo
 			justify-content: flex-start;
 			gap: 8px;
 			padding: 14px;
-			border-bottom: 1px solid ${i.stroke.primary};
+			border-bottom: 1px solid ${e.stroke.primary};
 
 			:last-child {
 				border-bottom: none !important;
@@ -35,15 +35,15 @@ import{Dropdown as t}from"react-bootstrap";import o from"styled-components";impo
 	}
 	button {
 		border: 1px solid
-			${t=>"true"===t.active?i.stroke.positive.lightAlt:i.stroke.primary};
+			${t=>"true"===t.active?e.stroke.positive.lightAlt:e.stroke.primary};
 		border-radius: 4px;
 		display: flex;
 		flex-direction: row;
 		align-items: center;
 		justify-content: space-between;
 		padding: 6px 0px;
-		background: ${t=>"true"===t.active?i.background.positive.light:i.surface.standard};
-		color: ${t=>"true"===t.active?i.content.positive:i.content.primary};
+		background: ${t=>"true"===t.active?e.background.positive.light:e.surface.standard};
+		color: ${t=>"true"===t.active?e.content.positive:e.content.primary};
 	}
 
 	.btn-primary:hover,
@@ -51,8 +51,8 @@ import{Dropdown as t}from"react-bootstrap";import o from"styled-components";impo
 	.btn-primary:focus,
 	.btn-primary.dropdown-toggle,
 	.show > .btn-primary.dropdown-toggle {
-		color: ${t=>"true"===t.active?i.content.positive:i.content.primary};
-		background-color: ${t=>"true"===t.active?i.background.positive.light:"transparent"};
+		color: ${t=>"true"===t.active?e.content.positive:e.content.primary};
+		background-color: ${t=>"true"===t.active?e.background.positive.light:"transparent"};
 		border: none;
 	}
 	.btn:focus {
@@ -61,13 +61,13 @@ import{Dropdown as t}from"react-bootstrap";import o from"styled-components";impo
 	}
 
 	.dropdown-toggle::after {
-		border-top: 0.3em solid ${i.content.primary};
-		display: none !important;
+		border-top: 0.3em solid ${e.content.primary};
+		display: none;
 	}
 
 	.dropdown-toggle::before {
-		border-top: 0.3em solid ${i.content.primary};
-		display: none !important;
+		border-top: 0.3em solid ${e.content.primary};
+		display: none;
 	}
 	.dropdown-menu {
 		min-width: 12rem;
@@ -75,9 +75,9 @@ import{Dropdown as t}from"react-bootstrap";import o from"styled-components";impo
 	}
 	.dropdown-item:active,
 	.dropdown-item:hover {
-		color: ${i.content.positive};
+		color: ${e.content.positive};
 		text-decoration: none;
-		background-color: ${i.background.positive.light};
+		background-color: ${e.background.positive.light};
 	}
 `,s=o(t.Toggle)`
 	border-radius: 4px;
@@ -89,11 +89,4 @@ import{Dropdown as t}from"react-bootstrap";import o from"styled-components";impo
 	font-weight: 400;
 	font-size: 14px;
 	line-height: 20px;
-`,l=o.div`
-	box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.12);
-	border-radius: 4px;
-	padding: 8px;
-	background-color: ${i.content.primary};
-	color: ${i.content.primaryInverse};
-	width: ${t=>t.tooltipWidth?t.tooltipWidth+"px":"120px"};
-`;export{e as DROP_POSITION,s as DropdownToggleContainer,r as FAB_POSITION,d as FloatingActionButtonContainer,p as FloatingActionButtonOuterContainer,n as MENU_ALIGNMENT,a as StyledDropdown,l as TooltipStyled};
+`;export{r as DROP_POSITION,s as DropdownToggleContainer,i as FAB_POSITION,d as FloatingActionButtonContainer,a as FloatingActionButtonOuterContainer,n as MENU_ALIGNMENT,p as StyledDropdown};

package/dist/esm/components/icon-button/IconButton.js

@@ -1 +1 @@
-import{__rest as e}from"../../_virtual/_tslib.js";import{jsx as t}from"react/jsx-runtime";import o,{forwardRef as i}from"react";import{IconButton as r}from"./IconButton.styled.js";import{getIconColor as s}from"./theme.js";const d=i(((i,d)=>{var{id:l,iconButtonType:n="default",Icon:c,height:a=20,width:m=20,bordered:y,disabled:h,isSelected:p,style:u,svgStyle:b,iconColor:f}=i,g=e(i,["id","iconButtonType","Icon","height","width","bordered","disabled","isSelected","style","svgStyle","iconColor"]);const j=s(n,h,p);return t(r,Object.assign({id:l,ref:d,style:u,iconButtonType:n,bordered:y,disabled:h,isSelected:p},g,{children:o.createElement(c,{height:a,width:m,color:f||j,style:Object.assign({display:"block"},null!=b?b:{})})}))}));d.displayName="IconButton";export{d as IconButton};
+import{__rest as e}from"../../_virtual/_tslib.js";import{jsx as t}from"react/jsx-runtime";import o,{forwardRef as i}from"react";import{IconButton as r}from"./IconButton.styled.js";import{getIconColor as d}from"./theme.js";const s=i(((i,s)=>{var{id:n,iconButtonType:c="default",Icon:l,height:a=20,width:m=20,bordered:h,disabled:p,isSelected:u,style:y}=i,b=e(i,["id","iconButtonType","Icon","height","width","bordered","disabled","isSelected","style"]);const f=d(c,p,u);return t(r,Object.assign({id:n,ref:s,style:y,iconButtonType:c,bordered:h,disabled:p,isSelected:u},b,{children:o.createElement(l,{height:a,width:m,color:f,style:{display:"block"}})}))}));s.displayName="IconButton";export{s as IconButton};

package/dist/esm/components/icon-button/IconButton.styled.js

@@ -1,3 +1,3 @@
 import t from"styled-components";import{COLORS as n}from"../../constants/Theme.js";import{generateBackgroundColor as o}from"./theme.js";const r=t.button`
-	${t=>`\n\tall: unset;\n\tcursor: pointer;\n\tpadding: 6px;\n\tborder-radius: 4px;\n\tflex-wrap: wrap;\n\t${t.bordered&&"ai"!==t.iconButtonType?`border: 1px solid ${n.stroke.primary};`:""}\n\t${t.isSelected?`\n\t\t\tbackground: ${o(t.iconButtonType)};\n\t\t\t\t`:"\n\t\t\t\t:hover {\n\t\t\t\t\tbackground-color: rgba(0, 0, 0, 0.03);\n\t\t\t\t}\n\t\t\t"}\n\t${t.disabled&&"\n\t\t\tcursor: not-allowed !important;\n\t\t\tbackground-color: rgba(0, 0, 0, 0.03);\n\t\t"}\n\n\t`}
+	${t=>`\n\tall: unset;\n\tcursor: pointer;\n\tpadding: 6px;\n\tborder-radius: 4px;\n\tflex-wrap: wrap;\n\t${t.bordered?`border: 1px solid ${n.stroke.primary};`:""}\n\t${t.isSelected?`\n\t\t\tbackground-color: ${o(t.iconButtonType)};\n\t\t\t\t`:"\n\t\t\t\t:hover {\n\t\t\t\t\tbackground-color: rgba(0, 0, 0, 0.03);\n\t\t\t\t}\n\t\t\t"}\n\t${t.disabled&&"\n\t\t\tcursor: not-allowed !important;\n\t\t\tbackground-color: rgba(0, 0, 0, 0.03);\n\t\t"}\n\n\t`}
 `;export{r as IconButton};

package/dist/esm/components/icon-button/model.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export type IconButtonType = 'default' | 'negative' | 'positive' | 'warning' | 'ai';
+export type IconButtonType = 'default' | 'negative' | 'positive' | 'warning';
 export interface IconButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
     /**
      * Icon to render
@@ -10,11 +10,6 @@ export interface IconButtonProps extends React.ButtonHTMLAttributes<HTMLButtonEl
      * @default default undefined
      */
     style?: React.CSSProperties;
-    /**
-     * Custom styles which can be added to the svg
-     * @default default undefined
-     */
-    svgStyle?: React.CSSProperties;
     /**
      * Custom height for the svg icon
      * @default default 20
@@ -39,5 +34,4 @@ export interface IconButtonProps extends React.ButtonHTMLAttributes<HTMLButtonEl
      * Flag to check if icon button is selected/clicked
      */
     isSelected?: boolean;
-    iconColor?: string;
 }

package/dist/esm/components/icon-button/theme.js

@@ -1 +1 @@
-import{COLORS as t}from"../../constants/Theme.js";const n=(n,e,r)=>{if(e)return t.content.inactive;switch(n){case"default":return r?t.content.brand:t.content.primary;case"negative":return t.content.negative;case"positive":return t.content.positive;case"warning":return r?t.content.warning:t.content.primary;default:return t.content.primary}},e=n=>"default"===n?t.background.brandLight:"negative"===n?t.background.negative.light:"positive"===n?t.background.positive.light:"ai"===n?t.surface.aiLight:t.background.warning.light;export{e as generateBackgroundColor,n as getIconColor};
+import{COLORS as t}from"../../constants/Theme.js";const n=(n,e,r)=>{if(e)return t.content.inactive;switch(n){case"default":return r?t.content.brand:t.content.primary;case"negative":return t.content.negative;case"positive":return t.content.positive;case"warning":return r?t.content.warning:t.content.primary;default:return t.content.primary}},e=n=>"default"===n?t.background.brandLight:"negative"===n?t.background.negative.light:"positive"===n?t.background.positive.light:t.background.warning.light;export{e as generateBackgroundColor,n as getIconColor};

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,10 +1,8 @@
-import React from 'react';
+/// <reference types="react" />
 export type InputVariant = 'default' | 'small';
-export type InputStateI = 'invalid' | 'active' | 'read-only' | 'disabled' | 'disabled-invalid' | 'none';
-export type InputTypeI = 'number' | 'email' | 'text' | 'multiline' | 'url' | 'zip' | 'phonenumber' | 'password';
+export type InputStateI = 'invalid' | 'active' | 'read-only' | 'disabled' | 'none';
+export type InputTypeI = 'number' | 'email' | 'text' | 'multiline';
 export interface InputProps {
-    'data-test'?: string;
-    noErrorHint?: boolean;
     placeholder?: string;
     variant?: InputVariant;
     width?: string;
@@ -17,7 +15,6 @@ export interface InputProps {
         icon: React.FC;
         callback?: () => void;
     };
-    labelElement?: React.ReactNode;
     labelText?: string;
     maxCharLimit?: number;
     isRequired?: boolean;
@@ -29,7 +26,7 @@ export interface InputProps {
         validate:  function takes the input and returns boolean + string (error message in case of invalid input)
      **/
     validate?: (input?: string | number) => [boolean, string];
-    onChangeText: (input: string, event?: Event) => void;
+    onChangeText: (input: string) => void;
     button?: {
         text: string;
         onClick?: () => void;
@@ -37,28 +34,7 @@ export interface InputProps {
     suffixText?: string;
     prefixText?: string;
     value?: string;
-    reset?: boolean;
-    onBlur?: (e: any) => void;
-    onFocus?: (e: any) => void;
-    onClick?: (e: any) => 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;
-    tooltipText?: string;
-    autoGrow?: boolean;
-    minHeight?: string;
-    maxHeight?: string;
-    labelTextBold?: boolean;
-    truncateText?: boolean;
-    maxCharLimitPosition?: 'TOP' | 'BOTTOM';
+    onBlur?: () => void;
+    onFocus?: () => void;
 }
-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 i}from"react/jsx-runtime";import n from"../../assets/icons/info.svg.js";import{forwardRef as l,useState as r,useContext as o,useRef as a,useEffect as s}from"react";import{Button as c}from"../button/Button.js";import{isFunction as u,validateInput as h}from"./Input-helper.js";import{Tooltip as d}from"../tooltips/Tooltip.js";import{TitleSmall as v,BodySecondary as p}from"../TypographyStyle.js";import{COLORS as g}from"../../constants/Theme.js";import m from"../../assets/icons/errorInfo.svg.js";import{InputStyleContext as f}from"./context/InputStyleProvider.js";import{RootContainer as x,InputFooter as b,MaxCharStyle as y,InputWrapper as j,IconHolder as O,PrefixHolder as C,InputContainer as T,InputContainerSmall as w,SuffixHolder as k,InputHeader as I}from"./Input.styled.js";const L=l(((l,L)=>{var B,H,M,E,z,A,D;const{placeholder:F,leftIcon:P,rightIcon:N,labelText:S,maxCharLimit:K,isRequired:R,hintText:G,type:_,state:q,validate:V,variant:W,button:$,suffixText:J,prefixText:Q,onChangeText:U,value:X,noErrorHint:Y,reset:Z,rangeValidation:ee,noKeyDownChange:te,version:ie,noMaxCharCheck:ne,labelElement:le,autoGrow:re,minHeight:oe,maxHeight:ae,labelTextBold:se,truncateText:ce,maxCharLimitPosition:ue}=Object.assign({maxCharLimit:0,type:"text",variant:"default",maxCharLimitPosition:"TOP"},l),he=null==P?void 0:P.icon,de=null==N?void 0:N.icon,[ve,pe]=r(!1),[ge,me]=r(!1),[fe,xe]=r(),be="small"===W?"18px":"22px",ye=o(f),[je,Oe]=r(),Ce=a(null),Te=null!=L?L:Ce;s((()=>{Oe(X),!X&&re&&(Te.current.style.height=oe||"48px")}),[X]),s((()=>{var e;Te.current&&(null===(e=l.onReferenceInit)||void 0===e||e.call(l,Te.current))}),[Te]),s((()=>{const e=Te.current;if(e&&["phonenumber","zip","number"].includes(_))return e.addEventListener("wheel",Le,{passive:!1}),()=>{e.removeEventListener("wheel",Le)}}),[]),s((()=>{Z&&Oe("")}),[Z]),s((()=>{var e;me(!!l.isActive),l.isActive&&(null===(e=Te.current)||void 0===e||e.focus())}),[l.isActive]),s((()=>{xe(l.errorMessage)}),[l.errorMessage]),s((()=>{var e;pe(!1),("invalid"===l.state||fe||"disabled-invalid"===l.state)&&pe(!0),"active"===l.state&&(null===(e=Te.current)||void 0===e||e.focus())}),[l.state,fe]),s((()=>{pe(!!fe||"invalid"===l.state)}),[fe,l.state]);const we=function(e){if(u(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)}},ke=()=>"zip"===_?6:2e3,Ie=e=>{const t=0!==K?K:ke();if(te||U(X||"",e),ne)return;const i=e.target.value;![8].includes(e.which)&&t>0&&i.length>=t&&e.preventDefault()},Le=e=>{e.preventDefault()},Be=e=>{let t=e.target.value;const i=0!==K?K+1:ke();!ne&&i>0&&t.length>=i&&(t=t.substring(0,i-1)),U(t,e),l.textControl||Oe(t),re&&(Te.current.style.height=`${Te.current.scrollHeight}px`,t||(Te.current.style.height=oe||"48px"));const n=V||h;if(!n||!u(n))return;const[r,o]=n(t,_,ee);pe(!r),xe(l.errorMessage?l.errorMessage:o)},He=e=>{var t;l.skipFocus||me(!0),we(null===(t=l.onFocus)||void 0===t?void 0:t.call(l,e))},Me=e=>{var t;l.skipFocus||me(!1),we(null===(t=l.onBlur)||void 0===t?void 0:t.call(l,e))},Ee=()=>{var n;return e(i,{children:["multiline"!==_&&t("input",{className:ce?"truncate-class":"","data-test":l["data-test"],id:l.id,style:null!==(n=null==ye?void 0:ye.input)&&void 0!==n?n:{},ref:Te,type:["phonenumber","zip","number"].includes(_)?"number":_,value:je,onFocus:e=>He(e),onBlur:e=>Me(e),placeholder:F||"Enter here",onChange:Be,onClick:e=>we(l.onClick),onKeyDown:e=>Ie(e)}),"multiline"===_&&t("textarea",{"data-test":l["data-test"],value:je,ref:Te,onFocus:e=>He(e),onBlur:e=>Me(e),onClick:e=>we(l.onClick),placeholder:F||"Enter here",onChange:Be,onKeyDown:e=>Ie(e),maxLength:K>0?K:void 0})]})};return e(x,Object.assign({width:l.width,height:l.height,state:q,type:_,style:null!==(B=null==ye?void 0:ye.RootContainer)&&void 0!==B?B:{}},{children:[e("div",Object.assign({className:"flex-align-center"},{children:[!Y&&(!!G||!!fe)&&e(b,Object.assign({invalid:!!fe},{children:[!!fe&&t(m,{width:16,height:16}),fe||G]})),K>0&&"BOTTOM"===ue&&e(y,Object.assign({position:"BOTTOM"},{children:[null!==(M=null===(H=l.value)||void 0===H?void 0:H.length)&&void 0!==M?M:0,"/",K]}))]})),e(j,Object.assign({variant:W,state:q,width:l.width,isActive:"active"===q||ge,isInvalid:ve,style:null!==(E=null==ye?void 0:ye.InputWrapper)&&void 0!==E?E:{},version:ie,height:l.height},{children:[!!he&&t(O,Object.assign({variant:W,iconSize:be,onClick:()=>we(null==P?void 0:P.callback),isLeft:!0,style:null!==(z=null==ye?void 0:ye.IconHolder)&&void 0!==z?z:{}},{children:t(he,{})})),!!Q&&t(C,Object.assign({variant:W},{children:Q})),"default"===W&&t(T,Object.assign({height:l.height,type:l.type,minHeight:oe,maxHeight:ae,autoGrow:re},{children:Ee()})),"small"===W&&t(w,Object.assign({height:l.height,type:l.type},{children:Ee()})),!!de&&t(O,Object.assign({variant:W,iconSize:be,onClick:()=>we(null==N?void 0:N.callback),isLeft:!1},{children:t(de,{})})),!!J&&t(k,Object.assign({variant:W},{children:J})),$&&$.text&&t(c,{buttonText:$.text,onClick:()=>we(null==$?void 0:$.onClick)})]})),(!!S||!!K)&&e(I,Object.assign({invalid:ve},{children:[le&&le,e("div",Object.assign({className:"label__container"},{children:[e(se?v:p,{children:[S,R?t("span",{children:"*"}):""]}),l.tooltipText&&t(d,Object.assign({body:l.tooltipText,placement:"top"},{children:t("span",{children:t(n,{style:{marginTop:-3},width:18,height:18,color:ve?g.content.negative:g.content.primary})})}))]})),K>0&&"TOP"===ue&&e(y,{children:[null!==(D=null===(A=l.value)||void 0===A?void 0:A.length)&&void 0!==D?D:0,"/",K]})]}))]}))}));L.displayName="Input";export{L as Input};
+import{jsxs as e,jsx as t,Fragment as n}from"react/jsx-runtime";import{forwardRef as i,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 h,InputWrapper as v,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=i(((i,C)=>{var I,O,w;const{placeholder:T,leftIcon:k,rightIcon:B,labelText:L,maxCharLimit:S,isRequired:D,hintText:F,type:z,state:A,validate:E,variant:K,button:M,suffixText:R,prefixText:q,onChangeText:H,value:N}=Object.assign({maxCharLimit:0,type:"text",variant:"default"},i),P=null==k?void 0:k.icon,W=null==B?void 0:B.icon,[G,J]=l(""),[Q,U]=l(!1),[V,X]=l(!1),[Y,Z]=l(),$="small"===K?"18px":"22px",_=r(d);o((()=>{Z(i.errorMessage)}),[i.errorMessage]),o((()=>{U(!1),("invalid"===i.state||Y)&&U(!0)}),[i.state,Y]),o((()=>{U(!!Y)}),[Y]),o((()=>{if(H(G),!E||!j(E))return;const[e,t]=E(G);U(!e),Z(t)}),[G]);const ee=function(e){if(j(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)}},te=e=>{![8].includes(e.which)&&S>0&&e.target.value.length===S&&e.preventDefault()},ne=e=>{J(e.target.value)},ie=()=>{var l;return e(n,{children:["multiline"!==z&&t("input",{style:null!==(l=null==_?void 0:_.input)&&void 0!==l?l:{},ref:C,type:z,value:N,onFocus:()=>(X(!0),void ee(i.onFocus)),onBlur:()=>(X(!1),void ee(i.onBlur)),placeholder:T||"Enter here",onChange:ne,onKeyDown:e=>te(e)}),"multiline"===z&&t("textarea",{value:N,ref:C,onFocus:()=>X(!0),onBlur:()=>X(!1),placeholder:T||"Enter here",onChange:ne,onKeyDown:e=>te(e)})]})};return e(u,Object.assign({width:i.width,height:i.height,state:A,type:z,style:null!==(I=null==_?void 0:_.RootContainer)&&void 0!==I?I:{}},{children:[(!!F||!!Y)&&e(h,Object.assign({invalid:!!Y},{children:[!!Y&&t(c,{}),Y||F]})),e(v,Object.assign({variant:K,state:A,width:i.width,isActive:"active"===A||V,isInvalid:Q,style:null!==(O=null==_?void 0:_.InputWrapper)&&void 0!==O?O:{}},{children:[!!P&&t(p,Object.assign({variant:K,iconSize:$,onClick:()=>ee(null==k?void 0:k.callback),isLeft:!0,style:null!==(w=null==_?void 0:_.IconHolder)&&void 0!==w?w:{}},{children:t(P,{})})),!!q&&t(f,Object.assign({variant:K},{children:q})),"default"===K&&t(g,{children:ie()}),"small"===K&&t(m,{children:ie()}),!!W&&t(p,Object.assign({variant:K,iconSize:$,onClick:()=>ee(null==k?void 0:k.callback),isLeft:!1},{children:t(W,{})})),!!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:[G.length,"/",S]})]}))]}))}));C.displayName="Input";export{C as Input};