@bikdotai/bik-component-library 0.0.702 → 0.0.703-beta.1

package/dist/cjs/components/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-import { QueryBuilderNodeProps } from "../../../types/QueryBuilderNodeProps.type";
+import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
 declare const EventsTrigger: React.FC<QueryBuilderNodeProps>;
 export default EventsTrigger;

package/dist/cjs/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts

@@ -1,2 +1,2 @@
-import { QueryBuilderAPIData } from "../../../types/QueryBuilderAPI.type";
+import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
 export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];

package/dist/cjs/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-import { QueryBuilderNodeProps } from "../../../types/QueryBuilderNodeProps.type";
+import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
 declare const IGTrigger: React.FC<QueryBuilderNodeProps>;
 export default IGTrigger;

package/dist/cjs/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts

@@ -1,2 +1,2 @@
-import { QueryBuilderAPIData } from "../../../types/QueryBuilderAPI.type";
+import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
 export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];

package/dist/cjs/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { DropdownOption } from "../../../dropdown/type";
-import { QueryBuilderProperty } from "../../types/QueryBuilder.type";
-import { QueryBuilderNodeProps } from "../../types/QueryBuilderNodeProps.type";
+import { QueryBuilderProperty } from "../../Types/QueryBuilder.type";
+import { QueryBuilderNodeProps } from "../../Types/QueryBuilderNodeProps.type";
 declare const BaseTriggerQueryBuilderNode: React.FC<QueryBuilderNodeProps & {
     cacheKey: string;
     propertyAddBtnText: string;

package/dist/cjs/components/bik-layout/BikHeader.d.ts

@@ -11,5 +11,6 @@ export interface HeaderProps {
     curtainProps?: CurtainProps;
     curtainZIndex?: number;
     headerStyles?: React.CSSProperties;
+    dataTest?: string;
 }
 export declare const BikHeader: React.FC<HeaderProps>;

package/dist/cjs/components/bik-layout/BikHeader.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),s=require("../../assets/icons/arrow_left.svg.js"),t=require("react"),r=require("../curtain/Curtain.js"),i=require("../TypographyStyle.js"),n=require("./CommonStyles.js");exports.BikHeader=x=>{const{header:o,subHeader:a,hideBackButton:u=!0,rightActionButton:j,onClickingBackButton:c,secondaryHeader:l,curtainProps:d,curtainZIndex:m,headerStyles:p,leftLayout:h}=x,[R,g]=t.useState(!!d);return e.jsxRuntimeExports.jsxs(n.BikHeaderWrapper,Object.assign({style:Object.assign({},p)},{children:[e.jsxRuntimeExports.jsxs(n.BikHeaderContainer,{children:[h?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[!u&&e.jsxRuntimeExports.jsx(s.default,{className:"cursor",height:24,width:24,onClick:c}),h]}):e.jsxRuntimeExports.jsxs("div",Object.assign({className:"row--flex left-container"},{children:[!u&&e.jsxRuntimeExports.jsx(s.default,{className:"cursor",height:24,width:24,onClick:c}),e.jsxRuntimeExports.jsxs("div",{children:[a?e.jsxRuntimeExports.jsx(i.BodyCaption,Object.assign({className:"brand"},{children:o})):e.jsxRuntimeExports.jsx(i.TitleMedium,{children:o}),e.jsxRuntimeExports.jsx(i.TitleRegular,{children:a})]})]})),e.jsxRuntimeExports.jsx("div",Object.assign({className:"row--flex right-container"},{children:j}))]}),R&&d&&e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx("div",Object.assign({style:{position:"sticky",top:0,width:"auto",zIndex:m||6}},{children:e.jsxRuntimeExports.jsx(r.Curtain,Object.assign({},d,{onCloseHandler:()=>{g(!1)}}))})),e.jsxRuntimeExports.jsx("div",{style:{height:20}})]}),null!=l?l:e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),s=require("../../assets/icons/arrow_left.svg.js"),t=require("react"),r=require("../curtain/Curtain.js"),i=require("../TypographyStyle.js"),n=require("./CommonStyles.js");exports.BikHeader=x=>{const{header:a,subHeader:o,hideBackButton:u=!0,rightActionButton:j,onClickingBackButton:c,secondaryHeader:d,curtainProps:l,curtainZIndex:m,headerStyles:p,leftLayout:h,dataTest:R}=x,[g,E]=t.useState(!!l);return e.jsxRuntimeExports.jsxs(n.BikHeaderWrapper,Object.assign({style:Object.assign({},p),"data-test":R},{children:[e.jsxRuntimeExports.jsxs(n.BikHeaderContainer,{children:[h?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[!u&&e.jsxRuntimeExports.jsx(s.default,{className:"cursor",height:24,width:24,onClick:c}),h]}):e.jsxRuntimeExports.jsxs("div",Object.assign({className:"row--flex left-container"},{children:[!u&&e.jsxRuntimeExports.jsx(s.default,{className:"cursor",height:24,width:24,onClick:c}),e.jsxRuntimeExports.jsxs("div",{children:[o?e.jsxRuntimeExports.jsx(i.BodyCaption,Object.assign({className:"brand"},{children:a})):e.jsxRuntimeExports.jsx(i.TitleMedium,{children:a}),e.jsxRuntimeExports.jsx(i.TitleRegular,{children:o})]})]})),e.jsxRuntimeExports.jsx("div",Object.assign({className:"row--flex right-container"},{children:j}))]}),g&&l&&e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx("div",Object.assign({style:{position:"sticky",top:0,width:"auto",zIndex:m||6}},{children:e.jsxRuntimeExports.jsx(r.Curtain,Object.assign({},l,{onCloseHandler:()=>{E(!1)}}))})),e.jsxRuntimeExports.jsx("div",{style:{height:20}})]}),null!=d?d:e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})]}))};

package/dist/cjs/components/template-context-mapper/modalElements/TemplateAnalyticsComponent.d.ts

@@ -3,6 +3,7 @@ export declare const TemplateAnalyticsComponent: (props: TemplateAnalyticsCompon
 export declare const RightPanelTemplateAnalytics: (props: {
     analyticsData: TemplateAnalyticsDataI;
     skipTitle?: boolean;
+    fullWidth?: boolean;
 }) => import("react/jsx-runtime").JSX.Element;
 export declare const AnalyticsItem: (props: {
     icon: React.ElementType;

package/dist/cjs/components/template-context-mapper/modalElements/TemplateAnalyticsComponent.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("../../../assets/icons/alert_triangle.svg.js"),s=require("../../../assets/icons/click.svg.js"),n=require("react"),i=require("../../modals/styledModal.js"),l=require("../../tag/Tag.js"),a=require("../../template-preview/models/WhatsAppTemplate.js"),r=require("../../TypographyStyle.js"),o=require("../../../constants/Theme.js"),c=require("../styles/TemplateAnalyticsStyles.js"),x=require("../utils/TemplateConstants.js"),u=require("./TemplateAnalyticsSkeleton.js");const j=t=>{const{analyticsData:n,skipTitle:i}=t;return e.jsxRuntimeExports.jsxs(c.RightPanelContainer,{children:[i?e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}):e.jsxRuntimeExports.jsx(r.TitleSmall,{children:"Here are your template's delivery & engagement stats for the last 30 days"}),e.jsxRuntimeExports.jsx("div",Object.assign({className:"mt-3"},{children:x.ANALYTICS_ENGAGEMENT_MAP.map(((t,s)=>e.jsxRuntimeExports.jsx(m,{icon:t.icon,title:t.title,value:n[t.valName]||0,percentValue:t.percentValName?n[t.percentValName]:null},s)))})),(null==n?void 0:n.clickAnalytics)&&Object.keys(null==n?void 0:n.clickAnalytics)&&Object.keys(null==n?void 0:n.clickAnalytics).length?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(r.TitleSmall,Object.assign({color:o.COLORS.content.secondary},{children:"Clicked"})),e.jsxRuntimeExports.jsx("div",Object.assign({className:"mt-3"},{children:Object.entries(n.clickAnalytics).map(((t,n)=>{let[i,l]=t;return e.jsxRuntimeExports.jsx(m,{icon:s.default,title:i,value:l.totalClicks||0,percentValue:l.clickPercentage},n)}))}))]}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})]})},m=t=>{const{icon:s,title:n,value:i,percentValue:a}=t;return e.jsxRuntimeExports.jsxs("div",Object.assign({className:"each--analytics--container"},{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[e.jsxRuntimeExports.jsx("div",Object.assign({className:"each--icon--container"},{children:e.jsxRuntimeExports.jsx(s,{width:"16px",height:"16px",color:o.COLORS.background.brand})})),e.jsxRuntimeExports.jsx(r.Caption,{children:n})]})),e.jsxRuntimeExports.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[a?e.jsxRuntimeExports.jsx(l.Tag,{tagText:`${a}%`||0,theme:"light",type:"neutral"}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}),e.jsxRuntimeExports.jsx(c.CustomTitleMedium,{children:i})]}))]}))};exports.AnalyticsItem=m,exports.RightPanelTemplateAnalytics=j,exports.TemplateAnalyticsComponent=s=>{const{templateAnalytics:l,onClose:m,onProceed:p,onCancel:d,headingTitle:y,headingSubtitle:E,templateId:T}=s,{templateQuality:g=a.TEMPLATE_QUALITY.GREEN,fetchAnalytics:h}=l||{},{icon:R,title:b,subline:A,sublineTextType:C,sublineColor:O}=x.TEMPLATE_QUALITY_MAP[g||a.TEMPLATE_QUALITY.GREEN],[k,v]=n.useState({}),[S,N]=n.useState(!0);n.useEffect((()=>{null==h||h(T||"").then((e=>{e.analytics&&v(e.analytics),N(!1)}))}),[]);const L=n.useMemo((()=>g===a.TEMPLATE_QUALITY.GREEN?{primaryButton:{buttonText:"Proceed with selection",buttonType:"primary",onClick:p,disabled:S},secondaryButton:{buttonText:"Cancel",buttonType:"tertiaryGray",onClick:()=>{null==m||m(),null==d||d()},disabled:S}}:{primaryButton:{buttonText:"Cancel",buttonType:"primary",onClick:()=>{null==m||m(),null==d||d()},disabled:S},secondaryButton:{buttonText:"Proceed with selection",buttonType:"secondary",onClick:p,disabled:S}}),[g,S]),P=C||r.Caption;return e.jsxRuntimeExports.jsx(i.StyledModal,Object.assign({open:!0,headingTitle:y,tintedHeader:!0,modalHeaderStyles:{backgroundColor:o.COLORS.surface.subdued},onBackPress:()=>{null==m||m()},headingSubtitle:E,footerShadow:!0,primaryButton:L.primaryButton,secondaryButton:L.secondaryButton,onClose:()=>{null==m||m()},width:"700px"},{children:e.jsxRuntimeExports.jsxs(c.TemplateContainer,{children:[e.jsxRuntimeExports.jsx(c.LeftPanelContainer,{children:e.jsxRuntimeExports.jsxs("div",Object.assign({className:"inside--container"},{children:[R&&e.jsxRuntimeExports.jsx("div",Object.assign({className:"icon--container"},{children:e.jsxRuntimeExports.jsx(t.default,{width:40,height:40,color:o.COLORS.content.warning})})),b&&e.jsxRuntimeExports.jsx(r.TitleRegular,Object.assign({style:{textAlign:"center"}},{children:b})),e.jsxRuntimeExports.jsx(P,Object.assign({style:{textAlign:"center",color:O||o.COLORS.content.primary}},{children:A}))]}))}),S?e.jsxRuntimeExports.jsx(u.TemplateAnalyticsSkeleton,{}):e.jsxRuntimeExports.jsx(j,{analyticsData:k,skipTitle:g==a.TEMPLATE_QUALITY.GREEN})]})}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("../../../assets/icons/click.svg.js"),s=require("react"),n=require("../../modals/styledModal.js"),i=require("../../tag/Tag.js"),l=require("../../template-preview/models/WhatsAppTemplate.js"),a=require("../../TypographyStyle.js"),r=require("../../../constants/Theme.js"),o=require("../styles/TemplateAnalyticsStyles.js"),c=require("../utils/TemplateConstants.js"),u=require("./TemplateAnalyticsSkeleton.js");const x=s=>{const{analyticsData:n,skipTitle:i,fullWidth:l}=s;return e.jsxRuntimeExports.jsxs(o.RightPanelContainer,Object.assign({fullWidth:l},{children:[i?e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}):e.jsxRuntimeExports.jsx(a.TitleSmall,{children:"Here are your template's delivery & engagement stats for the last 30 days"}),e.jsxRuntimeExports.jsx("div",Object.assign({className:"mt-3"},{children:c.ANALYTICS_ENGAGEMENT_MAP.map(((t,s)=>e.jsxRuntimeExports.jsx(d,{icon:t.icon,title:t.title,value:n[t.valName]||0,percentValue:t.percentValName?n[t.percentValName]:null},s)))})),(null==n?void 0:n.clickAnalytics)&&Object.keys(null==n?void 0:n.clickAnalytics)&&Object.keys(null==n?void 0:n.clickAnalytics).length?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(a.TitleSmall,Object.assign({color:r.COLORS.content.secondary},{children:"Clicked"})),e.jsxRuntimeExports.jsx("div",Object.assign({className:"mt-3"},{children:Object.entries(n.clickAnalytics).map(((s,n)=>{let[i,l]=s;return e.jsxRuntimeExports.jsx(d,{icon:t.default,title:i,value:l.totalClicks||0,percentValue:l.clickPercentage},n)}))}))]}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})]}))},d=t=>{const{icon:s,title:n,value:l,percentValue:c}=t;return e.jsxRuntimeExports.jsxs("div",Object.assign({className:"each--analytics--container"},{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[e.jsxRuntimeExports.jsx("div",Object.assign({className:"each--icon--container"},{children:e.jsxRuntimeExports.jsx(s,{width:"16px",height:"16px",color:r.COLORS.background.brand})})),e.jsxRuntimeExports.jsx(a.Caption,{children:n})]})),e.jsxRuntimeExports.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[c?e.jsxRuntimeExports.jsx(i.Tag,{tagText:`${c}%`||0,theme:"light",type:"neutral"}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}),e.jsxRuntimeExports.jsx(o.CustomTitleMedium,{children:l})]}))]}))};exports.AnalyticsItem=d,exports.RightPanelTemplateAnalytics=x,exports.TemplateAnalyticsComponent=t=>{const{templateAnalytics:i,onClose:d,onProceed:j,onCancel:p,headingTitle:m,headingSubtitle:E,templateId:T}=t,{templateQuality:y=l.TEMPLATE_QUALITY.GREEN,fetchAnalytics:g}=i||{},{Icon:h,title:R,subline:b,sublineTextType:A,sublineColor:O}=c.TEMPLATE_QUALITY_MAP[y||l.TEMPLATE_QUALITY.GREEN],[C,L]=s.useState((null==t?void 0:t.analyticsData)||{}),[N,k]=s.useState(!0);s.useEffect((()=>{(null==t?void 0:t.analyticsData)?k(!1):null==g||g(T||"").then((e=>{e.analytics&&L(e.analytics),k(!1)}))}),[]);const v=s.useMemo((()=>y===l.TEMPLATE_QUALITY.GREEN?{primaryButton:{buttonText:"Proceed with selection",buttonType:"primary",onClick:j,disabled:N},secondaryButton:{buttonText:"Cancel",buttonType:"tertiaryGray",onClick:()=>{null==d||d(),null==p||p()},disabled:N}}:{primaryButton:{buttonText:"Cancel",buttonType:"primary",onClick:()=>{null==d||d(),null==p||p()},disabled:N},secondaryButton:{buttonText:"Proceed with selection",buttonType:"secondary",onClick:j,disabled:N}}),[y,N]),S=A||a.Caption;return e.jsxRuntimeExports.jsx(n.StyledModal,Object.assign({open:!0,headingTitle:m,tintedHeader:!0,modalHeaderStyles:{backgroundColor:r.COLORS.surface.subdued},onBackPress:()=>{null==d||d()},headingSubtitle:E,footerShadow:!0,primaryButton:v.primaryButton,secondaryButton:v.secondaryButton,onClose:()=>{null==d||d()},width:"700px"},{children:e.jsxRuntimeExports.jsxs(o.TemplateContainer,{children:[y!=l.TEMPLATE_QUALITY.UNKNOWN&&e.jsxRuntimeExports.jsx(o.LeftPanelContainer,{children:e.jsxRuntimeExports.jsxs("div",Object.assign({className:"inside--container"},{children:[e.jsxRuntimeExports.jsx("div",Object.assign({className:"icon--container",style:{background:y===l.TEMPLATE_QUALITY.GREEN?r.COLORS.background.positive.light:r.COLORS.background.warning.light}},{children:e.jsxRuntimeExports.jsx(h,{width:40,height:40,color:y===l.TEMPLATE_QUALITY.GREEN?r.COLORS.content.positive:r.COLORS.content.warning})})),R&&e.jsxRuntimeExports.jsx(a.TitleRegular,Object.assign({style:{textAlign:"center"}},{children:R})),e.jsxRuntimeExports.jsx(S,Object.assign({style:{textAlign:"center",color:O||r.COLORS.content.primary}},{children:b}))]}))}),N?e.jsxRuntimeExports.jsx(u.TemplateAnalyticsSkeleton,{fullWidth:y===l.TEMPLATE_QUALITY.UNKNOWN}):e.jsxRuntimeExports.jsx(x,{analyticsData:C,skipTitle:y==l.TEMPLATE_QUALITY.GREEN,fullWidth:y===l.TEMPLATE_QUALITY.UNKNOWN})]})}))};

package/dist/cjs/components/template-context-mapper/modalElements/TemplateAnalyticsSkeleton.d.ts

@@ -1,3 +1,4 @@
 export declare const TemplateAnalyticsSkeleton: (props: {
     skipTitleShimmer?: boolean;
+    fullWidth?: boolean;
 }) => import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/template-context-mapper/modalElements/TemplateAnalyticsSkeleton.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var s=require("../../../node_modules/react/jsx-runtime.js"),e=require("../../shimmer/ShimmerComponent/BikShimmer.js"),t=require("../styles/TemplateAnalyticsStyles.js");const i=()=>s.jsxRuntimeExports.jsxs("div",Object.assign({className:"each--analytics--container"},{children:[s.jsxRuntimeExports.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[s.jsxRuntimeExports.jsx(e.BikShimmer,{boxes:[{width:"24px",height:"24px"}]}),s.jsxRuntimeExports.jsx(e.BikShimmer,{boxes:[{width:"69px",height:"11px"}]})]})),s.jsxRuntimeExports.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[s.jsxRuntimeExports.jsx(e.BikShimmer,{boxes:[{width:"43px",height:"18px"}]}),s.jsxRuntimeExports.jsx(e.BikShimmer,{boxes:[{width:"69px",height:"28px"}]})]}))]}));exports.TemplateAnalyticsSkeleton=x=>{const{skipTitleShimmer:r}=x;return s.jsxRuntimeExports.jsxs(t.RightPanelContainer,{children:[s.jsxRuntimeExports.jsx("div",{children:r?s.jsxRuntimeExports.jsx(s.jsxRuntimeExports.Fragment,{}):s.jsxRuntimeExports.jsx(e.BikShimmer,{boxes:[{width:"76px",height:"18px"}]})}),s.jsxRuntimeExports.jsx("div",Object.assign({className:"mt-3"},{children:[0,1,2].map((e=>s.jsxRuntimeExports.jsx(i,{},e)))})),s.jsxRuntimeExports.jsxs(s.jsxRuntimeExports.Fragment,{children:[s.jsxRuntimeExports.jsx("div",{children:s.jsxRuntimeExports.jsx(e.BikShimmer,{boxes:[{width:"76px",height:"18px"}]})}),s.jsxRuntimeExports.jsx("div",Object.assign({className:"mt-3"},{children:s.jsxRuntimeExports.jsx(i,{})}))]})]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var s=require("../../../node_modules/react/jsx-runtime.js"),e=require("../../shimmer/ShimmerComponent/BikShimmer.js"),t=require("../styles/TemplateAnalyticsStyles.js");const i=()=>s.jsxRuntimeExports.jsxs("div",Object.assign({className:"each--analytics--container"},{children:[s.jsxRuntimeExports.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[s.jsxRuntimeExports.jsx(e.BikShimmer,{boxes:[{width:"24px",height:"24px"}]}),s.jsxRuntimeExports.jsx(e.BikShimmer,{boxes:[{width:"69px",height:"11px"}]})]})),s.jsxRuntimeExports.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[s.jsxRuntimeExports.jsx(e.BikShimmer,{boxes:[{width:"43px",height:"18px"}]}),s.jsxRuntimeExports.jsx(e.BikShimmer,{boxes:[{width:"69px",height:"28px"}]})]}))]}));exports.TemplateAnalyticsSkeleton=x=>{const{skipTitleShimmer:r,fullWidth:n}=x;return s.jsxRuntimeExports.jsxs(t.RightPanelContainer,Object.assign({fullWidth:n},{children:[s.jsxRuntimeExports.jsx("div",{children:r?s.jsxRuntimeExports.jsx(s.jsxRuntimeExports.Fragment,{}):s.jsxRuntimeExports.jsx(e.BikShimmer,{boxes:[{width:"76px",height:"18px"}]})}),s.jsxRuntimeExports.jsx("div",Object.assign({className:"mt-3"},{children:[0,1,2].map((e=>s.jsxRuntimeExports.jsx(i,{},e)))})),s.jsxRuntimeExports.jsxs(s.jsxRuntimeExports.Fragment,{children:[s.jsxRuntimeExports.jsx("div",{children:s.jsxRuntimeExports.jsx(e.BikShimmer,{boxes:[{width:"76px",height:"18px"}]})}),s.jsxRuntimeExports.jsx("div",Object.assign({className:"mt-3"},{children:s.jsxRuntimeExports.jsx(i,{})}))]})]}))};

package/dist/cjs/components/template-context-mapper/styles/TemplateAnalyticsStyles.d.ts

@@ -1,5 +1,7 @@
 export declare const TemplateContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const RightPanelContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const RightPanelContainer: import("styled-components").StyledComponent<"div", any, {
+    fullWidth?: boolean | undefined;
+}, never>;
 export declare const LeftPanelContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const CustomTitleMedium: import("styled-components").StyledComponent<"div", any, {
     numberOfLines?: number | undefined;

package/dist/cjs/components/template-context-mapper/styles/TemplateAnalyticsStyles.js

@@ -2,13 +2,14 @@
 	display: flex;
 	padding: 16px 0px;
 `,o=r.default.div`
-	max-width: 450px;
+	max-width: ${e=>e.fullWidth?"none":"450px"};
 	height: 456px;
 	min-width: 358px;
 	overflow-y: auto;
-	border-left: ${i.COLORS.stroke.primary} 1px solid;
+	border-left: ${e=>e.fullWidth?"none":`${i.COLORS.stroke.primary} 1px solid`};
 	padding: 0px 23px 32px 23px;
 	gap: 16px;
+	${e=>e.fullWidth&&"flex: 1;"}
 	.each--analytics--container {
 		border: 1px solid ${i.COLORS.background.inactive};
 		border-radius: 8px;
@@ -31,7 +32,7 @@
 	.align--center {
 		align-items: center;
 	}
-`,p=r.default.div`
+`,d=r.default.div`
 	padding: 0px 23px 32px 23px;
 	flex: 1;
 	height: 456px;
@@ -55,9 +56,9 @@
 		align-items: center;
 		justify-content: center;
 	}
-`,d=r.default(t.TitleMedium)`
+`,l=r.default(t.TitleMedium)`
 	white-space: nowrap;
 	max-width: 161px;
 	overflow: hidden;
 	text-overflow: ellipsis;
-`;exports.CustomTitleMedium=d,exports.LeftPanelContainer=p,exports.RightPanelContainer=o,exports.TemplateContainer=a;
+`;exports.CustomTitleMedium=l,exports.LeftPanelContainer=d,exports.RightPanelContainer=o,exports.TemplateContainer=a;

package/dist/cjs/components/template-context-mapper/utils/TemplateConstants.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 export declare const TEMPLATE_QUALITY_MAP: {
     YELLOW: {
-        icon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
+        Icon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
         title: string;
         sublineTextType: import("styled-components").StyledComponent<"div", any, {
             numberOfLines?: number | undefined;
@@ -11,7 +11,7 @@ export declare const TEMPLATE_QUALITY_MAP: {
         subline: string;
     };
     RED: {
-        icon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
+        Icon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
         title: string;
         sublineTextType: import("styled-components").StyledComponent<"div", any, {
             numberOfLines?: number | undefined;
@@ -21,7 +21,17 @@ export declare const TEMPLATE_QUALITY_MAP: {
         subline: string;
     };
     GREEN: {
-        icon: string;
+        Icon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
+        title: string;
+        sublineTextType: import("styled-components").StyledComponent<"div", any, {
+            numberOfLines?: number | undefined;
+            color?: string | undefined;
+        }, never>;
+        sublineColor: string;
+        subline: string;
+    };
+    UNKNOWN: {
+        Icon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
         title: string;
         sublineTextType: import("styled-components").StyledComponent<"div", any, {
             numberOfLines?: number | undefined;

package/dist/cjs/components/template-context-mapper/utils/TemplateConstants.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../assets/icons/alert_triangle.svg.js"),t=require("../../../assets/icons/send_template.svg.js"),a=require("../../../assets/icons/tick.svg.js"),r=require("../../../assets/icons/tick_double.svg.js");require("../../template-preview/TemplatePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js");var i=require("../../../constants/Theme.js");require("../../curtain/CurtainHelper.js"),require("../../variable-picker-v3/model.js"),require("../../template-preview/models/TemplateMeta.js");var s=require("../../template-preview/models/WhatsAppTemplate.js");require("../../template-preview/models/Channels.js");var l=require("../../TypographyStyle.js");const n={[s.TEMPLATE_QUALITY.YELLOW]:{icon:e.default,title:"Medium quality template",sublineTextType:l.Caption,sublineColor:i.COLORS.content.secondary,subline:"Meta has downgraded this template to a medium-quality rating due to negative feedback from multiple customers or low read rates. We recommend improving its content or choosing a different template to enhance delivery and engagement in your next campaign"},[s.TEMPLATE_QUALITY.RED]:{icon:e.default,title:"Low quality template",sublineTextType:l.Caption,sublineColor:i.COLORS.content.secondary,subline:"Meta has downgraded this template to a low-quality rating due to negative feedback from multiple customers or low read rates. We recommend improving its content or choosing a different template to enhance delivery and engagement in your next campaign"},[s.TEMPLATE_QUALITY.GREEN]:{icon:"",title:"",sublineTextType:l.TitleSmall,sublineColor:"",subline:"Here is your template's delivery and engagement stats from the last 30 days. Higher engagement today can lead to better delivery rates in the future."}},o=[{title:"Sent",icon:t.default,valName:"totalSent"},{title:"Delivered",icon:a.default,valName:"totalDelivered",percentValName:"deliveredPercentage"},{title:"Read",icon:r.default,valName:"totalReads",percentValName:"readPercentage"}];exports.ANALYTICS_ENGAGEMENT_MAP=o,exports.TEMPLATE_QUALITY_MAP=n;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../assets/icons/alert_triangle.svg.js"),t=require("../../../assets/icons/check.svg.js"),a=require("../../../assets/icons/send_template.svg.js"),i=require("../../../assets/icons/tick.svg.js"),r=require("../../../assets/icons/tick_double.svg.js");require("../../template-preview/TemplatePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js");var n=require("../../../constants/Theme.js");require("../../curtain/CurtainHelper.js"),require("../../variable-picker-v3/model.js"),require("../../template-preview/models/TemplateMeta.js");var s=require("../../template-preview/models/WhatsAppTemplate.js");require("../../template-preview/models/Channels.js");var o=require("../../TypographyStyle.js");const l={[s.TEMPLATE_QUALITY.YELLOW]:{Icon:e.default,title:"Medium quality template",sublineTextType:o.Caption,sublineColor:n.COLORS.content.secondary,subline:"Meta has downgraded this template to a medium-quality rating due to negative feedback from multiple customers or low read rates. We recommend improving its content or choosing a different template to enhance delivery and engagement in your next campaign"},[s.TEMPLATE_QUALITY.RED]:{Icon:e.default,title:"Low quality template",sublineTextType:o.Caption,sublineColor:n.COLORS.content.secondary,subline:"Meta has downgraded this template to a low-quality rating due to negative feedback from multiple customers or low read rates. We recommend improving its content or choosing a different template to enhance delivery and engagement in your next campaign"},[s.TEMPLATE_QUALITY.GREEN]:{Icon:t.default,title:"High quality template",sublineTextType:o.Caption,sublineColor:n.COLORS.content.secondary,subline:"Meta has rated this template as high quality due to strong engagement and positive customer interactions. We recommend continuing to use this template or creating similar ones to maintain high delivery rates and maximize campaign performance."},[s.TEMPLATE_QUALITY.UNKNOWN]:{Icon:t.default,title:"No quality data available",sublineTextType:o.Caption,sublineColor:n.COLORS.content.secondary,subline:"There is currently no quality data available for this template. This may be due to insufficient usage or recent creation. We recommend monitoring its performance over time to gather insights and optimize future campaigns."}},u=[{title:"Sent",icon:a.default,valName:"totalSent"},{title:"Delivered",icon:i.default,valName:"totalDelivered",percentValName:"deliveredPercentage"},{title:"Read",icon:r.default,valName:"totalReads",percentValName:"readPercentage"}];exports.ANALYTICS_ENGAGEMENT_MAP=u,exports.TEMPLATE_QUALITY_MAP=l;

package/dist/cjs/components/template-preview/models/WhatsAppTemplate.d.ts

@@ -210,7 +210,8 @@ export type WhatsappPreviewButtonType = {
 export declare enum TEMPLATE_QUALITY {
     GREEN = "GREEN",
     YELLOW = "YELLOW",
-    RED = "RED"
+    RED = "RED",
+    UNKNOWN = "UNKNOWN"
 }
 export type WhatsappMeta = {
     containerStyle?: React.CSSProperties | undefined;
@@ -331,4 +332,5 @@ export interface TemplateAnalyticsComponentI {
     onCancel?: () => void;
     headingTitle?: string;
     headingSubtitle?: string;
+    analyticsData?: TemplateAnalyticsDataI;
 }

package/dist/cjs/components/template-preview/models/WhatsAppTemplate.js

@@ -1 +1 @@
-"use strict";var E,T,O;Object.defineProperty(exports,"__esModule",{value:!0}),exports.TEMPLATE_QUALITY=void 0,(E=exports.TEMPLATE_QUALITY||(exports.TEMPLATE_QUALITY={})).GREEN="GREEN",E.YELLOW="YELLOW",E.RED="RED",exports.BUTTON_TYPE=void 0,(T=exports.BUTTON_TYPE||(exports.BUTTON_TYPE={})).QUICK_REPLY="QUICK_REPLY",T.URL="URL",T.PHONE_NUMBER="PHONE_NUMBER",T.COPY_CODE="COPY_CODE",exports.POD=void 0,(O=exports.POD||(exports.POD={})).CHATBOT="CHATBOT",O.GROWTH="GROWTH",O.CAMPAIGN="CAMPAIGN",O.CRM="CRM",O.INTEGRATIONS="INTEGRATIONS",O.OPENAI="OPENAI",O.DM="DM",O.FRONTEND="FRONTEND";
+"use strict";var E,T,N;Object.defineProperty(exports,"__esModule",{value:!0}),exports.TEMPLATE_QUALITY=void 0,(E=exports.TEMPLATE_QUALITY||(exports.TEMPLATE_QUALITY={})).GREEN="GREEN",E.YELLOW="YELLOW",E.RED="RED",E.UNKNOWN="UNKNOWN",exports.BUTTON_TYPE=void 0,(T=exports.BUTTON_TYPE||(exports.BUTTON_TYPE={})).QUICK_REPLY="QUICK_REPLY",T.URL="URL",T.PHONE_NUMBER="PHONE_NUMBER",T.COPY_CODE="COPY_CODE",exports.POD=void 0,(N=exports.POD||(exports.POD={})).CHATBOT="CHATBOT",N.GROWTH="GROWTH",N.CAMPAIGN="CAMPAIGN",N.CRM="CRM",N.INTEGRATIONS="INTEGRATIONS",N.OPENAI="OPENAI",N.DM="DM",N.FRONTEND="FRONTEND";

package/dist/esm/components/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-import { QueryBuilderNodeProps } from "../../../types/QueryBuilderNodeProps.type";
+import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
 declare const EventsTrigger: React.FC<QueryBuilderNodeProps>;
 export default EventsTrigger;

package/dist/esm/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts

@@ -1,2 +1,2 @@
-import { QueryBuilderAPIData } from "../../../types/QueryBuilderAPI.type";
+import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
 export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];

package/dist/esm/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-import { QueryBuilderNodeProps } from "../../../types/QueryBuilderNodeProps.type";
+import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
 declare const IGTrigger: React.FC<QueryBuilderNodeProps>;
 export default IGTrigger;

package/dist/esm/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts

@@ -1,2 +1,2 @@
-import { QueryBuilderAPIData } from "../../../types/QueryBuilderAPI.type";
+import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
 export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];

package/dist/esm/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { DropdownOption } from "../../../dropdown/type";
-import { QueryBuilderProperty } from "../../types/QueryBuilder.type";
-import { QueryBuilderNodeProps } from "../../types/QueryBuilderNodeProps.type";
+import { QueryBuilderProperty } from "../../Types/QueryBuilder.type";
+import { QueryBuilderNodeProps } from "../../Types/QueryBuilderNodeProps.type";
 declare const BaseTriggerQueryBuilderNode: React.FC<QueryBuilderNodeProps & {
     cacheKey: string;
     propertyAddBtnText: string;

package/dist/esm/components/bik-layout/BikHeader.d.ts

@@ -11,5 +11,6 @@ export interface HeaderProps {
     curtainProps?: CurtainProps;
     curtainZIndex?: number;
     headerStyles?: React.CSSProperties;
+    dataTest?: string;
 }
 export declare const BikHeader: React.FC<HeaderProps>;

package/dist/esm/components/bik-layout/BikHeader.js

@@ -1 +1 @@
-import{j as s}from"../../node_modules/react/jsx-runtime.js";import e from"../../assets/icons/arrow_left.svg.js";import{useState as t}from"react";import{Curtain as r}from"../curtain/Curtain.js";import{BodyCaption as i,TitleMedium as n,TitleRegular as o}from"../TypographyStyle.js";import{BikHeaderWrapper as a,BikHeaderContainer as c}from"./CommonStyles.js";const l=l=>{const{header:d,subHeader:j,hideBackButton:h=!0,rightActionButton:m,onClickingBackButton:x,secondaryHeader:g,curtainProps:u,curtainZIndex:p,headerStyles:f,leftLayout:y}=l,[b,O]=t(!!u);return s.jsxs(a,Object.assign({style:Object.assign({},f)},{children:[s.jsxs(c,{children:[y?s.jsxs(s.Fragment,{children:[!h&&s.jsx(e,{className:"cursor",height:24,width:24,onClick:x}),y]}):s.jsxs("div",Object.assign({className:"row--flex left-container"},{children:[!h&&s.jsx(e,{className:"cursor",height:24,width:24,onClick:x}),s.jsxs("div",{children:[j?s.jsx(i,Object.assign({className:"brand"},{children:d})):s.jsx(n,{children:d}),s.jsx(o,{children:j})]})]})),s.jsx("div",Object.assign({className:"row--flex right-container"},{children:m}))]}),b&&u&&s.jsxs(s.Fragment,{children:[s.jsx("div",Object.assign({style:{position:"sticky",top:0,width:"auto",zIndex:p||6}},{children:s.jsx(r,Object.assign({},u,{onCloseHandler:()=>{O(!1)}}))})),s.jsx("div",{style:{height:20}})]}),null!=g?g:s.jsx(s.Fragment,{})]}))};export{l as BikHeader};
+import{j as s}from"../../node_modules/react/jsx-runtime.js";import e from"../../assets/icons/arrow_left.svg.js";import{useState as t}from"react";import{Curtain as r}from"../curtain/Curtain.js";import{BodyCaption as i,TitleMedium as n,TitleRegular as a}from"../TypographyStyle.js";import{BikHeaderWrapper as o,BikHeaderContainer as c}from"./CommonStyles.js";const l=l=>{const{header:d,subHeader:j,hideBackButton:h=!0,rightActionButton:m,onClickingBackButton:x,secondaryHeader:g,curtainProps:u,curtainZIndex:p,headerStyles:f,leftLayout:y,dataTest:b}=l,[O,k]=t(!!u);return s.jsxs(o,Object.assign({style:Object.assign({},f),"data-test":b},{children:[s.jsxs(c,{children:[y?s.jsxs(s.Fragment,{children:[!h&&s.jsx(e,{className:"cursor",height:24,width:24,onClick:x}),y]}):s.jsxs("div",Object.assign({className:"row--flex left-container"},{children:[!h&&s.jsx(e,{className:"cursor",height:24,width:24,onClick:x}),s.jsxs("div",{children:[j?s.jsx(i,Object.assign({className:"brand"},{children:d})):s.jsx(n,{children:d}),s.jsx(a,{children:j})]})]})),s.jsx("div",Object.assign({className:"row--flex right-container"},{children:m}))]}),O&&u&&s.jsxs(s.Fragment,{children:[s.jsx("div",Object.assign({style:{position:"sticky",top:0,width:"auto",zIndex:p||6}},{children:s.jsx(r,Object.assign({},u,{onCloseHandler:()=>{k(!1)}}))})),s.jsx("div",{style:{height:20}})]}),null!=g?g:s.jsx(s.Fragment,{})]}))};export{l as BikHeader};

package/dist/esm/components/template-context-mapper/modalElements/TemplateAnalyticsComponent.d.ts

@@ -3,6 +3,7 @@ export declare const TemplateAnalyticsComponent: (props: TemplateAnalyticsCompon
 export declare const RightPanelTemplateAnalytics: (props: {
     analyticsData: TemplateAnalyticsDataI;
     skipTitle?: boolean;
+    fullWidth?: boolean;
 }) => import("react/jsx-runtime").JSX.Element;
 export declare const AnalyticsItem: (props: {
     icon: React.ElementType;

package/dist/esm/components/template-context-mapper/modalElements/TemplateAnalyticsComponent.js

@@ -1 +1 @@
-import{j as e}from"../../../node_modules/react/jsx-runtime.js";import t from"../../../assets/icons/alert_triangle.svg.js";import n from"../../../assets/icons/click.svg.js";import{useState as s,useEffect as l,useMemo as i}from"react";import{StyledModal as a}from"../../modals/styledModal.js";import{Tag as c}from"../../tag/Tag.js";import{TEMPLATE_QUALITY as r}from"../../template-preview/models/WhatsAppTemplate.js";import{TitleRegular as o,TitleSmall as d,Caption as m}from"../../TypographyStyle.js";import{COLORS as j}from"../../../constants/Theme.js";import{TemplateContainer as p,LeftPanelContainer as u,RightPanelContainer as y,CustomTitleMedium as h}from"../styles/TemplateAnalyticsStyles.js";import{TEMPLATE_QUALITY_MAP as x,ANALYTICS_ENGAGEMENT_MAP as g}from"../utils/TemplateConstants.js";import{TemplateAnalyticsSkeleton as b}from"./TemplateAnalyticsSkeleton.js";const T=n=>{const{templateAnalytics:c,onClose:d,onProceed:y,onCancel:h,headingTitle:g,headingSubtitle:T,templateId:v}=n,{templateQuality:f=r.GREEN,fetchAnalytics:N}=c||{},{icon:O,title:C,subline:A,sublineTextType:B,sublineColor:w}=x[f||r.GREEN],[E,S]=s({}),[G,P]=s(!0);l((()=>{null==N||N(v||"").then((e=>{e.analytics&&S(e.analytics),P(!1)}))}),[]);const V=i((()=>f===r.GREEN?{primaryButton:{buttonText:"Proceed with selection",buttonType:"primary",onClick:y,disabled:G},secondaryButton:{buttonText:"Cancel",buttonType:"tertiaryGray",onClick:()=>{null==d||d(),null==h||h()},disabled:G}}:{primaryButton:{buttonText:"Cancel",buttonType:"primary",onClick:()=>{null==d||d(),null==h||h()},disabled:G},secondaryButton:{buttonText:"Proceed with selection",buttonType:"secondary",onClick:y,disabled:G}}),[f,G]),F=B||m;return e.jsx(a,Object.assign({open:!0,headingTitle:g,tintedHeader:!0,modalHeaderStyles:{backgroundColor:j.surface.subdued},onBackPress:()=>{null==d||d()},headingSubtitle:T,footerShadow:!0,primaryButton:V.primaryButton,secondaryButton:V.secondaryButton,onClose:()=>{null==d||d()},width:"700px"},{children:e.jsxs(p,{children:[e.jsx(u,{children:e.jsxs("div",Object.assign({className:"inside--container"},{children:[O&&e.jsx("div",Object.assign({className:"icon--container"},{children:e.jsx(t,{width:40,height:40,color:j.content.warning})})),C&&e.jsx(o,Object.assign({style:{textAlign:"center"}},{children:C})),e.jsx(F,Object.assign({style:{textAlign:"center",color:w||j.content.primary}},{children:A}))]}))}),G?e.jsx(b,{}):e.jsx(k,{analyticsData:E,skipTitle:f==r.GREEN})]})}))},k=t=>{const{analyticsData:s,skipTitle:l}=t;return e.jsxs(y,{children:[l?e.jsx(e.Fragment,{}):e.jsx(d,{children:"Here are your template's delivery & engagement stats for the last 30 days"}),e.jsx("div",Object.assign({className:"mt-3"},{children:g.map(((t,n)=>e.jsx(v,{icon:t.icon,title:t.title,value:s[t.valName]||0,percentValue:t.percentValName?s[t.percentValName]:null},n)))})),(null==s?void 0:s.clickAnalytics)&&Object.keys(null==s?void 0:s.clickAnalytics)&&Object.keys(null==s?void 0:s.clickAnalytics).length?e.jsxs(e.Fragment,{children:[e.jsx(d,Object.assign({color:j.content.secondary},{children:"Clicked"})),e.jsx("div",Object.assign({className:"mt-3"},{children:Object.entries(s.clickAnalytics).map(((t,s)=>{let[l,i]=t;return e.jsx(v,{icon:n,title:l,value:i.totalClicks||0,percentValue:i.clickPercentage},s)}))}))]}):e.jsx(e.Fragment,{})]})},v=t=>{const{icon:n,title:s,value:l,percentValue:i}=t;return e.jsxs("div",Object.assign({className:"each--analytics--container"},{children:[e.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[e.jsx("div",Object.assign({className:"each--icon--container"},{children:e.jsx(n,{width:"16px",height:"16px",color:j.background.brand})})),e.jsx(m,{children:s})]})),e.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[i?e.jsx(c,{tagText:`${i}%`||0,theme:"light",type:"neutral"}):e.jsx(e.Fragment,{}),e.jsx(h,{children:l})]}))]}))};export{v as AnalyticsItem,k as RightPanelTemplateAnalytics,T as TemplateAnalyticsComponent};
+import{j as e}from"../../../node_modules/react/jsx-runtime.js";import t from"../../../assets/icons/click.svg.js";import{useState as n,useEffect as l,useMemo as s}from"react";import{StyledModal as i}from"../../modals/styledModal.js";import{Tag as a}from"../../tag/Tag.js";import{TEMPLATE_QUALITY as c}from"../../template-preview/models/WhatsAppTemplate.js";import{TitleRegular as r,TitleSmall as o,Caption as d}from"../../TypographyStyle.js";import{COLORS as m}from"../../../constants/Theme.js";import{TemplateContainer as u,LeftPanelContainer as j,RightPanelContainer as p,CustomTitleMedium as y}from"../styles/TemplateAnalyticsStyles.js";import{TEMPLATE_QUALITY_MAP as h,ANALYTICS_ENGAGEMENT_MAP as g}from"../utils/TemplateConstants.js";import{TemplateAnalyticsSkeleton as x}from"./TemplateAnalyticsSkeleton.js";const b=t=>{const{templateAnalytics:a,onClose:o,onProceed:p,onCancel:y,headingTitle:g,headingSubtitle:b,templateId:k}=t,{templateQuality:v=c.GREEN,fetchAnalytics:T}=a||{},{Icon:f,title:O,subline:C,sublineTextType:E,sublineColor:A}=h[v||c.GREEN],[w,B]=n((null==t?void 0:t.analyticsData)||{}),[W,G]=n(!0);l((()=>{(null==t?void 0:t.analyticsData)?G(!1):null==T||T(k||"").then((e=>{e.analytics&&B(e.analytics),G(!1)}))}),[]);const S=s((()=>v===c.GREEN?{primaryButton:{buttonText:"Proceed with selection",buttonType:"primary",onClick:p,disabled:W},secondaryButton:{buttonText:"Cancel",buttonType:"tertiaryGray",onClick:()=>{null==o||o(),null==y||y()},disabled:W}}:{primaryButton:{buttonText:"Cancel",buttonType:"primary",onClick:()=>{null==o||o(),null==y||y()},disabled:W},secondaryButton:{buttonText:"Proceed with selection",buttonType:"secondary",onClick:p,disabled:W}}),[v,W]),R=E||d;return e.jsx(i,Object.assign({open:!0,headingTitle:g,tintedHeader:!0,modalHeaderStyles:{backgroundColor:m.surface.subdued},onBackPress:()=>{null==o||o()},headingSubtitle:b,footerShadow:!0,primaryButton:S.primaryButton,secondaryButton:S.secondaryButton,onClose:()=>{null==o||o()},width:"700px"},{children:e.jsxs(u,{children:[v!=c.UNKNOWN&&e.jsx(j,{children:e.jsxs("div",Object.assign({className:"inside--container"},{children:[e.jsx("div",Object.assign({className:"icon--container",style:{background:v===c.GREEN?m.background.positive.light:m.background.warning.light}},{children:e.jsx(f,{width:40,height:40,color:v===c.GREEN?m.content.positive:m.content.warning})})),O&&e.jsx(r,Object.assign({style:{textAlign:"center"}},{children:O})),e.jsx(R,Object.assign({style:{textAlign:"center",color:A||m.content.primary}},{children:C}))]}))}),W?e.jsx(x,{fullWidth:v===c.UNKNOWN}):e.jsx(N,{analyticsData:w,skipTitle:v==c.GREEN,fullWidth:v===c.UNKNOWN})]})}))},N=n=>{const{analyticsData:l,skipTitle:s,fullWidth:i}=n;return e.jsxs(p,Object.assign({fullWidth:i},{children:[s?e.jsx(e.Fragment,{}):e.jsx(o,{children:"Here are your template's delivery & engagement stats for the last 30 days"}),e.jsx("div",Object.assign({className:"mt-3"},{children:g.map(((t,n)=>e.jsx(k,{icon:t.icon,title:t.title,value:l[t.valName]||0,percentValue:t.percentValName?l[t.percentValName]:null},n)))})),(null==l?void 0:l.clickAnalytics)&&Object.keys(null==l?void 0:l.clickAnalytics)&&Object.keys(null==l?void 0:l.clickAnalytics).length?e.jsxs(e.Fragment,{children:[e.jsx(o,Object.assign({color:m.content.secondary},{children:"Clicked"})),e.jsx("div",Object.assign({className:"mt-3"},{children:Object.entries(l.clickAnalytics).map(((n,l)=>{let[s,i]=n;return e.jsx(k,{icon:t,title:s,value:i.totalClicks||0,percentValue:i.clickPercentage},l)}))}))]}):e.jsx(e.Fragment,{})]}))},k=t=>{const{icon:n,title:l,value:s,percentValue:i}=t;return e.jsxs("div",Object.assign({className:"each--analytics--container"},{children:[e.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[e.jsx("div",Object.assign({className:"each--icon--container"},{children:e.jsx(n,{width:"16px",height:"16px",color:m.background.brand})})),e.jsx(d,{children:l})]})),e.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[i?e.jsx(a,{tagText:`${i}%`||0,theme:"light",type:"neutral"}):e.jsx(e.Fragment,{}),e.jsx(y,{children:s})]}))]}))};export{k as AnalyticsItem,N as RightPanelTemplateAnalytics,b as TemplateAnalyticsComponent};

package/dist/esm/components/template-context-mapper/modalElements/TemplateAnalyticsSkeleton.d.ts

@@ -1,3 +1,4 @@
 export declare const TemplateAnalyticsSkeleton: (props: {
     skipTitleShimmer?: boolean;
+    fullWidth?: boolean;
 }) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/template-context-mapper/modalElements/TemplateAnalyticsSkeleton.js

@@ -1 +1 @@
-import{j as s}from"../../../node_modules/react/jsx-runtime.js";import{BikShimmer as e}from"../../shimmer/ShimmerComponent/BikShimmer.js";import{RightPanelContainer as i}from"../styles/TemplateAnalyticsStyles.js";const t=t=>{const{skipTitleShimmer:h}=t;return s.jsxs(i,{children:[s.jsx("div",{children:h?s.jsx(s.Fragment,{}):s.jsx(e,{boxes:[{width:"76px",height:"18px"}]})}),s.jsx("div",Object.assign({className:"mt-3"},{children:[0,1,2].map((e=>s.jsx(x,{},e)))})),s.jsxs(s.Fragment,{children:[s.jsx("div",{children:s.jsx(e,{boxes:[{width:"76px",height:"18px"}]})}),s.jsx("div",Object.assign({className:"mt-3"},{children:s.jsx(x,{})}))]})]})},x=()=>s.jsxs("div",Object.assign({className:"each--analytics--container"},{children:[s.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[s.jsx(e,{boxes:[{width:"24px",height:"24px"}]}),s.jsx(e,{boxes:[{width:"69px",height:"11px"}]})]})),s.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[s.jsx(e,{boxes:[{width:"43px",height:"18px"}]}),s.jsx(e,{boxes:[{width:"69px",height:"28px"}]})]}))]}));export{t as TemplateAnalyticsSkeleton};
+import{j as s}from"../../../node_modules/react/jsx-runtime.js";import{BikShimmer as e}from"../../shimmer/ShimmerComponent/BikShimmer.js";import{RightPanelContainer as i}from"../styles/TemplateAnalyticsStyles.js";const t=t=>{const{skipTitleShimmer:h,fullWidth:n}=t;return s.jsxs(i,Object.assign({fullWidth:n},{children:[s.jsx("div",{children:h?s.jsx(s.Fragment,{}):s.jsx(e,{boxes:[{width:"76px",height:"18px"}]})}),s.jsx("div",Object.assign({className:"mt-3"},{children:[0,1,2].map((e=>s.jsx(x,{},e)))})),s.jsxs(s.Fragment,{children:[s.jsx("div",{children:s.jsx(e,{boxes:[{width:"76px",height:"18px"}]})}),s.jsx("div",Object.assign({className:"mt-3"},{children:s.jsx(x,{})}))]})]}))},x=()=>s.jsxs("div",Object.assign({className:"each--analytics--container"},{children:[s.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[s.jsx(e,{boxes:[{width:"24px",height:"24px"}]}),s.jsx(e,{boxes:[{width:"69px",height:"11px"}]})]})),s.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[s.jsx(e,{boxes:[{width:"43px",height:"18px"}]}),s.jsx(e,{boxes:[{width:"69px",height:"28px"}]})]}))]}));export{t as TemplateAnalyticsSkeleton};

package/dist/esm/components/template-context-mapper/styles/TemplateAnalyticsStyles.d.ts

@@ -1,5 +1,7 @@
 export declare const TemplateContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const RightPanelContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const RightPanelContainer: import("styled-components").StyledComponent<"div", any, {
+    fullWidth?: boolean | undefined;
+}, never>;
 export declare const LeftPanelContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const CustomTitleMedium: import("styled-components").StyledComponent<"div", any, {
     numberOfLines?: number | undefined;

package/dist/esm/components/template-context-mapper/styles/TemplateAnalyticsStyles.js

@@ -1,14 +1,15 @@
 import e from"styled-components";import{TitleMedium as i}from"../../TypographyStyle.js";import{COLORS as t}from"../../../constants/Theme.js";const n=e.div`
 	display: flex;
 	padding: 16px 0px;
-`,r=e.div`
-	max-width: 450px;
+`,o=e.div`
+	max-width: ${e=>e.fullWidth?"none":"450px"};
 	height: 456px;
 	min-width: 358px;
 	overflow-y: auto;
-	border-left: ${t.stroke.primary} 1px solid;
+	border-left: ${e=>e.fullWidth?"none":`${t.stroke.primary} 1px solid`};
 	padding: 0px 23px 32px 23px;
 	gap: 16px;
+	${e=>e.fullWidth&&"flex: 1;"}
 	.each--analytics--container {
 		border: 1px solid ${t.background.inactive};
 		border-radius: 8px;
@@ -31,7 +32,7 @@ import e from"styled-components";import{TitleMedium as i}from"../../TypographySt
 	.align--center {
 		align-items: center;
 	}
-`,o=e.div`
+`,r=e.div`
 	padding: 0px 23px 32px 23px;
 	flex: 1;
 	height: 456px;
@@ -60,4 +61,4 @@ import e from"styled-components";import{TitleMedium as i}from"../../TypographySt
 	max-width: 161px;
 	overflow: hidden;
 	text-overflow: ellipsis;
-`;export{p as CustomTitleMedium,o as LeftPanelContainer,r as RightPanelContainer,n as TemplateContainer};
+`;export{p as CustomTitleMedium,r as LeftPanelContainer,o as RightPanelContainer,n as TemplateContainer};

package/dist/esm/components/template-context-mapper/utils/TemplateConstants.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 export declare const TEMPLATE_QUALITY_MAP: {
     YELLOW: {
-        icon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
+        Icon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
         title: string;
         sublineTextType: import("styled-components").StyledComponent<"div", any, {
             numberOfLines?: number | undefined;
@@ -11,7 +11,7 @@ export declare const TEMPLATE_QUALITY_MAP: {
         subline: string;
     };
     RED: {
-        icon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
+        Icon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
         title: string;
         sublineTextType: import("styled-components").StyledComponent<"div", any, {
             numberOfLines?: number | undefined;
@@ -21,7 +21,17 @@ export declare const TEMPLATE_QUALITY_MAP: {
         subline: string;
     };
     GREEN: {
-        icon: string;
+        Icon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
+        title: string;
+        sublineTextType: import("styled-components").StyledComponent<"div", any, {
+            numberOfLines?: number | undefined;
+            color?: string | undefined;
+        }, never>;
+        sublineColor: string;
+        subline: string;
+    };
+    UNKNOWN: {
+        Icon: import("react").FunctionComponent<import("react").SVGAttributes<SVGElement>>;
         title: string;
         sublineTextType: import("styled-components").StyledComponent<"div", any, {
             numberOfLines?: number | undefined;

package/dist/esm/components/template-context-mapper/utils/TemplateConstants.js

@@ -1 +1 @@
-import e from"../../../assets/icons/alert_triangle.svg.js";import t from"../../../assets/icons/send_template.svg.js";import a from"../../../assets/icons/tick.svg.js";import i from"../../../assets/icons/tick_double.svg.js";import"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import{COLORS as o}from"../../../constants/Theme.js";import"../../curtain/CurtainHelper.js";import"../../variable-picker-v3/model.js";import"../../template-preview/models/TemplateMeta.js";import{TEMPLATE_QUALITY as r}from"../../template-preview/models/WhatsAppTemplate.js";import"../../template-preview/models/Channels.js";import{Caption as n,TitleSmall as s}from"../../TypographyStyle.js";const l={[r.YELLOW]:{icon:e,title:"Medium quality template",sublineTextType:n,sublineColor:o.content.secondary,subline:"Meta has downgraded this template to a medium-quality rating due to negative feedback from multiple customers or low read rates. We recommend improving its content or choosing a different template to enhance delivery and engagement in your next campaign"},[r.RED]:{icon:e,title:"Low quality template",sublineTextType:n,sublineColor:o.content.secondary,subline:"Meta has downgraded this template to a low-quality rating due to negative feedback from multiple customers or low read rates. We recommend improving its content or choosing a different template to enhance delivery and engagement in your next campaign"},[r.GREEN]:{icon:"",title:"",sublineTextType:s,sublineColor:"",subline:"Here is your template's delivery and engagement stats from the last 30 days. Higher engagement today can lead to better delivery rates in the future."}},m=[{title:"Sent",icon:t,valName:"totalSent"},{title:"Delivered",icon:a,valName:"totalDelivered",percentValName:"deliveredPercentage"},{title:"Read",icon:i,valName:"totalReads",percentValName:"readPercentage"}];export{m as ANALYTICS_ENGAGEMENT_MAP,l as TEMPLATE_QUALITY_MAP};
+import e from"../../../assets/icons/alert_triangle.svg.js";import t from"../../../assets/icons/check.svg.js";import a from"../../../assets/icons/send_template.svg.js";import i from"../../../assets/icons/tick.svg.js";import o from"../../../assets/icons/tick_double.svg.js";import"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import{COLORS as n}from"../../../constants/Theme.js";import"../../curtain/CurtainHelper.js";import"../../variable-picker-v3/model.js";import"../../template-preview/models/TemplateMeta.js";import{TEMPLATE_QUALITY as r}from"../../template-preview/models/WhatsAppTemplate.js";import"../../template-preview/models/Channels.js";import{Caption as s}from"../../TypographyStyle.js";const m={[r.YELLOW]:{Icon:e,title:"Medium quality template",sublineTextType:s,sublineColor:n.content.secondary,subline:"Meta has downgraded this template to a medium-quality rating due to negative feedback from multiple customers or low read rates. We recommend improving its content or choosing a different template to enhance delivery and engagement in your next campaign"},[r.RED]:{Icon:e,title:"Low quality template",sublineTextType:s,sublineColor:n.content.secondary,subline:"Meta has downgraded this template to a low-quality rating due to negative feedback from multiple customers or low read rates. We recommend improving its content or choosing a different template to enhance delivery and engagement in your next campaign"},[r.GREEN]:{Icon:t,title:"High quality template",sublineTextType:s,sublineColor:n.content.secondary,subline:"Meta has rated this template as high quality due to strong engagement and positive customer interactions. We recommend continuing to use this template or creating similar ones to maintain high delivery rates and maximize campaign performance."},[r.UNKNOWN]:{Icon:t,title:"No quality data available",sublineTextType:s,sublineColor:n.content.secondary,subline:"There is currently no quality data available for this template. This may be due to insufficient usage or recent creation. We recommend monitoring its performance over time to gather insights and optimize future campaigns."}},l=[{title:"Sent",icon:a,valName:"totalSent"},{title:"Delivered",icon:i,valName:"totalDelivered",percentValName:"deliveredPercentage"},{title:"Read",icon:o,valName:"totalReads",percentValName:"readPercentage"}];export{l as ANALYTICS_ENGAGEMENT_MAP,m as TEMPLATE_QUALITY_MAP};

package/dist/esm/components/template-preview/models/WhatsAppTemplate.d.ts

@@ -210,7 +210,8 @@ export type WhatsappPreviewButtonType = {
 export declare enum TEMPLATE_QUALITY {
     GREEN = "GREEN",
     YELLOW = "YELLOW",
-    RED = "RED"
+    RED = "RED",
+    UNKNOWN = "UNKNOWN"
 }
 export type WhatsappMeta = {
     containerStyle?: React.CSSProperties | undefined;
@@ -331,4 +332,5 @@ export interface TemplateAnalyticsComponentI {
     onCancel?: () => void;
     headingTitle?: string;
     headingSubtitle?: string;
+    analyticsData?: TemplateAnalyticsDataI;
 }

package/dist/esm/components/template-preview/models/WhatsAppTemplate.js

@@ -1 +1 @@
-var E,N,O;!function(E){E.GREEN="GREEN",E.YELLOW="YELLOW",E.RED="RED"}(E||(E={})),function(E){E.QUICK_REPLY="QUICK_REPLY",E.URL="URL",E.PHONE_NUMBER="PHONE_NUMBER",E.COPY_CODE="COPY_CODE"}(N||(N={})),function(E){E.CHATBOT="CHATBOT",E.GROWTH="GROWTH",E.CAMPAIGN="CAMPAIGN",E.CRM="CRM",E.INTEGRATIONS="INTEGRATIONS",E.OPENAI="OPENAI",E.DM="DM",E.FRONTEND="FRONTEND"}(O||(O={}));export{N as BUTTON_TYPE,O as POD,E as TEMPLATE_QUALITY};
+var N,E,O;!function(N){N.GREEN="GREEN",N.YELLOW="YELLOW",N.RED="RED",N.UNKNOWN="UNKNOWN"}(N||(N={})),function(N){N.QUICK_REPLY="QUICK_REPLY",N.URL="URL",N.PHONE_NUMBER="PHONE_NUMBER",N.COPY_CODE="COPY_CODE"}(E||(E={})),function(N){N.CHATBOT="CHATBOT",N.GROWTH="GROWTH",N.CAMPAIGN="CAMPAIGN",N.CRM="CRM",N.INTEGRATIONS="INTEGRATIONS",N.OPENAI="OPENAI",N.DM="DM",N.FRONTEND="FRONTEND"}(O||(O={}));export{E as BUTTON_TYPE,O as POD,N as TEMPLATE_QUALITY};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bikdotai/bik-component-library",
-	"version": "0.0.702",
+	"version": "0.0.703-beta.01",
 	"description": "Bik Component Library",
 	"repository": {
 		"type": "git",