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

package/dist/cjs/components/accordion/Accordion.style.js

@@ -0,0 +1,43 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),r=require("../../constants/Theme.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=o(e);const i=d.default.div`
+	width: ${e=>e?.width||"100%"};
+	display: flex;
+	flex-direction: column;
+	border: ${e=>e.showBorders?"1px solid "+r.COLORS.stroke.primary:""};
+	border-color: ${e=>e.borderColor||r.COLORS.stroke.primary};
+	border-radius: ${e=>e.borderRadius?e.borderRadius:e.showBorders?"4px":""};
+	background: ${e=>e.backgroundColor||"unset"};
+	.accordion {
+		&__overview {
+			display: flex;
+			flex-direction: column;
+			gap: 4px;
+			padding: ${e=>e.headerPadding?e.headerPadding:"24px"};
+			border-bottom: ${e=>e.showBorders&&e.isActive?"1px solid "+r.COLORS.stroke.primary:""};
+			border-color: ${e=>e.borderColor||r.COLORS.stroke.primary};
+			&__header {
+				display: flex;
+				flex-direction: row;
+				align-items: center;
+				justify-content: space-between;
+			}
+			&__title-wrapper {
+				display: flex;
+				gap: 8px;
+			}
+			:hover {
+				background: ${e=>e.skipHoverState?null:r.COLORS.surface.subdued};
+				border-radius: ${e=>e.skipHoverState?null:"4px"};
+			}
+		}
+		&__content {
+			${e=>e.isActive?{margin:e?.contentMargin||"0px"}:{}};
+			overflow: ${e=>e.hasChildrenMaxHeight?"scroll":"hidden"};
+			max-height: 0;
+			order: ${e=>"UP"===e.openDirection?-1:0};
+		}
+	}
+`,t=d.default.div`
+	display: flex;
+	align-items: center;
+	gap: 24px;
+`;exports.AccordionHeaderGroup=t,exports.default=i;

package/dist/cjs/components/accordion/AccordionArrow.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const l=r(require("react")).default.forwardRef(((r,l)=>e.jsxs("div",{ref:l,className:"d-flex align-items-center",children:[!r.isNewIcon&&e.jsx("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e.jsx("path",{d:"M7.7071 10.7071C7.07713 10.0771 7.5233 9 8.41421 9H15.5858C16.4767 9 16.9228 10.0771 16.2929 10.7071L12.7071 14.2929C12.3166 14.6834 11.6834 14.6834 11.2929 14.2929L7.7071 10.7071Z",fill:r.arrowColor??"currentColor"})}),r.isNewIcon&&e.jsx("svg",{width:"10",height:"6",viewBox:"0 0 10 6",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M0.528758 0.52827C0.789108 0.26792 1.21122 0.26792 1.47157 0.52827L5.00016 4.05687L8.52876 0.52827C8.78911 0.26792 9.21122 0.26792 9.47157 0.52827C9.73192 0.788619 9.73192 1.21073 9.47157 1.47108L5.47157 5.47108C5.21122 5.73143 4.78911 5.73143 4.52876 5.47108L0.528758 1.47108C0.268409 1.21073 0.268409 0.788619 0.528758 0.52827Z",fill:r.arrowColor??"currentColor"})})]})));l.displayName="BikAccordionArrow",exports.default=l;

package/dist/cjs/components/action-button/ActionButton.styled.js

@@ -0,0 +1,23 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),r=require("../../constants/Theme.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const t=o(e).default.div`
+	width: ${e=>e.width??"100%"};
+	display: flex;
+	flex-direction: row;
+	justify-content: center;
+	align-items: center;
+	gap: 8px;
+	padding: 14px 0px;
+	box-shadow: ${e=>e.isConfigured||e.isSelected||e.isError?"0px 2px 8px 0px #0000001f":""};
+	background-color: white;
+	border-radius: 4px;
+	border: ${e=>e.border??`1px solid ${r.BASE_COLORS.grayscale[200]}`};
+	cursor: pointer;
+	:hover {
+		background-color: ${e=>e.isSelected||e.isError?"":r.BASE_COLORS.grayscale[200]};
+		border: ${e=>e.isSelected||e.isError?"":e.isConfigured?`1px solid ${r.BASE_COLORS.grayscale[400]}`:`1px dashed ${r.BASE_COLORS.grayscale[400]}`};
+	}
+
+	.action__icon {
+		height: 20px;
+		width: 20px;
+	}
+`;exports.ActionButtonContainer=t;

package/dist/cjs/components/action-button/ActionButtons.d.ts

@@ -0,0 +1,14 @@
+import React__default from 'react';
+
+interface ActionButtonInterface {
+    state: 'CONFIGURED' | 'NOT-CONFIGURED';
+    buttonText: string;
+    isSelected: boolean;
+    isError: boolean;
+    onClick: () => void;
+    icon: React__default.FunctionComponent<React__default.SVGAttributes<SVGElement>>;
+}
+declare const ActionButtons: React__default.FC<ActionButtonInterface>;
+
+export { ActionButtons };
+export type { ActionButtonInterface };

package/dist/cjs/components/action-button/ActionButtons.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("../../constants/Theme.js"),o=require("../../assets/icons/similar.svg.js"),s=require("../TypographyStyle.js"),i=require("./ActionButton.styled.js");exports.ActionButtons=({state:t,buttonText:l,icon:c=o.default,isSelected:d,isError:a,onClick:S})=>{const{color:n,border:O}="CONFIGURED"===t?(({isSelected:e,isError:o})=>e&&o?{color:r.BASE_COLORS.negative[700],border:`1px solid ${r.BASE_COLORS.negative[700]}`}:e?{color:r.BASE_COLORS.brand[500],border:`1px solid ${r.BASE_COLORS.brand[500]}`}:o?{color:r.BASE_COLORS.grayscale[900],border:`1px solid ${r.BASE_COLORS.negative[700]}`}:{color:r.BASE_COLORS.grayscale[900],border:`1px solid ${r.BASE_COLORS.grayscale[200]}`})({isSelected:d,isError:a}):(({isSelected:e,isError:o})=>e&&o?{color:r.BASE_COLORS.negative[700],border:`1px solid ${r.BASE_COLORS.negative[700]}`}:e?{color:r.BASE_COLORS.brand[500],border:`1px solid ${r.BASE_COLORS.brand[500]}`}:o?{color:r.BASE_COLORS.grayscale[700],border:`1px solid ${r.BASE_COLORS.negative[700]}`}:{color:r.BASE_COLORS.grayscale[700],border:`1px dashed ${r.BASE_COLORS.grayscale[200]}`})({isSelected:d,isError:a}),E={height:20,width:20,color:n,style:{display:"block"},className:"icon"};return e.jsxs(i.ActionButtonContainer,{isSelected:d,isError:a,border:O,isConfigured:"CONFIGURED"===t,onClick:S,children:[e.jsx("div",{className:"action__icon",children:e.jsx(c,{...E})}),e.jsx(s.BodyPrimary,{style:{fontWeight:600,color:n},children:l})]})};

package/dist/cjs/components/add-variableV2/AddVariableBox.styled.js

@@ -0,0 +1,25 @@
+"use strict";function t(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}Object.defineProperty(exports,"__esModule",{value:!0});const e=t(require("styled-components")).default.button`
+	padding: 2px 8px;
+	position: absolute;
+	right: 0px;
+	cursor: pointer;
+	color: white;
+	background-color: black;
+	width: fit-content;
+	float: right;
+	margin-top: 0px;
+	font-family: Inter;
+	font-style: normal;
+	font-weight: 600;
+	font-size: 14px;
+	line-height: 20px;
+	border-radius: 4px;
+	border: 1px solid #ccc;
+	margin-right: 1px;
+	z-index: 100;
+
+	.add {
+		display: flex;
+		align-items: center;
+	}
+`;exports.AddVariableStyled=e;

package/dist/cjs/components/add-variableV2/AddVariableV2.d.ts

@@ -0,0 +1,61 @@
+import React__default from 'react';
+
+interface VariableListInterfaceV2 {
+    displayName: string;
+    description: string;
+    orderId: number;
+    variables?: any;
+}
+interface Variable {
+    description?: string;
+    defaultValue?: string;
+    displayName: string;
+    actualValue: string;
+    variableType: string;
+    isAvailable: boolean;
+    actualValueEval?: string;
+    isSubHeader?: boolean;
+    variables?: {
+        [key: string]: Variable;
+    };
+    needsFetching?: boolean;
+}
+interface AddVariableProps {
+    data: VariableListInterfaceV2[];
+    showVariable: any;
+    setShowVariable: any;
+    variableValue?: any;
+    setVariableValue?: any;
+    placeholder: string;
+    customTrigger?: any;
+    isSearchRequired?: boolean;
+    isModalState?: boolean;
+    leftPosition?: number;
+    topPosition?: string;
+    pickerSize?: string;
+    enableVariable?: boolean;
+    isEvaluationList?: boolean;
+    onSearchBlur?: (e: any) => void;
+    id?: string;
+    selectWithTypes?: boolean;
+    positionStrategy?: 'static' | 'fixed';
+    zindex?: number;
+    hasHeader?: boolean;
+    height?: string;
+    needsBorder?: boolean;
+    reRender?: string;
+    styledCloseBtn?: boolean;
+    width?: string;
+    readonly?: boolean;
+}
+type Props = AddVariableProps;
+interface VariableBoxProps {
+    item: Variable;
+    raw?: string;
+    parentKey?: string;
+    readonly?: boolean;
+}
+declare const AddVariableV2: React__default.FC<Props>;
+
+export { AddVariableV2 };
+export type { AddVariableProps, Variable, VariableBoxProps, VariableListInterfaceV2 };

package/dist/cjs/components/add-variableV2/AddVariableV2.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),a=require("../../assets/icons/back_icon.svg.js"),s=require("../../assets/icons/chevronRightAlt.svg.js"),i=require("../../assets/icons/cross.svg.js"),l=require("../../assets/icons/plus.svg.js"),t=require("../../assets/icons/undo.svg.js"),r=require("react"),n=require("./AddVariableV2.styled.js"),o=require("../button/Button.js"),d=require("../icon-button/IconButton.js"),c=require("../searchBar/searchBar.js"),u=require("../tooltips/Tooltip.js"),b=require("../../constants/Theme.js"),v=require("../modals/modal.styled.js"),h=require("../switch/Switch.js"),m=require("../TypographyStyle.js");const p=r.memo((p=>{const{data:y,hasHeader:j=!0,needsBorder:x=!0,styledCloseBtn:f=!1,readonly:g=!1}=p,[S,N]=r.useState({}),[C,V]=r.useState(),[w,T]=r.useState(""),[_,B]=r.useState(""),[k,L]=r.useState(!0),q=/.*\..*/,[F,I]=r.useState(p.data),[E,O]=r.useState(!0);r.useEffect((()=>{const e={};y.forEach((a=>{e[a.displayName]=[]})),V(e)}),[y]),r.useEffect((()=>{P(!0)}),[]),r.useEffect((()=>{P(E,!w)}),[S,w]),r.useEffect((()=>{O(!0),B(""),H([],w),V((e=>({...e,[w]:[]}))),T("");const e=p.data.map((e=>z(e))).filter((e=>null!==e));I(e),e.length>0?L(!0):L(!1)}),[p.reRender]),r.useEffect((()=>{let e=p.data;w&&(e=[S[w]]);A(e,E).length>0?L(!0):L(!1)}),[_]);const A=(e,a=!1)=>e.flatMap((e=>Object.keys(e.variables).filter((s=>e.variables[s].displayName?.toLowerCase().includes(_.toLowerCase())&&(!a||e.variables[s].isAvailable===a)||R(e.variables[s]))))),H=(e,a)=>{const s=y.find((e=>e.displayName===a));if(s){let i=s;e.forEach(((e,a)=>{i=i.variables[e]})),N((e=>({...e,[a]:i})))}},R=e=>{let a=!1;if(e.isSubHeader&&e.variables){const s=Object.keys(e.variables);for(let i=0;i<s.length;i++){const l=s[i];if(e.variables&&e.variables[l].displayName.toLowerCase().includes(_.toLowerCase())&&e.variables[l].isAvailable===E){a=!0;break}}}return a},P=(e,a=!1)=>{if(O(e),e){let s=[];if(!w||a)s=p.data.map((e=>z(e))).filter((e=>null!==e));else{const e=S[w];s=p.data.filter((e=>e.displayName===w)).map((a=>z(a,e))).filter((e=>null!=e))}I(s),_&&(s=A(s,e)),s.length>0?L(!0):L(!1)}else if(I(p.data),_){A(p.data,e).length>0?L(!0):L(!1)}else L(!0)};function z(e,a,s={}){if(a)for(const i in e.variables)if(e.variables[i].displayName===a.displayName)for(const a in e.variables[i].variables)e.variables[i].variables[a].isAvailable&&(s[a]=e.variables[i].variables[a]);else e.variables[i].isSubHeader&&z(e.variables[i],a,s);else for(const a in e.variables)e.variables[a].isAvailable&&(s[a]=e.variables[a]);return 0===Object.keys(s).length?null:{...e,variables:s}}const $=a=>{const s=a.item.description;return a.readonly?e.jsx("div",{children:e.jsx(M,{item:a.item,readonly:a.readonly})}):e.jsx(e.Fragment,{children:e.jsx(u.Tooltip,{body:"",tooltipContent:e.jsx(m.BodyCaption,{color:b.COLORS.content.primaryInverse,style:{whiteSpace:"pre-line",padding:8},children:a.item.isAvailable?s?`• ${s}\n• Recommended here`:"Recommended here":"Not recommended here"}),width:300,delay:300,placement:"bottom",children:e.jsx("div",{children:e.jsx(M,{item:a.item})})})})},M=a=>e.jsx(o.Button,{darkMode:p.enableVariable?p.enableVariable:a.item.isAvailable,size:"chip",disabled:!!a.readonly&&!a.item.isSubHeader,LeadingIcon:a.item.isSubHeader||a.readonly?void 0:l.default,TrailingIcon:()=>a.item.isSubHeader?e.jsx("div",{className:"icon-trailing",style:{display:"flex"},children:e.jsx(s.default,{})}):e.jsx(e.Fragment,{}),buttonText:a.item.displayName}),W=(a,s)=>E&&!a.isAvailable?e.jsx(e.Fragment,{}):e.jsx("div",{onClick:a.isSubHeader?()=>{A([a],E).length||L(!1),B("");const e=[...C[w],s];H(e,w),V((a=>({...a,[w]:e})))}:()=>{p.customTrigger?(p.customTrigger(a),p.setShowVariable(!1)):p.isEvaluationList?G(a):p.setVariableValue(p.selectWithTypes?{actualValue:a.actualValue,variableType:a.variableType,needsFetching:a.needsFetching}:a.actualValue)},children:e.jsx($,{item:a,readonly:g})}),D=(e,a)=>{const s=[...C[e.displayName],a];H(s,e.displayName),V((a=>({...a,[e.displayName]:s}))),T(e.displayName)},G=e=>{if(e.actualValue.match(q)){const a=e.actualValue.replace("{{","").replace("}}","").split(".");let s=a[0];a.forEach(((e,a)=>{if(0===a)return;const i=(e=>/\w+\[\d+\]/g.test(e))(e);if(i){const a=e.match(/(\w+)\[(\d+)\]/);if(a){const e=a[1],i=a[2];s+=`['${e}'][${i}]`}}else s+=`['${e}']`})),p.setVariableValue(p.selectWithTypes?{actualValue:s,variableType:e.variableType,needsFetching:e.needsFetching}:s)}else{const a=e.actualValueEval?e.actualValueEval:e.actualValue;p.setVariableValue(p.selectWithTypes?{actualValue:a,variableType:e.variableType,needsFetching:e.needsFetching}:a)}},J=(e,a)=>{if(p.customTrigger)p.customTrigger(e.variables[a]),p.setShowVariable(!1);else if(p.isEvaluationList){const s=e.variables[a];G(s)}else p.setVariableValue(p.selectWithTypes?{actualValue:e.variables[a].actualValue,variableType:e.variables[a].variableType,needsFetching:e.variables[a].needsFetching}:e.variables[a].actualValue)},K=p.isModalState?void 0:{top:`${p.topPosition?p.topPosition:"small"===p.pickerSize?"300px":"60px"}`,left:`${p.leftPosition?p.leftPosition+24:430}px`};return e.jsx("div",{id:"varList",tabIndex:-1,children:e.jsxs(n.AddVariableStyled,{style:K,onClick:e=>{e.stopPropagation()},pickerSize:p.pickerSize||"large",isModalState:p.isModalState,positionStrategy:p.positionStrategy,zIndex:p.zindex,height:p.height,needsBorder:x,width:p.width,children:[f&&e.jsx(v.CloseButtonContainer,{onClick:()=>{p.setShowVariable(!1)},style:{zIndex:300},children:e.jsx(i.default,{height:20,width:20,color:b.COLORS.content.secondary})}),p.showVariable&&e.jsxs("div",{className:"popup",children:[e.jsxs("div",{className:"sticky__bar",children:[j&&e.jsxs("div",{className:"header__bar",children:[e.jsx("div",{className:"add__variable",children:"Add a new variable"}),!f&&e.jsx("div",{onClick:()=>{p.setShowVariable(!1)},style:{display:"flex",alignItems:"center",justifyContent:"center"},children:e.jsx(d.IconButton,{iconButtonType:"default",Icon:i.default})})]}),e.jsxs("div",{className:"search__bar",onBlur:e=>{p.onSearchBlur&&p.onSearchBlur(e)},children:[e.jsx(c.SearchBar,{width:"100%",isEnabled:!0,onChange:e=>{B(e)},onEnter:()=>{},reset:!_,placeholder:"Search...",variant:"default"}),e.jsxs("div",{style:{display:"flex",alignItems:"center",marginTop:8,justifyContent:"space-between"},children:[e.jsx(m.BodySecondary,{style:{color:b.COLORS.content.secondary},children:"Show only recommended variables"}),e.jsx(h.Switch,{value:E,onValueChange:async e=>await P(e)})]})]}),w&&C[w].length>0&&e.jsxs("div",{className:"nav__bar",children:[e.jsxs("div",{className:"left__nav",children:[e.jsx(d.IconButton,{Icon:a.default,style:{color:"#919191",display:"flex"},onClick:()=>{B("");const e=C[w].slice(0,-1);H(e,w),V((a=>({...a,[w]:e}))),e.length||T("")}}),e.jsxs("div",{className:"block",children:[e.jsx(m.TitleSmall,{children:S[w].displayName}),S[w].description&&e.jsx(m.BodyCaption,{children:S[w].description})]})]}),e.jsxs("div",{className:"right__nav",children:[e.jsx(d.IconButton,{Icon:t.default,style:{display:"flex"},onClick:()=>{B(""),H([],w),V((e=>({...e,[w]:[]}))),T("")}}),e.jsx("div",{children:"First page"})]})]})]}),!k&&e.jsxs("div",{style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",marginTop:16},children:[e.jsx(m.TitleSmall,{children:"No results found!"}),E?e.jsx(m.BodyCaption,{children:"Sorry we could not find any recommended variables"}):e.jsx(m.BodyCaption,{children:`Sorry we could not find any results for "${_}"`})]}),e.jsx("div",{className:"wrapper",children:e.jsx("div",{className:"list__map",children:e.jsxs("div",{className:"items",children:[!w&&F.map((a=>{let s=[];return _&&(s=Object.keys(a.variables).filter((e=>a.variables[e].displayName?.toLowerCase().includes(_.toLowerCase())||R(a.variables[e])))),e.jsxs(e.Fragment,{children:[_?s.length>0?e.jsxs("div",{className:"block",children:[e.jsx("div",{className:"heading__font",children:a?.displayName}),e.jsx(m.BodyCaption,{style:{marginBottom:8,color:"#616161"},children:a?.description})]}):e.jsx(e.Fragment,{}):e.jsxs("div",{className:"block",children:[e.jsx("div",{className:"heading__font",children:a?.displayName}),e.jsx(m.BodyCaption,{style:{marginBottom:8,color:"#616161"},children:a?.description})]}),Object.keys(a.variables).map((s=>_?a.variables[s].displayName?.toLowerCase().includes(_.toLowerCase())||R(a.variables[s])?e.jsx("div",{onClick:a.variables[s].isSubHeader?()=>D(a,s):()=>J(a,s),children:e.jsx($,{item:a.variables[s],readonly:g})}):e.jsx(e.Fragment,{}):e.jsx("div",{onClick:a.variables[s].isSubHeader?()=>D(a,s):()=>J(a,s),children:e.jsx($,{item:a.variables[s],readonly:g})})))]})})),w&&e.jsx("div",{className:"list__map",children:e.jsx("div",{className:"items",style:{marginTop:16},children:Object.keys(S[w].variables).map(((a,s)=>_?S[w].variables[a].displayName?.toLowerCase().includes(_.toLowerCase())||R(S[w].variables[a])?W(S[w].variables[a],a):e.jsx(e.Fragment,{}):W(S[w].variables[a],a)))})})]})})}),e.jsx("div",{className:"bottom__padding"})]})]})})}),((e,a)=>e.enableVariable===a.enableVariable&&(e.leftPosition===a.leftPosition&&e.reRender===a.reRender)));exports.AddVariableV2=p;

package/dist/cjs/components/add-variableV2/AddVariableV2.styled.js

@@ -0,0 +1,164 @@
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}Object.defineProperty(exports,"__esModule",{value:!0});var o=e(require("styled-components"));const t=o.default.div`
+	position: ${e=>e.positionStrategy?e.positionStrategy:"fixed"};
+	z-index: ${e=>e.zIndex?e.zIndex:250};
+	*::-webkit-scrollbar {
+		display: none;
+	}
+	* {
+		-ms-overflow-style: none;
+		scrollbar-width: none;
+	}
+	.popup {
+		background: white;
+		width: ${e=>e.width?e.width:e.isModalState?"566px":"480px"};
+		height: ${e=>e.isModalState?"100vh":e.height?e.height:"small"===e.pickerSize?"40vh":"90vh"};
+		border: ${e=>e.needsBorder?e.isModalState?"unset":"1px solid #e0e0e0":"none"};
+		border-radius: 8px;
+		overflow-y: scroll;
+		.sticky__bar {
+			z-index: 10;
+			position: sticky;
+			top: 0;
+			background: white;
+
+			.header__bar {
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				padding: 24px 24px 16px 24px;
+				border-bottom: 1px solid var(--stroke-color-stroke-primary, #e0e0e0);
+				.add__variable {
+					font-family: 'Inter';
+					font-style: normal;
+					font-weight: 600;
+					font-size: 20px;
+					line-height: 24px;
+
+					color: #212121;
+				}
+			}
+
+			.search__bar {
+				padding: 24px 24px 8px 24px;
+				background-color: #fafafa;
+				border-bottom: 1px solid var(--stroke-color-stroke-primary, #e0e0e0);
+			}
+			.nav__bar {
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				border-bottom: 1px solid var(--stroke-color-stroke-primary, #e0e0e0);
+				background: var(--surface-color-surface-hovered, #f0f0f0);
+				padding: 10px 24px;
+
+				font-family: Inter;
+				font-size: 14px;
+				font-style: normal;
+
+				line-height: 20px;
+
+				.left__nav {
+					display: flex;
+					align-items: center;
+					gap: 8px;
+					color: var(--content-color-content-primary, #212121);
+					cursor: pointer;
+				}
+				.right__nav {
+					display: flex;
+					align-items: center;
+					gap: 8px;
+					font-weight: 400;
+					color: var(--content-color-content-secondary, #616161);
+					cursor: pointer;
+				}
+			}
+		}
+		hr {
+			margin: 0;
+			border: 0.2px solid #e0e0e0;
+		}
+		.wrapper {
+			padding: 4px 24px 16px 24px;
+			.search__bar {
+				padding-bottom: 16px;
+				input {
+					width: 100%;
+					padding: 6px 8px;
+					border: 1px solid #e0e0e0;
+					border-radius: 4px;
+					background-image: url('https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F5bc8962e-af88-4692-80f1-631ac4a5c6c7?alt=media&token=7931b07d-cb55-43aa-be75-9ddac4b8ddad');
+					background-repeat: no-repeat;
+					background-position: 95% 50%;
+					background-size: 20px 20px;
+				}
+			}
+			.heading__font {
+				font-family: 'Inter';
+				font-style: normal;
+				font-weight: 600;
+				font-size: 16px;
+				line-height: 24px;
+				padding: 12px 0 0 0;
+				color: #212121;
+			}
+			.sub_heading__font {
+				font-family: 'Inter';
+				font-style: normal;
+				font-size: 12px;
+				line-height: 24px;
+				color: #212121;
+			}
+
+			.items {
+				display: flex;
+				flex-wrap: wrap;
+				grid-gap: 8px;
+				.block {
+					display: block;
+					min-width: 100%;
+					flex-wrap: nowrap;
+					width: 430px;
+				}
+			}
+		}
+		position: relative;
+
+		.bottom__padding {
+			background: white;
+			min-height: 30px;
+			width: 100%;
+			position: sticky;
+			z-index: 10;
+			bottom: 0px;
+		}
+	}
+`;o.default.div`
+	.box {
+		display: flex;
+		align-items: center;
+		cursor: pointer;
+		padding: 6px 12px 6px 8px;
+		gap: 8px;
+		width: auto;
+		height: 32px;
+
+		background: ${e=>e?.isAvailable?"#f0f0f0":"#fafafa"};
+
+		border: 1px solid #e0e0e0;
+		border-radius: 4px;
+		.icon {
+			color: ${e=>e?.isAvailable?"#212121":"#bdbdbd"};
+			display: flex;
+			align-items: center;
+		}
+		.variable__name {
+			font-family: 'Inter';
+			font-style: normal;
+			font-weight: 400;
+			font-size: 14px;
+			line-height: 20px;
+			color: ${e=>e?.isAvailable?"#212121":"#bdbdbd"};
+		}
+	}
+`,exports.AddVariableStyled=t;

package/dist/cjs/components/add-variableV2/AddVariableV2SideModal.d.ts

@@ -0,0 +1,23 @@
+import React__default from 'react';
+import { VariableListInterfaceV2 } from './AddVariableV2.js';
+
+interface VariableV2SideModalProps {
+    data: VariableListInterfaceV2[];
+    showVariable: any;
+    setShowVariable: any;
+    variableValue?: any;
+    setVariableValue?: any;
+    placeholder: string;
+    customTrigger?: any;
+    isSearchRequired?: boolean;
+    leftPosition?: number;
+    pickerSize?: string;
+    zIndex?: number;
+    onSearchBlur?: (e: any) => void;
+    id?: string;
+    selectWithTypes?: boolean;
+}
+declare const AddVariableV2SideModal: React__default.FC<VariableV2SideModalProps>;
+
+export { AddVariableV2SideModal };
+export type { VariableV2SideModalProps };

package/dist/cjs/components/add-variableV2/AddVariableV2SideModal.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),a=require("react-dom"),r=require("./AddVariableV2.js"),l=require("../side-modal/SideModal.style.js");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=t(a);exports.AddVariableV2SideModal=a=>d.default.createPortal(e.jsx(l.SideModalStyle,{zIndex:a.zIndex,children:e.jsx(l.SideModalContainer,{children:e.jsx(r.AddVariableV2,{data:a.data,showVariable:a.showVariable,setShowVariable:a.setShowVariable,variableValue:a.variableValue,setVariableValue:a.setVariableValue,placeholder:"Add a variable",customTrigger:a.customTrigger,isModalState:!0,onSearchBlur:a.onSearchBlur,selectWithTypes:a.selectWithTypes})})}),document.body);

package/dist/cjs/components/add-variableV2/types.d.ts

@@ -0,0 +1,8 @@
+type SelectedVariable = {
+    actualValue: string;
+    variableType: VARIABLE_TYPES;
+    needsFetching?: boolean;
+};
+type VARIABLE_TYPES = 'number' | 'string' | 'integer' | 'boolean' | 'list' | 'any';
+
+export type { SelectedVariable, VARIABLE_TYPES };

package/dist/cjs/components/ai-modals/ActivateBikAI.d.ts

@@ -0,0 +1,12 @@
+import React__default from 'react';
+import { POD } from '../template-preview/models/WhatsAppTemplate.js';
+
+declare const ActivateBikAi: React__default.FC<{
+    open: boolean;
+    onModalClose: () => void;
+    onRightBtnClick: () => void;
+    onLeftBtnClick: () => void;
+    source: POD.CHATBOT | POD.CRM;
+}>;
+
+export { ActivateBikAi };

package/dist/cjs/components/ai-modals/ActivateBikAI.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../constants/Theme.js"),i=require("../../assets/icons/graph.svg.js"),r=require("../../assets/icons/sparkle.svg.js"),s=require("../button/Button.js"),n=require("../modals/Modal.js"),o=require("../TypographyStyle.js");exports.ActivateBikAi=({open:l,onModalClose:d,onRightBtnClick:a,onLeftBtnClick:c,source:x})=>e.jsx(n.Modal,{open:l,centralContainerStyles:{height:"430px",width:"464px",borderRadius:"12px"},zIndex:40,onClose:d,closeOnOutsideClick:!0,children:e.jsxs("div",{children:[e.jsxs("div",{style:{height:"180px",width:"100%",backgroundColor:"rgba(142, 142, 142, 0.2)",display:"flex",justifyContent:"center",alignItems:"center",gap:"18px",padding:"24px"},children:[e.jsx("div",{children:e.jsx(i.default,{width:100,height:90})}),e.jsx("div",{children:"CHATBOT"===x?e.jsx(o.TitleMedium,{children:"Unlock higher conversion and ease agent work with BIK.AI"}):e.jsx(o.TitleMedium,{children:"Experience reduced Average Handling Time of your tickets with Bik.AI!"})})]}),e.jsxs("div",{style:{display:"flex",justifyContent:"center",alignItems:"center",flexDirection:"column",gap:"16px",padding:"24px"},children:[e.jsxs("div",{style:{display:"flex",flexDirection:"row",gap:"4px"},children:[e.jsx(o.TitleLarge,{children:"Activate BIK AI"}),e.jsx(r.default,{width:32,height:32})]}),"CHATBOT"===x?e.jsxs("div",{style:{display:"flex",flexDirection:"column",justifyContent:"center",alignItems:"center"},children:[e.jsx(o.BodyPrimary,{color:"#888888",children:"Sync your Shopify Data to Bik.AI to supercharge it with"}),e.jsx(o.BodyPrimary,{color:"#888888",children:"your store’s data to start personalizing it to your"}),e.jsx(o.BodyPrimary,{color:"#888888",children:"customers!"})]}):e.jsxs("div",{style:{display:"flex",flexDirection:"column",justifyContent:"center",alignItems:"center"},children:[e.jsxs(o.BodyPrimary,{color:"#888888",children:["Sync your Shopify Data to Bik.AI to supercharge it with"," "]}),e.jsx(o.BodyPrimary,{color:"#888888",children:"your store’s data to start responding to customer"}),e.jsx(o.BodyPrimary,{color:"#888888",children:"queries right away!"})]})]}),e.jsxs("div",{style:{display:"flex",flexDirection:"row",justifyContent:"flex-end",alignItems:"center",gap:"12px",paddingBottom:"24px",paddingLeft:"24px",paddingRight:"24px"},children:[e.jsx(s.Button,{buttonText:"Learn More",buttonType:"text",size:"large",onClick:c}),e.jsx(s.Button,{buttonText:"Sync Shopify Data",size:"large",style:{backgroundColor:t.COLORS.background.brand},onClick:a})]})]})});

package/dist/cjs/components/ai-modals/AiCreditsExhausted.d.ts

@@ -0,0 +1,11 @@
+import React__default from 'react';
+
+declare const AiCreditsExhausted: React__default.FC<{
+    open: boolean;
+    onModalClose: () => void;
+    body?: string;
+    onRightBtnClick: () => void;
+    onLeftBtnClick: () => void;
+}>;
+
+export { AiCreditsExhausted };

package/dist/cjs/components/ai-modals/AiCreditsExhausted.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../constants/Theme.js"),s=require("../../assets/icons/alert_triangle.svg.js"),n=require("../button/Button.js"),i=require("../modals/Modal.js"),r=require("../progress-bar/ProgressBarComponent.js"),o=require("../TypographyStyle.js");exports.AiCreditsExhausted=({open:l,onModalClose:d,body:a,onRightBtnClick:c,onLeftBtnClick:x})=>e.jsx(i.Modal,{open:l,centralContainerStyles:{width:"498px",height:"312px",borderRadius:"12px"},onClose:d,closeOnOutsideClick:!0,zIndex:40,children:e.jsxs("div",{style:{padding:"24px",display:"flex",flexDirection:"column"},children:[e.jsx("div",{style:{display:"flex",justifyContent:"center"},children:e.jsx(o.TitleLarge,{children:"Free AI Credits Exhausted"})}),e.jsx("div",{style:{height:"24px"}}),e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"12px"},children:[e.jsxs("div",{style:{display:"flex",flexDirection:"row",alignItems:"center",gap:"4px"},children:[e.jsx(s.default,{color:t.COLORS.content.negative,width:20,height:20}),e.jsx("div",{style:{width:"8px"}}),e.jsx(o.TitleRegular,{children:"0/100"}),e.jsx(o.BodySecondary,{color:t.COLORS.content.secondary,children:"Free Credits left"})]}),e.jsx(r.ProgressBarComponent,{completed:100,isAnimated:!1,height:16,color:t.COLORS.content.negative})]}),e.jsx("div",{style:{height:"24px"}}),e.jsx(o.BodyPrimary,{color:t.COLORS.content.secondary,children:a||"Contact support to add credits to generate replies using AI, and enjoy continued AI assistance!"}),e.jsx("div",{style:{height:"44px"}}),e.jsxs("div",{style:{display:"flex",flexDirection:"row",justifyContent:"flex-end",alignItems:"center",gap:"12px"},children:[e.jsx(n.Button,{buttonText:"Learn More",buttonType:"text",size:"small",onClick:x}),e.jsx(n.Button,{buttonText:"Contact Support",size:"small",style:{backgroundColor:t.COLORS.background.brand},onClick:c})]})]})});

package/dist/cjs/components/ai-modals/AiCreditsLow.d.ts

@@ -0,0 +1,10 @@
+import React__default from 'react';
+
+declare const AiCreditsLow: React__default.FC<{
+    open: boolean;
+    onModalClose: () => void;
+    onRightBtnClick: () => void;
+    onLeftBtnClick: () => void;
+}>;
+
+export { AiCreditsLow };

package/dist/cjs/components/ai-modals/AiCreditsLow.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../constants/Theme.js"),i=require("../../assets/icons/alert_triangle.svg.js"),r=require("../button/Button.js"),n=require("../modals/Modal.js"),o=require("../TypographyStyle.js");exports.AiCreditsLow=({open:s,onModalClose:l,onLeftBtnClick:d,onRightBtnClick:c})=>e.jsx(n.Modal,{open:s,centralContainerStyles:{width:"498px",borderRadius:"12px"},onClose:l,closeOnOutsideClick:!0,zIndex:40,children:e.jsxs("div",{style:{padding:"24px",display:"flex",flexDirection:"column",width:"100%"},children:[e.jsx("div",{style:{display:"flex",flexDirection:"row",justifyContent:"center"},children:e.jsx("div",{style:{backgroundColor:t.COLORS.background.negative.light,width:"64px",height:"64px",padding:"12px",borderRadius:"40px"},children:e.jsx(i.default,{width:40,height:40,color:t.COLORS.content.negative})})}),e.jsx("div",{style:{height:"32px"}}),e.jsx(o.TitleLarge,{children:"Your AI Credits are running low"}),e.jsx("div",{style:{height:"24px"}}),e.jsx(o.BodyPrimary,{color:t.COLORS.content.secondary,children:"Recharge your credits now to ensure uninterrupted service."}),e.jsx("div",{style:{height:"12px"}}),e.jsx("div",{style:{display:"flex",flexDirection:"row",justifyContent:"center"},children:e.jsx(o.BodyPrimary,{color:t.COLORS.content.secondary,children:"Don’t let the growth stop. Add AI Credits"})}),e.jsx("div",{style:{height:"32px"}}),e.jsxs("div",{style:{display:"flex",flexDirection:"row",justifyContent:"flex-end",alignItems:"center",gap:"12px"},children:[e.jsx(r.Button,{buttonText:"Close",buttonType:"text",size:"small",onClick:d}),e.jsx(r.Button,{buttonText:"Contact Support",size:"small",style:{backgroundColor:t.COLORS.background.brand},onClick:c})]})]})});

package/dist/cjs/components/ai-modals/AiSyncProgress.d.ts

@@ -0,0 +1,11 @@
+import React__default from 'react';
+
+declare const AiSyncProgress: React__default.FC<{
+    open: boolean;
+    onModalClose: () => void;
+    completedPercent: number;
+    onRightBtnClick: () => void;
+    onLeftBtnClick: () => void;
+}>;
+
+export { AiSyncProgress };

package/dist/cjs/components/ai-modals/AiSyncProgress.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../constants/Theme.js"),i=require("../../assets/icons/sync.svg.js"),s=require("../button/Button.js"),r=require("../modals/Modal.js"),o=require("../progress-bar/ProgressBarComponent.js"),n=require("../TypographyStyle.js");exports.AiSyncProgress=({open:l,onModalClose:a,completedPercent:c,onLeftBtnClick:d,onRightBtnClick:x})=>e.jsx(r.Modal,{open:l,centralContainerStyles:{width:"498px",height:"324px",borderRadius:"12px"},onClose:a,closeOnOutsideClick:!0,zIndex:40,children:e.jsxs("div",{style:{padding:"24px",display:"flex",flexDirection:"column"},children:[e.jsx("div",{style:{display:"flex",justifyContent:"center"},children:e.jsx(n.TitleLarge,{children:"Wait for Sync to complete"})}),e.jsx("div",{style:{height:"24px"}}),e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"12px"},children:[e.jsxs("div",{style:{display:"flex",flexDirection:"row",gap:"12px"},children:[e.jsx(i.default,{width:24,height:24}),e.jsx(n.BodyPrimary,{color:"#616161",children:"Syncing Shopify Store Data..."})]}),e.jsx(o.ProgressBarComponent,{completed:c,isAnimated:!1,height:16,color:t.COLORS.background.positive.vibrant})]}),e.jsx("div",{style:{height:"24px"}}),e.jsx(n.BodyPrimary,{color:t.COLORS.content.secondary,children:"You can start replying with AI after sync is complete. In the meanwhile, learn how to leverage AI for maximum efficiency"}),e.jsx("div",{style:{height:"32px"}}),e.jsxs("div",{style:{display:"flex",flexDirection:"row",justifyContent:"flex-end",alignItems:"center",gap:"12px"},children:[e.jsx(s.Button,{buttonText:"Close",buttonType:"text",size:"small",onClick:d}),e.jsx(s.Button,{buttonText:"Explore Bik.ai",size:"small",style:{backgroundColor:t.COLORS.background.brand},onClick:x})]})]})});

package/dist/cjs/components/alerts/Alert.d.ts

@@ -0,0 +1,25 @@
+import React__default from 'react';
+import { ALERT_TYPES, CONTENT_POSITION } from './AlertHelper.js';
+
+type AlertProps = {
+    type: ALERT_TYPES;
+    text: string | React__default.ReactNode;
+    icon?: React__default.FC<{
+        width: number;
+        height: number;
+        color: string;
+    }>;
+    textColor?: string;
+    contentPosition?: CONTENT_POSITION;
+    containerStyle?: React__default.CSSProperties;
+    redirectTo?: string;
+    redirectToText?: string;
+    iconStyle?: React__default.CSSProperties;
+    handleRedirectButtonClick?: () => void;
+    showCrossButton?: boolean;
+    handleCrossIconClick?: () => void;
+};
+declare const Alert: React__default.FC<AlertProps>;
+
+export { Alert };
+export type { AlertProps };

package/dist/cjs/components/alerts/Alert.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/cross.svg.js"),r=require("./Alert.styled.js"),o=require("./AlertHelper.js"),i=require("../TypographyStyle.js"),n=require("../../constants/Theme.js");exports.Alert=l=>e.jsxs(r.AlertStyle,{type:l.type,contentPosition:l.contentPosition,style:l.containerStyle,children:[e.jsxs(r.AlertContentWrapper,{children:[l.icon&&e.jsx("div",{style:{...l?.iconStyle,display:l?.iconStyle?.display||"flex",alignSelf:l?.iconStyle?.alignSelf||"flex-start"},children:e.jsx(l.icon,{color:o.COLOR_CONFIG_MAP[l.type].textColor,height:16,width:16})}),e.jsx(i.BodyCaption,{style:{color:l.textColor||o.COLOR_CONFIG_MAP[l.type].textColor,marginLeft:8,marginRight:4},children:l.text}),l.redirectToText&&l.redirectTo&&e.jsx(i.BodyCaption,{style:{color:n.COLORS.text.brand,cursor:"pointer",textDecoration:"underline"},onClick:()=>{"INTERNAL"===l.redirectTo&&l.handleRedirectButtonClick?l.handleRedirectButtonClick():l.redirectTo&&window.open(l.redirectTo,"_blank")},children:l.redirectToText})]}),l.showCrossButton&&e.jsx(r.CloseIconWrapper,{children:e.jsx(t.default,{width:20,height:20,color:n.COLORS.content.secondary,onClick:()=>{l?.handleCrossIconClick&&l.handleCrossIconClick()}})})]});

package/dist/cjs/components/alerts/Alert.styled.js

@@ -0,0 +1,17 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("./AlertHelper.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=r(e);const l=o.default.div`
+	display: flex;
+	align-items: center;
+	justify-content: ${e=>e.contentPosition||t.CONTENT_POSITION.CENTER};
+	padding: 8px 16px;
+	background-color: ${e=>t.COLOR_CONFIG_MAP[e.type].backgroundColor};
+	border-radius: 4px;
+	border: 1px solid ${e=>t.COLOR_CONFIG_MAP[e.type].borderColor};
+`,n=o.default.div`
+	flex: 1;
+	display: flex;
+	justify-content: center;
+`,i=o.default.div`
+	margin-left: 16px;
+	display: flex;
+	align-items: center;
+`;exports.AlertContentWrapper=n,exports.AlertStyle=l,exports.CloseIconWrapper=i;

package/dist/cjs/components/alerts/AlertHelper.d.ts

@@ -0,0 +1,42 @@
+declare enum ALERT_TYPES {
+    NEGATIVE = "Negative",
+    WARNING = "Warning",
+    POSITIVE = "Positive",
+    NEUTRAL = "Neutral",
+    BRAND = "Brand"
+}
+declare enum CONTENT_POSITION {
+    START = "start",
+    CENTER = "center",
+    END = "end",
+    SPACE_BETWEEN = "space-between"
+}
+declare const COLOR_CONFIG_MAP: {
+    Negative: {
+        backgroundColor: string;
+        textColor: string;
+        borderColor: string;
+    };
+    Warning: {
+        backgroundColor: string;
+        textColor: string;
+        borderColor: string;
+    };
+    Positive: {
+        backgroundColor: string;
+        textColor: string;
+        borderColor: string;
+    };
+    Neutral: {
+        backgroundColor: string;
+        textColor: string;
+        borderColor: string;
+    };
+    Brand: {
+        backgroundColor: string;
+        textColor: string;
+        borderColor: string;
+    };
+};
+
+export { ALERT_TYPES, COLOR_CONFIG_MAP, CONTENT_POSITION };

package/dist/cjs/components/alerts/AlertHelper.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var o=require("../../constants/Theme.js"),r=(o=>(o.NEGATIVE="Negative",o.WARNING="Warning",o.POSITIVE="Positive",o.NEUTRAL="Neutral",o.BRAND="Brand",o))(r||{}),t=(o=>(o.START="start",o.CENTER="center",o.END="end",o.SPACE_BETWEEN="space-between",o))(t||{});const e={Negative:{backgroundColor:o.COLORS.background.negative.light,textColor:o.COLORS.content.negative,borderColor:o.COLORS.stroke.negative.lightAlt},Warning:{backgroundColor:o.COLORS.background.warning.light,textColor:o.COLORS.content.warning,borderColor:o.COLORS.stroke.warning.lightAlt},Positive:{backgroundColor:o.COLORS.background.positive.light,textColor:o.COLORS.content.positive,borderColor:o.COLORS.stroke.positive.lightAlt},Neutral:{backgroundColor:o.COLORS.surface.subdued,textColor:o.COLORS.content.secondary,borderColor:o.COLORS.stroke.primary},Brand:{backgroundColor:o.COLORS.background.brandLight,textColor:o.COLORS.content.brand,borderColor:o.COLORS.stroke.brandLightAlt}};exports.ALERT_TYPES=r,exports.COLOR_CONFIG_MAP=e,exports.CONTENT_POSITION=t;

package/dist/cjs/components/analytics-card/AnalyticsCard.d.ts

@@ -0,0 +1,14 @@
+import React__default from 'react';
+
+type ModeType = 'light' | 'dark';
+declare const AnalyticsCard: React__default.FC<{
+    cardInfo: {
+        [category: string]: string;
+    };
+    width?: string;
+    mode?: ModeType;
+    isLoading?: boolean;
+}>;
+
+export { AnalyticsCard };
+export type { ModeType };

package/dist/cjs/components/analytics-card/AnalyticsCard.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../constants/Theme.js"),i=require("../shimmer/ShimmerComponent/BikShimmer.js"),s=require("../TypographyStyle.js"),r=require("./AnalyticsCard.styled.js");exports.AnalyticsCard=a=>{const{cardInfo:n,width:h,mode:c}=a;return e.jsx(r.AnalyticsContainer,{width:h,mode:c,count:Object.keys(n).length,children:a.isLoading?e.jsxs("div",{className:"shimmers",children:[e.jsx(i.BikShimmer,{isBrand:"light"!=a.mode,boxes:[{height:"18px",width:"120px"},{height:"18px",width:"120px"}]}),e.jsx(i.BikShimmer,{isBrand:"light"!=a.mode,boxes:[{height:"18px",width:"120px"},{height:"18px",width:"120px"}]})]}):Object.keys(n).map((i=>{const h=n[i],c=i;return e.jsxs(r.CardDataContainer,{className:"analytics__card",count:Object.keys(n).length,children:[e.jsx(s.TitleSmall,{className:"statistic",color:"light"==a.mode?t.BASE_COLORS.brand[900]:t.BASE_COLORS.grayscale.white,children:h}),e.jsx(s.BodyCaption,{className:"category",color:"light"==a.mode?t.BASE_COLORS.brand[900]:t.COLORS.content.secondaryInverse,children:c})]},c)}))})};

package/dist/cjs/components/analytics-card/AnalyticsCard.styled.d.ts

@@ -0,0 +1,21 @@
+import * as _emotion_styled from '@emotion/styled';
+import * as React from 'react';
+import * as _emotion_react from '@emotion/react';
+import { ModeType } from './AnalyticsCard.js';
+
+declare const AnalyticsContainer: _emotion_styled.StyledComponent<{
+    theme?: _emotion_react.Theme | undefined;
+    as?: React.ElementType<any> | undefined;
+} & {
+    width: string;
+    mode?: ModeType | undefined;
+    count?: number | undefined;
+}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+declare const CardDataContainer: _emotion_styled.StyledComponent<{
+    theme?: _emotion_react.Theme | undefined;
+    as?: React.ElementType<any> | undefined;
+} & {
+    count: number;
+}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+
+export { AnalyticsContainer, CardDataContainer };