@bikdotai/bik-component-library 0.0.687-beta.7 → 0.0.687-beta.9

package/dist/cjs/components/keywords-input/KeywordsInput.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("../../assets/icons/cross.svg.js"),t=require("react"),s=require("../input/Input.js"),i=require("../tag/Tag.js");exports.KeywordsInput=a=>{const[o,n]=t.useState(""),{keywords:d,onDeleteKeyword:l,errorMessage:c,onSelectKeyword:p,error:u,hint:x,width:g}=a;return e.jsxs("div",{style:{marginTop:12},children:[e.jsx(s.Input,{"data-test":a["data-test"],width:g,onChangeText:function(e,r){!r||"keydown"!==r?.type||13!==r.which&&13!==r.keyCode?n(e):e.trim()&&(n(""),p&&p(e.trim()))},value:o,hintText:x,placeholder:a.placeHolder??"Ex. Hello",errorMessage:u?c||"Please ENTER to add keyword":""}),e.jsx("div",{style:{display:"flex",flexDirection:"row",gap:"8px",marginTop:12,flexWrap:"wrap",width:g},children:d.map(((t,s)=>e.jsx(i.Tag,{tagText:t,TrailingIcon:r.default,onTrailingIconClicked:()=>l(t)},t+s)))})]})};

package/dist/cjs/components/list-item/ListItem.d.ts

@@ -0,0 +1,23 @@
+import * as React$1 from 'react';
+
+type Variant = 'default' | 'selected' | 'inactive' | 'error' | 'readonly' | 'placeholder' | 'separator';
+interface ListItemElement {
+    label: string;
+    value: string;
+}
+interface ListItemProps extends React.HTMLAttributes<HTMLDivElement> {
+    variant?: Variant;
+    subText?: string;
+    listItem: ListItemElement;
+    onSelect?: (ListItemElement: any) => void;
+    leadingIcon?: JSX.Element;
+    trailingIcon?: JSX.Element;
+    borderBottom?: string;
+    customComponent?: JSX.Element;
+    customListItemLabel?: JSX.Element;
+    version?: '1.0' | '2.0';
+}
+declare const ListItem: React$1.ForwardRefExoticComponent<ListItemProps & React$1.RefAttributes<HTMLDivElement>>;
+
+export { ListItem };
+export type { ListItemElement, ListItemProps, Variant };

package/dist/cjs/components/list-item/ListItem.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("./themes.js"),i=require("../TypographyStyle.js"),s=require("../../constants/Theme.js"),l=require("./ListItem.styled.js");const o=t.forwardRef((({id:t,onSelect:o,variant:n="default",trailingIcon:a,leadingIcon:d,subText:c,listItem:m,borderBottom:x,customComponent:y,customListItemLabel:p,version:u,...j},h)=>e.jsx(l.ListItem,{ref:h,id:t,variant:n,onClick:()=>o&&o(m),borderBottom:x,version:u,...j,children:y?e.jsx(e.Fragment,{children:y}):e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:8,width:"100%"},children:[!!d&&d,e.jsxs("div",{style:{display:"flex",rowGap:"4px",flexDirection:"column",overflow:"hidden"},children:[p?e.jsx(e.Fragment,{children:p}):e.jsx(e.Fragment,{children:!!m&&e.jsx(i.BodySecondary,{style:{fontSize:("2.0"===u?12:14)+"px",color:r.getColor(n),textOverflow:"ellipsis",display:"block"},children:m.label})}),!!c&&e.jsx(i.BodyCaption,{style:{color:"inactive"===n?s.COLORS.content.inactive:s.COLORS.text.secondary},children:c})]}),!!a&&e.jsx("div",{style:{display:"flex",marginLeft:"auto"},children:a})]})})));o.displayName="ListItem",exports.ListItem=o;

package/dist/cjs/components/list-item/ListItem.styled.js

@@ -0,0 +1,10 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@emotion/styled"),t=require("../../constants/Theme.js"),r=require("./themes.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const s=o(e).default.div`
+	border-bottom: ${e=>e.borderBottom||`${"2.0"===e.version?0:1}px solid ${t.COLORS.stroke.primary}`};
+	display: flex;
+	align-items: center;
+	justify-content: start;
+	column-gap: 12px;
+	padding: ${e=>"2.0"===e.version?"8px 12px":"12px 16px"};
+	${e=>r.getTheme(e.variant,e.version)};
+	border-radius: ${e=>"2.0"===e.version?8:0}px;
+`;exports.ListItem=s;

package/dist/cjs/components/list-item/themes.js

@@ -0,0 +1,29 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@emotion/react"),r=require("../../constants/Theme.js");exports.getColor=function(e){switch(e){case"default":case"readonly":default:return`${r.COLORS.text.primary}`;case"selected":return`${r.COLORS.content.positive}`;case"inactive":return`${r.COLORS.content.inactive}`;case"error":return`${r.COLORS.content.negative}`;case"placeholder":return`${r.COLORS.content.placeholder}`}},exports.getTheme=function(o,t){switch(o){case"default":return e.css`
+				cursor: pointer;
+				color: ${r.COLORS.text.primary};
+				background-color: ${r.COLORS.surface.standard};
+				&:hover {
+					background-color: ${r.COLORS.surface.subdued};
+				}
+			`;case"selected":return e.css`
+				color: ${r.COLORS.content.positive};
+				background: ${r.COLORS.background.positive.light};
+				box-shadow: ${"2.0"===t?"0":"0 2px 8px rgba(0, 0, 0, 0.12)"};
+			`;case"inactive":return e.css`
+				color: ${r.COLORS.content.inactive};
+				background-color: ${r.COLORS.surface.standard};
+				cursor: not-allowed;
+			`;case"readonly":return e.css`
+				color: ${r.COLORS.text.primary};
+			`;case"separator":return e.css`
+				color: ${r.COLORS.content.inactive};
+				background-color: ${r.COLORS.background.base};
+				cursor: none;
+				padding: 8px 16px;
+			`;default:return e.css`
+				color: ${r.COLORS.text.primary};
+				background-color: ${r.COLORS.surface.standard};
+				&:hover {
+					background-color: ${r.COLORS.surface.subdued};
+				}
+			`}};

package/dist/cjs/components/modals/Modal.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),s=require("./modal.styled.js"),r=require("../../constants/Theme.js"),o=require("../../assets/icons/cross.svg.js"),i=require("../TypographyStyle.js");exports.Modal=n=>{const[a,l]=t.useState(n.timeOut||5);t.useEffect((()=>{if(!n.skipModalWithTimer)return;const e=setInterval((()=>{l((t=>{const s=t-1;return s<=0?(clearInterval(e),0):s}))}),1e3);return()=>clearInterval(e)}),[n.skipModalWithTimer]);return e.jsx(e.Fragment,{children:n.open&&e.jsx("div",{id:n.id||"bik-modal",children:e.jsx(s.RootContainer,{"data-test":n["data-test"],zIndex:n.zIndex,onClick:e=>{n.closeOnOutsideClick&&n.onClose?n.skipModalWithTimer&&a>0?e.stopPropagation():n.onClose():e.stopPropagation()},children:e.jsx(s.CentralContainer,{style:{...n.centralContainerStyles??{}},onClick:e=>{e.stopPropagation()},width:n.width,children:e.jsxs(e.Fragment,{children:[!n?.hideCrossButton&&!n.skipModalWithTimer&&e.jsx(s.CloseButtonContainer,{"data-test":(n["data-test"]||"")+"-close-button",onClick:()=>n.onClose&&n.onClose(),children:e.jsx(o.default,{height:20,width:20,color:r.COLORS.content.secondary})}),n.skipModalWithTimer&&e.jsxs(s.CloseButtonWithTimer,{"data-test":(n["data-test"]||"")+"-timer-close-button",onClick:()=>{a>0||n.onClose&&n.onClose()},timerExists:a>0,children:[a>0?e.jsxs(i.BodySecondary,{children:["Skip in ",a," sec "]}):e.jsx(e.Fragment,{}),e.jsx(o.default,{height:20,width:20,color:a>0?r.COLORS.stroke.primary:r.COLORS.content.secondary})]}),n.children]})})})})})};

package/dist/cjs/components/modals/modal.styled.js

@@ -0,0 +1,47 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@emotion/styled"),t=require("../../constants/Theme.js"),r=require("../../constants/zindex.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=o(e);const n=i.default.div`
+	position: fixed;
+	top: 0;
+	left: 0;
+	z-index: ${e=>e.zIndex||r.ComponentZindex.MODAL};
+	height: 100%;
+	width: 100%;
+	background-color: rgba(0, 0, 0, 0.6);
+	display: flex;
+	align-items: center;
+	justify-content: center;
+`,s=i.default.div`
+	width: ${e=>e.width??"640px"};
+	background-color: ${t.COLORS.surface.standard};
+	border-radius: 4px;
+	position: relative;
+	display: flex;
+`,a=i.default.div`
+	height: 36px;
+	width: 36px;
+	border-radius: 50%;
+	position: absolute;
+	right: 0;
+	top: 0;
+	translate: 50% -50%;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	background-color: ${t.COLORS.surface.standard};
+	border: 1px solid ${t.COLORS.stroke.primary};
+	cursor: pointer;
+	z-index: 2;
+`,d=i.default.div`
+	border-radius: 24px;
+	position: absolute;
+	right: 0;
+	top: 0;
+	transform: ${e=>e.timerExists?"translate(20%, -50%)":"translate(50%, -50%)"};
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	background-color: ${t.COLORS.surface.standard};
+	border: 1px solid ${t.COLORS.stroke.primary};
+	cursor: ${e=>e.timerExists?"not-allowed":"pointer"};
+	z-index: 2;
+	padding: 8px;
+`;exports.CentralContainer=s,exports.CloseButtonContainer=a,exports.CloseButtonWithTimer=d,exports.RootContainer=n;

package/dist/cjs/components/modals/styledModal.d.ts

@@ -0,0 +1,35 @@
+import React__default from 'react';
+import { ButtonProps } from '../button/model.js';
+
+declare const StyledModal: React__default.FC<{
+    'data-test'?: string;
+    open: boolean;
+    onClose?: () => void;
+    children?: React__default.ReactNode;
+    centralContainerStyles?: React__default.CSSProperties;
+    closeOnOutsideClick?: boolean;
+    headingTitle?: string;
+    headingSubtitle?: string;
+    tintedHeader?: boolean;
+    primaryButton?: ButtonProps;
+    secondaryButton?: ButtonProps;
+    footerShadow?: boolean;
+    footerLeftCustomElement?: React__default.ReactNode;
+    headerLeftCustomElement?: React__default.ReactNode;
+    headerRightCustomElement?: React__default.ReactNode;
+    zIndex?: number;
+    hideCrossButton?: boolean;
+    width?: string;
+    wrapperStyle?: React__default.CSSProperties;
+    onBackPress?: () => void;
+    footerContainerStyle?: React__default.CSSProperties;
+    id?: string;
+    modalHeaderStyles?: React__default.CSSProperties;
+    innerModalId?: string;
+    isBeta?: boolean;
+    modalBodyStyles?: React__default.CSSProperties;
+    skipModalWithTimer?: boolean;
+    timeOut?: number;
+}>;
+
+export { StyledModal };

package/dist/cjs/components/modals/styledModal.js

@@ -0,0 +1,47 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("@emotion/styled"),i=require("../../assets/icons/arrow_back.svg.js"),n=require("react-dom"),d=require("../button/Button.js"),r=require("./Modal.js"),o=require("../TypographyStyle.js"),l=require("../../constants/Theme.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var s=a(t),u=a(n);const c=s.default.div`
+	display: flex;
+	flex-direction: column;
+	flex: 1;
+	align-items: flex-start;
+	overflow: hidden;
+	max-width: 100%;
+`,h=s.default.div`
+	padding: 16px 24px;
+	width: 100%;
+	display: flex;
+	flex-direction: row;
+	gap: 12px;
+	justify-content: center;
+	background-color: ${e=>e.tintedHeader?l.COLORS.background.warning.light:"transparent"};
+	border-top-left-radius: ${e=>e.tintedHeader?"4px":"none"};
+`,x=s.default.div`
+	display: flex;
+	flex-direction: column;
+`,f=s.default.div`
+	display: flex;
+	margin-left: auto;
+	justify-content: flex-end;
+	align-items: center;
+`,p=s.default(o.BodyPrimary)`
+	margin-top: 4px;
+	color: ${l.COLORS.content.secondary} !important;
+`,m=s.default.div`
+	padding: 16px 24px;
+	display: flex;
+	align-items: center;
+	justify-content: end;
+	margin-top: auto;
+	width: 100%;
+`,y=s.default.div`
+	margin-right: auto;
+	display: flex;
+	align-items: center;
+	justify-content: flex-end;
+	height: calc(100% - 32px);
+`,g=s.default.div`
+	width: 100%;
+	z-index: 1;
+	box-shadow: ${e=>e.showShadow?"inset 0 -3px 6px rgba(0, 0, 0, 0.12)":"none"};
+`,j=s.default(d.Button)`
+	margin-right: 8px;
+`;exports.StyledModal=t=>"undefined"==typeof window?null:u.default.createPortal(e.jsx(r.Modal,{"data-test":t["data-test"],id:t.id,zIndex:t.zIndex,open:t.open,onClose:t.onClose,closeOnOutsideClick:t.closeOnOutsideClick,centralContainerStyles:t.centralContainerStyles,hideCrossButton:t.hideCrossButton,width:t.width,skipModalWithTimer:t.skipModalWithTimer,timeOut:t.timeOut,children:e.jsxs(c,{style:t.wrapperStyle??{},id:t.innerModalId,children:[(t.headingTitle||t.headingSubtitle||t.headerRightCustomElement)&&e.jsxs(h,{style:t.modalHeaderStyles??{},tintedHeader:t.tintedHeader??!1,children:[t.onBackPress&&e.jsx("div",{style:{cursor:"pointer"},onClick:e=>{t.onBackPress?t.onBackPress():e.stopPropagation()},children:e.jsx(i.default,{width:18,height:18})}),e.jsxs("div",{style:{flex:1},children:[e.jsxs("div",{style:{display:"flex",gap:"8px",alignItems:"center"},children:[e.jsx(x,{children:t.headingTitle&&e.jsx(o.TitleMedium,{children:t.headingTitle})}),t.isBeta&&e.jsx("div",{style:{padding:"2px 8px",borderRadius:"16px",backgroundColor:"#1877f2",height:"fit-content",width:"fit-content"},children:e.jsx(o.BodyCaption,{style:{color:l.COLORS.surface.standard},children:"BETA"})}),t.headerLeftCustomElement&&t.headerLeftCustomElement]}),e.jsx(x,{children:t.headingSubtitle&&e.jsx(p,{children:t.headingSubtitle})})]}),t.headerRightCustomElement&&e.jsx(f,{children:t.headerRightCustomElement})]}),t.children&&e.jsx(g,{style:t.modalBodyStyles??{},showShadow:t.footerShadow??!1,children:t.children}),(t.primaryButton||t.secondaryButton||t.footerLeftCustomElement)&&e.jsxs(m,{style:t.footerContainerStyle,children:[t.footerLeftCustomElement&&e.jsx(y,{children:t.footerLeftCustomElement}),t.secondaryButton&&e.jsx(j,{...t.secondaryButton}),t.primaryButton&&e.jsx(d.Button,{...t.primaryButton})]})]})}),document.body);

package/dist/cjs/components/multi-level-dropdown/GroupedMenuList.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("../../constants/Theme.js"),t=require("../TypographyStyle.js"),o=require("./MenuItem.js"),n=require("./MultiLevelDropdown.styled.js");exports.GroupedMenuList=({width:s,onDropdownItemClick:i,option:p,parents:u})=>e.jsxs(n.GroupedMenuListContainer,{children:[e.jsx(t.BodyTiny,{style:{padding:"4px 8px 4px 12px",cursor:"default"},color:r.COLORS.content.placeholder,children:p.label}),p.options.map(((r,t)=>e.jsx(o.MenuItem,{width:s,onDropdownItemClick:i,option:r,parents:u},t)))]});

package/dist/cjs/components/multi-level-dropdown/MenuItem.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/chevronRight2.svg.js"),n=require("react"),i=require("../../constants/Theme.js"),r=require("../TypographyStyle.js"),o=require("./MultiLevelDropdown.styled.js");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=s(n);const d=l.default.lazy((()=>Promise.resolve().then((function(){return require("./MenuList.js")})).then((e=>({default:e.MenuList})))));exports.MenuItem=({width:s,onDropdownItemClick:c,option:a,parents:u})=>{const[p,h]=l.default.useState(!1),[C,j]=l.default.useState(!1),[g,x]=l.default.useState({top:0,left:0}),O=n.useRef({top:0,left:0});return e.jsxs(o.MenuItemWrapper,{onMouseEnter:e=>{h(!0),(e=>{const t=e.currentTarget.getBoundingClientRect();x({top:t.top,left:t.right}),O.current={top:t.top,left:t.right}})(e)},onMouseLeave:()=>{h(!1)},onClick:()=>{!c||a.disabled||a.children?.length||c(a,u)},id:"menuItemWrapper",style:{cursor:a.disabled?"not-allowed":"pointer",backgroundColor:a.disabled?i.COLORS.surface.standard:"transparent"},children:[a.customComponent?a.customComponent:e.jsxs(o.MenuItemContainer,{isSelected:a.selected,isSubMenuOpen:p,isHovered:C,isDisabled:a.disabled??!1,children:[e.jsxs(o.ContentContainer,{children:[a.leadingIcon&&e.jsx(o.LeadingIconContainer,{children:a.leadingIcon}),e.jsxs("div",{children:[e.jsx(r.BodyCaption,{style:{color:a.disabled?i.COLORS.content.inactive:a.selected||C?i.COLORS.content.positive:i.COLORS.content.primary},children:a.label}),a.subText&&e.jsx(r.BodyTiny,{style:{color:a.disabled?i.COLORS.content.inactive:a.selected||C?i.COLORS.content.positive:i.COLORS.content.secondary,marginTop:"2px"},children:a.subText})]})]}),a.children&&a.children.length>0?e.jsx(o.TrailingIconContainer,{children:e.jsx(t.default,{width:16,height:16,color:a.disabled?i.COLORS.content.inactive:a.selected||C?i.COLORS.content.positive:i.COLORS.content.primary})}):a.trailingIcon?e.jsx(o.TrailingIconContainer,{children:a.trailingIcon}):e.jsx(e.Fragment,{})]}),!a.disabled&&a.children&&a.children.length>0&&p&&e.jsx(o.SubMenuContainer,{width:s,className:"submenu",onMouseEnter:()=>j(!0),onMouseLeave:()=>j(!1),children:e.jsx(o.StyledSubMenuWrapper,{width:s,top:g.top,left:g.left,children:e.jsx(o.SubMenuListContainer,{children:e.jsx(n.Suspense,{fallback:e.jsx("div",{children:"Loading..."}),children:e.jsx(d,{width:s,onDropdownItemClick:c,options:a.children,parents:[...u,a]})})})})})]})};

package/dist/cjs/components/multi-level-dropdown/MenuList.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("./GroupedMenuList.js"),o=require("./MenuItem.js"),i=require("./MultiLevelDropdown.styled.js");exports.MenuList=({width:n,onDropdownItemClick:r,options:s,parents:p})=>e.jsx(i.StyledMenuList,{children:s.map(((i,s)=>"value"in i?e.jsx(o.MenuItem,{width:n,onDropdownItemClick:r,option:i,parents:p},s):"options"in i&&i.options.length>0?e.jsx(t.GroupedMenuList,{width:n,onDropdownItemClick:r,option:i,parents:p},s):void 0))});

package/dist/cjs/components/multi-level-dropdown/MultiLevelDropdown.d.ts

@@ -0,0 +1,6 @@
+import React__default from 'react';
+import { MultiLevelDropdownProps } from './type.js';
+
+declare const MultiLevelDropdown: React__default.FC<MultiLevelDropdownProps>;
+
+export { MultiLevelDropdown };

package/dist/cjs/components/multi-level-dropdown/MultiLevelDropdown.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("../zeroState/ZeroState.js"),n=require("../../constants/Theme.js"),o=require("../dropdown/OpenedDropdown/components/searchbox/SearchBox.js"),s=require("../floater/floater.js"),i=require("./MenuList.js"),l=require("./MultiLevelDropdown.styled.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=d(t);exports.MultiLevelDropdown=({options:d,width:c,isSearchable:a,onDropdownItemClick:f,refElement:p,topOffset:h,leftOffset:w,isDropdownOpen:x,onDropdownOutsideClick:j})=>{const m=u.default.useRef(null),[v,y]=t.useState(d),O=e=>{const t=Array.isArray(d)?[...d]:[],r=[];for(;t.length>0;){const n=t.shift();n&&n.label.toLowerCase().includes(e.toLowerCase())&&r.push(n),n&&"children"in n&&n.children?t.push(...n.children):n&&"options"in n&&n.options&&t.push(...n.options)}const n=e=>e.map((e=>{if(r.includes(e))return e;if("children"in e&&e.children){const t=n(e.children);if(t.length>0)return{...e,children:t}}if("options"in e&&e.options){const t=n(e.options);if(t.length>0)return{...e,options:t}}return null})).filter((e=>null!==e));y(n(d))},S=e=>{m.current&&!m.current.contains(e.target)?j&&j(!0):j&&j(!1)};return t.useEffect((()=>{x&&O("")}),[x]),t.useEffect((()=>(document.addEventListener("mousedown",S),()=>{document.removeEventListener("mousedown",S)})),[]),t.useEffect((()=>{y(d)}),[d]),e.jsx(s.Floater,{refElement:p,topOffset:h,leftOffset:w,children:x&&e.jsx("div",{ref:m,style:{backgroundColor:n.COLORS.surface.standard,zIndex:99999,borderRadius:"8px",whiteSpace:"normal"},children:e.jsxs(l.DropdownContainer,{width:c,children:[a&&e.jsx("div",{style:{padding:"4px",width:c??"200px"},children:e.jsx(o.SearchBox,{onSearch:O,version:"2.0"})}),e.jsx(l.OptionsContainer,{width:c,children:(v??[]).length>0&&e.jsx(i.MenuList,{width:c??"200px",onDropdownItemClick:f,options:v,parents:[]})}),0===(v??[]).length&&e.jsx(l.NoResultsContainer,{style:{width:c??"200px"},children:e.jsx(r.ZeroState,{title:"No results found!",subTitle:"Sorry, we are unable to find any results for your search."})})]})})})};

package/dist/cjs/components/multi-level-dropdown/MultiLevelDropdown.styled.js

@@ -0,0 +1,98 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../constants/Theme.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=i(e);const r=n.default.div`
+	position: relative;
+	border-radius: 8px;
+	box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.12);
+	padding-bottom: 4px;
+`,o=n.default.div`
+	width: ${({width:e})=>e||"200px"};
+	max-width: 300px;
+	max-height: 280px;
+	overflow-y: scroll;
+	padding: 4px 0 0;
+	&::-webkit-scrollbar {
+		width: 0px;
+	}
+`,d=n.default.div`
+	margin-top: 64px;
+	height: 200px;
+	width: ${({width:e})=>e||"200px"};
+`,a=n.default.div`
+	width: 100%;
+	justify-content: center;
+	cursor: pointer;
+	align-items: center;
+	justify-content: space-between;
+	margin: 4px 0;
+`,p=n.default.div`
+	z-index: 1000;
+	position: relative;
+	margin: 0px;
+	padding: 0px;
+	width: 100%;
+`,s=n.default.div`
+	position: relative;
+	padding: 1px 4px;
+	cursor: pointer;
+	width: 100%;
+	&:hover > .submenu,
+	&:focus-within > .submenu {
+		display: block;
+	}
+`,l=n.default.div`
+	position: relative;
+	padding: 4px 8px 4px 8px;
+	transition: background-color 0.2s;
+	width: 100%;
+	border-radius: 8px;
+	justify-content: center;
+	background-color: ${({isSelected:e,isHovered:i,isSubMenuOpen:n,isDisabled:r})=>r?t.COLORS.surface.standard:e||n?t.COLORS.background.positive.light:i?t.COLORS.surface.hovered:t.COLORS.surface.standard};
+	color: ${({isSelected:e,isSubMenuOpen:i})=>e||i?t.COLORS.content.positive:t.COLORS.content.primary};
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+
+	&:hover {
+		background-color: ${({isSelected:e,isDisabled:i})=>i?t.COLORS.surface.standard:e?t.COLORS.background.positive.light:t.COLORS.surface.hovered};
+	}
+`,x=n.default.div`
+	display: flex;
+	align-items: center;
+	gap: 8px;
+`,u=n.default.div`
+	z-index: 1001;
+	position: fixed;
+	border-left: 4px solid transparent;
+`,c=n.default.div`
+	margin: 4px;
+	background-color: ${t.COLORS.surface.standard};
+	box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.12);
+	border-radius: 8px;
+	padding-top: 4px;
+	max-height: 480px;
+	padding-bottom: 4px;
+	overflow-y: scroll;
+
+	&::-webkit-scrollbar {
+		display: none;
+	}
+`,f=n.default.div`
+	width: 16px;
+	height: 16px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	margin-right: 4px;
+`,g=n.default.div`
+	width: 16px;
+	height: 16px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	margin-left: 4px;
+`,h=n.default.div`
+	width: ${e=>e.width};
+`,b=n.default(u)`
+	width: ${e=>e.width};
+	top: ${e=>e.top}px;
+	left: ${e=>e.left}px;
+`;exports.ContentContainer=x,exports.DropdownContainer=r,exports.GroupedMenuListContainer=a,exports.LeadingIconContainer=f,exports.MenuItemContainer=l,exports.MenuItemWrapper=s,exports.NoResultsContainer=d,exports.OptionsContainer=o,exports.StyledMenuList=p,exports.StyledSubMenuWrapper=b,exports.SubMenuContainer=h,exports.SubMenuListContainer=c,exports.SubMenuWrapper=u,exports.TrailingIconContainer=g;

package/dist/cjs/components/multi-level-dropdown/type.d.ts

@@ -0,0 +1,30 @@
+import { FloaterProps } from '../floater/floater.js';
+
+interface MultiLevelDropdownProps extends FloaterProps {
+    options: MultiLevelDropdownOption[];
+    width?: string;
+    isSearchable?: boolean;
+    isDropdownOpen?: boolean;
+    onDropdownOutsideClick?: (isOutsideClick: any) => void;
+    onDropdownItemClick?: (option: MultiLevelDropdownOption, parents: MultiLevelDropdownOption[]) => void;
+}
+type GroupedOption = {
+    label: string;
+    options: SingleOption[];
+    trailingIcon?: JSX.Element;
+    leadingIcon?: JSX.Element;
+};
+type SingleOption = {
+    label: string;
+    value: string;
+    subText?: string;
+    trailingIcon?: JSX.Element;
+    leadingIcon?: JSX.Element;
+    customComponent?: JSX.Element;
+    disabled?: boolean;
+    selected?: boolean;
+    children?: SingleOption[];
+};
+type MultiLevelDropdownOption = SingleOption | GroupedOption;
+
+export type { GroupedOption, MultiLevelDropdownOption, MultiLevelDropdownProps, SingleOption };

package/dist/cjs/components/navigation-hyperlink/NavigationHyperlink.d.ts

@@ -0,0 +1,14 @@
+import * as styled_components from 'styled-components';
+import { ReactNode } from 'react';
+
+interface NavigationHyperlinkProps {
+    router: any;
+    href: string;
+    children?: ReactNode;
+    newTab?: boolean;
+}
+declare const NavigationHyperlink: React.FC<NavigationHyperlinkProps>;
+declare const NaLinkWrapper: styled_components.StyledComponent<"div", any, {}, never>;
+
+export { NaLinkWrapper, NavigationHyperlink };
+export type { NavigationHyperlinkProps };

package/dist/cjs/components/navigation-hyperlink/NavigationHyperlink.js

@@ -0,0 +1,3 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const i=n(require("styled-components")).default.div`
+	//	display: inline-block;
+`;exports.NaLinkWrapper=i,exports.NavigationHyperlink=n=>{const{router:o,href:t,newTab:r}=n;return e.jsx(i,{onClick:e=>{if(t.includes("http")){const n=r||e.metaKey?"_blank":"_self";window.open(t,n)}else{const n=`${t.startsWith("/")?"":"/"}${t}`;e.metaKey?window.open(window.location.origin+n,"_blank"):o?o.push(window.location.origin+n):window.open(window.location.origin+n,"_self")}},children:n.children})};

package/dist/cjs/components/pagination/Pagination.d.ts

@@ -0,0 +1,13 @@
+import * as React$1 from 'react';
+
+interface PaginationProps extends React.HTMLAttributes<HTMLDivElement> {
+    numberOfItemsLoaded: number;
+    totalNumberOfItems: number;
+    isLoading?: boolean;
+    onShowMore?: () => void;
+    width?: string;
+}
+declare const Pagination: React$1.ForwardRefExoticComponent<PaginationProps & React$1.RefAttributes<HTMLButtonElement>>;
+
+export { Pagination };
+export type { PaginationProps };

package/dist/cjs/components/pagination/Pagination.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),n=require("../TypographyStyle.js"),o=require("../../constants/Theme.js"),t=require("./Pagination.styled.js");const i=r.forwardRef((({id:r,onShowMore:i,isLoading:s,numberOfItemsLoaded:a,totalNumberOfItems:d,...l})=>e.jsx(t.Pagination,{id:r,...l,children:s?e.jsx(e.Fragment,{children:"loading..."}):e.jsx("div",{children:a<d?e.jsxs(t.Pagination,{children:[e.jsxs(n.BodySecondary,{style:{color:o.COLORS.content.secondary},children:["Showing ",a," out of ",d," ","results"]}),e.jsx(n.ButtonRegular,{style:{color:o.COLORS.content.brand,cursor:"pointer"},onClick:()=>i&&i(),children:"Show more"})]}):e.jsx(t.Pagination,{children:e.jsxs(n.BodySecondary,{style:{color:o.COLORS.content.secondary},children:["Showing all ",d," results"]})})})})));i.displayName="Pagination",exports.Pagination=i;

package/dist/cjs/components/pagination/Pagination.styled.js

@@ -0,0 +1,7 @@
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}Object.defineProperty(exports,"__esModule",{value:!0});const t=e(require("@emotion/styled")).default.div`
+	display: flex;
+	align-items: center;
+	justify-content: start;
+	column-gap: 16px;
+	width: 100%;
+`;exports.Pagination=t;

package/dist/cjs/components/plans/NewSubscriptionPlan.d.ts

@@ -0,0 +1,22 @@
+import { FunctionComponent } from 'react';
+import { SubscriptionPlanProps } from './SubscriptionPlan.js';
+
+interface NewSubscriptionPlanProps extends SubscriptionPlanProps {
+    popularTestimony?: string;
+    skipRadioSelection?: boolean;
+    includeText?: string;
+    height?: string;
+    showFeaturesButton?: boolean;
+    businessDescription?: string[];
+    yearlyCode?: string;
+    isPlanSelected?: boolean;
+    onClickShowAllFeatures?: () => void;
+    showSelectedPlanChip?: boolean;
+    perMonthForYearly?: boolean;
+    minHeightOfFeatures?: number;
+}
+type Props = NewSubscriptionPlanProps;
+declare const NewSubscriptionPlan: FunctionComponent<Props>;
+
+export { NewSubscriptionPlan };
+export type { NewSubscriptionPlanProps };

package/dist/cjs/components/plans/NewSubscriptionPlan.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/check.svg.js"),s=require("../../assets/icons/checkCircle.svg.js"),i=require("../../assets/icons/quotes.svg.js"),a=require("../../assets/icons/WhiteStarFilled.svg.js"),n=require("../button/Button.js"),o=require("./SubscriptionPlanStyled.js"),r=require("../TypographyStyle.js"),l=require("../../hooks/useCurreny.js"),c=require("../../constants/Theme.js"),d=require("../tag/Tag.js"),h=require("../tooltips/Tooltip.js");exports.NewSubscriptionPlan=u=>{const{formatCurrency:p}=l.useCurrency(),m=u.showMonthlyOptions?u.features:u.annualFeatures||[],x=u.showMonthlyOptions?u.monthlyPlan:u.yearlyPlan,y=!u.isDisabled&&u.isMostPopular,j=u.showMonthlyOptions?u.code:u.yearlyCode??u.code,{planName:g,isSelected:b=!1,isDisabled:C=!1,onPlanSelect:T,oldPrice:v,hideMonthYearTag:S,planDescription:O,planDescriptionDiscount:N,showTrialOptions:f,freeTrialMessages:L,extraBlockMessage:P,isLoading:k,buttonText:w,bottomDescription:M,showMonthlyOptions:B,popularTestimony:q,skipRadioSelection:R=!1,includeText:D,height:F,showFeaturesButton:$,businessDescription:_,isPlanSelected:z=!1,onClickShowAllFeatures:H,showSelectedPlanChip:W=!1,perMonthForYearly:I=!1,minHeightOfFeatures:U,hoverTooltip:Y,hidePriceBlock:A=!1}=u,E=e=>I&&!B?0==e?"$0":p(Math.round(e/12),"USD"):0==e?"$0":p(e,"USD");return e.jsx(h.Tooltip,{body:Y,children:e.jsxs(o.NewSubscriptionStyled,{height:F,showMostPopularChip:y||!1,onClick:()=>T(j),children:[y&&e.jsxs("div",{className:"most-popular-chip",children:[e.jsx(r.Caption,{className:"popular-text",children:"Most popular "}),e.jsx(a.default,{height:12,width:12})]}),e.jsxs("div",{className:`box  ${C?"disabled":""} \n\t\t\t\t`,children:[e.jsxs("div",{className:"radio-flex",children:[!R&&e.jsx("input",{type:"radio",id:"html",name:"fav_language",value:"HTML",disabled:C??!1,onChange:()=>T(j),className:"radio-button",checked:z}),e.jsx(r.TitleRegular,{style:{color:c.COLORS.content.secondary,marginBottom:4},children:g}),W&&e.jsx("div",{style:{marginLeft:"auto"},children:e.jsx(d.Tag,{tagText:"Current plan",type:"positive",theme:"dark"})})]}),A?e.jsx(e.Fragment,{}):e.jsxs("div",{className:"price-block",children:[v?e.jsx(r.BodyCaption,{className:"old--price",children:E(x.price)}):e.jsx(e.Fragment,{}),e.jsx(r.TitleLarge,{style:{color:c.COLORS.content.primary},children:E(v||x.price)}),e.jsx(r.Caption,{style:{color:c.COLORS.content.secondary,marginLeft:4},children:S?"":"/ "+(B?"month":I?"month billed annually":"year")})]}),O&&e.jsxs("div",{className:"per-message-price",children:[e.jsx(r.BodyCaption,{style:{color:c.COLORS.content.secondary},children:O}),N&&e.jsx(r.BodyCaption,{style:{color:c.COLORS.background.positive.vibrant,marginLeft:4},children:N})]}),_&&_.length&&e.jsx("div",{style:{marginTop:4},children:_.map(((t,s)=>e.jsx(r.BodyCaption,{style:{color:c.COLORS.content.secondary},dangerouslySetInnerHTML:{__html:t}},s)))}),f&&e.jsxs(r.Caption,{className:"trial "+(b?"selected":""),children:["7 day free trial with ",L," messages"]}),P&&e.jsx(r.Caption,{className:"trial "+(b?"selected":""),children:P}),e.jsx(r.TitleSmall,{className:"extra-include-margin",style:{height:D?"":"20px"},children:D||""}),e.jsx("div",{className:"features",style:{minHeight:U},children:m.map(((t,i)=>e.jsxs("div",{className:"feature",children:[e.jsx("div",{children:e.jsx(s.default,{height:20,width:20,color:c.COLORS.content.primary})}),e.jsx(r.BodyCaption,{className:"feature-text",children:t.detail},i)]},t.detail)))}),$&&e.jsx(n.Button,{isLoading:!1,buttonType:"tertiary",buttonText:"See all features",size:"small",onClick:e=>{e.stopPropagation(),H&&H()}}),R&&e.jsx("div",{className:"button-box",children:k?e.jsx(n.Button,{isLoading:!0,buttonType:"primary",buttonText:"Choose plan",size:"medium",matchParentWidth:!0}):e.jsxs(e.Fragment,{children:[b&&e.jsx(n.Button,{disabled:C,LeadingIcon:t.default,buttonType:"tertiary",size:"medium",matchParentWidth:!0,buttonText:w||"Selected Plan"}),!b&&!C&&e.jsx(n.Button,{buttonType:"primary",size:"medium",onClick:e=>{e.stopPropagation(),T(j)},matchParentWidth:!0,buttonText:w||"Choose plan"})]})}),q&&e.jsxs("div",{className:"popular-testimony",children:[e.jsx(i.default,{height:26,width:70}),e.jsx("div",{className:"testimony-text",children:e.jsx("i",{children:q})})]})]}),M&&e.jsx("div",{className:`plan-bottom-information\n\t\t\t\t\t${C?"disabled":""}\n\t\t\t\t\t${b?"selected":""}\n\t\t\t\t`,children:e.jsx(r.Caption,{className:"text",style:{color:c.COLORS.background.inverse},children:M})})]})})};

package/dist/cjs/components/plans/SubscriptionPlan.d.ts

@@ -0,0 +1,41 @@
+import { FunctionComponent } from 'react';
+
+interface PlanPrice {
+    price: number;
+    discount: number;
+}
+interface PlanFeature {
+    detail: string;
+}
+interface SubscriptionPlanProps {
+    code: string;
+    isMostPopular?: boolean;
+    isDisabled?: boolean;
+    isSelected?: boolean;
+    planName: string;
+    monthlyPlan: PlanPrice;
+    showTrialOptions: boolean;
+    yearlyPlan: PlanPrice;
+    features: PlanFeature[];
+    showMonthly: boolean;
+    planDescription?: string;
+    planDescriptionDiscount?: string;
+    onPlanSelect: (code: string) => void;
+    bottomDescription?: string;
+    freeTrialMessages?: string;
+    extraBlockMessage?: string;
+    isLoading?: boolean;
+    showMonthlyOptions?: boolean;
+    oldPrice?: number;
+    currency?: string;
+    annualFeatures?: PlanFeature[];
+    hideMonthYearTag?: boolean;
+    buttonText?: string;
+    hoverTooltip?: string;
+    hidePriceBlock?: boolean;
+}
+type Props = SubscriptionPlanProps;
+declare const SubscriptionPlan: FunctionComponent<Props>;
+
+export { SubscriptionPlan };
+export type { SubscriptionPlanProps };

package/dist/cjs/components/plans/SubscriptionPlan.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/check.svg.js"),s=require("../button/Button.js"),i=require("./SubscriptionPlanStyled.js"),n=require("../TypographyStyle.js"),r=require("../../hooks/useCurreny.js"),a=require("../../constants/Theme.js");exports.SubscriptionPlan=o=>{const{formatCurrency:l}=r.useCurrency(),c=o.showMonthlyOptions?o.features:o.annualFeatures||[],d=o.showMonthlyOptions?o.monthlyPlan:o.yearlyPlan,p=!o.isDisabled&&o.isMostPopular,u=e=>0==e?"$0":l(e,"USD");return e.jsxs(i.SubscriptionPlanStyled,{isManifestPlan:!0,isSelected:o.isSelected||!1,style:{marginTop:p?0:24},children:[p&&e.jsx("div",{className:"most-popular",children:e.jsx(n.Caption,{className:"text",children:"Most popular ⭐️"})}),e.jsxs("div",{className:`box ${o.isSelected?"selected":""} ${o.isDisabled?"disabled":""} ${p?"":"rounded-corners"}\n\t\t\t\t`,children:[e.jsxs("div",{children:[e.jsx(n.TitleRegular,{style:{color:a.COLORS.content.secondary,marginBottom:4},children:o.planName}),o?.hidePriceBlock?e.jsx(e.Fragment,{}):e.jsxs("div",{className:"price-block",children:[o.oldPrice?e.jsx(n.BodyCaption,{className:"old--price",children:u(d.price)}):e.jsx(e.Fragment,{}),e.jsx(n.TitleMedium,{style:{color:a.COLORS.content.primary},children:o.oldPrice?u(o.oldPrice):u(d.price)}),e.jsx(n.BodyPrimary,{style:{color:a.COLORS.content.secondary,marginLeft:4},children:o.hideMonthYearTag?"":"/ "+(o.showMonthlyOptions?"month":"year")})]}),e.jsxs("div",{className:"per-message-price",children:[o.planDescription&&e.jsx(n.BodyCaption,{style:{color:a.COLORS.content.secondary},children:o.planDescription}),o.planDescriptionDiscount&&e.jsx(n.BodyCaption,{style:{color:a.COLORS.background.positive.vibrant,marginLeft:4},children:o.planDescriptionDiscount})]}),o.showTrialOptions&&e.jsxs(n.Caption,{className:"trial "+(o.isSelected?"selected":""),children:["7 day free trial with ",o.freeTrialMessages," messages"]}),o.extraBlockMessage&&e.jsx(n.Caption,{className:"trial "+(o.isSelected?"selected":""),children:o.extraBlockMessage}),e.jsx("div",{className:"features",children:c.map(((s,i)=>e.jsxs("div",{className:"feature",children:[e.jsx("div",{children:e.jsx(t.default,{height:12,width:12,color:a.COLORS.content.primary})}),e.jsx(n.BodyCaption,{className:"feature-text",children:s.detail},i)]},s.detail)))})]}),e.jsx("div",{className:"button-box",children:o.isLoading?e.jsx(s.Button,{isLoading:!0,buttonType:"primary",buttonText:"Choose plan",size:"medium",matchParentWidth:!0}):e.jsxs(e.Fragment,{children:[o.isSelected&&e.jsx(s.Button,{disabled:o.isDisabled,LeadingIcon:t.default,buttonType:"tertiary",size:"medium",matchParentWidth:!0,buttonText:o.buttonText||"Selected Plan"}),!o.isSelected&&!o.isDisabled&&e.jsx(s.Button,{buttonType:"primary",size:"medium",onClick:()=>o.onPlanSelect(o.code),matchParentWidth:!0,buttonText:o.buttonText||"Choose plan"})]})})]}),o.bottomDescription&&e.jsx("div",{className:`plan-bottom-information\n\t\t\t\t\t${o.isDisabled?"disabled":""}\n\t\t\t\t\t${o.isSelected?"selected":""}\n\t\t\t\t`,children:e.jsx(n.Caption,{className:"text",style:{color:a.COLORS.background.inverse},children:o.bottomDescription})})]})};

package/dist/cjs/components/plans/SubscriptionPlanSelector.d.ts

@@ -0,0 +1,49 @@
+import * as _emotion_styled from '@emotion/styled';
+import * as React from 'react';
+import { FunctionComponent } from 'react';
+import * as _emotion_react from '@emotion/react';
+import { SubscriptionPlanProps } from './SubscriptionPlan.js';
+import { TabViewHeaderProps } from '../tabs/Tabs.model.js';
+
+type Props = {
+    plans: SubscriptionPlanProps[];
+    onPlanSelect: (code: string) => void;
+    onClose: () => void;
+    subHeader?: string;
+    warningDescription?: string;
+    showTrialOptions?: boolean;
+    header?: string;
+    showMonthlyOptions?: boolean;
+    showMonthlyTabs?: boolean;
+    staticWidthMultiplier?: number;
+    tabProperties?: TabViewHeaderProps;
+    showCouponApplicationCode?: boolean;
+    discountInputProperties?: {
+        errorMessage?: string;
+        successText?: string;
+        defaultValue?: string;
+        showRemoveCoupon?: boolean;
+        onChangeText: (text: string) => void;
+        removeCoupon?: () => void;
+        onCouponApply?: () => void;
+        isLoading?: boolean;
+    };
+    showBookAdemo?: boolean;
+    demoLink?: string;
+    onClickingBookADemo?: () => void;
+};
+declare const HeaderWrapper: _emotion_styled.StyledComponent<{
+    theme?: _emotion_react.Theme | undefined;
+    as?: React.ElementType<any> | undefined;
+}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+declare const BottomWrapper: _emotion_styled.StyledComponent<{
+    theme?: _emotion_react.Theme | undefined;
+    as?: React.ElementType<any> | undefined;
+}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+declare const defaultTabs: {
+    key: string;
+    title: string;
+}[];
+declare const SubscriptionPlanSelector: FunctionComponent<Props>;
+
+export { BottomWrapper, HeaderWrapper, SubscriptionPlanSelector, defaultTabs };