@bikdotai/bik-component-library 0.0.570-beta-23 → 0.0.570-beta-24

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

@@ -56,6 +56,5 @@ export interface TemplateContextMapperProps {
     maxCharLimit?: number;
     onDefaultVariableSelect?: (variable: VariableV3) => void;
     skipDefaultVariableContent?: boolean;
-    originalTemplateVariables?: WebpushTemplateVariables;
 }
 export declare const TemplateContextMapper: ({ selectedTemplate, closeDialog, showVariableMapping, channel, htmlContent, templateVariables, onTemplateSelect, globalPlaceholders, showOnlyContent, whatsappSpecificPickerMeta, zIndex, showVariableModal, variableList: variableListFromProps, discountCode, setDiscountCode, onBackPress, enabledCustomText, variableListForImage, showSampleValues, disableEditVariable, pod, extras, pickerConf, selectedCarouselProducts, disableEditExpiry, cardWidth, onDeleteSelectedProducts, fileName, setFileName, hideDeviceContainerInPreview, maxCharLimit, onDefaultVariableSelect, skipDefaultVariableContent, }: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("lodash"),l=require("react"),a=require("../../utils/StringUtils.js"),o=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:f,whatsappSpecificPickerMeta:x,zIndex:g,showVariableModal:T,variableList:L,discountCode:I,setDiscountCode:V,onBackPress:j,enabledCustomText:y,variableListForImage:D,showSampleValues:H,disableEditVariable:N,pod:w,extras:A,pickerConf:k,selectedCarouselProducts:M,disableEditExpiry:O,cardWidth:B,onDeleteSelectedProducts:q,fileName:F,setFileName:_,hideDeviceContainerInPreview:W,maxCharLimit:Y,onDefaultVariableSelect:R,skipDefaultVariableContent:U}=p;var z,$,G,J,K,Q,X,Z;l.useEffect((()=>{ie(b)}),[b]);const ee=C===s.CHANNEL_TYPE.WHATSAPP&&"CAROUSEL"===(null===($=null===(z=null==v?void 0:v.components)||void 0===z?void 0:z[1])||void 0===$?void 0:$.type),te=null==v?void 0:v.isProductCarouselType,[le,ae]=l.useState(C===s.CHANNEL_TYPE.EMAIL||C==s.CHANNEL_TYPE.WEBPUSH||ee?"desktop":"mobile"),[oe,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,fe]=l.useState(!1),[xe,ge]=l.useState(null!=S?S:[]),[Te,Le]=l.useState(!1),[Ie,Ve]=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),[je,ye]=l.useState([]),[De,He]=l.useState(void 0),Ne=l.useRef(null),[we,Ae]=l.useState(!1),[ke,Me]=l.useState(!1),[Oe,Be]=l.useState(!1),[qe,Fe]=l.useState({}),[_e,We]=l.useState({});l.useEffect((()=>{M?ye(M):te&&ye([])}),[M]),l.useEffect((()=>{var e;if(!Pe&&te&&(!M||0===ye.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,a,o;"HEADER"===e.type&&l.push(null!==(o=null===(a=null===(t=e.example)||void 0===t?void 0:t.header_handle)||void 0===a?void 0:a[0])&&void 0!==o?o:"")}))})),be(l),fe(!0)}}),[Pe]);const Ye=l.useMemo((()=>c.convertPlaceholdersToBikDropdown(P)),[P]);return l.useEffect((()=>{He(t.cloneDeep(L))}),[L]),l.useEffect((()=>{C===s.CHANNEL_TYPE.WEBPUSH&&ge(t.cloneDeep(xe))}),[xe]),e.jsx(n.TemplateModalContext.Provider,Object.assign({value:{hideFooterButton:Oe,setHideFooterButton:Be,hideCrossButton:ke,setHideCrossButton:Me,variableList:De,setVariableList:He,variableCallback:Se,setVariableCallback:Ee,showVariablePicker:oe,setShowVariablePicker:re,template:me,setTemplate:he,device:le,setDevice:ae,display_content:se,setDisplayContent:ie,originalVariableList:xe,setOriginalVariableList:ge,isError:ne,setIsError:de,channel:C,globalNormalizedPlaceholders:Ye,templateSelectionTriggered:Te,setTemplateSelectionTriggered:Le,enabledCustomText:y,disableEditVariable:N,pod:w,extras:A,isWhatsappCarousel:ee,selectedCarouselIndex:Ie,setSelectedCarouselIndex:Ve,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:k,carouselProducts:je,setCarouselProducts:ye,disableEditExpiry:O,cardWidth:B,cardImages:Ce,onDeleteSelectedProducts:q,hideDeviceContainerInPreview:W,sliderRef:Ne,isCarouselHovered:we,setIsCarouselHovered:Ae,maxCharLimit:Y,ctaOptionsErrors:qe,setCtaOptionsErrors:Fe,onDefaultVariableSelect:R,originalTemplateVariables:_e,setOriginalTemplateVariables:We}},{children:f?e.jsx(u.default,{variableListFromProps:L,channel:s.CHANNEL_TYPE.EMAIL,hideHeader:!0}):e.jsxs(r.StyledModal,Object.assign({hideCrossButton:ke,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?`${a.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==j||j()},modalHeaderStyles:{borderBottom:`1px solid ${o.COLORS.stroke.primary}`}},{children:[e.jsx(u.default,{variableListFromProps:L,showSampleValues:H,showVariableMapping:h,channel:C,whatsappSpecificPickerMeta:x,showVariableModal:T,discountCode:I,setDiscountCode:V,variableListForImage:D&&(null==D?void 0:D.length)>0?D:De,fileName:F,setFileName:e=>{null==_||_(e)},skipDefaultVariableContent:U}),E?e.jsx(d.default,{isWhatsappCarousel:null!=ee&&ee,onSelect:function(){var e;if((null==je?void 0:je.length)<1&&te)return void de(!0);if(Object.keys(qe).length>0&&w!==i.POD.CHATBOT)return void de(!0);const t=null==E?void 0:E(me,xe,null!=se?se:"",je);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);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/context/templateModalContext.d.ts

@@ -7,7 +7,6 @@ import { CHANNEL_TYPE } from "../../template-preview/models/Channels";
 import { globalNormalizedPlaceholdersType } from "../../template-preview/models/TemplateMeta";
 import { AllTemplateTypes, AllTemplateVariables } from "../../template-preview/models/types";
 import { ExtrasWhatsapp } from "../../template-preview/models/WhatsAppTemplate";
-import { WebpushTemplateVariables } from "../../template-preview/models/WebpushTemplate";
 export type DEVICE_TYPES = 'desktop' | 'mobile';
 export declare const TemplateModalContext: React.Context<{
     hideFooterButton: boolean;
@@ -75,8 +74,6 @@ export declare const TemplateModalContext: React.Context<{
         [key: string]: string;
     }>> | undefined;
     onDefaultVariableSelect?: ((variable: VariableV3) => void) | undefined;
-    setOriginalTemplateVariables?: React.Dispatch<React.SetStateAction<WebpushTemplateVariables>> | undefined;
-    originalTemplateVariables?: WebpushTemplateVariables | undefined;
 }>;
 export declare const useTemplateModalContext: () => {
     hideFooterButton: boolean;
@@ -144,6 +141,4 @@ export declare const useTemplateModalContext: () => {
         [key: string]: string;
     }>> | undefined;
     onDefaultVariableSelect?: ((variable: VariableV3) => void) | undefined;
-    setOriginalTemplateVariables?: React.Dispatch<React.SetStateAction<WebpushTemplateVariables>> | undefined;
-    originalTemplateVariables?: WebpushTemplateVariables | undefined;
 };

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

@@ -1,10 +1,10 @@
 import { WebpushTemplateType } from "../../template-preview/models/WebpushTemplate";
 import { WhatsAppPickerMeta } from "../../template-preview/models/WhatsAppTemplate";
-export interface EditWhatsAppTemplateV2Props {
+export interface EditWebpushTemplateV2Props {
     whatsappSpecificPickerMeta?: WhatsAppPickerMeta;
     template: WebpushTemplateType;
     onTemplateChange?: (template: WebpushTemplateType) => void;
     showVariableModal?: boolean;
 }
-declare const EditWebpushTemplate: ({ template, onTemplateChange, whatsappSpecificPickerMeta, showVariableModal, }: EditWhatsAppTemplateV2Props) => import("react/jsx-runtime").JSX.Element;
+declare const EditWebpushTemplate: ({ template, onTemplateChange, whatsappSpecificPickerMeta, showVariableModal }: EditWebpushTemplateV2Props) => import("react/jsx-runtime").JSX.Element;
 export default EditWebpushTemplate;

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:q}=l.useTemplateModalContext(),{processWebpushTemplate:w}=n.default(),[O,A]=a.useState(null),[L,R]=a.useState(null);a.useEffect((()=>{I&&w(g,I,q).then((e=>{let{templateVariableMapping:t,template:a,webpushBroadcastConfig:i}=e;x(t),null==M||M(Object.assign({},a)),y(i)}))}),[I,q]);const{descriptionComponents:S,bodyVariables:W,titleVariables:D}=a.useMemo((()=>{if(v&&V){const e=o.getAllDataFromWebpushTemplateComponent(V,v);return O||A(e.iconImage),L||R(e.bannerImage),{descriptionComponents:e.descriptionComponents,bodyVariables:e.bodyVariables,titleVariables:e.titleVariables}}return{descriptionComponents:[],bodyVariables:[],titleVariables:[],iconImage:null,bannerImage:null}}),[v,V]),{uploadMediaLink:B,uploadMediaFiles:H,validateMimeType:F}=f,k=a.useRef(null),P=p.useEditWhatsappTemplateMedia({uploadMediaLink:B,uploadMediaFiles:H,updateTemplateImageUrl:e=>U(e,"icon"),validateMimeType:F,mediaComponent:O,fileRef:k}),_=p.useEditWhatsappTemplateMedia({uploadMediaLink:B,uploadMediaFiles:H,updateTemplateImageUrl:e=>U(e,"image"),validateMimeType:F,mediaComponent:L,fileRef:k});function U(e,a){const i=Object.assign({},g),l=t.cloneDeep(i);"icon"===a?(l.webpushBroadcastConfig.icon=[e],A([e])):"image"===a&&(l.webpushBroadcastConfig.image=[e],R([e])),null==M||M(Object.assign({},l))}function G(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 Y=P.openEditMedia?P:_.openEditMedia?_:null;return Y?e.jsx(u.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsx(s.default,{mediaComponentFormat:i.HEADER_TYPES.IMAGE,uploadMedia:Y.uploadMedia,variableListForImage:[],useEditWhatsappTemplateMediaResponse:Y,setOpenEditMedia:Y.setOpenEditMedia,openEditMedia:Y.openEditMedia,editIconRef:Y.editIconRef,fileRef:k,skipAddVariable:!0})})):e.jsxs(u.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:"auto"}},{children:[O&&O.length?e.jsx(r.EditTemplateMediaContainer,{children:e.jsx(d.default,{imageName:O,handleImageChange:P.handleImageChange,mediaType:i.HEADER_TYPES.IMAGE,error:P.error,isLoading:P.loading,setOpenEditMedia:P.setOpenEditMedia})}):null,L&&L.length?e.jsx(r.EditTemplateMediaContainer,{children:e.jsx(d.default,{imageName:L,handleImageChange:_.handleImageChange,mediaType:i.HEADER_TYPES.IMAGE,error:_.error,isLoading:_.loading,setOpenEditMedia:_.setOpenEditMedia})}):null,(null==W?void 0:W.length)||(null==D?void 0:D.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==S?void 0:S.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:G},`${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"),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,setOriginalVariableList:q}=l.useTemplateModalContext(),{processWebpushTemplate:w}=n.default(),[A,L]=a.useState(null),[R,S]=a.useState(null);a.useEffect((()=>{I&&w(g,I,O).then((e=>{let{templateVariableMapping:t,template:a,webpushBroadcastConfig:i}=e;x(t),null==q||q(t),null==M||M(Object.assign({},a)),y(i)}))}),[I,O]);const{descriptionComponents:W,bodyVariables:D,titleVariables:B}=a.useMemo((()=>{if(v&&V){const e=o.getAllDataFromWebpushTemplateComponent(V,v);return A||L(e.iconImage),R||S(e.bannerImage),{descriptionComponents:e.descriptionComponents,bodyVariables:e.bodyVariables,titleVariables:e.titleVariables}}return{descriptionComponents:[],bodyVariables:[],titleVariables:[],iconImage:null,bannerImage:null}}),[v,V]),{uploadMediaLink:H,uploadMediaFiles:F,validateMimeType:k}=f,P=a.useRef(null),_=p.useEditWhatsappTemplateMedia({uploadMediaLink:H,uploadMediaFiles:F,updateTemplateImageUrl:e=>G(e,"icon"),validateMimeType:k,mediaComponent:A,fileRef:P}),U=p.useEditWhatsappTemplateMedia({uploadMediaLink:H,uploadMediaFiles:F,updateTemplateImageUrl:e=>G(e,"image"),validateMimeType:k,mediaComponent:R,fileRef:P});function G(e,a){const i=Object.assign({},g),l=t.cloneDeep(i);"icon"===a?(l.webpushBroadcastConfig.icon=[e],L([e])):"image"===a&&(l.webpushBroadcastConfig.image=[e],S([e])),null==M||M(Object.assign({},l))}function Y(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 N=_.openEditMedia?_:U.openEditMedia?U:null;return N?e.jsx(u.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsx(s.default,{mediaComponentFormat:i.HEADER_TYPES.IMAGE,uploadMedia:N.uploadMedia,variableListForImage:[],useEditWhatsappTemplateMediaResponse:N,setOpenEditMedia:N.setOpenEditMedia,openEditMedia:N.openEditMedia,editIconRef:N.editIconRef,fileRef:P,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:_.handleImageChange,mediaType:i.HEADER_TYPES.IMAGE,error:_.error,isLoading:_.loading,setOpenEditMedia:_.setOpenEditMedia})}):null,R&&R.length?e.jsx(r.EditTemplateMediaContainer,{children:e.jsx(d.default,{imageName:R,handleImageChange:U.handleImageChange,mediaType:i.HEADER_TYPES.IMAGE,error:U.error,isLoading:U.loading,setOpenEditMedia:U.setOpenEditMedia})}):null,(null==D?void 0:D.length)||(null==B?void 0:B.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==W?void 0:W.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:Y},`${a}`)))]}))};

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

@@ -56,6 +56,5 @@ export interface TemplateContextMapperProps {
     maxCharLimit?: number;
     onDefaultVariableSelect?: (variable: VariableV3) => void;
     skipDefaultVariableContent?: boolean;
-    originalTemplateVariables?: WebpushTemplateVariables;
 }
 export declare const TemplateContextMapper: ({ selectedTemplate, closeDialog, showVariableMapping, channel, htmlContent, templateVariables, onTemplateSelect, globalPlaceholders, showOnlyContent, whatsappSpecificPickerMeta, zIndex, showVariableModal, variableList: variableListFromProps, discountCode, setDiscountCode, onBackPress, enabledCustomText, variableListForImage, showSampleValues, disableEditVariable, pod, extras, pickerConf, selectedCarouselProducts, disableEditExpiry, cardWidth, onDeleteSelectedProducts, fileName, setFileName, hideDeviceContainerInPreview, maxCharLimit, onDefaultVariableSelect, skipDefaultVariableContent, }: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;

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:g,closeDialog:f,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:B,enabledCustomText:H,variableListForImage:M,showSampleValues:A,disableEditVariable:O,pod:F,extras:W,pickerConf:N,selectedCarouselProducts:U,disableEditExpiry:z,cardWidth:R,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==g?void 0:g.components)||void 0===X?void 0:X[1])||void 0===Y?void 0:Y.type),ae=null==g?void 0:g.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,ge]=i({}),[fe,Pe]=i(g),[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==fe?void 0:fe.mapping)||void 0===Z?void 0:Z.body)||void 0===ee?void 0:ee.length)?-1:0:-1),[Be,He]=i([]),[Me,Ae]=i(void 0),Oe=a(null),[Fe,We]=i(!1),[Ne,Ue]=i(!1),[ze,Re]=i(!1),[$e,_e]=i({}),[qe,Ge]=i({});r((()=>{U?He(U):ae&&He([])}),[U]),r((()=>{var e;if(!Te&&ae&&(!U||0===He.length)){const l=null===(e=null==fe?void 0:fe.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 Je=s((()=>b(T)),[T]);return r((()=>{Ae(t(L))}),[L]),r((()=>{x===c.WEBPUSH&&we(t(ye))}),[ye]),e(m.Provider,Object.assign({value:{hideFooterButton:ze,setHideFooterButton:Re,hideCrossButton:Ne,setHideCrossButton:Ue,variableList:Me,setVariableList:Ae,variableCallback:Se,setVariableCallback:Ie,showVariablePicker:de,setShowVariablePicker:ue,template:fe,setTemplate:Pe,device:se,setDevice:ne,display_content:ce,setDisplayContent:pe,originalVariableList:ye,setOriginalVariableList:we,isError:me,setIsError:ve,channel:x,globalNormalizedPlaceholders:Je,templateSelectionTriggered:ke,setTemplateSelectionTriggered:Le,enabledCustomText:H,disableEditVariable:O,pod:F,extras:W,isWhatsappCarousel:ie,selectedCarouselIndex:De,setSelectedCarouselIndex:je,isProductCarouselType:ae,templateErrorIndexes:Ce,cardCount:ie?null===(oe=null===(le=g.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:Be,setCarouselProducts:He,disableEditExpiry:z,cardWidth:R,cardImages:xe,onDeleteSelectedProducts:$,hideDeviceContainerInPreview:G,sliderRef:Oe,isCarouselHovered:Fe,setIsCarouselHovered:We,maxCharLimit:J,ctaOptionsErrors:$e,setCtaOptionsErrors:_e,onDefaultVariableSelect:K,originalTemplateVariables:qe,setOriginalTemplateVariables:Ge}},{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==f||f()},headingTitle:null==fe?void 0:fe.label,headingSubtitle:x===c.WHATSAPP?`${n.capitaliseFirstLetterOfString(null!==(te=null==fe?void 0:fe.category)&&void 0!==te?te:"")} • ${null!==(re=null==fe?void 0:fe.templateCategory)&&void 0!==re?re:""}`:"",onBackPress:()=>{null==B||B()},modalHeaderStyles:{borderBottom:`1px solid ${d.stroke.primary}`}},{children:[e(h,{variableListFromProps:L,showSampleValues:A,showVariableMapping:P,channel:x,whatsappSpecificPickerMeta:y,showVariableModal:k,discountCode:D,setDiscountCode:j,variableListForImage:M&&(null==M?void 0:M.length)>0?M:Me,fileName:_,setFileName:e=>{null==q||q(e)},skipDefaultVariableContent:Q}),I?e(v,{isWhatsappCarousel:null!=ie&&ie,onSelect:function(){var e;if((null==Be?void 0:Be.length)<1&&ae)return void ve(!0);if(Object.keys($e).length>0&&F!==p.CHATBOT)return void ve(!0);const l=null==I?void 0:I(fe,ye,null!=ce?ce:"",Be);ge(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);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/context/templateModalContext.d.ts

@@ -7,7 +7,6 @@ import { CHANNEL_TYPE } from "../../template-preview/models/Channels";
 import { globalNormalizedPlaceholdersType } from "../../template-preview/models/TemplateMeta";
 import { AllTemplateTypes, AllTemplateVariables } from "../../template-preview/models/types";
 import { ExtrasWhatsapp } from "../../template-preview/models/WhatsAppTemplate";
-import { WebpushTemplateVariables } from "../../template-preview/models/WebpushTemplate";
 export type DEVICE_TYPES = 'desktop' | 'mobile';
 export declare const TemplateModalContext: React.Context<{
     hideFooterButton: boolean;
@@ -75,8 +74,6 @@ export declare const TemplateModalContext: React.Context<{
         [key: string]: string;
     }>> | undefined;
     onDefaultVariableSelect?: ((variable: VariableV3) => void) | undefined;
-    setOriginalTemplateVariables?: React.Dispatch<React.SetStateAction<WebpushTemplateVariables>> | undefined;
-    originalTemplateVariables?: WebpushTemplateVariables | undefined;
 }>;
 export declare const useTemplateModalContext: () => {
     hideFooterButton: boolean;
@@ -144,6 +141,4 @@ export declare const useTemplateModalContext: () => {
         [key: string]: string;
     }>> | undefined;
     onDefaultVariableSelect?: ((variable: VariableV3) => void) | undefined;
-    setOriginalTemplateVariables?: React.Dispatch<React.SetStateAction<WebpushTemplateVariables>> | undefined;
-    originalTemplateVariables?: WebpushTemplateVariables | undefined;
 };

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

@@ -1,10 +1,10 @@
 import { WebpushTemplateType } from "../../template-preview/models/WebpushTemplate";
 import { WhatsAppPickerMeta } from "../../template-preview/models/WhatsAppTemplate";
-export interface EditWhatsAppTemplateV2Props {
+export interface EditWebpushTemplateV2Props {
     whatsappSpecificPickerMeta?: WhatsAppPickerMeta;
     template: WebpushTemplateType;
     onTemplateChange?: (template: WebpushTemplateType) => void;
     showVariableModal?: boolean;
 }
-declare const EditWebpushTemplate: ({ template, onTemplateChange, whatsappSpecificPickerMeta, showVariableModal, }: EditWhatsAppTemplateV2Props) => import("react/jsx-runtime").JSX.Element;
+declare const EditWebpushTemplate: ({ template, onTemplateChange, whatsappSpecificPickerMeta, showVariableModal }: EditWebpushTemplateV2Props) => import("react/jsx-runtime").JSX.Element;
 export default EditWebpushTemplate;

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 h}from"./VariableConnectorsPanel.js";import g 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}=r(),{processWebpushTemplate:R}=s(),[W,k]=a(null),[F,H]=a(null);o((()=>{A&&R(C,A,B).then((e=>{let{templateVariableMapping:t,template:i,webpushBroadcastConfig:a}=e;x(t),null==T||T(Object.assign({},i)),L(a)}))}),[A,B]);const{descriptionComponents:U,bodyVariables:D,titleVariables:G}=n((()=>{if(w&&O){const e=p(O,w);return W||k(e.iconImage),F||H(e.bannerImage),{descriptionComponents:e.descriptionComponents,bodyVariables:e.bodyVariables,titleVariables:e.titleVariables}}return{descriptionComponents:[],bodyVariables:[],titleVariables:[],iconImage:null,bannerImage:null}}),[w,O]),{uploadMediaLink:S,uploadMediaFiles:N,validateMimeType:P}=E,$=l(null),q=b({uploadMediaLink:S,uploadMediaFiles:N,updateTemplateImageUrl:e=>J(e,"icon"),validateMimeType:P,mediaComponent:W,fileRef:$}),z=b({uploadMediaLink:S,uploadMediaFiles:N,updateTemplateImageUrl:e=>J(e,"image"),validateMimeType:P,mediaComponent:F,fileRef:$});function J(e,t){const a=Object.assign({},C),o=i(a);"icon"===t?(o.webpushBroadcastConfig.icon=[e],k([e])):"image"===t&&(o.webpushBroadcastConfig.image=[e],H([e])),null==T||T(Object.assign({},o))}function K(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 Q=q.openEditMedia?q:z.openEditMedia?z:null;return Q?e(h,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e(m,{mediaComponentFormat:d.IMAGE,uploadMedia:Q.uploadMedia,variableListForImage:[],useEditWhatsappTemplateMediaResponse:Q,setOpenEditMedia:Q.setOpenEditMedia,openEditMedia:Q.openEditMedia,editIconRef:Q.editIconRef,fileRef:$,skipAddVariable:!0})})):t(h,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:"auto"}},{children:[W&&W.length?e(c,{children:e(u,{imageName:W,handleImageChange:q.handleImageChange,mediaType:d.IMAGE,error:q.error,isLoading:q.loading,setOpenEditMedia:q.setOpenEditMedia})}):null,F&&F.length?e(c,{children:e(u,{imageName:F,handleImageChange:z.handleImageChange,mediaType:d.IMAGE,error:z.error,isLoading:z.loading,setOpenEditMedia:z.setOpenEditMedia})}):null,(null==D?void 0:D.length)||(null==G?void 0:G.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==U?void 0:U.map(((t,i)=>e(g,{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:K},`${i}`)))]}))};export{v as default};
+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 h}from"./VariableConnectorsPanel.js";import g 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,setOriginalVariableList:R}=r(),{processWebpushTemplate:W}=s(),[k,F]=a(null),[H,U]=a(null);o((()=>{A&&W(C,A,B).then((e=>{let{templateVariableMapping:t,template:i,webpushBroadcastConfig:a}=e;x(t),null==R||R(t),null==T||T(Object.assign({},i)),L(a)}))}),[A,B]);const{descriptionComponents:D,bodyVariables:G,titleVariables:S}=n((()=>{if(w&&O){const e=p(O,w);return k||F(e.iconImage),H||U(e.bannerImage),{descriptionComponents:e.descriptionComponents,bodyVariables:e.bodyVariables,titleVariables:e.titleVariables}}return{descriptionComponents:[],bodyVariables:[],titleVariables:[],iconImage:null,bannerImage:null}}),[w,O]),{uploadMediaLink:N,uploadMediaFiles:P,validateMimeType:$}=E,q=l(null),z=b({uploadMediaLink:N,uploadMediaFiles:P,updateTemplateImageUrl:e=>K(e,"icon"),validateMimeType:$,mediaComponent:k,fileRef:q}),J=b({uploadMediaLink:N,uploadMediaFiles:P,updateTemplateImageUrl:e=>K(e,"image"),validateMimeType:$,mediaComponent:H,fileRef:q});function K(e,t){const a=Object.assign({},C),o=i(a);"icon"===t?(o.webpushBroadcastConfig.icon=[e],F([e])):"image"===t&&(o.webpushBroadcastConfig.image=[e],U([e])),null==T||T(Object.assign({},o))}function Q(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 X=z.openEditMedia?z:J.openEditMedia?J:null;return X?e(h,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e(m,{mediaComponentFormat:d.IMAGE,uploadMedia:X.uploadMedia,variableListForImage:[],useEditWhatsappTemplateMediaResponse:X,setOpenEditMedia:X.setOpenEditMedia,openEditMedia:X.openEditMedia,editIconRef:X.editIconRef,fileRef:q,skipAddVariable:!0})})):t(h,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:"auto"}},{children:[k&&k.length?e(c,{children:e(u,{imageName:k,handleImageChange:z.handleImageChange,mediaType:d.IMAGE,error:z.error,isLoading:z.loading,setOpenEditMedia:z.setOpenEditMedia})}):null,H&&H.length?e(c,{children:e(u,{imageName:H,handleImageChange:J.handleImageChange,mediaType:d.IMAGE,error:J.error,isLoading:J.loading,setOpenEditMedia:J.setOpenEditMedia})}):null,(null==G?void 0:G.length)||(null==S?void 0:S.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==D?void 0:D.map(((t,i)=>e(g,{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:Q},`${i}`)))]}))};export{v as default};

package/package.json

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