@bikdotai/bik-component-library 0.3.0-bik-layout-beta → 0.4.0-bik-layout-beta

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

@@ -0,0 +1,8 @@
+import React from 'react';
+import { DropdownOption, SingleOption } from '../../../type';
+export declare const MenuList: React.FC<{
+    options: DropdownOption[];
+    isMultiSelect?: boolean;
+    showDescription: (title?: string, description?: string) => void;
+    onSelect: (optionSelect: SingleOption) => void;
+}>;

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

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("./MenuItem.js"),s=require("./MenuList.styled.js");exports.MenuList=i=>{let{options:n,isMultiSelect:r,showDescription:o,onSelect:l}=i;return e.jsx(e.Fragment,{children:n.map(((i,u)=>{const c=u===n.length-1;if(i.options){const n=i;return e.jsxs("div",{children:[e.jsx(s.StyledGroupedLabel,{children:n.label}),n.options.map(((s,i)=>e.jsx(t.MenuItem,{last:c,onSelect:l,showDescription:o,isMultiSelect:r,option:s},i)))]},u)}return e.jsx(t.MenuItem,{last:c,onSelect:l,showDescription:o,isMultiSelect:r,option:i},u)}))})};

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

@@ -0,0 +1,3 @@
+export declare const StyledGroupedLabel: import("styled-components").StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+}, never>;

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

@@ -0,0 +1,5 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),o=require("../../../../TypographyStyle.js"),t=require("../../../../../constants/Theme.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const n=r(e).default(o.BodyCaption)`
+	padding: 8px 16px;
+	color: ${t.COLORS.content.secondary};
+	background-color: ${t.COLORS.background.base};
+`;exports.StyledGroupedLabel=n;

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

@@ -0,0 +1,7 @@
+import React from 'react';
+import { DropdownOption } from '../../../type';
+export type SelectAllCheckboxState = 'notSelected' | 'selectAll' | 'partiallySelected';
+export declare const SelectAllMenu: React.FC<{
+    options: DropdownOption[];
+    onSelect: (newState: SelectAllCheckboxState) => void;
+}>;

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

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),l=require("styled-components"),c=require("../../../../checkBox/CheckBox.js"),o=require("../../../../list-item/ListItem.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const s=r(l).default(o.ListItem)``;exports.SelectAllMenu=l=>{let{options:o,onSelect:r}=l;const[i,n]=t.useState("notSelected");function a(){"partiallySelected"===i&&r("notSelected"),"selectAll"===i&&r("notSelected"),"notSelected"===i&&r("selectAll")}return t.useEffect((()=>{const e=[];o.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)?n("selectAll"):e.filter(Boolean).length>0?n("partiallySelected"):n("notSelected")}),[o]),e.jsx(s,{onClick:e=>{e.preventDefault(),a()},listItem:{label:"Select All",value:"All"},leadingIcon:e.jsx(c.CheckBox,{isChecked:"selectAll"===i||"partiallySelected"===i,isPartiallyChecked:"partiallySelected"===i,onValueChange:a}),variant:"default"})};

package/dist/cjs/components/dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.d.ts

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

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

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

package/dist/cjs/components/dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.d.ts

@@ -0,0 +1 @@
+export declare const BottomBarContainer: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/cjs/components/dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js

@@ -0,0 +1,9 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../../../../constants/Theme.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const r=n(e).default.div`
+	display: flex;
+	padding: 8px 16px;
+	flex-direction: row;
+	align-items: center;
+	justify-content: end;
+	box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.12);
+	background: ${t.COLORS.surface.standard};
+`;exports.BottomBarContainer=r;

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

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

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

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("../../../../input/Input.js"),s=require("../../../../input/context/InputStyleProvider.js"),o=require("../../../../../constants/Theme.js"),n=require("../../../../../assets/icons/cross.svg.js"),i=require("../../../../../assets/icons/search.svg.js");exports.SearchBox=c=>{let{onSearch:a}=c;const[u,l]=r.useState(""),[p,d]=r.useState(!1);return e.jsx(s.InputStyleContext.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:"1px solid "+o.COLORS.stroke.primary,padding:"14px 16px"},IconHolder:{marginLeft:0},input:{marginLeft:4,minHeight:"100%"}}},{children:e.jsx(t.Input,{placeholder:"Search",leftIcon:{icon:()=>e.jsx(i.default,{width:24,height:24,color:o.COLORS.content.placeholder})},rightIcon:{icon:()=>u?e.jsx(n.default,{onClick:()=>{d(!0),a("")},width:24,height:24,color:o.COLORS.content.placeholder}):e.jsx(e.Fragment,{})},reset:p,onChangeText:e=>{d(!1),l(e),a(e)}})}))};

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

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

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

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

package/dist/cjs/components/dropdown/OpenedDropdown/index.d.ts

@@ -0,0 +1 @@
+export * from './components/OpennedDropdown';

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

@@ -0,0 +1,24 @@
+/// <reference types="react" />
+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;
+    selected?: boolean | undefined;
+    disabled?: boolean | undefined;
+    isFreeForm?: boolean | undefined;
+    subText?: string | undefined;
+    trailingIcon?: JSX.Element | undefined;
+    customComponent?: JSX.Element | undefined;
+} | {
+    label?: string | undefined;
+    value?: string | undefined;
+    description?: string | null | undefined;
+    selected?: boolean | undefined;
+    disabled?: boolean | undefined;
+    isFreeForm?: boolean | undefined;
+    subText?: string | undefined;
+    trailingIcon?: JSX.Element | undefined;
+    customComponent?: JSX.Element | undefined;
+    options: SingleOption[];
+})[];

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

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.iterateOnOptions=function(s,t,e){return s.map((s=>{if(s.options){const n=s.options.map((s=>!e||e(s)?Object.assign(Object.assign({},s),t):Object.assign({},s)));return Object.assign(Object.assign({},s),{options:[...n]})}return!e||e(s)?Object.assign(Object.assign({},s),t):Object.assign({},s)}))};

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

@@ -0,0 +1,4 @@
+export * from './Dropdown';
+export * from './DropdownPopover';
+export * from './OpenedDropdown';
+export * from './MenuItem/MenuItem';

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

@@ -0,0 +1,32 @@
+/// <reference types="react" />
+import { Placement } from '@popperjs/core';
+export interface OpenDropdownProps {
+    defaultOptions?: DropdownOption[];
+    options: DropdownOption[];
+    isSearchable?: boolean;
+    error?: string;
+    isMultiSelect?: boolean;
+    width?: string;
+    height?: number | string;
+    allowFreeForm?: boolean;
+    onClose?: () => void;
+    onSelect?: (option: DropdownOption | DropdownOption[]) => void;
+    placement?: Placement;
+}
+export type GroupedOption = {
+    label?: string;
+    options: (SingleOption | MultiSelectOption)[];
+};
+export type SingleOption = {
+    label: string;
+    value: string;
+    description?: string | null;
+    selected?: boolean;
+    disabled?: boolean;
+    isFreeForm?: boolean;
+    subText?: string;
+    trailingIcon?: JSX.Element;
+    customComponent?: JSX.Element;
+};
+export type MultiSelectOption = SingleOption;
+export type DropdownOption = MultiSelectOption | SingleOption | GroupedOption;

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

@@ -0,0 +1,24 @@
+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';
+export declare const FABMenu: React.FC<{
+    onSelect: (selected: DropdownOption | DropdownOption[]) => void;
+    menuOptions: DropdownOption[];
+    buttonWidth?: number;
+    buttonHeight?: number;
+    buttonColor?: string;
+    buttonPosition?: FAB_POSITION;
+    menuWidth?: number;
+    menuHeight?: number;
+    buttonIcon?: JSX.Element;
+    buttonPaddingHorizontal?: number;
+    buttonPaddingVertical?: number;
+    tooltipPlacement?: Placement;
+    tooltipText?: string;
+    tooltipWidth?: number;
+    zIndex?: number;
+    isRound?: boolean;
+    dropPosition?: DROP_POSITION;
+    menuAligment?: MENU_ALIGNMENT;
+}>;

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

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

package/dist/cjs/components/fab-menu/index.d.ts

@@ -0,0 +1 @@
+export * from './FABMenu';

package/dist/cjs/components/file-uploader/FileUploader.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { FileUploaderProps } from "./Models";
+declare const FileUploader: React.FC<FileUploaderProps>;
+export default FileUploader;

package/dist/cjs/components/file-uploader/FileUploaderStyle.d.ts

@@ -0,0 +1,7 @@
+export declare const FileUploaderStyle: import("styled-components").StyledComponent<"div", any, {
+    showProgressBar: boolean;
+    width?: string | undefined;
+}, never>;
+export declare const FileUploadedStyle: import("styled-components").StyledComponent<"div", any, {
+    width?: string | undefined;
+}, never>;

package/dist/cjs/components/file-uploader/FileUploaderStyle.js

@@ -0,0 +1,166 @@
+"use strict";var e=require("styled-components"),i=require("../../constants/Theme.js");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=t(e);r.default.div`
+	height: 100%;
+	width: 440px;
+	border: 1px dashed ${i.COLORS.stroke.primary};
+	border-radius: 4px;
+	gap: 24px;
+	align-items: cneter;
+	background-color: ${i.COLORS.surface.subdued};
+	.fileUploader {
+		display: flex;
+		flex-direction: column;
+		padding: 24px;
+		gap: 32px;
+		&__header {
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			justify-content: center;
+			gap: 8px;
+			&__icon {
+				cursor: default;
+				display: flex;
+				width: 80px;
+				height: 80px;
+				background-color: ${i.COLORS.background.base};
+				border-radius: 50%;
+				align-items: center;
+				justify-content: center;
+			}
+			&__title {
+				cursor: default;
+				display: flex;
+				width: calc(100% - 24px);
+				justify-content: center;
+				padding-top: 8px;
+			}
+			&__caption {
+				cursor: default;
+			}
+		}
+		&__body {
+			display: flex;
+			flex-direction: column;
+			gap: 16px;
+			&__divider {
+				display: flex;
+				.left {
+					border-top: 1px solid ${i.COLORS.stroke.primary};
+					flex-grow: 1;
+					margin-top: 8px;
+					margin-right: 8px;
+				}
+				.right {
+					border-top: 1px solid ${i.COLORS.stroke.primary};
+					flex-grow: 1;
+					margin-top: 8px;
+					margin-left: 8px;
+				}
+			}
+			&__upload {
+				display: flex;
+				flex-direction: row;
+				width: 100%;
+				height: 40px;
+				border: 1px solid ${i.COLORS.content.brand};
+				border-radius: 4px;
+				label {
+					width: 100%;
+					height: 100%;
+					cursor: pointer;
+					.file-uploader {
+						display: flex;
+						flex-direction: row;
+						width: 100%;
+						height: 100%;
+						align-items: center;
+						justify-content: center;
+						color: ${i.COLORS.content.brand};
+						gap: 10px;
+					}
+				}
+			}
+			&__cancel-button {
+				align-self: center;
+			}
+		}
+	}
+
+	.fileUploadError {
+		height: 36px;
+		width: 100%;
+		position: relative;
+	}
+`,r.default.div`
+	display: flex;
+	flex-direction: column;
+	height: 100%;
+	width: 440px;
+	border: 1px dashed ${i.COLORS.stroke.primary};
+	border-radius: 4px;
+	gap: 24px;
+	align-items: cneter;
+	background-color: ${i.COLORS.surface.subdued};
+	padding: 60px 16px;
+	.fileUploaded {
+		width: 100%;
+		&__header {
+			display: flex;
+			flex-direction: column;
+			width: 100%;
+			align-items: center;
+			justify-content: center;
+			gap: 16px;
+			&__icon {
+				display: flex;
+				width: 80px;
+				height: 80px;
+				background-color: ${i.COLORS.background.positive.vibrant};
+				border-radius: 50%;
+				align-items: center;
+				justify-content: center;
+			}
+		}
+		&__body {
+			display: flex;
+			flex-direction: column;
+			width: 100%;
+			gap: 24px;
+			&__file-detail {
+				display: flex;
+				flex-direction: row;
+				height: 56px;
+				background-color: ${i.COLORS.surface.standard};
+				border: 1px solid ${i.COLORS.stroke.primary};
+				border-radius: 4px;
+				align-items: center;
+				padding: 16px;
+				gap: 12px;
+				&__icon {
+					display: flex;
+					width: fit-content;
+				}
+				&__name {
+					overflow: hidden;
+					white-space: nowrap;
+					text-overflow: ellipsis;
+				}
+				&__size {
+					display: flex;
+					margin-left: auto;
+					width: fit-content;
+				}
+			}
+			&__buttons {
+				display: flex;
+				flex-direction: row;
+				gap: 12px;
+				&__edit,
+				&__done {
+					display: flex;
+					flex: 1;
+				}
+			}
+		}
+	}
+`;

package/dist/cjs/components/file-uploader/Models.d.ts

@@ -0,0 +1,34 @@
+export interface FileMetaData {
+    fileId: string;
+    fileName: string;
+    fileSize: string;
+    fileType: string;
+    fileUrl: string;
+    uploadType: 'URL' | 'FileUpload';
+    uploadDate: Date;
+}
+export interface FileUploadRules {
+    allowedFormats: string;
+    allowedSize: {
+        [key: string]: number;
+    };
+}
+export interface FileUploaderInterface {
+    onFileUpload: (file: File, metaData: FileMetaData) => void;
+    fileUploadRules: FileUploadRules;
+    onError: (error: string) => void;
+}
+export interface FileMetaFromUrl {
+    type: string;
+    size: number;
+}
+export interface FileUploaderProps {
+    uploadFile?: (file: File, fileName: string) => Promise<string>;
+    getFileMetaFromUrl?: (url: string) => Promise<FileMetaFromUrl>;
+    fileUploadRules: FileUploadRules;
+    onError: (error: string) => void;
+    uploadProgress: number;
+    onCancel: () => void;
+    onSuccess: (file: File, fileMeta: FileMetaData) => void;
+    fileName?: string;
+}

package/dist/cjs/components/file-uploader/index.d.ts

@@ -0,0 +1 @@
+export * from './FileUploader';

package/dist/cjs/components/file-uploader/useMockUrlUpload.d.ts

@@ -0,0 +1,8 @@
+import { FileMetaFromUrl } from "./Models";
+interface URLUploadOptions {
+    getFileMetaFromUrl: (url: string) => Promise<FileMetaFromUrl>;
+    error?: string;
+    success?: boolean;
+}
+declare const useMockUrlUpload: () => URLUploadOptions;
+export default useMockUrlUpload;

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

@@ -0,0 +1,22 @@
+import 'bootstrap/dist/css/bootstrap.min.css';
+import React from 'react';
+import { Placement } from '../tooltips';
+import { DROP_POSITION, FAB_POSITION, MENU_ALIGNMENT } from './FloatingActionButton.styles';
+export declare const FloatingActionButton: React.FC<{
+    onClick?: () => void;
+    children?: React.ReactNode;
+    width?: number;
+    height?: number;
+    icon?: JSX.Element;
+    color?: string;
+    position?: FAB_POSITION;
+    buttonPaddingHorizontal?: number;
+    buttonPaddingVertical?: number;
+    tooltipText?: string;
+    tooltipPlacement?: Placement;
+    zIndex?: number;
+    isRound?: boolean;
+    dropPosition?: DROP_POSITION;
+    menuAligment?: MENU_ALIGNMENT;
+    tootipWidth?: number;
+}>;

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

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

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

@@ -0,0 +1,50 @@
+/// <reference types="react" />
+export declare enum FAB_POSITION {
+    TOP_LEFT = "top left",
+    TOP_RIGHT = "top right",
+    BOTTOM_LEFT = "bottom left",
+    BOTTOM_RIGHT = "botton right"
+}
+export declare enum DROP_POSITION {
+    UP = "up",
+    UP_CENTERED = "up-centered",
+    START = "start",
+    END = "end",
+    DOWN = "down",
+    DOWN_CENTERED = "down-centered"
+}
+export declare enum MENU_ALIGNMENT {
+    START = "start",
+    END = "end"
+}
+export declare const FloatingActionButtonContainer: import("styled-components").StyledComponent<"div", any, {
+    width: number;
+    height: number;
+    color: string;
+    isRound?: boolean | undefined;
+}, never>;
+export declare const FloatingActionButtonOuterContainer: import("styled-components").StyledComponent<"div", any, {
+    width: number;
+    height: number;
+    color: string;
+    position: FAB_POSITION;
+    buttonPaddingHorizontal: number;
+    buttonPaddingVertical: number;
+    zIndex: number;
+}, never>;
+export declare const StyledDropdown: import("styled-components").StyledComponent<import("react-bootstrap/esm/helpers").BsPrefixRefForwardingComponent<"div", import("react-bootstrap").DropdownProps> & {
+    Toggle: import("react-bootstrap/esm/helpers").BsPrefixRefForwardingComponent<"button", import("react-bootstrap/esm/DropdownToggle").DropdownToggleProps>;
+    Menu: import("react-bootstrap/esm/helpers").BsPrefixRefForwardingComponent<"div", import("react-bootstrap/esm/DropdownMenu").DropdownMenuProps>;
+    Item: import("react-bootstrap/esm/helpers").BsPrefixRefForwardingComponent<import("@restart/ui/esm/types").DynamicRefForwardingComponent<import("react").ForwardRefExoticComponent<import("@restart/ui/esm/Button").ButtonProps & import("react").RefAttributes<HTMLElement>>, import("@restart/ui/esm/DropdownItem").DropdownItemProps>, import("react-bootstrap/esm/DropdownItem").DropdownItemProps>;
+    ItemText: import("react-bootstrap/esm/helpers").BsPrefixRefForwardingComponent<"span", unknown>;
+    Divider: import("react-bootstrap/esm/helpers").BsPrefixRefForwardingComponent<"hr", unknown>;
+    Header: import("react-bootstrap/esm/helpers").BsPrefixRefForwardingComponent<"div", unknown>;
+}, any, {
+    active?: string | undefined;
+    width?: string | undefined;
+    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/cjs/components/floating-action-button/FloatingActionButton.styles.js

@@ -0,0 +1,99 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react-bootstrap"),o=require("styled-components"),e=require("../../constants/Theme.js");function r(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var i,n,d,p=r(o);exports.FAB_POSITION=void 0,(i=exports.FAB_POSITION||(exports.FAB_POSITION={})).TOP_LEFT="top left",i.TOP_RIGHT="top right",i.BOTTOM_LEFT="bottom left",i.BOTTOM_RIGHT="botton right",exports.DROP_POSITION=void 0,(n=exports.DROP_POSITION||(exports.DROP_POSITION={})).UP="up",n.UP_CENTERED="up-centered",n.START="start",n.END="end",n.DOWN="down",n.DOWN_CENTERED="down-centered",exports.MENU_ALIGNMENT=void 0,(d=exports.MENU_ALIGNMENT||(exports.MENU_ALIGNMENT={})).START="start",d.END="end";const a=p.default.div`
+	width: ${t=>t.width}px;
+	height: ${t=>t.height}px;
+	background: ${t=>t.color};
+	${t=>t.isRound?"border-radius: 50%;":"border-bottom-left-radius: 50%; border-bottom-right-radius: 50%; border-top-left-radius:50%;"}
+	justify-content: center;
+	align-items: center;
+	cursor: pointer;
+	display: flex;
+`,s=p.default.div`
+	display: flex;
+	border-radius: 50%;
+	flex-direction: column;
+	align-items: flex-end;
+	position: fixed;
+	width: ${t=>t.width}px;
+	height: ${t=>t.height}px;
+	z-index: ${t=>t.zIndex};
+	${t=>t.position===exports.FAB_POSITION.BOTTOM_RIGHT?`right: ${t.buttonPaddingHorizontal}px; bottom: ${t.buttonPaddingVertical}px`:t.position===exports.FAB_POSITION.BOTTOM_LEFT?`left: ${t.buttonPaddingHorizontal}px; bottom: ${t.buttonPaddingVertical}px`:t.position===exports.FAB_POSITION.TOP_LEFT?`left: ${t.buttonPaddingHorizontal}px; top: ${t.buttonPaddingVertical}px`:t.position===exports.FAB_POSITION.TOP_RIGHT?`right: ${t.buttonPaddingHorizontal}px; top: ${t.buttonPaddingVertical}px`:""};
+`,l=p.default(t.Dropdown)`
+	.filter-container {
+		.single-row {
+			display: flex;
+			flex-direction: row;
+			align-items: center;
+			justify-content: flex-start;
+			gap: 8px;
+			padding: 14px;
+			border-bottom: 1px solid ${e.COLORS.stroke.primary};
+
+			:last-child {
+				border-bottom: none !important;
+			}
+		}
+	}
+	button {
+		border: 1px solid
+			${t=>"true"===t.active?e.COLORS.stroke.positive.lightAlt:e.COLORS.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?e.COLORS.background.positive.light:e.COLORS.surface.standard};
+		color: ${t=>"true"===t.active?e.COLORS.content.positive:e.COLORS.content.primary};
+	}
+
+	.btn-primary:hover,
+	.btn-primary:active,
+	.btn-primary:focus,
+	.btn-primary.dropdown-toggle,
+	.show > .btn-primary.dropdown-toggle {
+		color: ${t=>"true"===t.active?e.COLORS.content.positive:e.COLORS.content.primary};
+		background-color: ${t=>"true"===t.active?e.COLORS.background.positive.light:"transparent"};
+		border: none;
+	}
+	.btn:focus {
+		outline: 0;
+		box-shadow: 0 0 0 0.25rem transparent !important;
+	}
+
+	.dropdown-toggle::after {
+		border-top: 0.3em solid ${e.COLORS.content.primary};
+		display: none !important;
+	}
+
+	.dropdown-toggle::before {
+		border-top: 0.3em solid ${e.COLORS.content.primary};
+		display: none !important;
+	}
+	.dropdown-menu {
+		min-width: 12rem;
+		padding: 0 0;
+	}
+	.dropdown-item:active,
+	.dropdown-item:hover {
+		color: ${e.COLORS.content.positive};
+		text-decoration: none;
+		background-color: ${e.COLORS.background.positive.light};
+	}
+`,c=p.default(t.Dropdown.Toggle)`
+	border-radius: 4px;
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	justify-content: space-between;
+	padding: 6px 8px;
+	font-weight: 400;
+	font-size: 14px;
+	line-height: 20px;
+`,O=p.default.div`
+	box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.12);
+	border-radius: 4px;
+	padding: 8px;
+	background-color: ${e.COLORS.content.primary};
+	color: ${e.COLORS.content.primaryInverse};
+	width: ${t=>t.tooltipWidth?t.tooltipWidth+"px":"120px"};
+`;exports.DropdownToggleContainer=c,exports.FloatingActionButtonContainer=a,exports.FloatingActionButtonOuterContainer=s,exports.StyledDropdown=l,exports.TooltipStyled=O;

package/dist/cjs/components/floating-action-button/index.d.ts

@@ -0,0 +1,2 @@
+export * from './FloatingActionButton';
+export * from './FloatingActionButton.styles';

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

@@ -0,0 +1,12 @@
+export declare const FILE_TYPE_NOT_SUPPORT = "File type no supported";
+export declare const FILE_SIZE_REACHED: (size: number) => string;
+export declare const getFileFormatErrorMessage: (format: string) => string;
+export declare const SIZE_LIMIT_MAP: {
+    image: number;
+    video: number;
+    application: number;
+};
+export declare const SUPPORTED_FILE_FORMAT: string[];
+export declare class FileUploaderHelper {
+    validate(file: Blob): string | undefined;
+}

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

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../utils/bytesToMB.js");const r="File type no supported",t=e=>`Max file size of ${e}mb is allowed`,p=e=>`Only ${e.toUpperCase()} format allowed`,o={image:5,video:16,application:100},i=["mp4","png","jpeg","jpg","pdf"];exports.FILE_SIZE_REACHED=t,exports.FILE_TYPE_NOT_SUPPORT=r,exports.FileUploaderHelper=class{validate(s){const a=s.size,[l,n]=s.type.split("/");if(!o[l])return r;if(e.bytesToMB(a)>o[l])return t(o[l]);if(!i.includes(n.toLocaleLowerCase())){if("video"===l)return p("mp4");if("image"===l)return p("png, jpeg, jpg");if("application"===l)return p("pdf")}}},exports.SIZE_LIMIT_MAP=o,exports.SUPPORTED_FILE_FORMAT=i,exports.getFileFormatErrorMessage=p;

package/dist/cjs/components/icon-button/IconButton.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IconButtonProps } from './model';
+export declare const IconButton: React.ForwardRefExoticComponent<IconButtonProps & React.RefAttributes<HTMLButtonElement>>;

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

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),r=require("react"),o=require("./IconButton.styled.js"),i=require("./theme.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=d(r);const s=r.forwardRef(((r,d)=>{var{id:s,iconButtonType:c="default",Icon:l,height:u=20,width:a=20,bordered:y,disabled:b,isSelected:h,style:f}=r,p=e.__rest(r,["id","iconButtonType","Icon","height","width","bordered","disabled","isSelected","style"]);const j=i.getIconColor(c,b,h);return t.jsx(o.IconButton,Object.assign({id:s,ref:d,style:f,iconButtonType:c,bordered:y,disabled:b,isSelected:h},p,{children:n.default.createElement(l,{height:u,width:a,color:j,style:{display:"block"}})}))}));s.displayName="IconButton",exports.IconButton=s;

package/dist/cjs/components/icon-button/IconButton.styled.d.ts

@@ -0,0 +1,6 @@
+import { IconButtonType } from './model';
+export declare const IconButton: import("styled-components").StyledComponent<"button", any, {
+    bordered?: boolean | undefined;
+    iconButtonType: IconButtonType;
+    isSelected?: boolean | undefined;
+}, never>;