@bikdotai/bik-component-library 0.0.622 → 0.0.623

package/dist/cjs/components/template-context-mapper/Badge/index.js

@@ -7,4 +7,5 @@
 	border-radius: 4px;
 	margin-right: 12px;
 	color: ${i.COLORS.content.negative};
+	height: 32px;
 `;exports.Badge=r=>{const{errorText:a,padding:d}=r;return e.jsxs(s,Object.assign({padding:d},{children:[e.jsx(t.default,{height:20,width:20,color:i.COLORS.content.negative}),e.jsx(n.BodySecondary,{children:a})]}))},exports.BadgeContainer=s;

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

@@ -60,5 +60,7 @@ export interface TemplateContextMapperProps {
     disableCopyCode?: boolean;
     initialExpiryDateTime?: string;
     showDiscountCodeExpiryInfo?: boolean;
+    footerButtonText?: string;
+    footerInfoText?: string;
 }
 export declare const TemplateContextMapper: (props: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/template-context-mapper/TemplateContextMapper.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("lodash"),l=require("react"),o=require("../../utils/StringUtils.js"),a=require("../../constants/Theme.js"),i=require("../modals/styledModal.js"),r=require("../template-preview/models/Channels.js"),s=require("../template-preview/models/WhatsAppTemplate.js"),n=require("./context/templateModalContext.js"),d=require("./modalElements/Footer.js"),u=require("./modalElements/TemplateSelectModalContent.js"),c=require("./utils/convertPlaceholdersToBikDropdown.js");exports.TemplateContextMapper=p=>{var v,m,C,h,b,S,E,x;const{selectedTemplate:P,closeDialog:f,showVariableMapping:g,channel:T,htmlContent:y,templateVariables:D,onTemplateSelect:I,globalPlaceholders:L,showOnlyContent:j,whatsappSpecificPickerMeta:w,zIndex:k,showVariableModal:V,variableList:A,discountCode:H,setDiscountCode:M,onBackPress:N,enabledCustomText:O,variableListForImage:q,showSampleValues:B,disableEditVariable:F,pod:_,extras:W,pickerConf:Y,selectedCarouselProducts:R,disableEditExpiry:z,cardWidth:U,onDeleteSelectedProducts:$,fileName:G,setFileName:J,hideDeviceContainerInPreview:K,maxCharLimit:Q,onDefaultVariableSelect:X,skipDefaultVariableContent:Z,disableDatePicker:ee,disableCopyCode:te,initialExpiryDateTime:le,showDiscountCodeExpiryInfo:oe}=p;l.useEffect((()=>{ce(y)}),[y]);const ae=T===r.CHANNEL_TYPE.WHATSAPP&&"CAROUSEL"===(null===(m=null===(v=null==P?void 0:P.components)||void 0===v?void 0:v[1])||void 0===m?void 0:m.type),ie=null==P?void 0:P.isProductCarouselType,[re,se]=l.useState(T===r.CHANNEL_TYPE.EMAIL||T==r.CHANNEL_TYPE.WEBPUSH||ae?"desktop":"mobile"),[ne,de]=l.useState(!1),[ue,ce]=l.useState(y),[pe,ve]=l.useState(!1),[me,Ce]=l.useState([]),[he,be]=l.useState({}),[Se,Ee]=l.useState(P),[xe,Pe]=l.useState([]),[fe,ge]=l.useState(null),[Te,ye]=l.useState(!1),[De,Ie]=l.useState(null!=D?D:[]),[Le,je]=l.useState(!1),[we,ke]=l.useState(ae?(null===(h=null===(C=null==Se?void 0:Se.mapping)||void 0===C?void 0:C.body)||void 0===h?void 0:h.length)?-1:0:-1),[Ve,Ae]=l.useState([]),[He,Me]=l.useState(void 0),Ne=l.useRef(null),[Oe,qe]=l.useState(!1),[Be,Fe]=l.useState(!1),[_e,We]=l.useState(!1),[Ye,Re]=l.useState({});l.useEffect((()=>{R?Ae(R):ie&&Ae([])}),[R]),l.useEffect((()=>{var e;if(!Te&&ie&&(!R||0===Ae.length)){const t=null===(e=null==Se?void 0:Se.components)||void 0===e?void 0:e[1].cards,l=[];null==t||t.forEach((e=>{var t;null===(t=null==e?void 0:e.components)||void 0===t||t.forEach((e=>{var t,o,a;"HEADER"===e.type&&l.push(null!==(a=null===(o=null===(t=e.example)||void 0===t?void 0:t.header_handle)||void 0===o?void 0:o[0])&&void 0!==a?a:"")}))})),Pe(l),ye(!0)}}),[Te]);const ze=l.useMemo((()=>c.convertPlaceholdersToBikDropdown(L)),[L]);return l.useEffect((()=>{Me(t.cloneDeep(A))}),[A]),e.jsx(n.TemplateModalContext.Provider,Object.assign({value:{hideFooterButton:_e,setHideFooterButton:We,hideCrossButton:Be,setHideCrossButton:Fe,variableList:He,setVariableList:Me,variableCallback:fe,setVariableCallback:ge,showVariablePicker:ne,setShowVariablePicker:de,template:Se,setTemplate:Ee,device:re,setDevice:se,display_content:ue,setDisplayContent:ce,originalVariableList:De,setOriginalVariableList:Ie,isError:pe,setIsError:ve,channel:T,globalNormalizedPlaceholders:ze,templateSelectionTriggered:Le,setTemplateSelectionTriggered:je,enabledCustomText:O,disableEditVariable:F,pod:_,extras:W,isWhatsappCarousel:ae,selectedCarouselIndex:we,setSelectedCarouselIndex:ke,isProductCarouselType:ie,templateErrorIndexes:he,cardCount:ae?null===(S=null===(b=P.components)||void 0===b?void 0:b[1].cards)||void 0===S?void 0:S.length:void 0,errorIndexes:me,setErrorIndexes:Ce,pickerConf:Y,carouselProducts:Ve,setCarouselProducts:Ae,disableEditExpiry:z,cardWidth:U,cardImages:xe,onDeleteSelectedProducts:$,hideDeviceContainerInPreview:K,sliderRef:Ne,isCarouselHovered:Oe,setIsCarouselHovered:qe,maxCharLimit:Q,ctaOptionsErrors:Ye,setCtaOptionsErrors:Re,onDefaultVariableSelect:X,disableDatePicker:ee,disableCopyCode:te,initialExpiryDateTime:le,showDiscountCodeExpiryInfo:oe}},{children:j?e.jsx(u.default,{variableListFromProps:A,channel:r.CHANNEL_TYPE.EMAIL,hideHeader:!0}):e.jsxs(i.StyledModal,Object.assign({hideCrossButton:Be,zIndex:k,centralContainerStyles:{width:ae?900:T===r.CHANNEL_TYPE.EMAIL&&g?1e3:800},open:!0,onClose:()=>{null==f||f()},headingTitle:null==Se?void 0:Se.label,headingSubtitle:T===r.CHANNEL_TYPE.WHATSAPP?`${o.default.capitaliseFirstLetterOfString(null!==(E=null==Se?void 0:Se.category)&&void 0!==E?E:"")} • ${null!==(x=null==Se?void 0:Se.templateCategory)&&void 0!==x?x:""}`:"",onBackPress:()=>{null==N||N()},modalHeaderStyles:{borderBottom:`1px solid ${a.COLORS.stroke.primary}`}},{children:[e.jsx(u.default,{variableListFromProps:A,showSampleValues:B,showVariableMapping:g,channel:T,whatsappSpecificPickerMeta:w,showVariableModal:V,discountCode:H,setDiscountCode:M,variableListForImage:q&&(null==q?void 0:q.length)>0?q:He,fileName:G,setFileName:e=>{null==J||J(e)},skipDefaultVariableContent:Z}),I?e.jsx(d.default,{isWhatsappCarousel:null!=ae&&ae,onSelect:function(){var e;if((null==Ve?void 0:Ve.length)<1&&ie)return void ve(!0);if(Object.keys(Ye).length>0&&_!==s.POD.CHATBOT)return void ve(!0);const t=null==I?void 0:I(Se,De,null!=ue?ue:"",Ve);be(null!==(e=null==t?void 0:t.templateErrorIndexes)&&void 0!==e?e:{body:[],buttons:[]}),(null==t?void 0:t.errorIndexes)||(null==t?void 0:t.error)?((null==t?void 0:t.errorIndexes)&&Ce(t.errorIndexes),(null==t?void 0:t.error)&&ve(!!(null==t?void 0:t.error))):je(!0)}}):e.jsx(e.Fragment,{})]}))}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("lodash"),l=require("react"),o=require("../../utils/StringUtils.js"),a=require("../../constants/Theme.js"),i=require("../modals/styledModal.js"),r=require("../template-preview/models/Channels.js"),s=require("../template-preview/models/WhatsAppTemplate.js"),n=require("./context/templateModalContext.js"),d=require("./modalElements/Footer.js"),u=require("./modalElements/TemplateSelectModalContent.js"),c=require("./utils/convertPlaceholdersToBikDropdown.js");exports.TemplateContextMapper=p=>{var v,m,C,h,b,S,E,x;const{selectedTemplate:f,closeDialog:P,showVariableMapping:T,channel:g,htmlContent:y,templateVariables:I,onTemplateSelect:D,globalPlaceholders:L,showOnlyContent:j,whatsappSpecificPickerMeta:w,zIndex:k,showVariableModal:V,variableList:A,discountCode:H,setDiscountCode:M,onBackPress:N,enabledCustomText:B,variableListForImage:O,showSampleValues:q,disableEditVariable:F,pod:_,extras:W,pickerConf:Y,selectedCarouselProducts:R,disableEditExpiry:z,cardWidth:U,onDeleteSelectedProducts:$,fileName:G,setFileName:J,hideDeviceContainerInPreview:K,maxCharLimit:Q,onDefaultVariableSelect:X,skipDefaultVariableContent:Z,disableDatePicker:ee,disableCopyCode:te,initialExpiryDateTime:le,showDiscountCodeExpiryInfo:oe,footerButtonText:ae,footerInfoText:ie}=p;l.useEffect((()=>{ve(y)}),[y]);const re=g===r.CHANNEL_TYPE.WHATSAPP&&"CAROUSEL"===(null===(m=null===(v=null==f?void 0:f.components)||void 0===v?void 0:v[1])||void 0===m?void 0:m.type),se=null==f?void 0:f.isProductCarouselType,[ne,de]=l.useState(g===r.CHANNEL_TYPE.EMAIL||g==r.CHANNEL_TYPE.WEBPUSH||re?"desktop":"mobile"),[ue,ce]=l.useState(!1),[pe,ve]=l.useState(y),[me,Ce]=l.useState(!1),[he,be]=l.useState([]),[Se,Ee]=l.useState({}),[xe,fe]=l.useState(f),[Pe,Te]=l.useState([]),[ge,ye]=l.useState(null),[Ie,De]=l.useState(!1),[Le,je]=l.useState(null!=I?I:[]),[we,ke]=l.useState(!1),[Ve,Ae]=l.useState(re?(null===(h=null===(C=null==xe?void 0:xe.mapping)||void 0===C?void 0:C.body)||void 0===h?void 0:h.length)?-1:0:-1),[He,Me]=l.useState([]),[Ne,Be]=l.useState(void 0),Oe=l.useRef(null),[qe,Fe]=l.useState(!1),[_e,We]=l.useState(!1),[Ye,Re]=l.useState(!1),[ze,Ue]=l.useState({});l.useEffect((()=>{R?Me(R):se&&Me([])}),[R]),l.useEffect((()=>{var e;if(!Ie&&se&&(!R||0===Me.length)){const t=null===(e=null==xe?void 0:xe.components)||void 0===e?void 0:e[1].cards,l=[];null==t||t.forEach((e=>{var t;null===(t=null==e?void 0:e.components)||void 0===t||t.forEach((e=>{var t,o,a;"HEADER"===e.type&&l.push(null!==(a=null===(o=null===(t=e.example)||void 0===t?void 0:t.header_handle)||void 0===o?void 0:o[0])&&void 0!==a?a:"")}))})),Te(l),De(!0)}}),[Ie]);const $e=l.useMemo((()=>c.convertPlaceholdersToBikDropdown(L)),[L]);return l.useEffect((()=>{Be(t.cloneDeep(A))}),[A]),e.jsx(n.TemplateModalContext.Provider,Object.assign({value:{hideFooterButton:Ye,setHideFooterButton:Re,hideCrossButton:_e,setHideCrossButton:We,variableList:Ne,setVariableList:Be,variableCallback:ge,setVariableCallback:ye,showVariablePicker:ue,setShowVariablePicker:ce,template:xe,setTemplate:fe,device:ne,setDevice:de,display_content:pe,setDisplayContent:ve,originalVariableList:Le,setOriginalVariableList:je,isError:me,setIsError:Ce,channel:g,globalNormalizedPlaceholders:$e,templateSelectionTriggered:we,setTemplateSelectionTriggered:ke,enabledCustomText:B,disableEditVariable:F,pod:_,extras:W,isWhatsappCarousel:re,selectedCarouselIndex:Ve,setSelectedCarouselIndex:Ae,isProductCarouselType:se,templateErrorIndexes:Se,cardCount:re?null===(S=null===(b=f.components)||void 0===b?void 0:b[1].cards)||void 0===S?void 0:S.length:void 0,errorIndexes:he,setErrorIndexes:be,pickerConf:Y,carouselProducts:He,setCarouselProducts:Me,disableEditExpiry:z,cardWidth:U,cardImages:Pe,onDeleteSelectedProducts:$,hideDeviceContainerInPreview:K,sliderRef:Oe,isCarouselHovered:qe,setIsCarouselHovered:Fe,maxCharLimit:Q,ctaOptionsErrors:ze,setCtaOptionsErrors:Ue,onDefaultVariableSelect:X,disableDatePicker:ee,disableCopyCode:te,initialExpiryDateTime:le,showDiscountCodeExpiryInfo:oe}},{children:j?e.jsx(u.default,{variableListFromProps:A,channel:r.CHANNEL_TYPE.EMAIL,hideHeader:!0}):e.jsxs(i.StyledModal,Object.assign({hideCrossButton:_e,zIndex:k,centralContainerStyles:{width:re?900:g===r.CHANNEL_TYPE.EMAIL&&T?1e3:800},open:!0,onClose:()=>{null==P||P()},headingTitle:null==xe?void 0:xe.label,headingSubtitle:g===r.CHANNEL_TYPE.WHATSAPP?`${o.default.capitaliseFirstLetterOfString(null!==(E=null==xe?void 0:xe.category)&&void 0!==E?E:"")} • ${null!==(x=null==xe?void 0:xe.templateCategory)&&void 0!==x?x:""}`:"",onBackPress:N,modalHeaderStyles:{borderBottom:`1px solid ${a.COLORS.stroke.primary}`}},{children:[e.jsx(u.default,{variableListFromProps:A,showSampleValues:q,showVariableMapping:T,channel:g,whatsappSpecificPickerMeta:w,showVariableModal:V,discountCode:H,setDiscountCode:M,variableListForImage:O&&(null==O?void 0:O.length)>0?O:Ne,fileName:G,setFileName:e=>{null==J||J(e)},skipDefaultVariableContent:Z}),D?e.jsx(d.default,{isWhatsappCarousel:null!=re&&re,onSelect:function(){var e;if((null==He?void 0:He.length)<1&&se)return void Ce(!0);if(Object.keys(ze).length>0&&_!==s.POD.CHATBOT)return void Ce(!0);const t=null==D?void 0:D(xe,Le,null!=pe?pe:"",He);Ee(null!==(e=null==t?void 0:t.templateErrorIndexes)&&void 0!==e?e:{body:[],buttons:[]}),(null==t?void 0:t.errorIndexes)||(null==t?void 0:t.error)?((null==t?void 0:t.errorIndexes)&&be(t.errorIndexes),(null==t?void 0:t.error)&&Ce(!!(null==t?void 0:t.error))):ke(!0)},footerButtonText:ae,footerInfoText:ie}):e.jsx(e.Fragment,{})]}))}))};

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

@@ -1,6 +1,8 @@
 export interface FooterProps {
     isWhatsappCarousel: boolean;
     onSelect: () => void;
+    footerButtonText?: string;
+    footerInfoText?: string;
 }
-declare const Footer: ({ isWhatsappCarousel, onSelect }: FooterProps) => import("react/jsx-runtime").JSX.Element;
+declare const Footer: ({ isWhatsappCarousel, onSelect, footerButtonText, footerInfoText, }: FooterProps) => import("react/jsx-runtime").JSX.Element;
 export default Footer;

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

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("styled-components"),o=require("../../button/Button.js"),s=require("../../TypographyStyle.js"),l=require("../../../constants/Theme.js"),n=require("../Badge/index.js"),i=require("../context/templateModalContext.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const d=a(r).default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../assets/icons/info.svg.js"),r=require("react"),o=require("styled-components"),s=require("../../button/Button.js"),n=require("../../tag/Tag.js"),i=require("../../TypographyStyle.js"),l=require("../../../constants/Theme.js"),a=require("../Badge/index.js"),d=require("../context/templateModalContext.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const c=u(o).default.div`
 	background: ${l.COLORS.surface.standard};
 	border-top-width: 1px;
 	border-top-color: ${l.COLORS.stroke.primary};
@@ -12,4 +12,4 @@
 	border-bottom-left-radius: 4px;
 	border-bottom-right-radius: 4px;
 	height: ${e=>e.isWhatsappCarousel?64:80}px;
-`;exports.default=r=>{let{isWhatsappCarousel:a,onSelect:u}=r;var p,c,x,b;const{isError:g,selectedCarouselIndex:h,setSelectedCarouselIndex:j,setErrorIndexes:f,template:m,showVariablePicker:v,hideFooterButton:y}=i.useTemplateModalContext(),[C,S]=t.useState(a?"Next":"Select template");return t.useEffect((()=>{a&&-1===h?S("Next"):a&&null!=h&&h>-1&&S("Save & Select Template")}),[h]),e.jsxs(d,Object.assign({isWhatsappCarousel:a,justifyContent:a&&(null===(c=null===(p=null==m?void 0:m.mapping)||void 0===p?void 0:p.body)||void 0===c?void 0:c.length)?"space-between":"end"},{children:[a&&null!=h&&h>=-1&&!!(null===(b=null===(x=null==m?void 0:m.mapping)||void 0===x?void 0:x.body)||void 0===b?void 0:b.length)&&e.jsx(s.TitleRegular,Object.assign({color:l.COLORS.text.secondary},{children:`Step ${-1===h?1:2}/2`})),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row"}},{children:[g&&e.jsx(n.Badge,{errorText:"Some inputs are missing or incorrect. Please check"}),!y&&e.jsx(o.Button,{disabled:v,id:"select-template-btn",buttonText:C,size:a?"small":"large",onClick:function(){a&&-1===h&&j?j(0):(null==f||f([]),u())}})]}))]}))};
+`;exports.default=o=>{let{isWhatsappCarousel:u,onSelect:p,footerButtonText:x,footerInfoText:g}=o;var j,b,f,h;const{isError:m,selectedCarouselIndex:v,setSelectedCarouselIndex:y,setErrorIndexes:C,template:S,showVariablePicker:T,hideFooterButton:O}=d.useTemplateModalContext(),[q,w]=r.useState(u?"Next":"Select template");return r.useEffect((()=>{x?w(x):u&&-1===v?w("Next"):u&&null!=v&&v>-1&&w("Save & Select Template")}),[v]),e.jsxs(c,Object.assign({isWhatsappCarousel:u,justifyContent:u&&(null===(b=null===(j=null==S?void 0:S.mapping)||void 0===j?void 0:j.body)||void 0===b?void 0:b.length)?"space-between":"end"},{children:[u&&null!=v&&v>=-1&&!!(null===(h=null===(f=null==S?void 0:S.mapping)||void 0===f?void 0:f.body)||void 0===h?void 0:h.length)&&e.jsx(i.TitleRegular,Object.assign({color:l.COLORS.text.secondary},{children:`Step ${-1===v?1:2}/2`})),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center"}},{children:[m&&e.jsx(a.Badge,{errorText:"Some inputs are missing or incorrect. Please check"}),!m&&g&&e.jsx("div",Object.assign({style:{marginRight:12}},{children:e.jsx(n.Tag,{tagText:g,LeadingIcon:t.default})})),!O&&e.jsx(s.Button,{disabled:T,id:"select-template-btn",buttonText:q,size:u?"small":"large",onClick:function(){u&&-1===v&&y?y(0):(null==C||C([]),p())}})]}))]}))};

package/dist/esm/components/template-context-mapper/Badge/index.js

@@ -1,10 +1,11 @@
-import{jsxs as t,jsx as r}from"react/jsx-runtime";import e from"../../../assets/icons/alert.svg.js";import n from"styled-components";import{BodySecondary as o}from"../../TypographyStyle.js";import{COLORS as i}from"../../../constants/Theme.js";const p=n.div`
-	background: ${i.background.negative.light};
+import{jsxs as t,jsx as r}from"react/jsx-runtime";import e from"../../../assets/icons/alert.svg.js";import i from"styled-components";import{BodySecondary as n}from"../../TypographyStyle.js";import{COLORS as o}from"../../../constants/Theme.js";const p=i.div`
+	background: ${o.background.negative.light};
 	display: flex;
 	align-items: center;
 	padding: ${t=>t.padding?"8px":"0px"} 12px;
 	gap: 8px;
 	border-radius: 4px;
 	margin-right: 12px;
-	color: ${i.content.negative};
-`,a=n=>{const{errorText:a,padding:s}=n;return t(p,Object.assign({padding:s},{children:[r(e,{height:20,width:20,color:i.content.negative}),r(o,{children:a})]}))};export{a as Badge,p as BadgeContainer};
+	color: ${o.content.negative};
+	height: 32px;
+`,a=i=>{const{errorText:a,padding:s}=i;return t(p,Object.assign({padding:s},{children:[r(e,{height:20,width:20,color:o.content.negative}),r(n,{children:a})]}))};export{a as Badge,p as BadgeContainer};

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

@@ -60,5 +60,7 @@ export interface TemplateContextMapperProps {
     disableCopyCode?: boolean;
     initialExpiryDateTime?: string;
     showDiscountCodeExpiryInfo?: boolean;
+    footerButtonText?: string;
+    footerInfoText?: string;
 }
 export declare const TemplateContextMapper: (props: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/template-context-mapper/TemplateContextMapper.js

@@ -1 +1 @@
-import{jsx as e,jsxs as o,Fragment as l}from"react/jsx-runtime";import{cloneDeep as t}from"lodash";import{useEffect as i,useState as r,useRef as a,useMemo as s}from"react";import n from"../../utils/StringUtils.js";import{COLORS as d}from"../../constants/Theme.js";import{StyledModal as c}from"../modals/styledModal.js";import{CHANNEL_TYPE as u}from"../template-preview/models/Channels.js";import{POD as p}from"../template-preview/models/WhatsAppTemplate.js";import{TemplateModalContext as m}from"./context/templateModalContext.js";import v from"./modalElements/Footer.js";import h from"./modalElements/TemplateSelectModalContent.js";import{convertPlaceholdersToBikDropdown as b}from"./utils/convertPlaceholdersToBikDropdown.js";const C=C=>{var f,g,x,E,P,y,S,I;const{selectedTemplate:D,closeDialog:T,showVariableMapping:w,channel:V,htmlContent:k,templateVariables:L,onTemplateSelect:j,globalPlaceholders:M,showOnlyContent:A,whatsappSpecificPickerMeta:B,zIndex:H,showVariableModal:F,variableList:O,discountCode:W,setDiscountCode:N,onBackPress:z,enabledCustomText:R,variableListForImage:U,showSampleValues:$,disableEditVariable:_,pod:q,extras:G,pickerConf:J,selectedCarouselProducts:K,disableEditExpiry:Q,cardWidth:X,onDeleteSelectedProducts:Y,fileName:Z,setFileName:ee,hideDeviceContainerInPreview:oe,maxCharLimit:le,onDefaultVariableSelect:te,skipDefaultVariableContent:ie,disableDatePicker:re,disableCopyCode:ae,initialExpiryDateTime:se,showDiscountCodeExpiryInfo:ne}=C;i((()=>{be(k)}),[k]);const de=V===u.WHATSAPP&&"CAROUSEL"===(null===(g=null===(f=null==D?void 0:D.components)||void 0===f?void 0:f[1])||void 0===g?void 0:g.type),ce=null==D?void 0:D.isProductCarouselType,[ue,pe]=r(V===u.EMAIL||V==u.WEBPUSH||de?"desktop":"mobile"),[me,ve]=r(!1),[he,be]=r(k),[Ce,fe]=r(!1),[ge,xe]=r([]),[Ee,Pe]=r({}),[ye,Se]=r(D),[Ie,De]=r([]),[Te,we]=r(null),[Ve,ke]=r(!1),[Le,je]=r(null!=L?L:[]),[Me,Ae]=r(!1),[Be,He]=r(de?(null===(E=null===(x=null==ye?void 0:ye.mapping)||void 0===x?void 0:x.body)||void 0===E?void 0:E.length)?-1:0:-1),[Fe,Oe]=r([]),[We,Ne]=r(void 0),ze=a(null),[Re,Ue]=r(!1),[$e,_e]=r(!1),[qe,Ge]=r(!1),[Je,Ke]=r({});i((()=>{K?Oe(K):ce&&Oe([])}),[K]),i((()=>{var e;if(!Ve&&ce&&(!K||0===Oe.length)){const o=null===(e=null==ye?void 0:ye.components)||void 0===e?void 0:e[1].cards,l=[];null==o||o.forEach((e=>{var o;null===(o=null==e?void 0:e.components)||void 0===o||o.forEach((e=>{var o,t,i;"HEADER"===e.type&&l.push(null!==(i=null===(t=null===(o=e.example)||void 0===o?void 0:o.header_handle)||void 0===t?void 0:t[0])&&void 0!==i?i:"")}))})),De(l),ke(!0)}}),[Ve]);const Qe=s((()=>b(M)),[M]);return i((()=>{Ne(t(O))}),[O]),e(m.Provider,Object.assign({value:{hideFooterButton:qe,setHideFooterButton:Ge,hideCrossButton:$e,setHideCrossButton:_e,variableList:We,setVariableList:Ne,variableCallback:Te,setVariableCallback:we,showVariablePicker:me,setShowVariablePicker:ve,template:ye,setTemplate:Se,device:ue,setDevice:pe,display_content:he,setDisplayContent:be,originalVariableList:Le,setOriginalVariableList:je,isError:Ce,setIsError:fe,channel:V,globalNormalizedPlaceholders:Qe,templateSelectionTriggered:Me,setTemplateSelectionTriggered:Ae,enabledCustomText:R,disableEditVariable:_,pod:q,extras:G,isWhatsappCarousel:de,selectedCarouselIndex:Be,setSelectedCarouselIndex:He,isProductCarouselType:ce,templateErrorIndexes:Ee,cardCount:de?null===(y=null===(P=D.components)||void 0===P?void 0:P[1].cards)||void 0===y?void 0:y.length:void 0,errorIndexes:ge,setErrorIndexes:xe,pickerConf:J,carouselProducts:Fe,setCarouselProducts:Oe,disableEditExpiry:Q,cardWidth:X,cardImages:Ie,onDeleteSelectedProducts:Y,hideDeviceContainerInPreview:oe,sliderRef:ze,isCarouselHovered:Re,setIsCarouselHovered:Ue,maxCharLimit:le,ctaOptionsErrors:Je,setCtaOptionsErrors:Ke,onDefaultVariableSelect:te,disableDatePicker:re,disableCopyCode:ae,initialExpiryDateTime:se,showDiscountCodeExpiryInfo:ne}},{children:A?e(h,{variableListFromProps:O,channel:u.EMAIL,hideHeader:!0}):o(c,Object.assign({hideCrossButton:$e,zIndex:H,centralContainerStyles:{width:de?900:V===u.EMAIL&&w?1e3:800},open:!0,onClose:()=>{null==T||T()},headingTitle:null==ye?void 0:ye.label,headingSubtitle:V===u.WHATSAPP?`${n.capitaliseFirstLetterOfString(null!==(S=null==ye?void 0:ye.category)&&void 0!==S?S:"")} • ${null!==(I=null==ye?void 0:ye.templateCategory)&&void 0!==I?I:""}`:"",onBackPress:()=>{null==z||z()},modalHeaderStyles:{borderBottom:`1px solid ${d.stroke.primary}`}},{children:[e(h,{variableListFromProps:O,showSampleValues:$,showVariableMapping:w,channel:V,whatsappSpecificPickerMeta:B,showVariableModal:F,discountCode:W,setDiscountCode:N,variableListForImage:U&&(null==U?void 0:U.length)>0?U:We,fileName:Z,setFileName:e=>{null==ee||ee(e)},skipDefaultVariableContent:ie}),j?e(v,{isWhatsappCarousel:null!=de&&de,onSelect:function(){var e;if((null==Fe?void 0:Fe.length)<1&&ce)return void fe(!0);if(Object.keys(Je).length>0&&q!==p.CHATBOT)return void fe(!0);const o=null==j?void 0:j(ye,Le,null!=he?he:"",Fe);Pe(null!==(e=null==o?void 0:o.templateErrorIndexes)&&void 0!==e?e:{body:[],buttons:[]}),(null==o?void 0:o.errorIndexes)||(null==o?void 0:o.error)?((null==o?void 0:o.errorIndexes)&&xe(o.errorIndexes),(null==o?void 0:o.error)&&fe(!!(null==o?void 0:o.error))):Ae(!0)}}):e(l,{})]}))}))};export{C as TemplateContextMapper};
+import{jsx as e,jsxs as o,Fragment as l}from"react/jsx-runtime";import{cloneDeep as t}from"lodash";import{useEffect as i,useState as r,useRef as a,useMemo as s}from"react";import n from"../../utils/StringUtils.js";import{COLORS as d}from"../../constants/Theme.js";import{StyledModal as u}from"../modals/styledModal.js";import{CHANNEL_TYPE as c}from"../template-preview/models/Channels.js";import{POD as p}from"../template-preview/models/WhatsAppTemplate.js";import{TemplateModalContext as m}from"./context/templateModalContext.js";import v from"./modalElements/Footer.js";import h from"./modalElements/TemplateSelectModalContent.js";import{convertPlaceholdersToBikDropdown as b}from"./utils/convertPlaceholdersToBikDropdown.js";const C=C=>{var f,x,g,E,P,I,T,y;const{selectedTemplate:S,closeDialog:D,showVariableMapping:w,channel:V,htmlContent:k,templateVariables:L,onTemplateSelect:j,globalPlaceholders:B,showOnlyContent:M,whatsappSpecificPickerMeta:A,zIndex:H,showVariableModal:F,variableList:O,discountCode:W,setDiscountCode:N,onBackPress:z,enabledCustomText:R,variableListForImage:U,showSampleValues:$,disableEditVariable:_,pod:q,extras:G,pickerConf:J,selectedCarouselProducts:K,disableEditExpiry:Q,cardWidth:X,onDeleteSelectedProducts:Y,fileName:Z,setFileName:ee,hideDeviceContainerInPreview:oe,maxCharLimit:le,onDefaultVariableSelect:te,skipDefaultVariableContent:ie,disableDatePicker:re,disableCopyCode:ae,initialExpiryDateTime:se,showDiscountCodeExpiryInfo:ne,footerButtonText:de,footerInfoText:ue}=C;i((()=>{fe(k)}),[k]);const ce=V===c.WHATSAPP&&"CAROUSEL"===(null===(x=null===(f=null==S?void 0:S.components)||void 0===f?void 0:f[1])||void 0===x?void 0:x.type),pe=null==S?void 0:S.isProductCarouselType,[me,ve]=r(V===c.EMAIL||V==c.WEBPUSH||ce?"desktop":"mobile"),[he,be]=r(!1),[Ce,fe]=r(k),[xe,ge]=r(!1),[Ee,Pe]=r([]),[Ie,Te]=r({}),[ye,Se]=r(S),[De,we]=r([]),[Ve,ke]=r(null),[Le,je]=r(!1),[Be,Me]=r(null!=L?L:[]),[Ae,He]=r(!1),[Fe,Oe]=r(ce?(null===(E=null===(g=null==ye?void 0:ye.mapping)||void 0===g?void 0:g.body)||void 0===E?void 0:E.length)?-1:0:-1),[We,Ne]=r([]),[ze,Re]=r(void 0),Ue=a(null),[$e,_e]=r(!1),[qe,Ge]=r(!1),[Je,Ke]=r(!1),[Qe,Xe]=r({});i((()=>{K?Ne(K):pe&&Ne([])}),[K]),i((()=>{var e;if(!Le&&pe&&(!K||0===Ne.length)){const o=null===(e=null==ye?void 0:ye.components)||void 0===e?void 0:e[1].cards,l=[];null==o||o.forEach((e=>{var o;null===(o=null==e?void 0:e.components)||void 0===o||o.forEach((e=>{var o,t,i;"HEADER"===e.type&&l.push(null!==(i=null===(t=null===(o=e.example)||void 0===o?void 0:o.header_handle)||void 0===t?void 0:t[0])&&void 0!==i?i:"")}))})),we(l),je(!0)}}),[Le]);const Ye=s((()=>b(B)),[B]);return i((()=>{Re(t(O))}),[O]),e(m.Provider,Object.assign({value:{hideFooterButton:Je,setHideFooterButton:Ke,hideCrossButton:qe,setHideCrossButton:Ge,variableList:ze,setVariableList:Re,variableCallback:Ve,setVariableCallback:ke,showVariablePicker:he,setShowVariablePicker:be,template:ye,setTemplate:Se,device:me,setDevice:ve,display_content:Ce,setDisplayContent:fe,originalVariableList:Be,setOriginalVariableList:Me,isError:xe,setIsError:ge,channel:V,globalNormalizedPlaceholders:Ye,templateSelectionTriggered:Ae,setTemplateSelectionTriggered:He,enabledCustomText:R,disableEditVariable:_,pod:q,extras:G,isWhatsappCarousel:ce,selectedCarouselIndex:Fe,setSelectedCarouselIndex:Oe,isProductCarouselType:pe,templateErrorIndexes:Ie,cardCount:ce?null===(I=null===(P=S.components)||void 0===P?void 0:P[1].cards)||void 0===I?void 0:I.length:void 0,errorIndexes:Ee,setErrorIndexes:Pe,pickerConf:J,carouselProducts:We,setCarouselProducts:Ne,disableEditExpiry:Q,cardWidth:X,cardImages:De,onDeleteSelectedProducts:Y,hideDeviceContainerInPreview:oe,sliderRef:Ue,isCarouselHovered:$e,setIsCarouselHovered:_e,maxCharLimit:le,ctaOptionsErrors:Qe,setCtaOptionsErrors:Xe,onDefaultVariableSelect:te,disableDatePicker:re,disableCopyCode:ae,initialExpiryDateTime:se,showDiscountCodeExpiryInfo:ne}},{children:M?e(h,{variableListFromProps:O,channel:c.EMAIL,hideHeader:!0}):o(u,Object.assign({hideCrossButton:qe,zIndex:H,centralContainerStyles:{width:ce?900:V===c.EMAIL&&w?1e3:800},open:!0,onClose:()=>{null==D||D()},headingTitle:null==ye?void 0:ye.label,headingSubtitle:V===c.WHATSAPP?`${n.capitaliseFirstLetterOfString(null!==(T=null==ye?void 0:ye.category)&&void 0!==T?T:"")} • ${null!==(y=null==ye?void 0:ye.templateCategory)&&void 0!==y?y:""}`:"",onBackPress:z,modalHeaderStyles:{borderBottom:`1px solid ${d.stroke.primary}`}},{children:[e(h,{variableListFromProps:O,showSampleValues:$,showVariableMapping:w,channel:V,whatsappSpecificPickerMeta:A,showVariableModal:F,discountCode:W,setDiscountCode:N,variableListForImage:U&&(null==U?void 0:U.length)>0?U:ze,fileName:Z,setFileName:e=>{null==ee||ee(e)},skipDefaultVariableContent:ie}),j?e(v,{isWhatsappCarousel:null!=ce&&ce,onSelect:function(){var e;if((null==We?void 0:We.length)<1&&pe)return void ge(!0);if(Object.keys(Qe).length>0&&q!==p.CHATBOT)return void ge(!0);const o=null==j?void 0:j(ye,Be,null!=Ce?Ce:"",We);Te(null!==(e=null==o?void 0:o.templateErrorIndexes)&&void 0!==e?e:{body:[],buttons:[]}),(null==o?void 0:o.errorIndexes)||(null==o?void 0:o.error)?((null==o?void 0:o.errorIndexes)&&Pe(o.errorIndexes),(null==o?void 0:o.error)&&ge(!!(null==o?void 0:o.error))):He(!0)},footerButtonText:de,footerInfoText:ue}):e(l,{})]}))}))};export{C as TemplateContextMapper};

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

@@ -1,6 +1,8 @@
 export interface FooterProps {
     isWhatsappCarousel: boolean;
     onSelect: () => void;
+    footerButtonText?: string;
+    footerInfoText?: string;
 }
-declare const Footer: ({ isWhatsappCarousel, onSelect }: FooterProps) => import("react/jsx-runtime").JSX.Element;
+declare const Footer: ({ isWhatsappCarousel, onSelect, footerButtonText, footerInfoText, }: FooterProps) => import("react/jsx-runtime").JSX.Element;
 export default Footer;

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

@@ -1,7 +1,7 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as o,useEffect as r}from"react";import i from"styled-components";import{Button as l}from"../../button/Button.js";import{TitleRegular as n}from"../../TypographyStyle.js";import{COLORS as s}from"../../../constants/Theme.js";import{Badge as a}from"../Badge/index.js";import{useTemplateModalContext as d}from"../context/templateModalContext.js";const p=i.div`
-	background: ${s.surface.standard};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import o from"../../../assets/icons/info.svg.js";import{useState as r,useEffect as i}from"react";import n from"styled-components";import{Button as s}from"../../button/Button.js";import{Tag as l}from"../../tag/Tag.js";import{TitleRegular as a}from"../../TypographyStyle.js";import{COLORS as d}from"../../../constants/Theme.js";import{Badge as p}from"../Badge/index.js";import{useTemplateModalContext as c}from"../context/templateModalContext.js";const m=n.div`
+	background: ${d.surface.standard};
 	border-top-width: 1px;
-	border-top-color: ${s.stroke.primary};
+	border-top-color: ${d.stroke.primary};
 	box-shadow: 0px -4px 12px rgba(0, 0, 0, 0.12);
 	width: 100%;
 	padding: 0 24px;
@@ -12,4 +12,4 @@ import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as o,useEffect
 	border-bottom-left-radius: 4px;
 	border-bottom-right-radius: 4px;
 	height: ${e=>e.isWhatsappCarousel?64:80}px;
-`,c=i=>{let{isWhatsappCarousel:c,onSelect:m}=i;var u,x,b,h;const{isError:f,selectedCarouselIndex:g,setSelectedCarouselIndex:v,setErrorIndexes:y,template:j,showVariablePicker:C,hideFooterButton:S}=d(),[w,k]=o(c?"Next":"Select template");return r((()=>{c&&-1===g?k("Next"):c&&null!=g&&g>-1&&k("Save & Select Template")}),[g]),e(p,Object.assign({isWhatsappCarousel:c,justifyContent:c&&(null===(x=null===(u=null==j?void 0:j.mapping)||void 0===u?void 0:u.body)||void 0===x?void 0:x.length)?"space-between":"end"},{children:[c&&null!=g&&g>=-1&&!!(null===(h=null===(b=null==j?void 0:j.mapping)||void 0===b?void 0:b.body)||void 0===h?void 0:h.length)&&t(n,Object.assign({color:s.text.secondary},{children:`Step ${-1===g?1:2}/2`})),e("div",Object.assign({style:{display:"flex",flexDirection:"row"}},{children:[f&&t(a,{errorText:"Some inputs are missing or incorrect. Please check"}),!S&&t(l,{disabled:C,id:"select-template-btn",buttonText:w,size:c?"small":"large",onClick:function(){c&&-1===g&&v?v(0):(null==y||y([]),m())}})]}))]}))};export{c as default};
+`,u=n=>{let{isWhatsappCarousel:u,onSelect:x,footerButtonText:g,footerInfoText:f}=n;var b,h,v,j;const{isError:y,selectedCarouselIndex:C,setSelectedCarouselIndex:T,setErrorIndexes:S,template:w,showVariablePicker:I,hideFooterButton:k}=c(),[$,B]=r(u?"Next":"Select template");return i((()=>{g?B(g):u&&-1===C?B("Next"):u&&null!=C&&C>-1&&B("Save & Select Template")}),[C]),e(m,Object.assign({isWhatsappCarousel:u,justifyContent:u&&(null===(h=null===(b=null==w?void 0:w.mapping)||void 0===b?void 0:b.body)||void 0===h?void 0:h.length)?"space-between":"end"},{children:[u&&null!=C&&C>=-1&&!!(null===(j=null===(v=null==w?void 0:w.mapping)||void 0===v?void 0:v.body)||void 0===j?void 0:j.length)&&t(a,Object.assign({color:d.text.secondary},{children:`Step ${-1===C?1:2}/2`})),e("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center"}},{children:[y&&t(p,{errorText:"Some inputs are missing or incorrect. Please check"}),!y&&f&&t("div",Object.assign({style:{marginRight:12}},{children:t(l,{tagText:f,LeadingIcon:o})})),!k&&t(s,{disabled:I,id:"select-template-btn",buttonText:$,size:u?"small":"large",onClick:function(){u&&-1===C&&T?T(0):(null==S||S([]),x())}})]}))]}))};export{u as default};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bikdotai/bik-component-library",
-	"version": "0.0.622",
+	"version": "0.0.623",
 	"description": "Bik Component Library",
 	"repository": {
 		"type": "git",