@bikdotai/bik-component-library 0.0.575-beta-01 → 0.0.575-beta-03

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

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

@@ -23,6 +23,7 @@ declare const useWebPushTemplate: () => {
             icon?: string[] | undefined;
             image?: string[] | undefined;
             buttons?: string[] | undefined;
+            redirectionLink?: string[] | undefined;
         };
         template: {
             name: string;
@@ -45,10 +46,12 @@ declare const useWebPushTemplate: () => {
                 icon?: string[] | undefined;
                 image?: string[] | undefined;
                 buttons?: string[] | undefined;
+                redirectionLink?: string[] | undefined;
             } | undefined;
             components: WebPushTemplateComponent;
             whatsappSpecificPickerMeta?: import("../../template-preview").WhatsAppPickerMeta | undefined;
         };
     }>;
+    isValidUrl: (url: string) => boolean;
 };
 export default useWebPushTemplate;

package/dist/cjs/components/template-context-mapper/helpers/WebpushTemplateHelper.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js");require("../../template-preview/TemplatePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js"),require("../../../constants/Theme.js"),require("../../curtain/CurtainHelper.js"),require("../../variable-picker-v3/model.js"),require("../../template-preview/models/TemplateMeta.js");var t=require("../../template-preview/models/WhatsAppTemplate.js");require("../../template-preview/models/Channels.js");var i=require("../../template-preview/constants/TemplateConstants.js"),l=require("../../../utils/variableUtils.js");exports.default=()=>{function a(e,t,i,a){const r=t.map(((t,r)=>{const s=n(t);if(a)return{variableName:t,isEditableVariable:!1,updatedValue:t,index:r,variableValue:t,type:"string"};const u=function(e,t,i){const a=i&&i.length?i:l.extractVariables(e);if(!a||!a.length)return[];const n=[];return a.forEach(((e,i)=>{const l=o(t,`{{${e}}}`);if(l){const{actualValue:e,defaultValue:t,variableText:a}=l;n.push({editable:"editableVariable"===a,variableVal:t,editableDefaultValues:t,variableName:e,idx:i})}})),n}(s?t:i,e);if(u.length>0){const e=u[0];return{variableName:e.variableName,isEditableVariable:!0,updatedValue:s?e.variableName:t,index:r,variableValue:e.variableVal,type:"string"}}return null})).filter((e=>null!==e));return r}const n=e=>e.includes("{{")&&e.includes("}}"),r=e=>e&&e.length?e.flatMap((e=>n(e)?l.extractVariables(e).map((e=>`{{${e}}}`))||[]:e)):[];const o=(e,t)=>{for(const i of e)for(const e in i.variables){const l=i.variables[e];if(l.actualValue===t)return l}return null};return{processWebpushTemplate:function(o,s,u,b){var d,p,v,c,m,f,h,L;return e.__awaiter(this,void 0,void 0,(function*(){const e=Object.assign({},o);e.components=function(e){let t;if("string"==typeof e)try{t=JSON.parse(e)}catch(e){console.error("Error parsing webpush component JSON:",e),t={}}else t=e;return t}(e.components);const{components:{title:g,body:V,buttons:w,icon:_,image:y},webpushBroadcastConfig:C}=e;let x={title:r(null!==(d=null==C?void 0:C.title)&&void 0!==d?d:[]),body:r(null!==(p=null==C?void 0:C.body)&&void 0!==p?p:[]),buttonsW:null!==(v=null==C?void 0:C.buttons)&&void 0!==v?v:[]};if(!e.webpushBroadcastConfig){const t=null!==(c=null==V?void 0:V.text)&&void 0!==c?c:"string"==typeof V?V:"",a=w&&(null==w?void 0:w.length)?w.map((e=>(null==e?void 0:e.websiteLink)==i.CUSTOM_URL_PLACEHOLDER?null==e?void 0:e.redirectionLink:null==e?void 0:e.websiteLink)).filter((e=>void 0!==e)):[];x={title:l.extractVariables(g).map((e=>`{{${e}}}`)),body:l.extractVariables(t).map((e=>`{{${e}}}`)),buttonsW:[]};const n={title:null!==(m=x.title)&&void 0!==m?m:[],body:null!==(f=x.body)&&void 0!==f?f:[],buttons:a,icon:_?[_]:void 0,image:y?[y]:void 0};e.webpushBroadcastConfig=n}const W=w&&w.length?w.map(((e,l)=>({type:t.BUTTON_TYPE.URL,text:null==e?void 0:e.text,url:"https://d.bik.ai/{{1}}",example:x.buttonsW&&x.buttonsW.length?n(x.buttonsW[l])?[""]:[x.buttonsW[l]]:e.redirectionLink?[e.redirectionLink]:void 0,buttonVariable:x.buttonsW&&x.buttonsW.length?n(x.buttonsW[l])?x.buttonsW[l]:i.CUSTOM_URL_PLACEHOLDER_VAR:e.websiteLink?e.websiteLink==i.CUSTOM_URL_PLACEHOLDER?i.CUSTOM_URL_PLACEHOLDER_VAR:e.websiteLink:i.CUSTOM_URL_PLACEHOLDER_VAR,index:l}))):[],E={title:a(s,x.title,g,b),body:a(s,x.body,(null==V?void 0:V.text)||"",b),buttons:W};return{templateVariableMapping:{title:(null===(h=null==u?void 0:u.title)||void 0===h?void 0:h.length)?u.title:E.title,body:(null===(L=null==u?void 0:u.body)||void 0===L?void 0:L.length)?u.body:E.body,buttons:E.buttons,icon:[],header:[]},webpushBroadcastConfig:e.webpushBroadcastConfig,template:e}}))}}};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js");require("../../template-preview/TemplatePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js"),require("../../../constants/Theme.js"),require("../../curtain/CurtainHelper.js"),require("../../variable-picker-v3/model.js"),require("../../template-preview/models/TemplateMeta.js");var t=require("../../template-preview/models/WhatsAppTemplate.js");require("../../template-preview/models/Channels.js");var i=require("../../template-preview/constants/TemplateConstants.js"),l=require("../../../utils/variableUtils.js");exports.default=()=>{function n(e,t,i,n,o){const u=t.map(((t,u)=>{const s=a(t);if(n)return{variableName:t,isEditableVariable:!1,updatedValue:t,index:u,variableValue:t,type:"string"};const d=function(e,t,i,n){const a=i&&i.length?i:l.extractVariables(e);if(!a||!a.length)return[];const o=[];return a.forEach(((e,i)=>{var l,a,u,s;const d=r(t,`{{${e}}}`);if(d){const{actualValue:t,defaultValue:r}=d,v="{{custom.text}}"===t||"{{custom.url}}"===t;o.push({editable:v,variableVal:v?null===(a=null===(l=null==n?void 0:n.filter((t=>t.name==e)))||void 0===l?void 0:l[0])||void 0===a?void 0:a.value:r,editableDefaultValues:v?void 0:r,variableName:t,updatedValue:v?null===(s=null===(u=null==n?void 0:n.filter((t=>t.name==e)))||void 0===u?void 0:u[0])||void 0===s?void 0:s.value:r,idx:i})}})),o}(s?t:i,e,void 0,o);if(d.length>0){const e=d[0];return{variableName:e.variableName,isEditableVariable:!0,updatedValue:(null==e?void 0:e.updatedValue)?null==e?void 0:e.updatedValue:s?e.variableName:t,index:u,variableValue:e.variableVal,type:"string"}}return null})).filter((e=>null!==e));return u}const a=e=>e.includes("{{")&&e.includes("}}"),o=(e,t)=>e&&e.length?e.flatMap(((e,i)=>{var n;return a(e)?e.includes("editableVariable")?(null===(n=null==t?void 0:t[i])||void 0===n?void 0:n.value)||e:l.extractVariables(e).map((e=>`{{${e}}}`))||[]:e})):[];const r=(e,t)=>{for(const i of e)for(const e in i.variables){const l=i.variables[e];if(l.actualValue===t||t.includes("editableVariable")&&l.actualValue.includes("custom.text"))return l}return null};return{processWebpushTemplate:function(r,u,s,d){var v,b,p,c,m,f,h,L;return e.__awaiter(this,void 0,void 0,(function*(){const e=Object.assign({},r);e.components=function(e){let t;if("string"==typeof e)try{t=JSON.parse(e)}catch(e){console.error("Error parsing webpush component JSON:",e),t={}}else t=e;return t}(e.components);const{components:{title:V,body:g,buttons:w,icon:y,image:_},webpushBroadcastConfig:C}=e;let x={title:o(null!==(v=null==C?void 0:C.title)&&void 0!==v?v:[]),body:o(null!==(b=null==C?void 0:C.body)&&void 0!==b?b:[],null==g?void 0:g.variables),buttonsW:null!==(p=null==C?void 0:C.buttons)&&void 0!==p?p:[]};if(!e.webpushBroadcastConfig){const t=null!==(c=null==g?void 0:g.text)&&void 0!==c?c:"string"==typeof g?g:"",n=w&&(null==w?void 0:w.length)?w.map((e=>(null==e?void 0:e.websiteLink)==i.CUSTOM_URL_PLACEHOLDER?null==e?void 0:e.redirectionLink:null==e?void 0:e.websiteLink)).filter((e=>void 0!==e)):[],a=l.extractVariables(t).map(((e,t)=>{var i,l;return e.includes("editableVariable")?(null===(l=null===(i=null==g?void 0:g.variables)||void 0===i?void 0:i[t])||void 0===l?void 0:l.value)||e:`{{${e}}}`}));x={title:l.extractVariables(V).map((e=>`{{${e}}}`)),body:a,buttonsW:[]};const o={title:null!==(m=x.title)&&void 0!==m?m:[],body:null!==(f=x.body)&&void 0!==f?f:[],buttons:n,icon:y?[y]:void 0,image:_?[_]:void 0,redirectionLink:(null==g?void 0:g.redirectionLink)?[null==g?void 0:g.redirectionLink]:[]};e.webpushBroadcastConfig=o}const W=w&&w.length?w.map(((e,l)=>({type:t.BUTTON_TYPE.URL,text:null==e?void 0:e.text,url:"https://d.bik.ai/{{1}}",example:x.buttonsW&&x.buttonsW.length?a(x.buttonsW[l])?[""]:[x.buttonsW[l]]:e.redirectionLink?[e.redirectionLink]:void 0,buttonVariable:x.buttonsW&&x.buttonsW.length?a(x.buttonsW[l])?x.buttonsW[l]:i.CUSTOM_URL_PLACEHOLDER_VAR:e.websiteLink?e.websiteLink==i.CUSTOM_URL_PLACEHOLDER?i.CUSTOM_URL_PLACEHOLDER_VAR:e.websiteLink:i.CUSTOM_URL_PLACEHOLDER_VAR,index:l}))):[],k={title:n(u,x.title,V,d),body:n(u,x.body,(null==g?void 0:g.text)||"",d,null==g?void 0:g.variables),buttons:W};return{templateVariableMapping:{title:(null===(h=null==s?void 0:s.title)||void 0===h?void 0:h.length)?s.title:k.title,body:(null===(L=null==s?void 0:s.body)||void 0===L?void 0:L.length)?s.body:k.body,buttons:k.buttons,icon:[],header:[]},webpushBroadcastConfig:e.webpushBroadcastConfig,template:e}}))},isValidUrl:e=>{try{return new URL(e),!0}catch(e){return!1}}}};

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("lodash"),a=require("react"),i=require("../../template-preview/models/TemplateMeta.js"),l=require("../context/templateModalContext.js"),n=require("../helpers/WebpushTemplateHelper.js"),o=require("../utils/getDataFromTemplateComponent.js"),s=require("./EditMediaModal.js"),d=require("./EditMediaV2.js"),r=require("./EditMediaV2.style.js"),p=require("./useEditWhtasappTemplateMedia.js"),u=require("./VariableConnectorsPanel.js"),m=require("./VariableConnectorWhatsApp.js"),c=require("./VariableEditorHeader.js"),b=require("./WhatsAppTemplateCardButtonV2.js");exports.default=h=>{let{template:g,onTemplateChange:M,whatsappSpecificPickerMeta:f,showVariableModal:E}=h;var T,j,C;const[v,x]=a.useState(null),[V,y]=a.useState(null),{variableList:I,disableEditVariable:O,originalVariableList:q,setOriginalVariableList:w}=l.useTemplateModalContext(),{processWebpushTemplate:L}=n.default(),[A,R]=a.useState(null),[S,W]=a.useState(null);a.useEffect((()=>{I&&L(g,I,q,O).then((e=>{let{templateVariableMapping:t,template:a,webpushBroadcastConfig:i}=e;x(t),null==w||w(t),null==M||M(Object.assign({},a)),y(i)}))}),[I,O]);const{descriptionComponents:D,bodyVariables:B,titleVariables:H}=a.useMemo((()=>{if(v&&V){const e=o.getAllDataFromWebpushTemplateComponent(V,v);return A||R(e.iconImage),S||W(e.bannerImage),{descriptionComponents:e.descriptionComponents,bodyVariables:e.bodyVariables,titleVariables:e.titleVariables}}return{descriptionComponents:[],bodyVariables:[],titleVariables:[],iconImage:null,bannerImage:null}}),[v,V]),{uploadMediaLink:F,uploadMediaFiles:k,validateMimeType:P}=f,_=a.useRef(null),U=p.useEditWhatsappTemplateMedia({uploadMediaLink:F,uploadMediaFiles:k,updateTemplateImageUrl:e=>Y(e,"icon"),validateMimeType:P,mediaComponent:A,fileRef:_}),G=p.useEditWhatsappTemplateMedia({uploadMediaLink:F,uploadMediaFiles:k,updateTemplateImageUrl:e=>Y(e,"image"),validateMimeType:P,mediaComponent:S,fileRef:_});function Y(e,a){const i=Object.assign({},g),l=t.cloneDeep(i);"icon"===a?(l.webpushBroadcastConfig.icon=[e],R([e])):"image"===a&&(l.webpushBroadcastConfig.image=[e],W([e])),null==M||M(Object.assign({},l))}function N(e,a,i){var l;const n=Object.assign({},g),o=t.cloneDeep(n),s="custom"===a&&"string"==typeof e,d=null===(l=null==o?void 0:o.webpushBroadcastConfig)||void 0===l?void 0:l.buttons;if(d&&d.length>0){d[i]=s?e:"string"!=typeof e?e.placeHolder:"";const t=Object.assign(Object.assign({},o.webpushBroadcastConfig),{buttons:d});o.webpushBroadcastConfig=t}null==M||M(o)}const $=U.openEditMedia?U:G.openEditMedia?G:null;return $?e.jsx(u.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsx(s.default,{mediaComponentFormat:i.HEADER_TYPES.IMAGE,uploadMedia:$.uploadMedia,variableListForImage:[],useEditWhatsappTemplateMediaResponse:$,setOpenEditMedia:$.setOpenEditMedia,openEditMedia:$.openEditMedia,editIconRef:$.editIconRef,fileRef:_,skipAddVariable:!0})})):e.jsxs(u.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:"auto"}},{children:[A&&A.length?e.jsx(r.EditTemplateMediaContainer,{children:e.jsx(d.default,{imageName:A,handleImageChange:U.handleImageChange,mediaType:i.HEADER_TYPES.IMAGE,error:U.error,isLoading:U.loading,setOpenEditMedia:U.setOpenEditMedia})}):null,S&&S.length?e.jsx(r.EditTemplateMediaContainer,{children:e.jsx(d.default,{imageName:S,handleImageChange:G.handleImageChange,mediaType:i.HEADER_TYPES.IMAGE,error:G.error,isLoading:G.loading,setOpenEditMedia:G.setOpenEditMedia})}):null,(null==B?void 0:B.length)||(null==H?void 0:H.length)?e.jsx(c.default,{containerStyle:{paddingTop:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}):null,null==D?void 0:D.map(((t,a)=>e.jsx(m.default,{originalVariableList:v,type:t.type,descriptionComponent:t.component,showVariableModal:E},a))),(null===(j=null===(T=null==v?void 0:v.buttons)||void 0===T?void 0:T.filter((e=>"URL"===e.type)))||void 0===j?void 0:j.length)>0&&e.jsx(c.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(C=null==v?void 0:v.buttons)||void 0===C?void 0:C.map(((t,a)=>e.jsx(b.default,{variableListIndex:a,CTAoptions:null==f?void 0:f.CTAoptions,button:t,currentVariableList:v,updateSelectedURLTemplateBtn:N},`${a}`)))]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("lodash"),a=require("react"),i=require("../../template-preview/models/TemplateMeta.js"),n=require("../context/templateModalContext.js"),l=require("../helpers/WebpushTemplateHelper.js"),o=require("../utils/getDataFromTemplateComponent.js"),s=require("./EditMediaModal.js"),d=require("./EditMediaV2.js"),r=require("./EditMediaV2.style.js"),p=require("./useEditWhtasappTemplateMedia.js"),u=require("./VariableConnectorsPanel.js"),c=require("./VariableConnectorWhatsApp.js"),m=require("./VariableEditorHeader.js"),h=require("./WhatsAppTemplateCardButtonV2.js"),b=require("../../input/Input.js");exports.default=g=>{let{template:f,onTemplateChange:M,whatsappSpecificPickerMeta:j,showVariableModal:E}=g;var x,C,T;const[v,V]=a.useState(null),[y,L]=a.useState(null),{variableList:I,disableEditVariable:w,originalVariableList:O,setOriginalVariableList:q}=n.useTemplateModalContext(),{processWebpushTemplate:R,isValidUrl:A}=l.default(),[k,D]=a.useState(null),[S,B]=a.useState(null),[W,F]=a.useState(null);a.useEffect((()=>{I&&R(f,I,O,w).then((e=>{let{templateVariableMapping:t,template:a,webpushBroadcastConfig:i}=e;V(t),null==q||q(t),null==M||M(Object.assign({},a)),L(i)}))}),[I,w]);const{descriptionComponents:H,bodyVariables:P,titleVariables:U}=a.useMemo((()=>{if(v&&y){const e=o.getAllDataFromWebpushTemplateComponent(y,v);return k||D(e.iconImage),S||B(e.bannerImage),W||F(e.redirectionLink),{descriptionComponents:e.descriptionComponents,bodyVariables:e.bodyVariables,titleVariables:e.titleVariables}}return{descriptionComponents:[],bodyVariables:[],titleVariables:[],iconImage:null,bannerImage:null}}),[v,y]),{uploadMediaLink:_,uploadMediaFiles:G,validateMimeType:Y}=j,N=a.useRef(null),$=p.useEditWhatsappTemplateMedia({uploadMediaLink:_,uploadMediaFiles:G,updateTemplateImageUrl:e=>z(e,"icon"),validateMimeType:Y,mediaComponent:k,fileRef:N}),K=p.useEditWhatsappTemplateMedia({uploadMediaLink:_,uploadMediaFiles:G,updateTemplateImageUrl:e=>z(e,"image"),validateMimeType:Y,mediaComponent:S,fileRef:N});function z(e,a){const i=Object.assign({},f),n=t.cloneDeep(i);"icon"===a?(n.webpushBroadcastConfig.icon=[e],D([e])):"image"===a&&(n.webpushBroadcastConfig.image=[e],B([e])),null==M||M(Object.assign({},n))}function J(e,a,i){var n;const l=Object.assign({},f),o=t.cloneDeep(l),s="custom"===a&&"string"==typeof e,d=null===(n=null==o?void 0:o.webpushBroadcastConfig)||void 0===n?void 0:n.buttons;if(d&&d.length>0){d[i]=s?e:"string"!=typeof e?e.placeHolder:"";const t=Object.assign(Object.assign({},o.webpushBroadcastConfig),{buttons:d});o.webpushBroadcastConfig=t}null==M||M(o)}const Q=$.openEditMedia?$:K.openEditMedia?K:null;if(Q)return e.jsx(u.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsx(s.default,{mediaComponentFormat:i.HEADER_TYPES.IMAGE,uploadMedia:Q.uploadMedia,variableListForImage:[],useEditWhatsappTemplateMediaResponse:Q,setOpenEditMedia:Q.setOpenEditMedia,openEditMedia:Q.openEditMedia,editIconRef:Q.editIconRef,fileRef:N,skipAddVariable:!0})}));return e.jsxs(u.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:"auto"}},{children:[k&&k.length?e.jsx(r.EditTemplateMediaContainer,{children:e.jsx(d.default,{imageName:k,handleImageChange:$.handleImageChange,mediaType:i.HEADER_TYPES.IMAGE,error:$.error,isLoading:$.loading,setOpenEditMedia:$.setOpenEditMedia})}):null,S&&S.length?e.jsx(r.EditTemplateMediaContainer,{children:e.jsx(d.default,{imageName:S,handleImageChange:K.handleImageChange,mediaType:i.HEADER_TYPES.IMAGE,error:K.error,isLoading:K.loading,setOpenEditMedia:K.setOpenEditMedia})}):null,(null==P?void 0:P.length)||(null==U?void 0:U.length)?e.jsx(m.default,{containerStyle:{paddingTop:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}):null,null==H?void 0:H.map(((t,a)=>e.jsx(c.default,{originalVariableList:v,type:t.type,descriptionComponent:t.component,showVariableModal:E},a))),W&&W.length?e.jsx("div",Object.assign({style:{padding:"16px 14px"}},{children:e.jsx(b.Input,{labelText:"Redirection Link",id:"redirection-link",value:W[0].replace("https://",""),errorMessage:A(W[0])?"":"Please enter a valid URL",maxCharLimit:2e3,noKeyDownChange:!0,state:w?"disabled":"none",prefixText:"https://",placeholder:"Enter custom URL here",onChangeText:e=>{!function(e){var a;const i=`https://${e}`;F([i]);const n=t.cloneDeep(f);(null===(a=n.webpushBroadcastConfig)||void 0===a?void 0:a.redirectionLink)&&(n.webpushBroadcastConfig.redirectionLink=[i]),null==M||M(Object.assign({},n))}(e)}})})):e.jsx(e.Fragment,{}),(null===(C=null===(x=null==v?void 0:v.buttons)||void 0===x?void 0:x.filter((e=>"URL"===e.type)))||void 0===C?void 0:C.length)>0&&e.jsx(m.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(T=null==v?void 0:v.buttons)||void 0===T?void 0:T.map(((t,a)=>e.jsx(h.default,{variableListIndex:a,CTAoptions:null==j?void 0:j.CTAoptions,button:t,currentVariableList:v,updateSelectedURLTemplateBtn:J},`${a}`)))]}))};

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

@@ -24,6 +24,7 @@ export declare const getAllDataFromWebpushTemplateComponent: (mapping: WebpushTe
     titleVariables: string[];
     iconImage: string[];
     bannerImage: string[];
+    redirectionLink: string[];
     descriptionComponents: {
         type: string;
         component: any;

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.getAllDataFromTemplateComponent=e=>{var o,t;const n=[],i=[],l=[],p=[],a=[];let s=null;return e.components.forEach(((e,o)=>{var t,p,a,d,r,m;if("BODY"===e.type&&e.text&&n.push({component:e,i:o,type:"BODY"}),"HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format&&(null===(p=null===(t=e.example)||void 0===t?void 0:t.header_handle)||void 0===p?void 0:p[0])&&(s=e),"HEADER"===e.type&&"TEXT"===e.format&&n.push({component:e,i:o,type:"HEADER"}),"BUTTONS"===e.type){const t=null===(d=null===(a=e.buttons)||void 0===a?void 0:a.filter)||void 0===d?void 0:d.call(a,(e=>"URL"===e.type));i.push({component:Object.assign(Object.assign({},e),{buttons:t}),i:o});const n=null===(m=null===(r=e.buttons)||void 0===r?void 0:r.filter)||void 0===m?void 0:m.call(r,(e=>"QUICK_REPLY"===e.type));l.push({component:Object.assign(Object.assign({},e),{buttons:n}),i:o})}"limited_time_offer"===e.type&&n.push({component:e,i:o,type:"limited_time_offer"})})),e.mapping&&(null===(o=e.mapping.body)||void 0===o||o.forEach((e=>{p.push(e)}))),e.mapping&&(null===(t=e.mapping.header)||void 0===t||t.forEach((e=>{a.push(e)}))),{imageComponent:s,descriptionComponents:n,urlBtns:i,qrbBtns:l,bodyVariables:p,headerVariables:a}},exports.getAllDataFromWebpushTemplateComponent=(e,o)=>{var t,n,i,l;return{bodyVariables:(null===(t=null==e?void 0:e.body)||void 0===t?void 0:t.map((e=>e)))||[],titleVariables:(null===(n=null==e?void 0:e.title)||void 0===n?void 0:n.map((e=>e)))||[],iconImage:(null===(i=null==e?void 0:e.icon)||void 0===i?void 0:i.map((e=>e)))||[],bannerImage:(null===(l=null==e?void 0:e.image)||void 0===l?void 0:l.map((e=>e)))||[],descriptionComponents:Object.keys(o).map((e=>({type:e.toUpperCase(),component:Object.assign(Object.assign({},o[e]),{type:e.toUpperCase()})})))}};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.getAllDataFromTemplateComponent=e=>{var o,t;const n=[],i=[],l=[],p=[],a=[];let s=null;return e.components.forEach(((e,o)=>{var t,p,a,d,r,m;if("BODY"===e.type&&e.text&&n.push({component:e,i:o,type:"BODY"}),"HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format&&(null===(p=null===(t=e.example)||void 0===t?void 0:t.header_handle)||void 0===p?void 0:p[0])&&(s=e),"HEADER"===e.type&&"TEXT"===e.format&&n.push({component:e,i:o,type:"HEADER"}),"BUTTONS"===e.type){const t=null===(d=null===(a=e.buttons)||void 0===a?void 0:a.filter)||void 0===d?void 0:d.call(a,(e=>"URL"===e.type));i.push({component:Object.assign(Object.assign({},e),{buttons:t}),i:o});const n=null===(m=null===(r=e.buttons)||void 0===r?void 0:r.filter)||void 0===m?void 0:m.call(r,(e=>"QUICK_REPLY"===e.type));l.push({component:Object.assign(Object.assign({},e),{buttons:n}),i:o})}"limited_time_offer"===e.type&&n.push({component:e,i:o,type:"limited_time_offer"})})),e.mapping&&(null===(o=e.mapping.body)||void 0===o||o.forEach((e=>{p.push(e)}))),e.mapping&&(null===(t=e.mapping.header)||void 0===t||t.forEach((e=>{a.push(e)}))),{imageComponent:s,descriptionComponents:n,urlBtns:i,qrbBtns:l,bodyVariables:p,headerVariables:a}},exports.getAllDataFromWebpushTemplateComponent=(e,o)=>{var t,n,i,l,p;return{bodyVariables:(null===(t=null==e?void 0:e.body)||void 0===t?void 0:t.map((e=>e)))||[],titleVariables:(null===(n=null==e?void 0:e.title)||void 0===n?void 0:n.map((e=>e)))||[],iconImage:(null===(i=null==e?void 0:e.icon)||void 0===i?void 0:i.map((e=>e)))||[],bannerImage:(null===(l=null==e?void 0:e.image)||void 0===l?void 0:l.map((e=>e)))||[],redirectionLink:(null===(p=null==e?void 0:e.redirectionLink)||void 0===p?void 0:p.map((e=>e)))||[],descriptionComponents:Object.keys(o).map((e=>({type:e.toUpperCase(),component:Object.assign(Object.assign({},o[e]),{type:e.toUpperCase()})})))}};

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

@@ -33,7 +33,8 @@ export declare enum WEB_PUSH_COMPONENT_TYPE {
     BODY = "body",
     ICON = "icon",
     IMAGE = "image",
-    BUTTONS = "buttons"
+    BUTTONS = "buttons",
+    redirectionLink = "redirectionLink"
 }
 export type WebpushComponentKeyType = {
     type: WEB_PUSH_COMPONENT_TYPE;
@@ -42,6 +43,10 @@ export type WebPushComponentType = {
     text: string;
     redirectionLink?: string;
     websiteLink?: string;
+    variables?: {
+        name: string;
+        value: string;
+    }[];
 };
 export type WebPushTemplateComponent = {
     [WEB_PUSH_COMPONENT_TYPE.TITLE]: string;
@@ -49,6 +54,7 @@ export type WebPushTemplateComponent = {
     [WEB_PUSH_COMPONENT_TYPE.ICON]: string;
     [WEB_PUSH_COMPONENT_TYPE.IMAGE]: string;
     [WEB_PUSH_COMPONENT_TYPE.BUTTONS]: WebPushComponentType[];
+    [WEB_PUSH_COMPONENT_TYPE.redirectionLink]?: string;
 };
 export interface WebpushTemplateVariables extends WhatsAppTemplateVariables {
     title: CUSTOM_VARIABLE[];

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

@@ -1 +1 @@
-"use strict";var e;Object.defineProperty(exports,"__esModule",{value:!0}),exports.WEB_PUSH_COMPONENT_TYPE=void 0,(e=exports.WEB_PUSH_COMPONENT_TYPE||(exports.WEB_PUSH_COMPONENT_TYPE={})).TITLE="title",e.BODY="body",e.ICON="icon",e.IMAGE="image",e.BUTTONS="buttons";
+"use strict";var e;Object.defineProperty(exports,"__esModule",{value:!0}),exports.WEB_PUSH_COMPONENT_TYPE=void 0,(e=exports.WEB_PUSH_COMPONENT_TYPE||(exports.WEB_PUSH_COMPONENT_TYPE={})).TITLE="title",e.BODY="body",e.ICON="icon",e.IMAGE="image",e.BUTTONS="buttons",e.redirectionLink="redirectionLink";

package/dist/cjs/components/template-preview/webpush/WebpushPreview.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../models/WebpushTemplate.js"),t=require("../utils/TemplateHelperUtils.js"),i=require("./WebpushPreview.styled.js");exports.default=n=>{var l,a,r,E,O,c;const{components:P,webpushBroadcastConfig:_}=n.template,o=(new t.TemplateHelperUtils).parseJsonString(P),T="https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F4daae031-3902-4e58-a57c-32f29ea90812?alt=media&token=a7655ba9-6843-47df-91ba-422345e925c3",N=(e,s)=>{let t=0;return e?e.replace(/{{(.*?)}}/g,((e,i)=>{const n=i.trim();if(s&&s.length&&t<s.length){const e=s[t];return t++,e}return`{{${n}}}`})):""},d=N(o[s.WEB_PUSH_COMPONENT_TYPE.TITLE],null==_?void 0:_.title),g=N(null!==(r=null!==(a=null===(l=o[s.WEB_PUSH_COMPONENT_TYPE.BODY])||void 0===l?void 0:l.text)&&void 0!==a?a:o[s.WEB_PUSH_COMPONENT_TYPE.BODY])&&void 0!==r?r:"",null==_?void 0:_.body);return e.jsxs(i.WebpushPreviewContainer,Object.assign({style:Object.assign({},n.extraContainerCss)},{children:[e.jsxs("div",Object.assign({className:"icon--header"},{children:[e.jsx("div",Object.assign({className:"icon-img-container"},{children:e.jsx("img",{src:(null===(E=null==_?void 0:_[s.WEB_PUSH_COMPONENT_TYPE.ICON])||void 0===E?void 0:E.length)?_[s.WEB_PUSH_COMPONENT_TYPE.ICON][0]:o[s.WEB_PUSH_COMPONENT_TYPE.ICON]||T,alt:"icon-image"})})),e.jsxs("div",Object.assign({className:"text--container"},{children:[e.jsx("div",{children:d}),e.jsx("div",Object.assign({style:{marginTop:3}},{children:g}))]}))]})),o[s.WEB_PUSH_COMPONENT_TYPE.IMAGE]&&o[s.WEB_PUSH_COMPONENT_TYPE.IMAGE].length&&e.jsx("div",Object.assign({className:"banner-img-container"},{children:e.jsx("img",{src:(null===(O=null==_?void 0:_[s.WEB_PUSH_COMPONENT_TYPE.IMAGE])||void 0===O?void 0:O.length)?_[s.WEB_PUSH_COMPONENT_TYPE.IMAGE][0]:null!==(c=o[s.WEB_PUSH_COMPONENT_TYPE.IMAGE])&&void 0!==c?c:T,alt:"icon-image"})})),o[s.WEB_PUSH_COMPONENT_TYPE.BUTTONS]&&o[s.WEB_PUSH_COMPONENT_TYPE.BUTTONS].length&&e.jsx("div",Object.assign({className:"button-container "+(1===o[s.WEB_PUSH_COMPONENT_TYPE.BUTTONS].length?"single-button":"")},{children:o[s.WEB_PUSH_COMPONENT_TYPE.BUTTONS].map(((t,i)=>e.jsx("div",Object.assign({className:"each--btn",style:{flex:1===o[s.WEB_PUSH_COMPONENT_TYPE.BUTTONS].length?"0 0 50%":"1"}},{children:e.jsx("div",Object.assign({className:"text-btn"},{children:t.text}))}),`webpush-buttons-${i}`)))}))]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../models/WebpushTemplate.js"),t=require("../utils/TemplateHelperUtils.js"),i=require("./WebpushPreview.styled.js");exports.default=n=>{var l,a,r,E,O,c;const{components:P,webpushBroadcastConfig:_}=n.template,o=(new t.TemplateHelperUtils).parseJsonString(P),T="https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F4daae031-3902-4e58-a57c-32f29ea90812?alt=media&token=a7655ba9-6843-47df-91ba-422345e925c3",N=(e,s)=>{let t=0;return e?e.replace(/{{(.*?)}}/g,((e,i)=>{const n=i.trim();if(s&&s.length&&t<s.length){const e=s[t];return t++,`${e} `}return`{{${n}}}`})):""},d=N(o[s.WEB_PUSH_COMPONENT_TYPE.TITLE],null==_?void 0:_.title),g=N(null!==(r=null!==(a=null===(l=o[s.WEB_PUSH_COMPONENT_TYPE.BODY])||void 0===l?void 0:l.text)&&void 0!==a?a:o[s.WEB_PUSH_COMPONENT_TYPE.BODY])&&void 0!==r?r:"",null==_?void 0:_.body);return e.jsxs(i.WebpushPreviewContainer,Object.assign({style:Object.assign({},n.extraContainerCss)},{children:[e.jsxs("div",Object.assign({className:"icon--header"},{children:[e.jsx("div",Object.assign({className:"icon-img-container"},{children:e.jsx("img",{src:(null===(E=null==_?void 0:_[s.WEB_PUSH_COMPONENT_TYPE.ICON])||void 0===E?void 0:E.length)?_[s.WEB_PUSH_COMPONENT_TYPE.ICON][0]:o[s.WEB_PUSH_COMPONENT_TYPE.ICON]||T,alt:"icon-image"})})),e.jsxs("div",Object.assign({className:"text--container"},{children:[e.jsx("div",{children:d}),e.jsx("div",Object.assign({style:{marginTop:3}},{children:g}))]}))]})),o[s.WEB_PUSH_COMPONENT_TYPE.IMAGE]&&o[s.WEB_PUSH_COMPONENT_TYPE.IMAGE].length&&e.jsx("div",Object.assign({className:"banner-img-container"},{children:e.jsx("img",{src:(null===(O=null==_?void 0:_[s.WEB_PUSH_COMPONENT_TYPE.IMAGE])||void 0===O?void 0:O.length)?_[s.WEB_PUSH_COMPONENT_TYPE.IMAGE][0]:null!==(c=o[s.WEB_PUSH_COMPONENT_TYPE.IMAGE])&&void 0!==c?c:T,alt:"icon-image"})})),o[s.WEB_PUSH_COMPONENT_TYPE.BUTTONS]&&o[s.WEB_PUSH_COMPONENT_TYPE.BUTTONS].length&&e.jsx("div",Object.assign({className:"button-container "+(1===o[s.WEB_PUSH_COMPONENT_TYPE.BUTTONS].length?"single-button":"")},{children:o[s.WEB_PUSH_COMPONENT_TYPE.BUTTONS].map(((t,i)=>e.jsx("div",Object.assign({className:"each--btn",style:{flex:1===o[s.WEB_PUSH_COMPONENT_TYPE.BUTTONS].length?"0 0 50%":"1"}},{children:e.jsx("div",Object.assign({className:"text-btn"},{children:t.text}))}),`webpush-buttons-${i}`)))}))]}))};

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

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

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

@@ -23,6 +23,7 @@ declare const useWebPushTemplate: () => {
             icon?: string[] | undefined;
             image?: string[] | undefined;
             buttons?: string[] | undefined;
+            redirectionLink?: string[] | undefined;
         };
         template: {
             name: string;
@@ -45,10 +46,12 @@ declare const useWebPushTemplate: () => {
                 icon?: string[] | undefined;
                 image?: string[] | undefined;
                 buttons?: string[] | undefined;
+                redirectionLink?: string[] | undefined;
             } | undefined;
             components: WebPushTemplateComponent;
             whatsappSpecificPickerMeta?: import("../../template-preview").WhatsAppPickerMeta | undefined;
         };
     }>;
+    isValidUrl: (url: string) => boolean;
 };
 export default useWebPushTemplate;

package/dist/esm/components/template-context-mapper/helpers/WebpushTemplateHelper.js

@@ -1 +1 @@
-import{__awaiter as t}from"../../../_virtual/_tslib.js";import"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import"../../../constants/Theme.js";import"../../curtain/CurtainHelper.js";import"../../variable-picker-v3/model.js";import"../../template-preview/models/TemplateMeta.js";import{BUTTON_TYPE as e}from"../../template-preview/models/WhatsAppTemplate.js";import"../../template-preview/models/Channels.js";import{CUSTOM_URL_PLACEHOLDER as i,CUSTOM_URL_PLACEHOLDER_VAR as l}from"../../template-preview/constants/TemplateConstants.js";import{extractVariables as n}from"../../../utils/variableUtils.js";const o=()=>{function o(t,e,i,l){const o=e.map(((e,o)=>{const r=a(e);if(l)return{variableName:e,isEditableVariable:!1,updatedValue:e,index:o,variableValue:e,type:"string"};const u=function(t,e,i){const l=i&&i.length?i:n(t);if(!l||!l.length)return[];const o=[];return l.forEach(((t,i)=>{const l=s(e,`{{${t}}}`);if(l){const{actualValue:t,defaultValue:e,variableText:n}=l;o.push({editable:"editableVariable"===n,variableVal:e,editableDefaultValues:e,variableName:t,idx:i})}})),o}(r?e:i,t);if(u.length>0){const t=u[0];return{variableName:t.variableName,isEditableVariable:!0,updatedValue:r?t.variableName:e,index:o,variableValue:t.variableVal,type:"string"}}return null})).filter((t=>null!==t));return o}const a=t=>t.includes("{{")&&t.includes("}}"),r=t=>t&&t.length?t.flatMap((t=>a(t)?n(t).map((t=>`{{${t}}}`))||[]:t)):[];const s=(t,e)=>{for(const i of t)for(const t in i.variables){const l=i.variables[t];if(l.actualValue===e)return l}return null};return{processWebpushTemplate:function(s,u,p,d){var b,v,c,m,f,h,g,w;return t(this,void 0,void 0,(function*(){const t=Object.assign({},s);t.components=function(t){let e;if("string"==typeof t)try{e=JSON.parse(t)}catch(t){console.error("Error parsing webpush component JSON:",t),e={}}else e=t;return e}(t.components);const{components:{title:y,body:V,buttons:W,icon:j,image:k},webpushBroadcastConfig:x}=t;let L={title:r(null!==(b=null==x?void 0:x.title)&&void 0!==b?b:[]),body:r(null!==(v=null==x?void 0:x.body)&&void 0!==v?v:[]),buttonsW:null!==(c=null==x?void 0:x.buttons)&&void 0!==c?c:[]};if(!t.webpushBroadcastConfig){const e=null!==(m=null==V?void 0:V.text)&&void 0!==m?m:"string"==typeof V?V:"",l=W&&(null==W?void 0:W.length)?W.map((t=>(null==t?void 0:t.websiteLink)==i?null==t?void 0:t.redirectionLink:null==t?void 0:t.websiteLink)).filter((t=>void 0!==t)):[];L={title:n(y).map((t=>`{{${t}}}`)),body:n(e).map((t=>`{{${t}}}`)),buttonsW:[]};const o={title:null!==(f=L.title)&&void 0!==f?f:[],body:null!==(h=L.body)&&void 0!==h?h:[],buttons:l,icon:j?[j]:void 0,image:k?[k]:void 0};t.webpushBroadcastConfig=o}const C=W&&W.length?W.map(((t,n)=>({type:e.URL,text:null==t?void 0:t.text,url:"https://d.bik.ai/{{1}}",example:L.buttonsW&&L.buttonsW.length?a(L.buttonsW[n])?[""]:[L.buttonsW[n]]:t.redirectionLink?[t.redirectionLink]:void 0,buttonVariable:L.buttonsW&&L.buttonsW.length?a(L.buttonsW[n])?L.buttonsW[n]:l:t.websiteLink?t.websiteLink==i?l:t.websiteLink:l,index:n}))):[],N={title:o(u,L.title,y,d),body:o(u,L.body,(null==V?void 0:V.text)||"",d),buttons:C};return{templateVariableMapping:{title:(null===(g=null==p?void 0:p.title)||void 0===g?void 0:g.length)?p.title:N.title,body:(null===(w=null==p?void 0:p.body)||void 0===w?void 0:w.length)?p.body:N.body,buttons:N.buttons,icon:[],header:[]},webpushBroadcastConfig:t.webpushBroadcastConfig,template:t}}))}}};export{o as default};
+import{__awaiter as e}from"../../../_virtual/_tslib.js";import"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import"../../../constants/Theme.js";import"../../curtain/CurtainHelper.js";import"../../variable-picker-v3/model.js";import"../../template-preview/models/TemplateMeta.js";import{BUTTON_TYPE as t}from"../../template-preview/models/WhatsAppTemplate.js";import"../../template-preview/models/Channels.js";import{CUSTOM_URL_PLACEHOLDER as i,CUSTOM_URL_PLACEHOLDER_VAR as l}from"../../template-preview/constants/TemplateConstants.js";import{extractVariables as n}from"../../../utils/variableUtils.js";const o=()=>{function o(e,t,i,l,o){const r=t.map(((t,r)=>{const s=a(t);if(l)return{variableName:t,isEditableVariable:!1,updatedValue:t,index:r,variableValue:t,type:"string"};const d=function(e,t,i,l){const o=i&&i.length?i:n(e);if(!o||!o.length)return[];const a=[];return o.forEach(((e,i)=>{var n,o,r,s;const d=u(t,`{{${e}}}`);if(d){const{actualValue:t,defaultValue:u}=d,v="{{custom.text}}"===t||"{{custom.url}}"===t;a.push({editable:v,variableVal:v?null===(o=null===(n=null==l?void 0:l.filter((t=>t.name==e)))||void 0===n?void 0:n[0])||void 0===o?void 0:o.value:u,editableDefaultValues:v?void 0:u,variableName:t,updatedValue:v?null===(s=null===(r=null==l?void 0:l.filter((t=>t.name==e)))||void 0===r?void 0:r[0])||void 0===s?void 0:s.value:u,idx:i})}})),a}(s?t:i,e,void 0,o);if(d.length>0){const e=d[0];return{variableName:e.variableName,isEditableVariable:!0,updatedValue:(null==e?void 0:e.updatedValue)?null==e?void 0:e.updatedValue:s?e.variableName:t,index:r,variableValue:e.variableVal,type:"string"}}return null})).filter((e=>null!==e));return r}const a=e=>e.includes("{{")&&e.includes("}}"),r=(e,t)=>e&&e.length?e.flatMap(((e,i)=>{var l;return a(e)?e.includes("editableVariable")?(null===(l=null==t?void 0:t[i])||void 0===l?void 0:l.value)||e:n(e).map((e=>`{{${e}}}`))||[]:e})):[];const u=(e,t)=>{for(const i of e)for(const e in i.variables){const l=i.variables[e];if(l.actualValue===t||t.includes("editableVariable")&&l.actualValue.includes("custom.text"))return l}return null};return{processWebpushTemplate:function(u,s,d,v){var p,b,c,m,f,h,g,V;return e(this,void 0,void 0,(function*(){const e=Object.assign({},u);e.components=function(e){let t;if("string"==typeof e)try{t=JSON.parse(e)}catch(e){console.error("Error parsing webpush component JSON:",e),t={}}else t=e;return t}(e.components);const{components:{title:w,body:y,buttons:W,icon:k,image:L},webpushBroadcastConfig:j}=e;let x={title:r(null!==(p=null==j?void 0:j.title)&&void 0!==p?p:[]),body:r(null!==(b=null==j?void 0:j.body)&&void 0!==b?b:[],null==y?void 0:y.variables),buttonsW:null!==(c=null==j?void 0:j.buttons)&&void 0!==c?c:[]};if(!e.webpushBroadcastConfig){const t=null!==(m=null==y?void 0:y.text)&&void 0!==m?m:"string"==typeof y?y:"",l=W&&(null==W?void 0:W.length)?W.map((e=>(null==e?void 0:e.websiteLink)==i?null==e?void 0:e.redirectionLink:null==e?void 0:e.websiteLink)).filter((e=>void 0!==e)):[],o=n(t).map(((e,t)=>{var i,l;return e.includes("editableVariable")?(null===(l=null===(i=null==y?void 0:y.variables)||void 0===i?void 0:i[t])||void 0===l?void 0:l.value)||e:`{{${e}}}`}));x={title:n(w).map((e=>`{{${e}}}`)),body:o,buttonsW:[]};const a={title:null!==(f=x.title)&&void 0!==f?f:[],body:null!==(h=x.body)&&void 0!==h?h:[],buttons:l,icon:k?[k]:void 0,image:L?[L]:void 0,redirectionLink:(null==y?void 0:y.redirectionLink)?[null==y?void 0:y.redirectionLink]:[]};e.webpushBroadcastConfig=a}const C=W&&W.length?W.map(((e,n)=>({type:t.URL,text:null==e?void 0:e.text,url:"https://d.bik.ai/{{1}}",example:x.buttonsW&&x.buttonsW.length?a(x.buttonsW[n])?[""]:[x.buttonsW[n]]:e.redirectionLink?[e.redirectionLink]:void 0,buttonVariable:x.buttonsW&&x.buttonsW.length?a(x.buttonsW[n])?x.buttonsW[n]:l:e.websiteLink?e.websiteLink==i?l:e.websiteLink:l,index:n}))):[],N={title:o(s,x.title,w,v),body:o(s,x.body,(null==y?void 0:y.text)||"",v,null==y?void 0:y.variables),buttons:C};return{templateVariableMapping:{title:(null===(g=null==d?void 0:d.title)||void 0===g?void 0:g.length)?d.title:N.title,body:(null===(V=null==d?void 0:d.body)||void 0===V?void 0:V.length)?d.body:N.body,buttons:N.buttons,icon:[],header:[]},webpushBroadcastConfig:e.webpushBroadcastConfig,template:e}}))},isValidUrl:e=>{try{return new URL(e),!0}catch(e){return!1}}}};export{o as default};

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

@@ -1 +1 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{cloneDeep as i}from"lodash";import{useState as a,useEffect as o,useMemo as n,useRef as l}from"react";import{HEADER_TYPES as d}from"../../template-preview/models/TemplateMeta.js";import{useTemplateModalContext as r}from"../context/templateModalContext.js";import s from"../helpers/WebpushTemplateHelper.js";import{getAllDataFromWebpushTemplateComponent as p}from"../utils/getDataFromTemplateComponent.js";import m from"./EditMediaModal.js";import u from"./EditMediaV2.js";import{EditTemplateMediaContainer as c}from"./EditMediaV2.style.js";import{useEditWhatsappTemplateMedia as b}from"./useEditWhtasappTemplateMedia.js";import{Container as g}from"./VariableConnectorsPanel.js";import h from"./VariableConnectorWhatsApp.js";import f from"./VariableEditorHeader.js";import M from"./WhatsAppTemplateCardButtonV2.js";const v=v=>{let{template:C,onTemplateChange:T,whatsappSpecificPickerMeta:E,showVariableModal:V}=v;var j,y,I;const[w,x]=a(null),[O,L]=a(null),{variableList:A,disableEditVariable:B,originalVariableList:R,setOriginalVariableList:W}=r(),{processWebpushTemplate:k}=s(),[F,H]=a(null),[U,D]=a(null);o((()=>{A&&k(C,A,R,B).then((e=>{let{templateVariableMapping:t,template:i,webpushBroadcastConfig:a}=e;x(t),null==W||W(t),null==T||T(Object.assign({},i)),L(a)}))}),[A,B]);const{descriptionComponents:G,bodyVariables:S,titleVariables:N}=n((()=>{if(w&&O){const e=p(O,w);return F||H(e.iconImage),U||D(e.bannerImage),{descriptionComponents:e.descriptionComponents,bodyVariables:e.bodyVariables,titleVariables:e.titleVariables}}return{descriptionComponents:[],bodyVariables:[],titleVariables:[],iconImage:null,bannerImage:null}}),[w,O]),{uploadMediaLink:P,uploadMediaFiles:$,validateMimeType:q}=E,z=l(null),J=b({uploadMediaLink:P,uploadMediaFiles:$,updateTemplateImageUrl:e=>Q(e,"icon"),validateMimeType:q,mediaComponent:F,fileRef:z}),K=b({uploadMediaLink:P,uploadMediaFiles:$,updateTemplateImageUrl:e=>Q(e,"image"),validateMimeType:q,mediaComponent:U,fileRef:z});function Q(e,t){const a=Object.assign({},C),o=i(a);"icon"===t?(o.webpushBroadcastConfig.icon=[e],H([e])):"image"===t&&(o.webpushBroadcastConfig.image=[e],D([e])),null==T||T(Object.assign({},o))}function X(e,t,a){var o;const n=Object.assign({},C),l=i(n),d="custom"===t&&"string"==typeof e,r=null===(o=null==l?void 0:l.webpushBroadcastConfig)||void 0===o?void 0:o.buttons;if(r&&r.length>0){r[a]=d?e:"string"!=typeof e?e.placeHolder:"";const t=Object.assign(Object.assign({},l.webpushBroadcastConfig),{buttons:r});l.webpushBroadcastConfig=t}null==T||T(l)}const Y=J.openEditMedia?J:K.openEditMedia?K:null;return Y?e(g,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e(m,{mediaComponentFormat:d.IMAGE,uploadMedia:Y.uploadMedia,variableListForImage:[],useEditWhatsappTemplateMediaResponse:Y,setOpenEditMedia:Y.setOpenEditMedia,openEditMedia:Y.openEditMedia,editIconRef:Y.editIconRef,fileRef:z,skipAddVariable:!0})})):t(g,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:"auto"}},{children:[F&&F.length?e(c,{children:e(u,{imageName:F,handleImageChange:J.handleImageChange,mediaType:d.IMAGE,error:J.error,isLoading:J.loading,setOpenEditMedia:J.setOpenEditMedia})}):null,U&&U.length?e(c,{children:e(u,{imageName:U,handleImageChange:K.handleImageChange,mediaType:d.IMAGE,error:K.error,isLoading:K.loading,setOpenEditMedia:K.setOpenEditMedia})}):null,(null==S?void 0:S.length)||(null==N?void 0:N.length)?e(f,{containerStyle:{paddingTop:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}):null,null==G?void 0:G.map(((t,i)=>e(h,{originalVariableList:w,type:t.type,descriptionComponent:t.component,showVariableModal:V},i))),(null===(y=null===(j=null==w?void 0:w.buttons)||void 0===j?void 0:j.filter((e=>"URL"===e.type)))||void 0===y?void 0:y.length)>0&&e(f,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(I=null==w?void 0:w.buttons)||void 0===I?void 0:I.map(((t,i)=>e(M,{variableListIndex:i,CTAoptions:null==E?void 0:E.CTAoptions,button:t,currentVariableList:w,updateSelectedURLTemplateBtn:X},`${i}`)))]}))};export{v as default};
+import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import{cloneDeep as a}from"lodash";import{useState as n,useEffect as o,useMemo as l,useRef as r}from"react";import{HEADER_TYPES as d}from"../../template-preview/models/TemplateMeta.js";import{useTemplateModalContext as s}from"../context/templateModalContext.js";import p from"../helpers/WebpushTemplateHelper.js";import{getAllDataFromWebpushTemplateComponent as m}from"../utils/getDataFromTemplateComponent.js";import u from"./EditMediaModal.js";import c from"./EditMediaV2.js";import{EditTemplateMediaContainer as h}from"./EditMediaV2.style.js";import{useEditWhatsappTemplateMedia as b}from"./useEditWhtasappTemplateMedia.js";import{Container as g}from"./VariableConnectorsPanel.js";import f from"./VariableConnectorWhatsApp.js";import M from"./VariableEditorHeader.js";import v from"./WhatsAppTemplateCardButtonV2.js";import{Input as C}from"../../input/Input.js";const T=T=>{let{template:E,onTemplateChange:V,whatsappSpecificPickerMeta:j,showVariableModal:x}=T;var L,y,I;const[w,O]=n(null),[k,R]=n(null),{variableList:B,disableEditVariable:A,originalVariableList:U,setOriginalVariableList:W}=s(),{processWebpushTemplate:F,isValidUrl:H}=p(),[D,G]=n(null),[P,S]=n(null),[N,$]=n(null);o((()=>{B&&F(E,B,U,A).then((e=>{let{templateVariableMapping:t,template:i,webpushBroadcastConfig:a}=e;O(t),null==W||W(t),null==V||V(Object.assign({},i)),R(a)}))}),[B,A]);const{descriptionComponents:K,bodyVariables:q,titleVariables:z}=l((()=>{if(w&&k){const e=m(k,w);return D||G(e.iconImage),P||S(e.bannerImage),N||$(e.redirectionLink),{descriptionComponents:e.descriptionComponents,bodyVariables:e.bodyVariables,titleVariables:e.titleVariables}}return{descriptionComponents:[],bodyVariables:[],titleVariables:[],iconImage:null,bannerImage:null}}),[w,k]),{uploadMediaLink:J,uploadMediaFiles:Q,validateMimeType:X}=j,Y=r(null),Z=b({uploadMediaLink:J,uploadMediaFiles:Q,updateTemplateImageUrl:e=>ee(e,"icon"),validateMimeType:X,mediaComponent:D,fileRef:Y}),_=b({uploadMediaLink:J,uploadMediaFiles:Q,updateTemplateImageUrl:e=>ee(e,"image"),validateMimeType:X,mediaComponent:P,fileRef:Y});function ee(e,t){const i=Object.assign({},E),n=a(i);"icon"===t?(n.webpushBroadcastConfig.icon=[e],G([e])):"image"===t&&(n.webpushBroadcastConfig.image=[e],S([e])),null==V||V(Object.assign({},n))}function te(e,t,i){var n;const o=Object.assign({},E),l=a(o),r="custom"===t&&"string"==typeof e,d=null===(n=null==l?void 0:l.webpushBroadcastConfig)||void 0===n?void 0:n.buttons;if(d&&d.length>0){d[i]=r?e:"string"!=typeof e?e.placeHolder:"";const t=Object.assign(Object.assign({},l.webpushBroadcastConfig),{buttons:d});l.webpushBroadcastConfig=t}null==V||V(l)}const ie=Z.openEditMedia?Z:_.openEditMedia?_:null;if(ie)return e(g,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e(u,{mediaComponentFormat:d.IMAGE,uploadMedia:ie.uploadMedia,variableListForImage:[],useEditWhatsappTemplateMediaResponse:ie,setOpenEditMedia:ie.setOpenEditMedia,openEditMedia:ie.openEditMedia,editIconRef:ie.editIconRef,fileRef:Y,skipAddVariable:!0})}));return t(g,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:"auto"}},{children:[D&&D.length?e(h,{children:e(c,{imageName:D,handleImageChange:Z.handleImageChange,mediaType:d.IMAGE,error:Z.error,isLoading:Z.loading,setOpenEditMedia:Z.setOpenEditMedia})}):null,P&&P.length?e(h,{children:e(c,{imageName:P,handleImageChange:_.handleImageChange,mediaType:d.IMAGE,error:_.error,isLoading:_.loading,setOpenEditMedia:_.setOpenEditMedia})}):null,(null==q?void 0:q.length)||(null==z?void 0:z.length)?e(M,{containerStyle:{paddingTop:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}):null,null==K?void 0:K.map(((t,i)=>e(f,{originalVariableList:w,type:t.type,descriptionComponent:t.component,showVariableModal:x},i))),N&&N.length?e("div",Object.assign({style:{padding:"16px 14px"}},{children:e(C,{labelText:"Redirection Link",id:"redirection-link",value:N[0].replace("https://",""),errorMessage:H(N[0])?"":"Please enter a valid URL",maxCharLimit:2e3,noKeyDownChange:!0,state:A?"disabled":"none",prefixText:"https://",placeholder:"Enter custom URL here",onChangeText:e=>{!function(e){var t;const i=`https://${e}`;$([i]);const n=a(E);(null===(t=n.webpushBroadcastConfig)||void 0===t?void 0:t.redirectionLink)&&(n.webpushBroadcastConfig.redirectionLink=[i]),null==V||V(Object.assign({},n))}(e)}})})):e(i,{}),(null===(y=null===(L=null==w?void 0:w.buttons)||void 0===L?void 0:L.filter((e=>"URL"===e.type)))||void 0===y?void 0:y.length)>0&&e(M,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(I=null==w?void 0:w.buttons)||void 0===I?void 0:I.map(((t,i)=>e(v,{variableListIndex:i,CTAoptions:null==j?void 0:j.CTAoptions,button:t,currentVariableList:w,updateSelectedURLTemplateBtn:te},`${i}`)))]}))};export{T as default};

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

@@ -24,6 +24,7 @@ export declare const getAllDataFromWebpushTemplateComponent: (mapping: WebpushTe
     titleVariables: string[];
     iconImage: string[];
     bannerImage: string[];
+    redirectionLink: string[];
     descriptionComponents: {
         type: string;
         component: any;

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

@@ -1 +1 @@
-const o=o=>{var e,n;const t=[],i=[],l=[],p=[],a=[];let s=null;return o.components.forEach(((o,e)=>{var n,p,a,d,r,m;if("BODY"===o.type&&o.text&&t.push({component:o,i:e,type:"BODY"}),"HEADER"===o.type&&"NONE"!==o.format&&"TEXT"!==o.format&&(null===(p=null===(n=o.example)||void 0===n?void 0:n.header_handle)||void 0===p?void 0:p[0])&&(s=o),"HEADER"===o.type&&"TEXT"===o.format&&t.push({component:o,i:e,type:"HEADER"}),"BUTTONS"===o.type){const n=null===(d=null===(a=o.buttons)||void 0===a?void 0:a.filter)||void 0===d?void 0:d.call(a,(o=>"URL"===o.type));i.push({component:Object.assign(Object.assign({},o),{buttons:n}),i:e});const t=null===(m=null===(r=o.buttons)||void 0===r?void 0:r.filter)||void 0===m?void 0:m.call(r,(o=>"QUICK_REPLY"===o.type));l.push({component:Object.assign(Object.assign({},o),{buttons:t}),i:e})}"limited_time_offer"===o.type&&t.push({component:o,i:e,type:"limited_time_offer"})})),o.mapping&&(null===(e=o.mapping.body)||void 0===e||e.forEach((o=>{p.push(o)}))),o.mapping&&(null===(n=o.mapping.header)||void 0===n||n.forEach((o=>{a.push(o)}))),{imageComponent:s,descriptionComponents:t,urlBtns:i,qrbBtns:l,bodyVariables:p,headerVariables:a}},e=(o,e)=>{var n,t,i,l;return{bodyVariables:(null===(n=null==o?void 0:o.body)||void 0===n?void 0:n.map((o=>o)))||[],titleVariables:(null===(t=null==o?void 0:o.title)||void 0===t?void 0:t.map((o=>o)))||[],iconImage:(null===(i=null==o?void 0:o.icon)||void 0===i?void 0:i.map((o=>o)))||[],bannerImage:(null===(l=null==o?void 0:o.image)||void 0===l?void 0:l.map((o=>o)))||[],descriptionComponents:Object.keys(e).map((o=>({type:o.toUpperCase(),component:Object.assign(Object.assign({},e[o]),{type:o.toUpperCase()})})))}};export{o as getAllDataFromTemplateComponent,e as getAllDataFromWebpushTemplateComponent};
+const o=o=>{var e,i;const n=[],t=[],l=[],p=[],a=[];let d=null;return o.components.forEach(((o,e)=>{var i,p,a,s,r,u;if("BODY"===o.type&&o.text&&n.push({component:o,i:e,type:"BODY"}),"HEADER"===o.type&&"NONE"!==o.format&&"TEXT"!==o.format&&(null===(p=null===(i=o.example)||void 0===i?void 0:i.header_handle)||void 0===p?void 0:p[0])&&(d=o),"HEADER"===o.type&&"TEXT"===o.format&&n.push({component:o,i:e,type:"HEADER"}),"BUTTONS"===o.type){const i=null===(s=null===(a=o.buttons)||void 0===a?void 0:a.filter)||void 0===s?void 0:s.call(a,(o=>"URL"===o.type));t.push({component:Object.assign(Object.assign({},o),{buttons:i}),i:e});const n=null===(u=null===(r=o.buttons)||void 0===r?void 0:r.filter)||void 0===u?void 0:u.call(r,(o=>"QUICK_REPLY"===o.type));l.push({component:Object.assign(Object.assign({},o),{buttons:n}),i:e})}"limited_time_offer"===o.type&&n.push({component:o,i:e,type:"limited_time_offer"})})),o.mapping&&(null===(e=o.mapping.body)||void 0===e||e.forEach((o=>{p.push(o)}))),o.mapping&&(null===(i=o.mapping.header)||void 0===i||i.forEach((o=>{a.push(o)}))),{imageComponent:d,descriptionComponents:n,urlBtns:t,qrbBtns:l,bodyVariables:p,headerVariables:a}},e=(o,e)=>{var i,n,t,l,p;return{bodyVariables:(null===(i=null==o?void 0:o.body)||void 0===i?void 0:i.map((o=>o)))||[],titleVariables:(null===(n=null==o?void 0:o.title)||void 0===n?void 0:n.map((o=>o)))||[],iconImage:(null===(t=null==o?void 0:o.icon)||void 0===t?void 0:t.map((o=>o)))||[],bannerImage:(null===(l=null==o?void 0:o.image)||void 0===l?void 0:l.map((o=>o)))||[],redirectionLink:(null===(p=null==o?void 0:o.redirectionLink)||void 0===p?void 0:p.map((o=>o)))||[],descriptionComponents:Object.keys(e).map((o=>({type:o.toUpperCase(),component:Object.assign(Object.assign({},e[o]),{type:o.toUpperCase()})})))}};export{o as getAllDataFromTemplateComponent,e as getAllDataFromWebpushTemplateComponent};

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

@@ -33,7 +33,8 @@ export declare enum WEB_PUSH_COMPONENT_TYPE {
     BODY = "body",
     ICON = "icon",
     IMAGE = "image",
-    BUTTONS = "buttons"
+    BUTTONS = "buttons",
+    redirectionLink = "redirectionLink"
 }
 export type WebpushComponentKeyType = {
     type: WEB_PUSH_COMPONENT_TYPE;
@@ -42,6 +43,10 @@ export type WebPushComponentType = {
     text: string;
     redirectionLink?: string;
     websiteLink?: string;
+    variables?: {
+        name: string;
+        value: string;
+    }[];
 };
 export type WebPushTemplateComponent = {
     [WEB_PUSH_COMPONENT_TYPE.TITLE]: string;
@@ -49,6 +54,7 @@ export type WebPushTemplateComponent = {
     [WEB_PUSH_COMPONENT_TYPE.ICON]: string;
     [WEB_PUSH_COMPONENT_TYPE.IMAGE]: string;
     [WEB_PUSH_COMPONENT_TYPE.BUTTONS]: WebPushComponentType[];
+    [WEB_PUSH_COMPONENT_TYPE.redirectionLink]?: string;
 };
 export interface WebpushTemplateVariables extends WhatsAppTemplateVariables {
     title: CUSTOM_VARIABLE[];

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

@@ -1 +1 @@
-var t;!function(t){t.TITLE="title",t.BODY="body",t.ICON="icon",t.IMAGE="image",t.BUTTONS="buttons"}(t||(t={}));export{t as WEB_PUSH_COMPONENT_TYPE};
+var i;!function(i){i.TITLE="title",i.BODY="body",i.ICON="icon",i.IMAGE="image",i.BUTTONS="buttons",i.redirectionLink="redirectionLink"}(i||(i={}));export{i as WEB_PUSH_COMPONENT_TYPE};

package/dist/esm/components/template-preview/webpush/WebpushPreview.js

@@ -1 +1 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import{WEB_PUSH_COMPONENT_TYPE as i}from"../models/WebpushTemplate.js";import{TemplateHelperUtils as n}from"../utils/TemplateHelperUtils.js";import{WebpushPreviewContainer as s}from"./WebpushPreview.styled.js";const a=a=>{var l,o,c,r,d,m;const{components:g,webpushBroadcastConfig:b}=a.template,h=(new n).parseJsonString(g),u="https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F4daae031-3902-4e58-a57c-32f29ea90812?alt=media&token=a7655ba9-6843-47df-91ba-422345e925c3",v=(e,t)=>{let i=0;return e?e.replace(/{{(.*?)}}/g,((e,n)=>{const s=n.trim();if(t&&t.length&&i<t.length){const e=t[i];return i++,e}return`{{${s}}}`})):""},p=v(h[i.TITLE],null==b?void 0:b.title),O=v(null!==(c=null!==(o=null===(l=h[i.BODY])||void 0===l?void 0:l.text)&&void 0!==o?o:h[i.BODY])&&void 0!==c?c:"",null==b?void 0:b.body);return e(s,Object.assign({style:Object.assign({},a.extraContainerCss)},{children:[e("div",Object.assign({className:"icon--header"},{children:[t("div",Object.assign({className:"icon-img-container"},{children:t("img",{src:(null===(r=null==b?void 0:b[i.ICON])||void 0===r?void 0:r.length)?b[i.ICON][0]:h[i.ICON]||u,alt:"icon-image"})})),e("div",Object.assign({className:"text--container"},{children:[t("div",{children:p}),t("div",Object.assign({style:{marginTop:3}},{children:O}))]}))]})),h[i.IMAGE]&&h[i.IMAGE].length&&t("div",Object.assign({className:"banner-img-container"},{children:t("img",{src:(null===(d=null==b?void 0:b[i.IMAGE])||void 0===d?void 0:d.length)?b[i.IMAGE][0]:null!==(m=h[i.IMAGE])&&void 0!==m?m:u,alt:"icon-image"})})),h[i.BUTTONS]&&h[i.BUTTONS].length&&t("div",Object.assign({className:"button-container "+(1===h[i.BUTTONS].length?"single-button":"")},{children:h[i.BUTTONS].map(((e,n)=>t("div",Object.assign({className:"each--btn",style:{flex:1===h[i.BUTTONS].length?"0 0 50%":"1"}},{children:t("div",Object.assign({className:"text-btn"},{children:e.text}))}),`webpush-buttons-${n}`)))}))]}))};export{a as default};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import{WEB_PUSH_COMPONENT_TYPE as i}from"../models/WebpushTemplate.js";import{TemplateHelperUtils as n}from"../utils/TemplateHelperUtils.js";import{WebpushPreviewContainer as s}from"./WebpushPreview.styled.js";const a=a=>{var l,o,c,r,d,m;const{components:g,webpushBroadcastConfig:b}=a.template,h=(new n).parseJsonString(g),u="https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F4daae031-3902-4e58-a57c-32f29ea90812?alt=media&token=a7655ba9-6843-47df-91ba-422345e925c3",v=(e,t)=>{let i=0;return e?e.replace(/{{(.*?)}}/g,((e,n)=>{const s=n.trim();if(t&&t.length&&i<t.length){const e=t[i];return i++,`${e} `}return`{{${s}}}`})):""},p=v(h[i.TITLE],null==b?void 0:b.title),O=v(null!==(c=null!==(o=null===(l=h[i.BODY])||void 0===l?void 0:l.text)&&void 0!==o?o:h[i.BODY])&&void 0!==c?c:"",null==b?void 0:b.body);return e(s,Object.assign({style:Object.assign({},a.extraContainerCss)},{children:[e("div",Object.assign({className:"icon--header"},{children:[t("div",Object.assign({className:"icon-img-container"},{children:t("img",{src:(null===(r=null==b?void 0:b[i.ICON])||void 0===r?void 0:r.length)?b[i.ICON][0]:h[i.ICON]||u,alt:"icon-image"})})),e("div",Object.assign({className:"text--container"},{children:[t("div",{children:p}),t("div",Object.assign({style:{marginTop:3}},{children:O}))]}))]})),h[i.IMAGE]&&h[i.IMAGE].length&&t("div",Object.assign({className:"banner-img-container"},{children:t("img",{src:(null===(d=null==b?void 0:b[i.IMAGE])||void 0===d?void 0:d.length)?b[i.IMAGE][0]:null!==(m=h[i.IMAGE])&&void 0!==m?m:u,alt:"icon-image"})})),h[i.BUTTONS]&&h[i.BUTTONS].length&&t("div",Object.assign({className:"button-container "+(1===h[i.BUTTONS].length?"single-button":"")},{children:h[i.BUTTONS].map(((e,n)=>t("div",Object.assign({className:"each--btn",style:{flex:1===h[i.BUTTONS].length?"0 0 50%":"1"}},{children:t("div",Object.assign({className:"text-btn"},{children:e.text}))}),`webpush-buttons-${n}`)))}))]}))};export{a as default};

package/package.json

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