@bikdotai/bik-component-library 0.0.639--beta0.4 → 0.0.639--beta0.6

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export declare const Menus: ({
     displayName: string;
     key: number;

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

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

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export declare const Menus: ({
     displayName: string;
     key: number;

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

@@ -4,6 +4,7 @@ declare const TemplateAnalyticsComponent: React.FC<TemplateAnalyticsComponentI>;
 export default TemplateAnalyticsComponent;
 export declare const RightPanelTemplateAnalytics: React.FC<{
     analyticsData: TemplateAnalyticsDataI;
+    skipTitle?: boolean;
 }>;
 export declare const AnalyticsItem: React.FC<{
     icon: React.ElementType;

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

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

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bikdotai/bik-component-library",
-	"version": "0.0.639--beta0.4",
+	"version": "0.0.639--beta0.6",
 	"description": "Bik Component Library",
 	"repository": {
 		"type": "git",