@bikdotai/bik-component-library 0.0.734-beta.3 → 0.0.735-beta.1

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

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

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

@@ -1,6 +1,6 @@
-export * from './TemplateContextMapper';
-export * from './utils/getDataFromTemplateComponent';
-export * from './utils/validateIsUrl';
-export * from './helpers/WebpushTemplateHelper';
-export * from './modalElements/TemplateAnalyticsSkeleton';
-export * from './modalElements/TemplateAnalyticsComponent';
+export * from './TemplateContextMapper';
+export * from './utils/getDataFromTemplateComponent';
+export * from './utils/validateIsUrl';
+export * from './helpers/WebpushTemplateHelper';
+export * from './modalElements/TemplateAnalyticsSkeleton';
+export * from './modalElements/TemplateAnalyticsComponent';

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

@@ -1,4 +1,4 @@
-export declare const BackTrackComponent: (props: {
-    backTrackMessage?: string | undefined;
-    setBackTrackMessage?: ((backTrackMessage: string) => void) | undefined;
-}) => import("react/jsx-runtime").JSX.Element;
+export declare const BackTrackComponent: (props: {
+    backTrackMessage?: string;
+    setBackTrackMessage?: (backTrackMessage: string) => void;
+}) => import("react/jsx-runtime").JSX.Element;

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

@@ -1 +1 @@
-import{jsxs as e,Fragment as r,jsx as t}from"react/jsx-runtime";import{useState as i}from"react";import{CheckBox as a}from"../../checkBox/CheckBox.js";import{Input as n}from"../../input/Input.js";import{TitleSmall as s}from"../../TypographyStyle.js";const c=c=>{const{backTrackMessage:o,setBackTrackMessage:l}=c,[p,m]=i(!!o);return e(r,{children:[e("div",Object.assign({style:{display:"flex",flexDirection:"row",marginLeft:10,marginTop:8,width:"300px",padding:"20px 0px"}},{children:[t(a,{isChecked:p,onValueChange:()=>{p&&l&&l(""),m(!p)}}),t(s,Object.assign({style:{marginLeft:8}},{children:"Prevent BackTracking"}))]})),p&&t("div",Object.assign({style:{margin:10}},{children:t(n,{type:"multiline",placeholder:"Enter your text here",labelText:"Message if user tries backtracking",onChangeText:e=>{l&&l(e)},height:"120px",maxCharLimit:1024,value:o,noErrorHint:!0,validate:e=>[!0,""]})}))]})};export{c as BackTrackComponent};
+import{jsxs as e,Fragment as r,jsx as t}from"react/jsx-runtime";import{useState as i}from"react";import{CheckBox as a}from"../../checkBox/CheckBox.js";import{Input as n}from"../../input/Input.js";import{TitleSmall as o}from"../../TypographyStyle.js";const c=c=>{const{backTrackMessage:l,setBackTrackMessage:s}=c,[p,m]=i(!!l);return e(r,{children:[e("div",{style:{display:"flex",flexDirection:"row",marginLeft:10,marginTop:8,width:"300px",padding:"20px 0px"},children:[t(a,{isChecked:p,onValueChange:()=>{p&&s&&s(""),m(!p)}}),t(o,{style:{marginLeft:8},children:"Prevent BackTracking"})]}),p&&t("div",{style:{margin:10},children:t(n,{type:"multiline",placeholder:"Enter your text here",labelText:"Message if user tries backtracking",onChangeText:e=>{s&&s(e)},height:"120px",maxCharLimit:1024,value:l,noErrorHint:!0,validate:e=>[!0,""]})})]})};export{c as BackTrackComponent};

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

@@ -1,18 +1,18 @@
-import type { VariableListInterfaceV2 } from "../../add-variableV2/AddVariableV2";
-import type { WhatsAppPickerMeta } from "../../template-preview/models/WhatsAppTemplate";
-export interface BodyProps {
-    showVariableMapping: boolean;
-    showOnlyContent?: boolean;
-    whatsappSpecificPickerMeta?: WhatsAppPickerMeta;
-    showVariableModal?: boolean;
-    variableListForImage?: VariableListInterfaceV2[];
-    discountCode?: string;
-    setDiscountCode?: (code: string) => void;
-    showSampleValues?: boolean;
-    fileName?: string;
-    setFileName?: (name: string) => void;
-    variableListFromProps?: VariableListInterfaceV2[];
-    skipDefaultVariableContent?: boolean;
-}
-declare const Body: (props: BodyProps) => import("react/jsx-runtime").JSX.Element;
-export default Body;
+import { VariableListInterfaceV2 } from '@src/components/add-variableV2/AddVariableV2';
+import { WhatsAppPickerMeta } from '@src/components/template-preview/models/WhatsAppTemplate';
+export interface BodyProps {
+    showVariableMapping: boolean;
+    showOnlyContent?: boolean;
+    whatsappSpecificPickerMeta?: WhatsAppPickerMeta;
+    showVariableModal?: boolean;
+    variableListForImage?: VariableListInterfaceV2[];
+    discountCode?: string;
+    setDiscountCode?: (code: string) => void;
+    showSampleValues?: boolean;
+    fileName?: string;
+    setFileName?: (name: string) => void;
+    variableListFromProps?: VariableListInterfaceV2[];
+    skipDefaultVariableContent?: boolean;
+}
+declare const Body: (props: BodyProps) => import("react/jsx-runtime").JSX.Element;
+export default Body;

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

@@ -1,22 +1,22 @@
-import{jsxs as e,jsx as t,Fragment as a}from"react/jsx-runtime";import"../../curtain/CurtainHelper.js";import{PickerType as i}from"../../variable-picker-v3/model.js";import o from"lodash/cloneDeep";import{useRef as l}from"react";import n from"styled-components";import{CarouselPreview as r}from"../../carousel-preview/CarouselPreview.js";import s from"./EditWhatsAppCarouselTemplateV2.js";import{TemplatePreview as p}from"../../template-preview/TemplatePreview.js";import{CHANNEL_TYPE as c}from"../../template-preview/models/Channels.js";import{BodySecondary as d}from"../../TypographyStyle.js";import{VariablePicker as m}from"../../variable-picker-v3/VariablePicker.js";import{COLORS as h}from"../../../constants/Theme.js";import{useTemplateModalContext as u}from"../context/templateModalContext.js";import{BACKGROUND_PREVIEW_IMAGE as w}from"../utils/constants.js";import{getVariableNameForEmailByIndex as f}from"../utils/getVariableNameEmail.js";import{highlightFor as v}from"../utils/highlightFor.js";import b from"./DesktopPreview.js";import C from"./EditWebpushTemplate.js";import g from"./EditWhatsAppTemplateV2.js";import P from"./MobilePreview.js";import S from"./VariableConnectorsPanel.js";const x=n.div`
+import{jsxs as e,jsx as t,Fragment as a}from"react/jsx-runtime";import"../../curtain/CurtainHelper.js";import{PickerType as i}from"../../variable-picker-v3/model.js";import{cloneDeep as o}from"lodash";import{useRef as l}from"react";import r from"styled-components";import{CarouselPreview as n}from"../../carousel-preview/CarouselPreview.js";import s from"./EditWhatsAppCarouselTemplateV2.js";import{TemplatePreview as p}from"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import{COLORS as m}from"../../../constants/Theme.js";import"../../template-preview/models/TemplateMeta.js";import"../../template-preview/models/WhatsAppTemplate.js";import{CHANNEL_TYPE as d}from"../../template-preview/models/Channels.js";import{BodySecondary as c}from"../../TypographyStyle.js";import{VariablePicker as h}from"../../variable-picker-v3/VariablePicker.js";import{useTemplateModalContext as u}from"../context/templateModalContext.js";import{BACKGROUND_PREVIEW_IMAGE as w}from"../utils/constants.js";import{getVariableNameForEmailByIndex as v}from"../utils/getVariableNameEmail.js";import{highlightFor as f}from"../utils/highlightFor.js";import b from"./DesktopPreview.js";import C from"./EditWebpushTemplate.js";import P from"./EditWhatsAppTemplateV2.js";import g from"./MobilePreview.js";import S from"./VariableConnectorsPanel.js";const k=r.div`
 	display: flex;
 	//	height: 100%;
-`,y=n.div`
+`,x=r.div`
 	max-width: 450px;
-	max-width: ${e=>e.channel===c.EMAIL?"400px":"450px"};
+	max-width: ${e=>e.channel===d.EMAIL?"400px":"450px"};
 
-	height: ${e=>e.channel===c.WHATSAPP?"500px":"475px"};
+	height: ${e=>e.channel===d.WHATSAPP?"500px":"475px"};
 	overflow-y: auto;
 	padding-bottom: 24px;
-	border-left: ${h.stroke.primary} 1px solid;
-	border-top: ${e=>e.isWhatsappCarousel?`${h.stroke.primary} 1px solid`:void 0};
+	border-left: ${m.stroke.primary} 1px solid;
+	border-top: ${e=>e.isWhatsappCarousel?`${m.stroke.primary} 1px solid`:void 0};
 	${e=>!e.showVariableMapping&&"width: 340px; height: 500px"};
-`,k=n.div`
+`,y=r.div`
 	padding: ${e=>e.isWhatsappCarousel?void 0:e.showOnlyContent?"16px 14px":"16px 32px"};
 	flex: 1;
 	height: ${e=>e.isWhatsappCarousel||e.hideDeviceContainerInPreview?"500px":"475px"};
 	overflow-y: auto;
-	background-image: ${e=>e.hideDeviceContainerInPreview&&e.channel===c.WHATSAPP?`url(${w});`:"none"};
-	display: ${e=>!e.hideDeviceContainerInPreview||e.channel!==c.WHATSAPP&&e.channel!==c.RCS?"initial":"flex"};
+	background-image: ${e=>e.hideDeviceContainerInPreview&&e.channel===d.WHATSAPP?`url(${w});`:"none"};
+	display: ${e=>!e.hideDeviceContainerInPreview||e.channel!==d.WHATSAPP&&e.channel!==d.RCS?"initial":"flex"};
 	align-items: flex-start;
-`,V=n=>{const{showVariableMapping:w,showOnlyContent:V,whatsappSpecificPickerMeta:j,showVariableModal:M,discountCode:A,setDiscountCode:W,variableListForImage:T,showSampleValues:D,variableListFromProps:E,fileName:I,setFileName:H,skipDefaultVariableContent:$}=n,B=l(),L=l(),{variableList:F,setVariableList:O,variableCallback:_,showVariablePicker:N,setShowVariablePicker:R,device:U,display_content:G,channel:q,template:z,setTemplate:J,isWhatsappCarousel:K,isProductCarouselType:Q,hideDeviceContainerInPreview:X,onDefaultVariableSelect:Y}=u();const Z=e=>{let t=0;for(;e;)t+=e.offsetTop,e=e.offsetParent;return t};return e(x,{children:[t(k,Object.assign({showOnlyContent:V,showVariableMapping:w,isWhatsappCarousel:K,hideDeviceContainerInPreview:X,channel:q,skipDefaultVariableContent:$},{children:"mobile"===U?t(P,{ref:L,display_content:null!=G?G:"",channel:q,template:z,showSampleValues:D}):q!==c.WHATSAPP&&q!==c.RCS||!K?q===c.WEBPUSH?t(p,{showSampleValues:D,channel:q,hideHeader:!0,template:z}):q!==c.MESSAGE?t(b,{ref:B,channel:q,display_content:null!=G?G:"",showSampleValues:D}):t(a,{}):t(r,{ref:B,channel:q,template:z,showSampleValues:D,isPreview:!1,showArrows:!0})})),(Q||w)&&e(y,Object.assign({channel:q,isWhatsappCarousel:K,showVariableMapping:!0},{children:[t("div",Object.assign({style:{height:"100%",width:"whatsapp"===q?428:400,display:N?"block":"none"}},{children:t(m,{hideHeaderCross:!0,showHeader:!0,showBackButton:!0,onBackButtonClick:()=>{O(o(E)),R(!1)},onSelect:e=>{_(e),O(o(E)),R(!1)},type:i.EMBEDDED,data:null!=F?F:[],onDefaultVariableSelect:Y,skipDefaultVariableContent:$},Math.random())})),t("div",Object.assign({style:{padding:"16px 14px",width:"whatsapp"===q||"webpush"==q||"rcs"==q?428:400,display:N?"none":"block"}},{children:q!==c.WHATSAPP&&q!==(null==c?void 0:c.RCS)?q==c.WEBPUSH?t(C,{whatsappSpecificPickerMeta:j,template:z,onTemplateChange:e=>{null==J||J(e)},showVariableModal:M}):t(S,{onFocus:q===c.EMAIL?function(e){var t,a,i;const o=null===document||void 0===document?void 0:document.getElementById("mobile"===U?"template_html_mobile":"template_html_desktop"),l=f(e+1),n=q===c.EMAIL?null===(t=null==o?void 0:o.contentWindow)||void 0===t?void 0:t.document.getElementById(l):document.getElementById(l),r=Z(n),s=null==n?void 0:n.offsetLeft;"desktop"===U?r&&B.current&&(null===(a=null==o?void 0:o.contentWindow)||void 0===a||a.scrollTo(null!=s?s:0,r),v(l,h.background.warning.light,2,q,U)):r&&L.current&&(null===(i=null==o?void 0:o.contentWindow)||void 0===i||i.scrollTo(null!=s?s:0,r),v(l,h.background.warning.light,2,q,U))}:void 0,showVariableModal:M,discountCode:A,setDiscountCode:W}):q!==c.WHATSAPP&&q!==c.RCS||!K?t(g,{whatsappSpecificPickerMeta:j,template:z,onTemplateChange:e=>{null==J||J(e)},showVariableModal:M,variableListForImage:T,discountCode:A,setDiscountCode:W,fileName:I,setFileName:H}):t(s,{whatsappSpecificPickerMeta:j,template:z,showVariableModal:M,variableListForImage:T,discountCode:A,setDiscountCode:W})}))]})),[c.WHATSAPP,c.SMS].includes(q)&&!w&&!Q&&t(y,{children:t(d,Object.assign({color:h.content.secondary,style:{fontStyle:"italic"}},{children:"Click on ‘Select template’ below to use it"}))})]})};export{V as default};
+`,V=r=>{const{showVariableMapping:w,showOnlyContent:V,whatsappSpecificPickerMeta:A,showVariableModal:W,discountCode:j,setDiscountCode:M,variableListForImage:T,showSampleValues:D,variableListFromProps:E,fileName:I,setFileName:H,skipDefaultVariableContent:L}=r,$=l(),B=l(),{variableList:F,setVariableList:_,variableCallback:N,showVariablePicker:R,setShowVariablePicker:O,device:U,display_content:G,channel:q,template:z,setTemplate:J,isWhatsappCarousel:K,isProductCarouselType:Q,hideDeviceContainerInPreview:X,onDefaultVariableSelect:Y}=u();const Z=e=>{let t=0;for(;e;)t+=e.offsetTop,e=e.offsetParent;return t};return e(k,{children:[t(y,{showOnlyContent:V,showVariableMapping:w,isWhatsappCarousel:K,hideDeviceContainerInPreview:X,channel:q,skipDefaultVariableContent:L,children:"mobile"===U?t(g,{ref:B,display_content:null!=G?G:"",channel:q,template:z,showSampleValues:D}):q!==d.WHATSAPP&&q!==d.RCS||!K?q===d.WEBPUSH?t(p,{showSampleValues:D,channel:q,hideHeader:!0,template:z}):q!==d.MESSAGE?t(b,{ref:$,channel:q,display_content:null!=G?G:"",showSampleValues:D}):t(a,{}):t(n,{ref:$,channel:q,template:z,showSampleValues:D,isPreview:!1,showArrows:!0})}),(Q||w)&&e(x,{channel:q,isWhatsappCarousel:K,showVariableMapping:!0,children:[t("div",{style:{height:"100%",width:"whatsapp"===q?428:400,display:R?"block":"none"},children:t(h,{hideHeaderCross:!0,showHeader:!0,showBackButton:!0,onBackButtonClick:()=>{_(o(E)),O(!1)},onSelect:e=>{N(e),_(o(E)),O(!1)},type:i.EMBEDDED,data:null!=F?F:[],onDefaultVariableSelect:Y,skipDefaultVariableContent:L},Math.random())}),t("div",{style:{padding:"16px 14px",width:"whatsapp"===q||"webpush"==q||"rcs"==q?428:400,display:R?"none":"block"},children:q!==d.WHATSAPP&&q!==(null==d?void 0:d.RCS)?q==d.WEBPUSH?t(C,{whatsappSpecificPickerMeta:A,template:z,onTemplateChange:e=>{null==J||J(e)},showVariableModal:W}):t(S,{onFocus:q===d.EMAIL?function(e){var t,a,i;const o=null===document||void 0===document?void 0:document.getElementById("mobile"===U?"template_html_mobile":"template_html_desktop"),l=v(e+1),r=q===d.EMAIL?null===(t=null==o?void 0:o.contentWindow)||void 0===t?void 0:t.document.getElementById(l):document.getElementById(l),n=Z(r),s=null==r?void 0:r.offsetLeft;"desktop"===U?n&&$.current&&(null===(a=null==o?void 0:o.contentWindow)||void 0===a||a.scrollTo(null!=s?s:0,n),f(l,m.background.warning.light,2,q,U)):n&&B.current&&(null===(i=null==o?void 0:o.contentWindow)||void 0===i||i.scrollTo(null!=s?s:0,n),f(l,m.background.warning.light,2,q,U))}:void 0,showVariableModal:W,discountCode:j,setDiscountCode:M}):q!==d.WHATSAPP&&q!==d.RCS||!K?t(P,{whatsappSpecificPickerMeta:A,template:z,onTemplateChange:e=>{null==J||J(e)},showVariableModal:W,variableListForImage:T,discountCode:j,setDiscountCode:M,fileName:I,setFileName:H}):t(s,{whatsappSpecificPickerMeta:A,template:z,showVariableModal:W,variableListForImage:T,discountCode:j,setDiscountCode:M})})]}),[d.WHATSAPP,d.SMS].includes(q)&&!w&&!Q&&t(x,{children:t(c,{color:m.content.secondary,style:{fontStyle:"italic"},children:"Click on ‘Select template’ below to use it"})})]})};export{V as default};

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

@@ -1,8 +1,8 @@
-import React from 'react';
-import { CHANNEL_TYPE } from "../../template-preview/models/Channels";
-declare const DesktopPreview: React.ForwardRefExoticComponent<{
-    display_content: string;
-    channel: CHANNEL_TYPE;
-    showSampleValues?: boolean | undefined;
-} & React.RefAttributes<HTMLDivElement>>;
-export default DesktopPreview;
+import React from 'react';
+import { CHANNEL_TYPE } from '@src/components/template-preview/models/Channels';
+declare const DesktopPreview: React.ForwardRefExoticComponent<{
+    display_content: string;
+    channel: CHANNEL_TYPE;
+    showSampleValues?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+export default DesktopPreview;

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

@@ -1,20 +1,20 @@
-import{jsxs as e,jsx as r}from"react/jsx-runtime";import t from"react";import i from"styled-components";import{Spinner as o}from"../../spinner/Spinner.js";import{TemplatePreview as a}from"../../template-preview/TemplatePreview.js";import{CHANNEL_TYPE as d}from"../../template-preview/models/Channels.js";import{COLORS as p}from"../../../constants/Theme.js";const s=i.div`
-	background: ${p.surface.standard};
-	border: 1px solid ${p.stroke.primary};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import r from"react";import i from"styled-components";import{Spinner as p}from"../../spinner/Spinner.js";import{TemplatePreview as o}from"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import{COLORS as a}from"../../../constants/Theme.js";import"../../curtain/CurtainHelper.js";import"../../variable-picker-v3/model.js";import"../../template-preview/models/TemplateMeta.js";import"../../template-preview/models/WhatsAppTemplate.js";import{CHANNEL_TYPE as m}from"../../template-preview/models/Channels.js";const l=i.div`
+	background: ${a.surface.standard};
+	border: 1px solid ${a.stroke.primary};
 	border-radius: 8px;
 	overflow-y: auto;
 	/* max-height: 420px; */
 	scroll-behavior: smooth;
 	height: 100%;
-`,l=i.div`
+`,s=i.div`
 	padding: 18px 24px 12px;
 	display: flex;
 	gap: 4px;
 	border-bottom-width: 1px;
-	border-bottom-color: ${p.stroke.primary};
-`,m=i.div`
+	border-bottom-color: ${a.stroke.primary};
+`,d=i.div`
 	width: 6px;
 	height: 6px;
 	background: #d9d9d9;
 	border-radius: 3px;
-`,n=t.forwardRef(((t,i)=>{let{display_content:p,showSampleValues:n}=t;return e(s,Object.assign({ref:i},{children:[e(l,{children:[r(m,{}),r(m,{}),r(m,{})]}),r("div",{children:p?r(a,{showSampleValues:n,channel:d.EMAIL,hideHeader:!0,emailSpecificMeta:{emailDisplayContent:p,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_desktop",containerStyle:{height:441},templateContainerStyles:{height:"100%"}},hidePointerEvents:!0}):r("div",Object.assign({style:{padding:20}},{children:r(o,{size:"small"})}))})]}))}));n.displayName="DesktopPreview";export{n as default};
+`,n=r.forwardRef(((r,i)=>{let{display_content:a,showSampleValues:n}=r;return e(l,{ref:i,children:[e(s,{children:[t(d,{}),t(d,{}),t(d,{})]}),t("div",{children:a?t(o,{showSampleValues:n,channel:m.EMAIL,hideHeader:!0,emailSpecificMeta:{emailDisplayContent:a,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_desktop",containerStyle:{height:441},templateContainerStyles:{height:"100%"}},hidePointerEvents:!0}):t("div",{style:{padding:20},children:t(p,{size:"small"})})})]})}));n.displayName="DesktopPreview";export{n as default};

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

@@ -1,4 +1,4 @@
-export declare const DiscountCodeComponent: (props: {
-    discountCode?: string | undefined;
-    setDiscountCode?: ((code: string) => void) | undefined;
-}) => import("react/jsx-runtime").JSX.Element;
+export declare const DiscountCodeComponent: (props: {
+    discountCode?: string;
+    setDiscountCode?: (code: string) => void;
+}) => import("react/jsx-runtime").JSX.Element;

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

@@ -1 +1 @@
-import{jsxs as e,Fragment as r,jsx as o}from"react/jsx-runtime";import t from"../../../assets/icons/PlusIcon.js";import{useState as i,useRef as a,useEffect as n}from"react";import{CheckBox as s}from"../../checkBox/CheckBox.js";import{Input as c}from"../../input/Input.js";import{TitleSmall as l}from"../../TypographyStyle.js";import{useTemplateModalContext as d}from"../context/templateModalContext.js";import{AddVariableStyled as m}from"./VariableConnectorsPanel.js";const u=u=>{const{discountCode:h,setDiscountCode:p}=u,[g,f]=i(""),[j,b]=i(!!h),[v,C]=i(!1),{setVariableCallback:x,setShowVariablePicker:y}=d(),V=a(),k=a();n((()=>{p&&g&&p(h+g)}),[g]);const O=e=>{f(e.actualValue)};return e(r,{children:[e("div",Object.assign({style:{display:"flex",flexDirection:"row",marginLeft:10,marginTop:8}},{children:[o(s,{isChecked:j,onValueChange:()=>{j&&p&&(p(""),f("")),b(!j)}}),o(l,Object.assign({style:{marginLeft:8}},{children:"Add discount code"}))]})),j&&e("div",Object.assign({ref:V,style:{margin:10}},{children:[o(c,{placeholder:"Enter your discount code",onChangeText:e=>{p&&p(e)},value:h,onFocus:()=>{C(!0)},onBlur:e=>{var r;"addVar"===(null===(r=e.relatedTarget)||void 0===r?void 0:r.id)?(V.current&&V.current.focus(),C(!0)):C(!1)},noErrorHint:!0,validate:e=>[!0,""]}),v&&o(m,Object.assign({ref:k,id:"addVar",onClick:e=>{e.stopPropagation(),x((()=>O)),y(!0)}},{children:e("div",Object.assign({className:"add"},{children:[o(t,{width:14,height:14,color:"white"}),o("div",Object.assign({className:"variable"},{children:"Add variable"}))]}))}))]}))]})};export{u as DiscountCodeComponent};
+import{jsxs as e,Fragment as r,jsx as o}from"react/jsx-runtime";import t from"../../../assets/icons/PlusIcon.js";import{useState as i,useRef as a,useEffect as n}from"react";import{CheckBox as l}from"../../checkBox/CheckBox.js";import{Input as c}from"../../input/Input.js";import{TitleSmall as d}from"../../TypographyStyle.js";import{useTemplateModalContext as s}from"../context/templateModalContext.js";import{AddVariableStyled as m}from"./VariableConnectorsPanel.js";const u=u=>{const{discountCode:h,setDiscountCode:p}=u,[f,v]=i(""),[g,C]=i(!!h),[x,y]=i(!1),{setVariableCallback:j,setShowVariablePicker:V}=s(),b=a(),k=a();n((()=>{p&&f&&p(h+f)}),[f]);const w=e=>{v(e.actualValue)};return e(r,{children:[e("div",{style:{display:"flex",flexDirection:"row",marginLeft:10,marginTop:8},children:[o(l,{isChecked:g,onValueChange:()=>{g&&p&&(p(""),v("")),C(!g)}}),o(d,{style:{marginLeft:8},children:"Add discount code"})]}),g&&e("div",{ref:b,style:{margin:10},children:[o(c,{placeholder:"Enter your discount code",onChangeText:e=>{p&&p(e)},value:h,onFocus:()=>{y(!0)},onBlur:e=>{var r;"addVar"===(null===(r=e.relatedTarget)||void 0===r?void 0:r.id)?(b.current&&b.current.focus(),y(!0)):y(!1)},noErrorHint:!0,validate:e=>[!0,""]}),x&&o(m,{ref:k,id:"addVar",onClick:e=>{e.stopPropagation(),j((()=>w)),V(!0)},children:e("div",{className:"add",children:[o(t,{width:14,height:14,color:"white"}),o("div",{className:"variable",children:"Add variable"})]})})]})]})};export{u as DiscountCodeComponent};

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

@@ -1,17 +1,17 @@
-import React from 'react';
-import type { VariableListInterfaceV2 } from "../../add-variableV2/AddVariableV2";
-import { HEADER_TYPES } from "../../template-preview/models/TemplateMeta";
-import type { UseEditWhatsappTemplateMediaResponse } from './useEditWhtasappTemplateMedia';
-interface EditMediaModalProps {
-    setOpenEditMedia: React.Dispatch<React.SetStateAction<boolean>>;
-    openEditMedia: boolean;
-    mediaComponentFormat: HEADER_TYPES;
-    variableListForImage: VariableListInterfaceV2[];
-    uploadMedia: (urlOrVariable?: string) => void;
-    editIconRef: React.MutableRefObject<HTMLDivElement | null>;
-    fileRef: React.MutableRefObject<HTMLInputElement | null>;
-    useEditWhatsappTemplateMediaResponse: UseEditWhatsappTemplateMediaResponse;
-    skipAddVariable?: boolean;
-}
-declare const EditMediaModal: React.FC<EditMediaModalProps>;
-export default EditMediaModal;
+import React from 'react';
+import { VariableListInterfaceV2 } from '@src/components/add-variableV2';
+import { HEADER_TYPES } from '@src/components/template-preview';
+import { UseEditWhatsappTemplateMediaResponse } from './useEditWhtasappTemplateMedia';
+interface EditMediaModalProps {
+    setOpenEditMedia: React.Dispatch<React.SetStateAction<boolean>>;
+    openEditMedia: boolean;
+    mediaComponentFormat: HEADER_TYPES;
+    variableListForImage: VariableListInterfaceV2[];
+    uploadMedia: (urlOrVariable?: string) => void;
+    editIconRef: React.MutableRefObject<HTMLDivElement | null>;
+    fileRef: React.MutableRefObject<HTMLInputElement | null>;
+    useEditWhatsappTemplateMediaResponse: UseEditWhatsappTemplateMediaResponse;
+    skipAddVariable?: boolean;
+}
+declare const EditMediaModal: React.FC<EditMediaModalProps>;
+export default EditMediaModal;

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

@@ -1 +1 @@
-import{jsx as e,Fragment as t,jsxs as o}from"react/jsx-runtime";import i from"../../../assets/icons/arrow_back.svg.js";import a from"../../../assets/icons/info.svg.js";import"../../curtain/CurtainHelper.js";import{PickerType as r}from"../../variable-picker-v3/model.js";import{useState as s,useEffect as n}from"react";import{Button as l}from"../../button/Button.js";import{BikImageCropper as d}from"../../image-cropper/BikImageCropper.js";import{InputWithVariables as p}from"../../input-with-vars/InputWithVariables.js";import{PureSpinner as c}from"../../spinner/Spinner.js";import{HEADER_TYPES as m}from"../../template-preview/models/TemplateMeta.js";import{POD as g}from"../../template-preview/models/WhatsAppTemplate.js";import{TitleRegular as h,TitleMedium as u,BodySecondary as f,BodyCaption as b}from"../../TypographyStyle.js";import{validateURL as v}from"../../../utils/validator.js";import{DEFAULT_THEME as y,COLORS as x}from"../../../constants/Theme.js";import j from"../../../assets/icons/file.svg.js";import I from"../../../assets/icons/filePdf.svg.js";import C from"../../../assets/icons/image.svg.js";import M from"../../../assets/icons/upload.svg.js";import{useTemplateModalContext as E}from"../context/templateModalContext.js";import{isVariable as k}from"../utils/validateIsUrl.js";const w=w=>{let{setOpenEditMedia:O,mediaComponentFormat:V,variableListForImage:T,openEditMedia:A,uploadMedia:B,fileRef:D,useEditWhatsappTemplateMediaResponse:U,skipAddVariable:G}=w;const{pod:L,setHideCrossButton:P,setHideFooterButton:R}=E(),[H,S]=s(""),[$,W]=s(void 0),[F,N]=s(!1),[q,z]=s("");let J;if(n((()=>(R(!0),()=>{R(!1)})),[]),n((()=>{const e=document.querySelector('[class*="ModalWrapper"]');e&&W(e)}),[U.loading]),J=V===m.IMAGE?"image/png, image/jpeg":V===m.VIDEO?"video/mp4":"application/pdf",!A)return e(t,{});const Y=()=>V===m.IMAGE?"Image":V===m.VIDEO?"Video":"Document";return o(t,{children:[o("div",Object.assign({style:{display:"flex",gap:"10px",alignItems:"center",marginBottom:"16px"}},{children:[e(i,{onClick:e=>{e.stopPropagation(),O(!1),S("")},style:{cursor:"pointer"},width:16,height:16}),e(h,{children:"Update Media"})]})),o("div",Object.assign({style:{position:"relative",padding:16,borderRadius:4,border:F?`1px dashed ${y.colorsV2.stroke.negative.vibrant}`:`1px dashed ${y.colorsV2.stroke.primary}`,backgroundColor:y.colorsV2.surface.subdued,width:"100%",height:"100%",alignItems:"center",display:U.loading?"flex":"initial"}},{children:[o("div",Object.assign({style:{marginBottom:24,display:"flex",justifyContent:"center",flexDirection:"column",alignItems:"center",gap:16}},{children:[U.loading?e(c,{width:"40px",height:"40px",color:x.content.brand}):e("div",Object.assign({style:{height:64,width:64,borderRadius:"100%",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:y.colorsV2.background.base}},{children:V===m.IMAGE?e(C,{width:40,height:40}):V===m.VIDEO?e(j,{width:40,height:40}):e(I,{width:40,height:40})})),e(u,{children:U.loading?"Upload in progress...":V===m.IMAGE?"Upload an image":V===m.VIDEO?"Upload a video":"Upload a document"}),e(f,Object.assign({color:x.content.secondary},{children:U.loading?`Your ${V.toLowerCase()} is getting loaded. This may take a couple of minutes.`:V===m.IMAGE?"JPEG/ PNG format • Max 5MB":V===m.VIDEO?"MP4 format video • Max 16MB":"PDF format document • Max 100MB"}))]})),!U.loading&&o(t,{children:[e("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"6px"}},{children:e(p,{labelText:`${Y()} URL`,onPickerToggle:e=>{P(!!e)},pickerType:r.EMBEDDED,portalElement:null!=$?$:document.body,noMaxCharCheck:!0,allowMix:!1,onChange:e=>{z(e.actualValue),N(!1)},showVarHeader:!0,varHeaderText:"Select variable",errorMessage:H,prevVariable:{actualValue:"",variableType:"string"},variablesList:T,placeHolder:G?"Enter URL":"Enter URL/Add variable",showAddButton:L!==g.CAMPAIGN||!G&&V===m.IMAGE})})),o("div",Object.assign({style:{display:"flex",alignItems:"center",justifyContent:"space-between",gap:"4px",marginBottom:"12px"}},{children:[e("hr",{style:{height:"2px",flex:.5,backgroundColor:"black"}}),e(b,{children:"Or upload media from device"}),e("hr",{style:{height:"2px",flex:.5,backgroundColor:"black"}})]})),e("div",Object.assign({style:{display:"flex",width:"100%"}},{children:e(l,{matchParentWidth:!0,buttonText:"Upload",buttonType:"dashBold",LeadingIcon:M,onClick:()=>{B(),N(!1)},size:"medium"})}))]}),F&&o("div",Object.assign({style:{position:"absolute",display:"flex",alignItems:"center",bottom:-24,left:0,gap:4}},{children:[e(a,{width:16,height:16,color:x.content.negative}),e(b,Object.assign({style:{color:x.content.negative}},{children:`Select ${Y()}`}))]}))]})),!U.loading&&e("div",Object.assign({style:{display:"flex",justifyContent:"flex-end",marginTop:8}},{children:e(l,{buttonText:`Add ${Y()}`,onClick:()=>{q?v(q)||k(q)?(B(q),O(!1),S(""),N(!1)):S("Enter valid URL"):N(!0)}})})),e("input",{ref:D,style:{display:"none"},type:"file",onChange:U.handleImageUpload,accept:J}),!!U.selectedImage&&e(d,{aspectRatio:15/8,src:U.selectedImage,onCropComplete:U.onCropComplete,onCancel:()=>{U.setLoading(!1),U.setSelectedImage(""),D.current&&(D.current.value="")}})]})};export{w as default};
+import{jsx as e,Fragment as t,jsxs as o}from"react/jsx-runtime";import i from"../../../assets/icons/arrow_back.svg.js";import a from"../../../assets/icons/info.svg.js";import"../../curtain/CurtainHelper.js";import{PickerType as r}from"../../variable-picker-v3/model.js";import{useState as s,useEffect as l}from"react";import{Button as n}from"../../button/Button.js";import{BikImageCropper as p}from"../../image-cropper/BikImageCropper.js";import"../../image-compress/ImageCompress.js";import"../../states/StateComponent.js";import"../../../_virtual/_tslib.js";import"../../../constants/zindex.js";import"../../modals/styledModal.js";import{PureSpinner as d}from"../../spinner/Spinner.js";import{InputWithVariables as m}from"../../input-with-vars/InputWithVariables.js";import"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import{DEFAULT_THEME as c,COLORS as g}from"../../../constants/Theme.js";import{HEADER_TYPES as h}from"../../template-preview/models/TemplateMeta.js";import{POD as u}from"../../template-preview/models/WhatsAppTemplate.js";import"../../template-preview/models/Channels.js";import{TitleRegular as f,TitleMedium as v,BodySecondary as y,BodyCaption as x}from"../../TypographyStyle.js";import{validateURL as b}from"../../../utils/validator.js";import j from"../../../assets/icons/file.svg.js";import C from"../../../assets/icons/filePdf.svg.js";import I from"../../../assets/icons/image.svg.js";import M from"../../../assets/icons/upload.svg.js";import{useTemplateModalContext as w}from"../context/templateModalContext.js";import{isVariable as k}from"../utils/validateIsUrl.js";const E=E=>{let{setOpenEditMedia:A,mediaComponentFormat:V,variableListForImage:T,openEditMedia:B,uploadMedia:D,fileRef:P,useEditWhatsappTemplateMediaResponse:U,skipAddVariable:L}=E;const{pod:G,setHideCrossButton:R,setHideFooterButton:W}=w(),[O,S]=s(""),[H,$]=s(void 0),[F,_]=s(!1),[z,N]=s("");let q;if(l((()=>(W(!0),()=>{W(!1)})),[]),l((()=>{const e=document.querySelector('[class*="ModalWrapper"]');e&&$(e)}),[U.loading]),q=V===h.IMAGE?"image/png, image/jpeg":V===h.VIDEO?"video/mp4":"application/pdf",!B)return e(t,{});const J=()=>V===h.IMAGE?"Image":V===h.VIDEO?"Video":"Document";return o(t,{children:[o("div",{style:{display:"flex",gap:"10px",alignItems:"center",marginBottom:"16px"},children:[e(i,{onClick:e=>{e.stopPropagation(),A(!1),S("")},style:{cursor:"pointer"},width:16,height:16}),e(f,{children:"Update Media"})]}),o("div",{style:{position:"relative",padding:16,borderRadius:4,border:F?`1px dashed ${c.colorsV2.stroke.negative.vibrant}`:`1px dashed ${c.colorsV2.stroke.primary}`,backgroundColor:c.colorsV2.surface.subdued,width:"100%",height:"100%",alignItems:"center",display:U.loading?"flex":"initial"},children:[o("div",{style:{marginBottom:24,display:"flex",justifyContent:"center",flexDirection:"column",alignItems:"center",gap:16},children:[U.loading?e(d,{width:"40px",height:"40px",color:g.content.brand}):e("div",{style:{height:64,width:64,borderRadius:"100%",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:c.colorsV2.background.base},children:V===h.IMAGE?e(I,{width:40,height:40}):V===h.VIDEO?e(j,{width:40,height:40}):e(C,{width:40,height:40})}),e(v,{children:U.loading?"Upload in progress...":V===h.IMAGE?"Upload an image":V===h.VIDEO?"Upload a video":"Upload a document"}),e(y,{color:g.content.secondary,children:U.loading?`Your ${V.toLowerCase()} is getting loaded. This may take a couple of minutes.`:V===h.IMAGE?"JPEG/ PNG format • Max 5MB":V===h.VIDEO?"MP4 format video • Max 16MB":"PDF format document • Max 100MB"})]}),!U.loading&&o(t,{children:[e("div",{style:{display:"flex",flexDirection:"column",gap:"6px"},children:e(m,{labelText:`${J()} URL`,onPickerToggle:e=>{R(!!e)},pickerType:r.EMBEDDED,portalElement:null!=H?H:document.body,noMaxCharCheck:!0,allowMix:!1,onChange:e=>{N(e.actualValue),_(!1)},showVarHeader:!0,varHeaderText:"Select variable",errorMessage:O,prevVariable:{actualValue:"",variableType:"string"},variablesList:T,placeHolder:L?"Enter URL":"Enter URL/Add variable",showAddButton:G!==u.CAMPAIGN||!L&&V===h.IMAGE})}),o("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",gap:"4px",marginBottom:"12px"},children:[e("hr",{style:{height:"2px",flex:.5,backgroundColor:"black"}}),e(x,{children:"Or upload media from device"}),e("hr",{style:{height:"2px",flex:.5,backgroundColor:"black"}})]}),e("div",{style:{display:"flex",width:"100%"},children:e(n,{matchParentWidth:!0,buttonText:"Upload",buttonType:"dashBold",LeadingIcon:M,onClick:()=>{D(),_(!1)},size:"medium"})})]}),F&&o("div",{style:{position:"absolute",display:"flex",alignItems:"center",bottom:-24,left:0,gap:4},children:[e(a,{width:16,height:16,color:g.content.negative}),e(x,{style:{color:g.content.negative},children:`Select ${J()}`})]})]}),!U.loading&&e("div",{style:{display:"flex",justifyContent:"flex-end",marginTop:8},children:e(n,{buttonText:`Add ${J()}`,onClick:()=>{z?b(z)||k(z)?(D(z),A(!1),S(""),_(!1)):S("Enter valid URL"):_(!0)}})}),e("input",{ref:P,style:{display:"none"},type:"file",onChange:U.handleImageUpload,accept:q}),!!U.selectedImage&&e(p,{aspectRatio:15/8,src:U.selectedImage,onCropComplete:U.onCropComplete,onCancel:()=>{U.setLoading(!1),U.setSelectedImage(""),P.current&&(P.current.value="")}})]})};export{E as default};

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

@@ -1,14 +1,13 @@
-/// <reference types="react" />
-import { HEADER_TYPES } from "../../template-preview/models/TemplateMeta";
-export interface EditMediaV2Props {
-    imageName: string[];
-    selectedVariable?: string;
-    errorSecondaryText?: string;
-    error?: string;
-    isLoading?: boolean;
-    mediaType?: HEADER_TYPES;
-    handleImageChange?: () => void;
-    setOpenEditMedia?: React.Dispatch<React.SetStateAction<boolean>>;
-}
-declare const EditMediaV2: (props: EditMediaV2Props) => import("react/jsx-runtime").JSX.Element;
-export default EditMediaV2;
+import { HEADER_TYPES } from '@src/components/template-preview/models/TemplateMeta';
+export interface EditMediaV2Props {
+    imageName: string[];
+    selectedVariable?: string;
+    errorSecondaryText?: string;
+    error?: string;
+    isLoading?: boolean;
+    mediaType?: HEADER_TYPES;
+    handleImageChange?: () => void;
+    setOpenEditMedia?: React.Dispatch<React.SetStateAction<boolean>>;
+}
+declare const EditMediaV2: (props: EditMediaV2Props) => import("react/jsx-runtime").JSX.Element;
+export default EditMediaV2;

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

@@ -1,4 +1,4 @@
-import{jsxs as e,jsx as i,Fragment as t}from"react/jsx-runtime";import o from"../../../assets/icons/broken_media_image.svg.js";import r from"../../../assets/icons/document_pdf.svg.js";import s from"../../../assets/icons/edit.svg.js";import n from"../../../assets/icons/refresh.svg.js";import l from"styled-components";import{ShimmerImage as a}from"../../shimmer-image/ShimmerImage.js";import{Spinner as d}from"../../spinner/Spinner.js";import{HEADER_TYPES as c}from"../../template-preview/models/TemplateMeta.js";import{BodyCaption as m,BodySecondary as p,Caption as g}from"../../TypographyStyle.js";import h from"../../../utils/StringUtils.js";import{COLORS as f}from"../../../constants/Theme.js";import{useTemplateModalContext as b}from"../context/templateModalContext.js";import{Container as j,ImageContainer as y,RightComponent as u}from"./EditMediaV2.style.js";const v=l.div`
+import{jsxs as e,jsx as i,Fragment as t}from"react/jsx-runtime";import o from"../../../assets/icons/broken_media_image.svg.js";import r from"../../../assets/icons/document_pdf.svg.js";import l from"../../../assets/icons/edit.svg.js";import s from"../../../assets/icons/refresh.svg.js";import n from"styled-components";import{ShimmerImage as a}from"../../shimmer-image/ShimmerImage.js";import{Spinner as d}from"../../spinner/Spinner.js";import{HEADER_TYPES as m}from"../../template-preview/models/TemplateMeta.js";import{BodyCaption as c,BodySecondary as p,Caption as h}from"../../TypographyStyle.js";import g from"../../../utils/StringUtils.js";import{COLORS as f}from"../../../constants/Theme.js";import{useTemplateModalContext as y}from"../context/templateModalContext.js";import{Container as u,ImageContainer as v,RightComponent as b}from"./EditMediaV2.style.js";const j=n.div`
 	padding-left: 14px;
 	padding-right: 6px;
 	height: 100%;
@@ -6,4 +6,4 @@ import{jsxs as e,jsx as i,Fragment as t}from"react/jsx-runtime";import o from"..
 	cursor: pointer;
 	display: flex;
 	align-items: center;
-`,x=l=>{const{imageName:x,error:w,isLoading:O,mediaType:k,selectedVariable:L,setOpenEditMedia:C}=l,E=null==x?void 0:x[0].split("/"),M=null==E?void 0:E[E.length-1],{disableEditVariable:S}=b();return e(j,{children:[i(y,Object.assign({error:!!w,onClick:()=>null==C?void 0:C(!0)},{children:w?i(o,{width:56,height:56}):O?i(d,{size:"small"}):L?i(a,{imageUrl:"https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F629bff40-6405-4514-9203-029bca59a7b0?alt=media&token=228e2231-176e-46d8-b29f-532d72592f51",width:56,height:56}):k===c.IMAGE?i(a,{imageUrl:null==x?void 0:x[0],width:56,height:56}):k===c.VIDEO?i("video",Object.assign({src:x[0],style:{width:56,height:56}},{children:i("track",{default:!0,kind:"captions",srcLang:"en",src:x[0]})})):i(r,{width:18,height:22,color:f.content.placeholder})})),e(u,{children:[i("div",Object.assign({style:{flex:w?"unset":1}},{children:x&&w?i(t,{}):O?i(m,Object.assign({style:{marginLeft:8}},{children:"Your media is getting loaded..."})):i(p,Object.assign({style:{color:f.content.primary,marginLeft:8}},{children:L||h.toCapitilize(null==k?void 0:k.toLowerCase())||M}))})),!!w&&e("div",Object.assign({style:{display:"flex",flexDirection:"column",marginLeft:8,gap:"2px"}},{children:[e(p,Object.assign({style:{color:f.content.negative}},{children:["Error loading this ",null==k?void 0:k.toLowerCase(),". Retry"]})),i(g,Object.assign({style:{color:f.content.secondary}},{children:w}))]}))]}),!S&&!O&&i(v,Object.assign({onClick:()=>null==C?void 0:C(!0),onKeyDown:()=>null==C?void 0:C(!0),role:"presentation"},{children:w?i(n,{color:f.content.brand,width:24,height:24}):i(s,{width:24,height:24,color:f.content.placeholder})}))]})};export{x as default};
+`,x=n=>{const{imageName:x,error:w,isLoading:k,mediaType:L,selectedVariable:C,setOpenEditMedia:E}=n,M=null==x?void 0:x[0].split("/"),S=null==M?void 0:M[M.length-1],{disableEditVariable:T}=y();return e(u,{children:[i(v,{error:!!w,onClick:()=>null==E?void 0:E(!0),children:w?i(o,{width:56,height:56}):k?i(d,{size:"small"}):C?i(a,{imageUrl:"https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F629bff40-6405-4514-9203-029bca59a7b0?alt=media&token=228e2231-176e-46d8-b29f-532d72592f51",width:56,height:56}):L===m.IMAGE?i(a,{imageUrl:null==x?void 0:x[0],width:56,height:56}):L===m.VIDEO?i("video",{src:x[0],style:{width:56,height:56},children:i("track",{default:!0,kind:"captions",srcLang:"en",src:x[0]})}):i(r,{width:18,height:22,color:f.content.placeholder})}),e(b,{children:[i("div",{style:{flex:w?"unset":1},children:x&&w?i(t,{}):k?i(c,{style:{marginLeft:8},children:"Your media is getting loaded..."}):i(p,{style:{color:f.content.primary,marginLeft:8},children:C||g.toCapitilize(null==L?void 0:L.toLowerCase())||S})}),!!w&&e("div",{style:{display:"flex",flexDirection:"column",marginLeft:8,gap:"2px"},children:[e(p,{style:{color:f.content.negative},children:["Error loading this ",null==L?void 0:L.toLowerCase(),". Retry"]}),i(h,{style:{color:f.content.secondary},children:w})]})]}),!T&&!k&&i(j,{onClick:()=>null==E?void 0:E(!0),onKeyDown:()=>null==E?void 0:E(!0),role:"presentation",children:w?i(s,{color:f.content.brand,width:24,height:24}):i(l,{width:24,height:24,color:f.content.placeholder})})]})};export{x as default};

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

@@ -1,6 +1,6 @@
-export declare const RightComponent: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const ImageContainer: import("styled-components").StyledComponent<"div", any, {
-    error: boolean;
-}, never>;
-export declare const Container: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const EditTemplateMediaContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const RightComponent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const ImageContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    error: boolean;
+}>> & string;
+export declare const Container: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const EditTemplateMediaContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

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

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

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

@@ -1,13 +1,24 @@
-import type { VariableListInterfaceV2 } from "../../add-variableV2/AddVariableV2";
-import type { WhatsAppCarouselTemplate } from "../../template-preview/models/WhatsappCarouselTemplate";
-import { type WhatsAppPickerMeta } from "../../template-preview/models/WhatsAppTemplate";
-export interface EditWhatsAppCarouselTemplateV2Props {
-    whatsappSpecificPickerMeta?: WhatsAppPickerMeta;
-    template: WhatsAppCarouselTemplate;
-    showVariableModal?: boolean;
-    variableListForImage?: VariableListInterfaceV2[];
-    discountCode?: string;
-    setDiscountCode?: (code: string) => void;
-}
-declare const EditWhatsAppCarouselTemplateV2: ({ template, whatsappSpecificPickerMeta, showVariableModal, variableListForImage, discountCode, setDiscountCode, }: EditWhatsAppCarouselTemplateV2Props) => import("react/jsx-runtime").JSX.Element;
-export default EditWhatsAppCarouselTemplateV2;
+import { VariableListInterfaceV2 } from '@src/components/add-variableV2';
+import { WhatsAppPickerMeta } from '@src/components/template-preview';
+import { WhatsAppCarouselTemplate } from '@src/components/template-preview/models/WhatsappCarouselTemplate';
+export interface EditWhatsAppCarouselTemplateV2Props {
+    whatsappSpecificPickerMeta?: WhatsAppPickerMeta;
+    template: WhatsAppCarouselTemplate;
+    showVariableModal?: boolean;
+    variableListForImage?: VariableListInterfaceV2[];
+    discountCode?: string;
+    setDiscountCode?: (code: string) => void;
+}
+export interface CarouselProduct {
+    name: string;
+    image: string;
+    quantity: number;
+    variantId: string;
+    productId: string;
+    displayOrder: number;
+    collectionId: string;
+    productName: string;
+    productImage: string;
+}
+declare const EditWhatsAppCarouselTemplateV2: ({ template, whatsappSpecificPickerMeta, showVariableModal, variableListForImage, discountCode, setDiscountCode, }: EditWhatsAppCarouselTemplateV2Props) => import("react/jsx-runtime").JSX.Element;
+export default EditWhatsAppCarouselTemplateV2;

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

@@ -1 +1 @@
-import{jsxs as e,jsx as l,Fragment as t}from"react/jsx-runtime";import{ApplicationType as o}from"@bikdotai/bik-models/growth/models/bik-store";import n from"../../../assets/icons/arrow_back.svg.js";import i from"../../../assets/icons/chevronLeft.svg.js";import r from"../../../assets/icons/chevronRight.svg.js";import a from"../../../assets/icons/PlusIcon.js";import d from"lodash/cloneDeep";import{useState as s,useEffect as c}from"react";import{Button as u}from"../../button/Button.js";import{IconButton as p}from"../../icon-button/IconButton.js";import{ProductPickerModal as m}from"../../product-picker-v2/modal.js";import{ScreenName as v}from"../../product-picker-v2/type.js";import{Badge as h}from"../Badge/index.js";import{useTemplateModalContext as g}from"../context/templateModalContext.js";import f from"./EditWhatsAppTemplateV2.js";import{ProductBox as y}from"./ProductBox.js";import{isRCSChannel as b}from"../../template-preview/helpers/templateMiscHelper.js";import{POD as x}from"../../template-preview/models/WhatsAppTemplate.js";import{TitleMedium as C,TitleRegular as j,BodySecondary as I,BodyCaption as k}from"../../TypographyStyle.js";import{COLORS as O}from"../../../constants/Theme.js";const w=w=>{let{template:P,whatsappSpecificPickerMeta:T,showVariableModal:S,variableListForImage:B,discountCode:E,setDiscountCode:L}=w;var D,F,M,R,V,$,q,A;const{selectedCarouselIndex:N,setTemplate:W,pickerConf:_,isProductCarouselType:z,pod:G,cardCount:H,carouselProducts:K,setCarouselProducts:J,isError:Q,cardImages:U,disableEditVariable:X,onDeleteSelectedProducts:Y,setSelectedCarouselIndex:Z,setVariableCallback:ee,setShowVariablePicker:le,sliderRef:te}=g(),[oe,ne]=s(b(null==P?void 0:P.channel)?"Carousel Cards":-1==N?"First Message (Step 1/2)":z?"Product Carousel "+((null===(F=null===(D=null==P?void 0:P.mapping)||void 0===D?void 0:D.body)||void 0===F?void 0:F.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(R=null===(M=null==P?void 0:P.mapping)||void 0===M?void 0:M.body)||void 0===R?void 0:R.length)?"(Step 2/2)":"")),[ie,re]=s(!1),[ae,de]=s(!1),se=N===(null!=H?H:-1)-1,ce=(null!=N?N:-1)<1;c((()=>{var e,l,t,o;ne(b(null==P?void 0:P.channel)?"Carousel Cards":-1==N?"First Message (Step 1/2)":z?"Product Carousel "+((null===(l=null===(e=null==P?void 0:P.mapping)||void 0===e?void 0:e.body)||void 0===l?void 0:l.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(o=null===(t=null==P?void 0:P.mapping)||void 0===t?void 0:t.body)||void 0===o?void 0:o.length)?"(Step 2/2)":""))}),[N]);const ue=e=>{null==J||J([{name:"variable",productName:e.actualValue}])};return c((()=>{-1===N&&b(null==P?void 0:P.channel)&&(null==Z||Z(0))}),[N,null==P?void 0:P.channel]),e("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"16px"}},{children:[e("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center"}},{children:[!b(null==P?void 0:P.channel)&&null!=N&&N>=0&&!!(null===($=null===(V=null==P?void 0:P.mapping)||void 0===V?void 0:V.body)||void 0===$?void 0:$.length)&&l(p,{Icon:n,onClick:()=>{null==Z||Z(-1)}}),l(C,Object.assign({style:{marginLeft:10}},{children:oe}))]})),z&&(null!==(q=null==K?void 0:K.length)&&void 0!==q?q:0)>0&&null!=N&&N>=0&&e("div",Object.assign({style:{display:"flex",rowGap:8,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"}},{children:[l(y,{editItem:()=>{1===(null==K?void 0:K.length)&&"variable"===K[0].name?(ee((()=>ue)),le(!0)):re(!ie)},cardBody:1===(null==K?void 0:K.length)&&"variable"===K[0].name?`${K[0].productName}`:`${null==K?void 0:K.length} Products Selected`,hideIcon:1===(null==K?void 0:K.length)&&"variable"===K[0].name,deleteItem:()=>{var e;if(1===(null==K?void 0:K.length)&&"variable"===K[0].name)return void(null==J||J([]));const l=d(Object.assign({},P));l&&(U&&U.length>0?null==U||U.forEach(((e,t)=>{var o;l.components[1].cards[t].components[0].example.header_handle=[null!==(o=U[t])&&void 0!==o?o:"https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})):null===(e=null==l?void 0:l.components[1].cards)||void 0===e||e.forEach(((e,t)=>{l.components[1].cards[t].components[0].example.header_handle=["https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})),null==W||W(l)),null==J||J([]),null==Y||Y()}}),K&&(null==K?void 0:K.length)>0&&"variable"!=K[0].name&&l(u,{disabled:(null!==(A=null==K?void 0:K.length)&&void 0!==A?A:0)<=1,style:{alignSelf:"flex-end"},onClick:()=>{de(!0),re(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]})),!X&&z&&0===(null==K?void 0:K.length)&&null!=N&&N>=0&&e(t,{children:[e("div",Object.assign({style:{marginLeft:12}},{children:[l(j,{children:"Product(s)"}),l(I,{children:`Select ${null!=H?H:1} products`})]})),e("div",Object.assign({style:{marginTop:16,marginBottom:16,marginLeft:Q?16:12,marginRight:Q?16:12,flexDirection:"column",display:"flex",alignItems:"center"}},{children:[l(u,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12,border:Q?`2px dashed ${O.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s)",buttonType:Q?"tertiaryGray":"dashBold",LeadingIcon:()=>l("div",Object.assign({style:{display:"flex",width:18,height:18}},{children:l(a,{width:18,height:18,color:O.content.secondary})})),onClick:e=>{re(!0)}}),G===x.CHATBOT&&e(t,{children:[e("div",Object.assign({style:{display:"flex",flex:1,alignItems:"center",justifyContent:"space-between",flexDirection:"row",width:"100%"}},{children:[l("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginRight:8}}),l(k,Object.assign({style:{color:"#616161",overflow:"unset"}},{children:"OR"})),l("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginLeft:8}})]})),l(u,{matchParentWidth:!0,style:{flex:1,display:"flex",marginTop:12,width:"100%",border:Q?`2px dashed ${O.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s) Variable",buttonType:Q?"tertiaryGray":"dashBold",LeadingIcon:()=>l("div",Object.assign({style:{display:"flex"}},{children:l(a,{width:18,height:18,color:O.content.secondary})})),onClick:e=>{ee((()=>ue)),le(!0)}})]})]})),Q&&l("div",Object.assign({style:{marginLeft:10,marginBottom:16}},{children:l(h,{padding:"8px",errorText:"Please add products"})}))]}),!z&&(null!=N?N:-1)>-1&&e("div",Object.assign({style:{display:"flex",background:O.surface.hovered,alignItems:"center"}},{children:[l(p,{Icon:i,disabled:ce,width:8,height:14,svgStyle:ce?{}:{color:O.content.secondary},onClick:()=>{var e;null===(e=null==te?void 0:te.current)||void 0===e||e.slickPrev(),(null!=N?N:-1)<1||null==Z||Z((e=>e-1))}}),l(j,Object.assign({style:{flex:1,display:"flex",justifyContent:"center"},color:O.content.secondary},{children:`Card ${(null!=N?N:0)+1}/${H}`})),l(p,{Icon:r,width:8,height:14,disabled:se,svgStyle:se?{}:{color:O.content.secondary},onClick:()=>{var e;null===(e=null==te?void 0:te.current)||void 0===e||e.slickNext(),(null!=N?N:-1)>=(null!=H?H:-1)-1||null==Z||Z((e=>e+1))}})]})),l(f,{whatsappSpecificPickerMeta:T,template:P,onTemplateChange:e=>{null==W||W(e)},showVariableModal:S,variableListForImage:B,discountCode:E,setDiscountCode:L}),ie&&_&&l(m,{zIndex:200,startupScreen:ae?v.RearrangeProducts:v.Collections,rearrangeEnabled:!0,storeId:_.storeId,selectedItems:(e=>{if(e.length>0){const l={};for(const t of e){const e=null==t?void 0:t.collectionId,o=t.productId,n=t.variantId;e in l||(l[e]={products:{},name:"",image:"",isSmartCollection:!1}),o in l[e].products||(l[e].products[o]={variants:{},name:(null==t?void 0:t.productName)||"",image:(null==t?void 0:t.productImage)||""}),l[e].products[o].variants[n]={name:(null==t?void 0:t.name)||"",price:"",image:(null==t?void 0:t.image)||"",quantity:t.quantity||0,displayOrder:t.displayOrder}}return l}return{}})(null!=K?K:[]),collectionFetcher:_.fetchCollections,productFetcher:_.fetchProducts,onAdd:(e,l)=>{var t,o,n,i,r,a;de(!1);const s=[];delete e.isCustom;for(const l of Object.keys(e)){const d=e[l].products;if(void 0!==d&&Object.keys(d).length)for(const e of Object.keys(d)){const c=d[e].variants;if(void 0!==c&&Object.keys(c).length)for(const u of Object.keys(c)){const{name:p,image:m,quantity:v,displayOrder:h}=c[u],g={name:p,image:null!==(o=null!=m?m:null===(t=d[e])||void 0===t?void 0:t.image)&&void 0!==o?o:"",quantity:v,variantId:u,productId:e,displayOrder:h,collectionId:l,productName:null!==(i=null===(n=d[e])||void 0===n?void 0:n.name)&&void 0!==i?i:"",productImage:null!==(a=null===(r=d[e])||void 0===r?void 0:r.image)&&void 0!==a?a:""};s.push(g)}}}const c=s.sort(((e,l)=>e.displayOrder-l.displayOrder)),u=s.map((e=>e.image)),p=d(Object.assign({},P));p&&(u.forEach(((e,l)=>{var t;p.components[1].cards[l].components[0].example.header_handle=e?[e]:[null!==(t=null==U?void 0:U[l])&&void 0!==t?t:""]})),null==W||W(p)),null==J||J(c),re(!1)},searchInCollectionFetcher:_.searchInCollection,searchFetcher:_.searchProducts,visible:ie,onClose:()=>{re(!1)},exactLimit:null!=H?H:1,appType:_.appType||o.BIK})]}))};export{w as default};
+import{jsxs as e,jsx as l,Fragment as t}from"react/jsx-runtime";import{ApplicationType as o}from"@bikdotai/bik-models/growth/models/bik-store";import i from"../../../assets/icons/arrow_back.svg.js";import n from"../../../assets/icons/chevronLeft.svg.js";import r from"../../../assets/icons/chevronRight.svg.js";import a from"../../../assets/icons/PlusIcon.js";import{cloneDeep as d}from"lodash";import{useState as s,useEffect as c}from"react";import{Button as u}from"../../button/Button.js";import{IconButton as p}from"../../icon-button/IconButton.js";import{ProductPickerModal as m}from"../../product-picker-v2/modal.js";import{ScreenName as v}from"../../product-picker-v2/type.js";import{Badge as h}from"../Badge/index.js";import{useTemplateModalContext as g}from"../context/templateModalContext.js";import f from"./EditWhatsAppTemplateV2.js";import{ProductBox as y}from"./ProductBox.js";import"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import{COLORS as b}from"../../../constants/Theme.js";import"../../curtain/CurtainHelper.js";import"../../variable-picker-v3/model.js";import"../../template-preview/models/TemplateMeta.js";import{POD as C}from"../../template-preview/models/WhatsAppTemplate.js";import"../../template-preview/models/Channels.js";import{isRCSChannel as x}from"../../template-preview/helpers/templateMiscHelper.js";import{TitleMedium as I,TitleRegular as j,BodySecondary as k,BodyCaption as w}from"../../TypographyStyle.js";const P=P=>{let{template:T,whatsappSpecificPickerMeta:S,showVariableModal:O,variableListForImage:L,discountCode:B,setDiscountCode:E}=P;var A,M,V,D,F,R,W,$;const{selectedCarouselIndex:q,setTemplate:N,pickerConf:_,isProductCarouselType:z,pod:G,cardCount:H,carouselProducts:K,setCarouselProducts:J,isError:Q,cardImages:U,disableEditVariable:X,onDeleteSelectedProducts:Y,setSelectedCarouselIndex:Z,setVariableCallback:ee,setShowVariablePicker:le,sliderRef:te}=g(),[oe,ie]=s(x(null==T?void 0:T.channel)?"Carousel Cards":-1==q?"First Message (Step 1/2)":z?"Product Carousel "+((null===(M=null===(A=null==T?void 0:T.mapping)||void 0===A?void 0:A.body)||void 0===M?void 0:M.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(D=null===(V=null==T?void 0:T.mapping)||void 0===V?void 0:V.body)||void 0===D?void 0:D.length)?"(Step 2/2)":"")),[ne,re]=s(!1),[ae,de]=s(!1),se=q===(null!=H?H:-1)-1,ce=(null!=q?q:-1)<1;c((()=>{var e,l,t,o;ie(x(null==T?void 0:T.channel)?"Carousel Cards":-1==q?"First Message (Step 1/2)":z?"Product Carousel "+((null===(l=null===(e=null==T?void 0:T.mapping)||void 0===e?void 0:e.body)||void 0===l?void 0:l.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(o=null===(t=null==T?void 0:T.mapping)||void 0===t?void 0:t.body)||void 0===o?void 0:o.length)?"(Step 2/2)":""))}),[q]);const ue=e=>{null==J||J([{name:"variable",productName:e.actualValue}])};return c((()=>{-1===q&&x(null==T?void 0:T.channel)&&(null==Z||Z(0))}),[q,null==T?void 0:T.channel]),e("div",{style:{display:"flex",flexDirection:"column",gap:"16px"},children:[e("div",{style:{display:"flex",flexDirection:"row",alignItems:"center"},children:[!x(null==T?void 0:T.channel)&&null!=q&&q>=0&&!!(null===(R=null===(F=null==T?void 0:T.mapping)||void 0===F?void 0:F.body)||void 0===R?void 0:R.length)&&l(p,{Icon:i,onClick:()=>{null==Z||Z(-1)}}),l(I,{style:{marginLeft:10},children:oe})]}),z&&(null!==(W=null==K?void 0:K.length)&&void 0!==W?W:0)>0&&null!=q&&q>=0&&e("div",{style:{display:"flex",rowGap:8,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"},children:[l(y,{editItem:()=>{1===(null==K?void 0:K.length)&&"variable"===K[0].name?(ee((()=>ue)),le(!0)):re(!ne)},cardBody:1===(null==K?void 0:K.length)&&"variable"===K[0].name?`${K[0].productName}`:`${null==K?void 0:K.length} Products Selected`,hideIcon:1===(null==K?void 0:K.length)&&"variable"===K[0].name,deleteItem:()=>{var e;if(1===(null==K?void 0:K.length)&&"variable"===K[0].name)return void(null==J||J([]));const l=d(Object.assign({},T));l&&(U&&U.length>0?null==U||U.forEach(((e,t)=>{var o;l.components[1].cards[t].components[0].example.header_handle=[null!==(o=U[t])&&void 0!==o?o:"https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})):null===(e=null==l?void 0:l.components[1].cards)||void 0===e||e.forEach(((e,t)=>{l.components[1].cards[t].components[0].example.header_handle=["https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})),null==N||N(l)),null==J||J([]),null==Y||Y()}}),K&&(null==K?void 0:K.length)>0&&"variable"!=K[0].name&&l(u,{disabled:(null!==($=null==K?void 0:K.length)&&void 0!==$?$:0)<=1,style:{alignSelf:"flex-end"},onClick:()=>{de(!0),re(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]}),!X&&z&&0===(null==K?void 0:K.length)&&null!=q&&q>=0&&e(t,{children:[e("div",{style:{marginLeft:12},children:[l(j,{children:"Product(s)"}),l(k,{children:`Select ${null!=H?H:1} products`})]}),e("div",{style:{marginTop:16,marginBottom:16,marginLeft:Q?16:12,marginRight:Q?16:12,flexDirection:"column",display:"flex",alignItems:"center"},children:[l(u,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12,border:Q?`2px dashed ${b.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s)",buttonType:Q?"tertiaryGray":"dashBold",LeadingIcon:()=>l("div",{style:{display:"flex",width:18,height:18},children:l(a,{width:18,height:18,color:b.content.secondary})}),onClick:e=>{re(!0)}}),G===C.CHATBOT&&e(t,{children:[e("div",{style:{display:"flex",flex:1,alignItems:"center",justifyContent:"space-between",flexDirection:"row",width:"100%"},children:[l("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginRight:8}}),l(w,{style:{color:"#616161",overflow:"unset"},children:"OR"}),l("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginLeft:8}})]}),l(u,{matchParentWidth:!0,style:{flex:1,display:"flex",marginTop:12,width:"100%",border:Q?`2px dashed ${b.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s) Variable",buttonType:Q?"tertiaryGray":"dashBold",LeadingIcon:()=>l("div",{style:{display:"flex"},children:l(a,{width:18,height:18,color:b.content.secondary})}),onClick:e=>{ee((()=>ue)),le(!0)}})]})]}),Q&&l("div",{style:{marginLeft:10,marginBottom:16},children:l(h,{padding:"8px",errorText:"Please add products"})})]}),!z&&(null!=q?q:-1)>-1&&e("div",{style:{display:"flex",background:b.surface.hovered,alignItems:"center"},children:[l(p,{Icon:n,disabled:ce,width:8,height:14,svgStyle:ce?{}:{color:b.content.secondary},onClick:()=>{var e;null===(e=null==te?void 0:te.current)||void 0===e||e.slickPrev(),(null!=q?q:-1)<1||null==Z||Z((e=>e-1))}}),l(j,{style:{flex:1,display:"flex",justifyContent:"center"},color:b.content.secondary,children:`Card ${(null!=q?q:0)+1}/${H}`}),l(p,{Icon:r,width:8,height:14,disabled:se,svgStyle:se?{}:{color:b.content.secondary},onClick:()=>{var e;null===(e=null==te?void 0:te.current)||void 0===e||e.slickNext(),(null!=q?q:-1)>=(null!=H?H:-1)-1||null==Z||Z((e=>e+1))}})]}),l(f,{whatsappSpecificPickerMeta:S,template:T,onTemplateChange:e=>{null==N||N(e)},showVariableModal:O,variableListForImage:L,discountCode:B,setDiscountCode:E}),ne&&_&&l(m,{zIndex:200,startupScreen:ae?v.RearrangeProducts:v.Collections,rearrangeEnabled:!0,storeId:_.storeId,selectedItems:(e=>{if(e.length>0){const l={};for(const t of e){const e=null==t?void 0:t.collectionId,o=t.productId,i=t.variantId;e in l||(l[e]={products:{},name:"",image:"",isSmartCollection:!1}),o in l[e].products||(l[e].products[o]={variants:{},name:(null==t?void 0:t.productName)||"",image:(null==t?void 0:t.productImage)||""}),l[e].products[o].variants[i]={name:(null==t?void 0:t.name)||"",price:"",image:(null==t?void 0:t.image)||"",quantity:t.quantity||0,displayOrder:t.displayOrder}}return l}return{}})(null!=K?K:[]),collectionFetcher:_.fetchCollections,productFetcher:_.fetchProducts,onAdd:(e,l)=>{var t,o,i,n,r,a;de(!1);const s=[];delete e.isCustom;for(const l of Object.keys(e)){const d=e[l].products;if(void 0!==d&&Object.keys(d).length)for(const e of Object.keys(d)){const c=d[e].variants;if(void 0!==c&&Object.keys(c).length)for(const u of Object.keys(c)){const{name:p,image:m,quantity:v,displayOrder:h}=c[u],g={name:p,image:null!==(o=null!=m?m:null===(t=d[e])||void 0===t?void 0:t.image)&&void 0!==o?o:"",quantity:v,variantId:u,productId:e,displayOrder:h,collectionId:l,productName:null!==(n=null===(i=d[e])||void 0===i?void 0:i.name)&&void 0!==n?n:"",productImage:null!==(a=null===(r=d[e])||void 0===r?void 0:r.image)&&void 0!==a?a:""};s.push(g)}}}const c=s.sort(((e,l)=>e.displayOrder-l.displayOrder)),u=s.map((e=>e.image)),p=d(Object.assign({},T));p&&(u.forEach(((e,l)=>{var t;p.components[1].cards[l].components[0].example.header_handle=e?[e]:[null!==(t=null==U?void 0:U[l])&&void 0!==t?t:""]})),null==N||N(p)),null==J||J(c),re(!1)},searchInCollectionFetcher:_.searchInCollection,searchFetcher:_.searchProducts,visible:ne,onClose:()=>{re(!1)},exactLimit:null!=H?H:1,appType:_.appType||o.BIK})]})};export{P as default};

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

@@ -1,18 +1,18 @@
-import type { VariableListInterfaceV2 } from "../../add-variableV2/AddVariableV2";
-import type { EmailTemplateType } from "../../template-preview/models/EmailTemplate";
-import type { SMSTemplateType } from "../../template-preview/models/SmsTemplate";
-import type { WhatsAppCarouselTemplate } from "../../template-preview/models/WhatsappCarouselTemplate";
-import { type WhatsAppPickerMeta, type WhatsAppTemplate } from "../../template-preview/models/WhatsAppTemplate";
-export interface EditWhatsAppTemplateV2Props {
-    whatsappSpecificPickerMeta?: WhatsAppPickerMeta;
-    template: WhatsAppTemplate | WhatsAppCarouselTemplate;
-    onTemplateChange?: (template: WhatsAppTemplate | EmailTemplateType | SMSTemplateType | WhatsAppCarouselTemplate) => void;
-    showVariableModal?: boolean;
-    variableListForImage?: VariableListInterfaceV2[];
-    discountCode?: string;
-    setDiscountCode?: (code: string) => void;
-    fileName?: string;
-    setFileName?: (name: string) => void;
-}
-declare const EditWhatsAppTemplateV2: ({ template, onTemplateChange, whatsappSpecificPickerMeta, showVariableModal, variableListForImage, setDiscountCode, fileName, setFileName, }: EditWhatsAppTemplateV2Props) => import("react/jsx-runtime").JSX.Element;
-export default EditWhatsAppTemplateV2;
+import { VariableListInterfaceV2 } from '@src/components/add-variableV2/AddVariableV2';
+import { EmailTemplateType } from '@src/components/template-preview/models/EmailTemplate';
+import { SMSTemplateType } from '@src/components/template-preview/models/SmsTemplate';
+import { WhatsAppCarouselTemplate } from '@src/components/template-preview/models/WhatsappCarouselTemplate';
+import { WhatsAppPickerMeta, WhatsAppTemplate } from '@src/components/template-preview/models/WhatsAppTemplate';
+export interface EditWhatsAppTemplateV2Props {
+    whatsappSpecificPickerMeta?: WhatsAppPickerMeta;
+    template: WhatsAppTemplate | WhatsAppCarouselTemplate;
+    onTemplateChange?: (template: WhatsAppTemplate | EmailTemplateType | SMSTemplateType | WhatsAppCarouselTemplate) => void;
+    showVariableModal?: boolean;
+    variableListForImage?: VariableListInterfaceV2[];
+    discountCode?: string;
+    setDiscountCode?: (code: string) => void;
+    fileName?: string;
+    setFileName?: (name: string) => void;
+}
+declare const EditWhatsAppTemplateV2: ({ template, onTemplateChange, whatsappSpecificPickerMeta, showVariableModal, variableListForImage, setDiscountCode, fileName, setFileName, }: EditWhatsAppTemplateV2Props) => import("react/jsx-runtime").JSX.Element;
+export default EditWhatsAppTemplateV2;