@bikdotai/bik-component-library 0.0.40 → 0.0.41-2.beta.1

package/dist/cjs/components/access-token-troubleshoot-dialog/AccessTokenTroubleshootDialog.d.ts

@@ -0,0 +1,17 @@
+import React, { CSSProperties } from 'react';
+import { ButtonProps } from '../button/model';
+export interface StepsDetails {
+    info: string;
+    hideBullet?: boolean;
+}
+export declare const AccessTokenTroubleshootDialog: React.FC<{
+    onCancel: () => void;
+    titleIconContainerStyles?: CSSProperties;
+    title: string;
+    TitleIcon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
+    desc: string;
+    primaryButton: ButtonProps;
+    isModalOpen: boolean;
+    stepsDetails: StepsDetails[];
+    titleIconColor?: string;
+}>;

package/dist/cjs/components/access-token-troubleshoot-dialog/AccessTokenTroubleshootDialog.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/alert.svg.js"),s=require("../../constants/Theme.js"),l=require("../modals/styledModal.js"),n=require("../TypographyStyle.js"),r=require("./AccessTokenTroubleshootDialog.styles.js");const o=t=>{let{info:s,hideBullet:l,last:o}=t;return e.jsxs(r.EachStep,Object.assign({last:o},{children:[!l&&e.jsx(r.BulletWrapper,{children:e.jsx(r.Bullet,{})}),e.jsx(n.BodyCaption,{children:s})]}))};exports.AccessTokenTroubleshootDialog=i=>{let{onCancel:a,titleIconContainerStyles:c,isModalOpen:d,title:h,desc:j,primaryButton:u,TitleIcon:p,stepsDetails:x,titleIconColor:y}=i;return e.jsxs(l.StyledModal,Object.assign({open:!!d,primaryButton:Object.assign({},u),secondaryButton:{buttonText:"Cancel",onClick:a,buttonType:"tertiaryGray"},onClose:a},{children:[e.jsxs(r.Header,{children:[e.jsx(r.IconContainer,Object.assign({style:Object.assign({},c)},{children:p?e.jsx(p,{width:18,height:18,color:y}):e.jsx(t.default,{width:18,height:18,color:s.COLORS.content.negative})})),e.jsx(n.TitleMedium,{children:h})]}),e.jsx(r.Description,{children:e.jsx(n.BodySecondary,{dangerouslySetInnerHTML:{__html:j}})}),e.jsxs(r.StepsContainer,{children:[e.jsx(n.TitleSmall,{children:"Follow the steps:"}),x.map(((t,s)=>e.jsx(o,{info:t.info,hideBullet:t.hideBullet,last:x.length-1===s},s)))]})]}))};

package/dist/cjs/components/access-token-troubleshoot-dialog/AccessTokenTroubleshootDialog.styles.d.ts

@@ -0,0 +1,10 @@
+export declare const Header: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const IconContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const Description: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StepsContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const EachStep: import("styled-components").StyledComponent<"div", any, {
+    last?: boolean | undefined;
+}, never>;
+export declare const BulletWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const Bullet: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const Image: import("styled-components").StyledComponent<"img", any, {}, never>;

package/dist/cjs/components/access-token-troubleshoot-dialog/AccessTokenTroubleshootDialog.styles.js

@@ -0,0 +1,50 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("styled-components"),e=require("../../constants/Theme.js");function r(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var i=r(t);const o=i.default.div`
+	display: flex;
+	gap: 12;
+	align-items: center;
+	margin-bottom: 8px;
+	padding: 34px 32px 0px 32px;
+`,p=i.default.div`
+	background-color: ${e.COLORS.background.negative.light};
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	width: 28px;
+	height: 28px;
+	border-radius: 100%;
+	margin-right: 12px;
+`,d=i.default.div`
+	padding-bottom: 32px;
+	border-bottom: 1px solid ${e.COLORS.stroke.primary};
+	margin-left: 32px;
+	margin-right: 40px;
+`,a=i.default.div`
+	padding: 32px;
+	padding-bottom: 24px;
+	border-bottom: 1px solid ${e.COLORS.stroke.primary};
+`,n=i.default.div`
+	padding-top: 12px;
+	padding-bottom: 12px;
+	border-bottom: ${t=>t.last?"0px":"1px"} solid
+		${e.COLORS.stroke.primary};
+	display: flex;
+	gap: 9px;
+`,x=i.default.div`
+	background-color: ${e.COLORS.surface.hovered};
+	width: 14px;
+	height: 14px;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	border-radius: 100%;
+`,s=i.default.div`
+	width: 8px;
+	height: 8px;
+	background-color: ${e.COLORS.content.primary};
+	border-radius: 100%;
+`;i.default.img`
+	width: 16px;
+	height: 16px;
+	margin-left: 6px;
+	margin-right: 4px;
+`,exports.Bullet=s,exports.BulletWrapper=x,exports.Description=d,exports.EachStep=n,exports.Header=o,exports.IconContainer=p,exports.StepsContainer=a;

package/dist/cjs/components/access-token-troubleshoot-dialog/index.d.ts

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

package/dist/cjs/components/accordion/Accordion.d.ts

@@ -0,0 +1,18 @@
+import React, { ReactNode } from 'react';
+export interface AccordionProps {
+    header: JSX.Element | string;
+    caption?: string;
+    children: ReactNode;
+    width?: string;
+    rightActionComponent?: JSX.Element;
+    contentMargin?: string;
+    skipHoverHeader?: boolean;
+    headerPadding?: string;
+    childrenPadding?: string;
+    showBorders?: boolean;
+    backgroundColor?: string;
+    refresh?: number | boolean;
+    autoOpen?: boolean;
+    childrenMaxHeight?: number;
+}
+export declare const BikAccordion: React.FC<AccordionProps>;

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

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("../TypographyStyle.js"),n=require("./Accordion.style.js"),i=require("./AccordionArrow.js");exports.BikAccordion=o=>{var s;const[a,c]=r.useState(!1),l=r.useRef(null),d=r.useRef(null);r.useEffect((()=>{o.autoOpen&&u(o.autoOpen,{})}),[o.autoOpen]);const u=(e,r)=>{var t;d.current&&l.current&&("keydown"===r.type&&"Enter"!==r.key||(c(e),d.current.style.maxHeight?(d.current.style.maxHeight="",l.current.style.transform="rotate(0deg)",l.current.style.transition="transform 0.25s ease-in-out",d.current.style.transition="padding 0s"):(d.current.style.maxHeight=(null!==(t=o.childrenMaxHeight)&&void 0!==t?t:d.current.scrollHeight)+"px",l.current.style.transform="rotate(180deg)",l.current.style.transition="transform 0.25s ease-in-out",d.current.style.transition="max-height 0.25s ease-in-out")))};return r.useEffect((()=>{var e;a&&(null==o?void 0:o.refresh)&&(null===(e=null==d?void 0:d.current)||void 0===e?void 0:e.scrollHeight)&&!o.childrenMaxHeight&&setTimeout((()=>{d.current.style.maxHeight=d.current.scrollHeight+"px"}),100)}),[a,null==o?void 0:o.refresh,null===(s=null==d?void 0:d.current)||void 0===s?void 0:s.scrollHeight]),e.jsxs(n.default,Object.assign({className:"accordion",isActive:a,width:null==o?void 0:o.width,contentMargin:null==o?void 0:o.contentMargin,headerPadding:o.headerPadding,skipHoverState:o.skipHoverHeader,showBorders:o.showBorders,backgroundColor:o.backgroundColor},{children:[e.jsxs("div",Object.assign({className:"accordion__overview "+(a?"active":""),onClick:e=>u(!a,e),onKeyDown:e=>u(!a,e),role:"button",tabIndex:0},{children:[!o.rightActionComponent&&e.jsxs("div",Object.assign({className:"accordion__overview__header"},{children:["string"==typeof o.header?e.jsx(t.TitleRegular,{children:null==o?void 0:o.header}):o.header,e.jsx(i.default,{isNewIcon:!0,ref:l})]})),o.rightActionComponent&&e.jsxs("div",Object.assign({className:"accordion__overview__header"},{children:[e.jsxs("div",Object.assign({className:"accordion__overview__title-wrapper"},{children:[e.jsx(i.default,{isNewIcon:!0,ref:l}),"string"==typeof o.header?e.jsx(t.TitleRegular,{children:null==o?void 0:o.header}):o.header]})),e.jsx("div",Object.assign({onClick:e=>e.stopPropagation(),onKeyDown:e=>{"Enter"===e.key&&e.stopPropagation()},role:"button",tabIndex:0},{children:o.rightActionComponent}))]})),(null==o?void 0:o.caption)&&e.jsx("div",Object.assign({className:"accordion__overview__caption"},{children:e.jsx(t.BodySecondary,{children:o.caption})}))]})),e.jsx("div",Object.assign({ref:d,className:"accordion__content"},{children:o.children}))]}))};

package/dist/cjs/components/accordion/Accordion.style.d.ts

@@ -0,0 +1,11 @@
+declare const AccordionStyle: import("styled-components").StyledComponent<"div", any, {
+    isActive: boolean;
+    width?: string | undefined;
+    contentMargin?: string | undefined;
+    skipHoverState?: boolean | undefined;
+    headerPadding?: string | undefined;
+    showBorders?: boolean | undefined;
+    backgroundColor?: string | undefined;
+    hasChildrenMaxHeight?: boolean | undefined;
+}, never>;
+export default AccordionStyle;

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

@@ -0,0 +1,36 @@
+"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=>(null==e?void 0:e.width)||"100%"};
+	display: flex;
+	flex-direction: column;
+	border: ${e=>e.showBorders?"1px solid "+r.COLORS.stroke.primary:""};
+	border-radius: ${e=>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:""};
+			&__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:(null==e?void 0:e.contentMargin)||"0px"}:{}};
+			overflow: ${e=>e.hasChildrenMaxHeight?"scroll":"hidden"};
+			max-height: 0;
+		}
+	}
+`;exports.default=t;

package/dist/cjs/components/accordion/AccordionArrow.d.ts

@@ -0,0 +1,6 @@
+import React, { HTMLAttributes } from 'react';
+interface BikAccordionArrowProps extends HTMLAttributes<HTMLDivElement> {
+    isNewIcon: boolean;
+}
+declare const BikAccordionArrow: React.ForwardRefExoticComponent<BikAccordionArrowProps & React.RefAttributes<HTMLDivElement>>;
+export default BikAccordionArrow;

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 t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const i=t(require("react")).default.forwardRef(((t,i)=>e.jsxs("div",Object.assign({ref:i,className:"d-flex align-items-center"},{children:[!t.isNewIcon&&e.jsx("svg",Object.assign({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:"currentColor"})})),t.isNewIcon&&e.jsx("svg",Object.assign({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:"currentColor"})}))]}))));i.displayName="BikAccordionArrow",exports.default=i;

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

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

package/dist/cjs/components/add-variableV2/AddVariableBox.styled.d.ts

@@ -0,0 +1,3 @@
+export declare const AddVariableStyled: import("styled-components").StyledComponent<"button", any, {
+    right: string;
+}, never>;

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: ${t=>t.right};
+    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,58 @@
+import React from 'react';
+export interface VariableListInterfaceV2 {
+    displayName: string;
+    description: string;
+    orderId: number;
+    variables?: any;
+}
+export interface Variable {
+    description?: string;
+    defaultValue?: string;
+    displayName: string;
+    actualValue: string;
+    variableType: string;
+    isAvailable: boolean;
+    actualValueEval?: string;
+    isSubHeader?: boolean;
+    variables?: {
+        [key: string]: Variable;
+    };
+    needsFetching?: boolean;
+}
+export 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;
+export interface VariableBoxProps {
+    item: Variable;
+    raw?: string;
+    parentKey?: string;
+    readonly?: boolean;
+}
+export declare const AddVariableV2: React.FC<Props>;
+export {};

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

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

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

@@ -0,0 +1,12 @@
+export declare const AddVariableStyled: import("styled-components").StyledComponent<"div", any, {
+    pickerSize: string;
+    isModalState?: boolean | undefined;
+    zIndex?: number | undefined;
+    positionStrategy?: string | undefined;
+    height?: string | undefined;
+    needsBorder?: boolean | undefined;
+    width?: string | undefined;
+}, never>;
+export declare const VariableBoxStyled: import("styled-components").StyledComponent<"div", any, {
+    isAvailable?: boolean | undefined;
+}, never>;

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=>(null==e?void 0:e.isAvailable)?"#f0f0f0":"#fafafa"};
+
+		border: 1px solid #e0e0e0;
+		border-radius: 4px;
+		.icon {
+			color: ${e=>(null==e?void 0: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=>(null==e?void 0:e.isAvailable)?"#212121":"#bdbdbd"};
+		}
+	}
+`,exports.AddVariableStyled=t;

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

@@ -0,0 +1,19 @@
+import React from 'react';
+import { VariableListInterfaceV2 } from "./AddVariableV2";
+export 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;
+}
+export declare const AddVariableV2SideModal: React.FC<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 i=t(a);exports.AddVariableV2SideModal=a=>i.default.createPortal(e.jsx(l.SideModalStyle,Object.assign({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/index.d.ts

@@ -0,0 +1,2 @@
+export * from './AddVariableV2SideModal';
+export * from './AddVariableV2';

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

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

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

@@ -0,0 +1,13 @@
+import React from 'react';
+import { ALERT_TYPES } from "./AlertHelper";
+export type AlertProps = {
+    type: ALERT_TYPES;
+    text: string;
+    icon?: React.FC<{
+        width: number;
+        height: number;
+        color: string;
+    }>;
+    textColor?: string;
+};
+export declare const Alert: React.FC<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("./Alert.styled.js"),r=require("./AlertHelper.js"),s=require("../TypographyStyle.js");exports.Alert=l=>e.jsxs(t.AlertStyle,Object.assign({type:l.type},{children:[l.icon&&e.jsx("div",Object.assign({style:{display:"flex"}},{children:e.jsx(l.icon,{color:r.COLOR_CONFIG_MAP[l.type].textColor,height:20,width:20})})),e.jsx(s.BodyCaption,Object.assign({style:{color:l.textColor||r.COLOR_CONFIG_MAP[l.type].textColor,marginLeft:12}},{children:l.text}))]}));

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

@@ -0,0 +1,4 @@
+import { ALERT_TYPES } from "./AlertHelper";
+export declare const AlertStyle: import("styled-components").StyledComponent<"div", any, {
+    type: ALERT_TYPES;
+}, never>;

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

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

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

@@ -0,0 +1,34 @@
+export declare enum ALERT_TYPES {
+    NEGATIVE = "Negative",
+    WARNING = "Warning",
+    POSITIVE = "Positive",
+    NEUTRAL = "Neutral",
+    BRAND = "Brand"
+}
+export 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;
+    };
+};

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

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

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

@@ -0,0 +1,2 @@
+export * from './Alert';
+export * from './AlertHelper';

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

@@ -6,4 +6,5 @@ export declare const AnalyticsCard: React.FC<{
     };
     width?: string;
     mode?: ModeType;
+    isLoading?: boolean;
 }>;

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

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