@bikdotai/bik-component-library 0.0.634-del.0 → 0.0.634-del.1

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

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

@@ -5,6 +5,8 @@ interface QualityWarningModalProps {
     onClose?: () => void;
     onProceed?: () => void;
     onCancel?: () => void;
+    headingTitle?: string;
+    headingSubtitle?: string;
 }
 declare const QualityWarningModal: React.FC<QualityWarningModalProps>;
 export default QualityWarningModal;

package/dist/cjs/components/template-context-mapper/modalElements/QualityWarningModal.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"),n=require("../../modals/styledModal.js"),r=require("../../TypographyStyle.js"),i=require("../../../constants/Theme.js");const o={YELLOW:"Medium quality",RED:"Low quality"};exports.default=l=>{let{quality:s,onClose:a,onProceed:d,onCancel:c}=l;return e.jsx(n.StyledModal,Object.assign({open:!0,headingTitle:"Quality Warning",tintedHeader:!0,modalHeaderStyles:{backgroundColor:i.COLORS.surface.subdued},onBackPress:()=>{null==a||a()},headingSubtitle:"Marketing • Sales and offers",footerShadow:!0,primaryButton:{buttonText:"Cancel",buttonType:"primary",onClick:()=>{null==a||a(),null==c||c()}},secondaryButton:{buttonText:"Proceed with selection",buttonType:"secondary",onClick:()=>{null==d||d()}},onClose:()=>{null==a||a()}},{children:e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",margin:"128px 80px",gap:"16px"}},{children:[e.jsx("div",Object.assign({style:{background:i.COLORS.background.warning.light,width:"64px",height:"64px",padding:"12px",borderRadius:"40px"}},{children:e.jsx(t.default,{width:40,height:40,color:i.COLORS.content.warning})})),e.jsxs(r.TitleMedium,{children:[o[s]," template"]}),e.jsx(r.BodyPrimary,Object.assign({style:{textAlign:"center"},color:i.COLORS.content.secondary},{children:`This template is of ${o[s]}. Are you sure you want to send the\n\t\t\t\t\tcampaign with this template? We recommend changing the content or\n\t\t\t\t\tselect a different template before proceeding`}))]}))}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../assets/icons/alert_triangle.svg.js"),n=require("../../modals/styledModal.js"),i=require("../../TypographyStyle.js"),r=require("../../../constants/Theme.js");const l={YELLOW:"Medium quality",RED:"Low quality"};exports.default=o=>{let{quality:s,onClose:a,onProceed:d,onCancel:c,headingTitle:u,headingSubtitle:g}=o;return e.jsx(n.StyledModal,Object.assign({open:!0,headingTitle:u,tintedHeader:!0,modalHeaderStyles:{backgroundColor:r.COLORS.surface.subdued},onBackPress:()=>{null==a||a()},headingSubtitle:g,footerShadow:!0,primaryButton:{buttonText:"Cancel",buttonType:"primary",onClick:()=>{null==a||a(),null==c||c()}},secondaryButton:{buttonText:"Proceed with selection",buttonType:"secondary",onClick:()=>{null==d||d()}},onClose:()=>{null==a||a()}},{children:e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",margin:"128px 80px",gap:"16px"}},{children:[e.jsx("div",Object.assign({style:{background:r.COLORS.background.warning.light,width:"64px",height:"64px",padding:"12px",borderRadius:"40px"}},{children:e.jsx(t.default,{width:40,height:40,color:r.COLORS.content.warning})})),e.jsxs(i.TitleMedium,{children:[l[s]," template"]}),e.jsx(i.BodyPrimary,Object.assign({style:{textAlign:"center"},color:r.COLORS.content.secondary},{children:`This template is of ${l[s]}. Are you sure you want to send the\n\t\t\t\t\tcampaign with this template? We recommend changing the content or\n\t\t\t\t\tselect a different template before proceeding`}))]}))}))};

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

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

@@ -5,6 +5,8 @@ interface QualityWarningModalProps {
     onClose?: () => void;
     onProceed?: () => void;
     onCancel?: () => void;
+    headingTitle?: string;
+    headingSubtitle?: string;
 }
 declare const QualityWarningModal: React.FC<QualityWarningModalProps>;
 export default QualityWarningModal;

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

@@ -1 +1 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import n from"../../../assets/icons/alert_triangle.svg.js";import{StyledModal as o}from"../../modals/styledModal.js";import{TitleMedium as r,BodyPrimary as i}from"../../TypographyStyle.js";import{COLORS as a}from"../../../constants/Theme.js";const l={YELLOW:"Medium quality",RED:"Low quality"},s=s=>{let{quality:c,onClose:d,onProceed:u,onCancel:p}=s;return e(o,Object.assign({open:!0,headingTitle:"Quality Warning",tintedHeader:!0,modalHeaderStyles:{backgroundColor:a.surface.subdued},onBackPress:()=>{null==d||d()},headingSubtitle:"Marketing • Sales and offers",footerShadow:!0,primaryButton:{buttonText:"Cancel",buttonType:"primary",onClick:()=>{null==d||d(),null==p||p()}},secondaryButton:{buttonText:"Proceed with selection",buttonType:"secondary",onClick:()=>{null==u||u()}},onClose:()=>{null==d||d()}},{children:t("div",Object.assign({style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",margin:"128px 80px",gap:"16px"}},{children:[e("div",Object.assign({style:{background:a.background.warning.light,width:"64px",height:"64px",padding:"12px",borderRadius:"40px"}},{children:e(n,{width:40,height:40,color:a.content.warning})})),t(r,{children:[l[c]," template"]}),e(i,Object.assign({style:{textAlign:"center"},color:a.content.secondary},{children:`This template is of ${l[c]}. Are you sure you want to send the\n\t\t\t\t\tcampaign with this template? We recommend changing the content or\n\t\t\t\t\tselect a different template before proceeding`}))]}))}))};export{s as default};
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import n from"../../../assets/icons/alert_triangle.svg.js";import{StyledModal as o}from"../../modals/styledModal.js";import{TitleMedium as i,BodyPrimary as r}from"../../TypographyStyle.js";import{COLORS as l}from"../../../constants/Theme.js";const a={YELLOW:"Medium quality",RED:"Low quality"},s=s=>{let{quality:c,onClose:d,onProceed:u,onCancel:p,headingTitle:g,headingSubtitle:m}=s;return e(o,Object.assign({open:!0,headingTitle:g,tintedHeader:!0,modalHeaderStyles:{backgroundColor:l.surface.subdued},onBackPress:()=>{null==d||d()},headingSubtitle:m,footerShadow:!0,primaryButton:{buttonText:"Cancel",buttonType:"primary",onClick:()=>{null==d||d(),null==p||p()}},secondaryButton:{buttonText:"Proceed with selection",buttonType:"secondary",onClick:()=>{null==u||u()}},onClose:()=>{null==d||d()}},{children:t("div",Object.assign({style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",margin:"128px 80px",gap:"16px"}},{children:[e("div",Object.assign({style:{background:l.background.warning.light,width:"64px",height:"64px",padding:"12px",borderRadius:"40px"}},{children:e(n,{width:40,height:40,color:l.content.warning})})),t(i,{children:[a[c]," template"]}),e(r,Object.assign({style:{textAlign:"center"},color:l.content.secondary},{children:`This template is of ${a[c]}. Are you sure you want to send the\n\t\t\t\t\tcampaign with this template? We recommend changing the content or\n\t\t\t\t\tselect a different template before proceeding`}))]}))}))};export{s as default};

package/package.json

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