@bikdotai/bik-component-library 0.0.686 → 0.0.687-beta.1

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

@@ -1,10 +1,10 @@
-import{jsxs as e,jsx as t,Fragment as l}from"react/jsx-runtime";import i from"../../../assets/icons/edit.svg.js";import a from"../../../assets/icons/info.svg.js";import{format as n}from"date-fns";import{cloneDeep as o}from"lodash";import{useState as s,useEffect as u}from"react";import d from"styled-components";import{Alert as r}from"../../alerts/Alert.js";import{ALERT_TYPES as c}from"../../alerts/AlertHelper.js";import{CustomDateTime as p}from"../../custom-date-time/CustomDateTime.js";import{Dropdown as m}from"../../dropdown/Dropdown.js";import{Input as v}from"../../input/Input.js";import{truncate as b}from"../../product-picker-v2/collectionScreen.js";import{placeHolderNamePattern as g}from"../../template-preview/constants/regexPatterns.js";import{isCarouselComponent as O}from"../../template-preview/helpers/templateMiscHelper.js";import{CHANNEL_TYPE as j}from"../../template-preview/models/Channels.js";import{WEB_PUSH_COMPONENT_TYPE as y}from"../../template-preview/models/WebpushTemplate.js";import{POD as x,BUTTON_TYPE as h}from"../../template-preview/models/WhatsAppTemplate.js";import{BodySecondary as f,BodyPrimary as T}from"../../TypographyStyle.js";import _ from"../../../utils/StringUtils.js";import{COLORS as E}from"../../../constants/Theme.js";import{useTemplateModalContext as C}from"../context/templateModalContext.js";import{updateVariables as V}from"../custom-hooks/useAdditionalVariables.js";import{getVariableNameForEmailByIndex as S}from"../utils/getVariableNameEmail.js";import{QueryParamsComponent as k}from"./QueryParamsComponent.js";const A=d.div`
+import{jsxs as e,jsx as l,Fragment as t}from"react/jsx-runtime";import a from"../../../assets/icons/edit.svg.js";import o from"../../../assets/icons/info.svg.js";import{format as n}from"date-fns";import{cloneDeep as i}from"lodash";import{useState as u,useEffect as r}from"react";import s from"styled-components";import{Alert as p}from"../../alerts/Alert.js";import{ALERT_TYPES as d}from"../../alerts/AlertHelper.js";import{CustomDateTime as m}from"../../custom-date-time/CustomDateTime.js";import{Dropdown as c}from"../../dropdown/Dropdown.js";import{Input as v}from"../../input/Input.js";import{truncate as b}from"../../product-picker-v2/collectionScreen.js";import{placeHolderNamePattern as y}from"../../template-preview/constants/regexPatterns.js";import{isCarouselComponent as x}from"../../template-preview/helpers/templateMiscHelper.js";import{CHANNEL_TYPE as h}from"../../template-preview/models/Channels.js";import{WEB_PUSH_COMPONENT_TYPE as f}from"../../template-preview/models/WebpushTemplate.js";import{POD as T,BUTTON_TYPE as _}from"../../template-preview/models/WhatsAppTemplate.js";import{BodySecondary as g,BodyPrimary as E}from"../../TypographyStyle.js";import C from"../../../utils/StringUtils.js";import{COLORS as S}from"../../../constants/Theme.js";import{useTemplateModalContext as V}from"../context/templateModalContext.js";import{updateVariables as k}from"../custom-hooks/useAdditionalVariables.js";import{getVariableNameForEmailByIndex as O}from"../utils/getVariableNameEmail.js";import{QueryParamsComponent as A}from"./QueryParamsComponent.js";var P=Object.defineProperty,B=Object.defineProperties,L=Object.getOwnPropertyDescriptors,w=Object.getOwnPropertySymbols,D=Object.prototype.hasOwnProperty,U=Object.prototype.propertyIsEnumerable,j=(e,l,t)=>l in e?P(e,l,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[l]=t,H=(e,l)=>{for(var t in l||(l={}))D.call(l,t)&&j(e,t,l[t]);if(w)for(var t of w(l))U.call(l,t)&&j(e,t,l[t]);return e},N=(e,l)=>B(e,L(l));const I=s.div`
 	/* surface/$color-background-warning-light */
 
-	background: ${e=>e.focused&&e.channel===j.EMAIL?E.background.warning.light:"transparent"};
+	background: ${e=>e.focused&&e.channel===h.EMAIL?S.background.warning.light:"transparent"};
 	border-radius: 4px;
 	padding: 8px 10px;
-`,B=d.div`
+`,R=s.div`
 	position: absolute;
 	top: 0;
 	left: 0;
@@ -12,8 +12,8 @@ import{jsxs as e,jsx as t,Fragment as l}from"react/jsx-runtime";import i from"..
 	height: 100%;
 	z-index: 1000;
 	cursor: not-allowed;
-`,L=d.div`
+`,W=s.div`
 	height: 100%;
 	width: 48%;
 	background: rgba(0, 0, 0, 0.1);
-`,P={value:"custom_link",label:"Custom URL"},w={value:"custom_text",label:"Custom text"},D={value:"static_expiry",label:"Static Expiry"},U=d=>{var U,H,N,R,I,W,Y,$,M;const{onFocus:z,variable:Z,index:q,showVariableModal:G,setShowDiscountCheckBox:F,componentType:K,CTAoptions:Q,buttonType:J}=d,[X,ee]=s(!1),[te,le]=s(""),[ie,ae]=s([]),[ne,oe]=s(),[se,ue]=s(!1),{variableList:de,setVariableList:re,setVariableCallback:ce,setShowVariablePicker:pe,device:me,channel:ve,isError:be,originalVariableList:ge,template:Oe,templateSelectionTriggered:je,setTemplate:ye,setDisplayContent:xe,setOriginalVariableList:he,globalNormalizedPlaceholders:fe,enabledCustomText:Te,pod:_e,selectedCarouselIndex:Ee,isProductCarouselType:Ce,isWhatsappCarousel:Ve,disableEditVariable:Se,disableEditExpiry:ke,templateErrorIndexes:Ae,maxCharLimit:Be,disableDatePicker:Le,showDiscountCodeExpiryInfo:Pe,cardIndex:we=1}=C();function De(e,t){var l,i,a,n;const o=e;le(""),oe(o),ve===j.WHATSAPP||ve===j.RCS?"custom_text"!==o.value&&"custom_link"!==o.value&&"static_expiry"!==o.value?(He(null!==(l=o.value)&&void 0!==l?l:"","string"),null==Ne||Ne(null!==(i=Z.index)&&void 0!==i?i:0,o.value,!0)):(null==Ne||Ne(null!==(a=Z.index)&&void 0!==a?a:0,"",!0,o.value),He("","url"===o.bikPlaceholderType?"link":"string")):"custom_text"!==o.value&&"custom_link"!==o.value?(He(o.value,"url"===o.bikPlaceholderType?"link":"string"),ve==j.WEBPUSH&&(null==Ie||Ie(null!==(n=Z.index)&&void 0!==n?n:0,o.value))):(le(""),He("",o.value))}function Ue(e,t){var l,i;le(t);const a="custom_link"===(null==ne?void 0:ne.value)&&t?t.includes("https")?t:`https://${t}`:t;He(a,"static_expiry"===e?"string":e),ve!==j.WHATSAPP&&ve!==j.RCS||null==Ne||Ne(null!==(l=Z.index)&&void 0!==l?l:0,a,"custom_link"===e||_e===x.CHATBOT&&"custom_text"===e,e),ve===j.WEBPUSH&&(null==Ie||Ie(null!==(i=Z.index)&&void 0!==i?i:0,a))}function He(e,t,l){var i,a,n,s,u;const d="custom_link"===t?"link":"custom_text"===t?"string":t;if(ve!==j.WHATSAPP&&ve!==j.WEBPUSH&&ve!==j.RCS){const l=S(q+1),a=null===document||void 0===document?void 0:document.getElementById("mobile"===me?"template_html_mobile":"template_html_desktop"),n=ve===j.EMAIL?null===(i=null==a?void 0:a.contentWindow)||void 0===i?void 0:i.document.getElementById(l):document.getElementById(l);n&&(n.textContent="custom_text"!==t&&"custom_link"!==t||e?e:Z.variableName);const o=ge.map(((t,l)=>l===q?Object.assign(Object.assign({},t),{type:d,updatedValue:e}):t));null==he||he(o)}if(ve===j.WEBPUSH){const t=ge,l=t=>null==t?void 0:t.map(((t,l)=>l===q?Object.assign(Object.assign({},t),{type:d,updatedValue:e}):t)),i={BODY:"BODY"===K?l(t.body):t.body,TITLE:K===y.TITLE.toUpperCase()?l(t.title):t.title};null==he||he((e=>Object.assign(Object.assign({},e),{title:i.TITLE,body:i.BODY,buttons:t.buttons})))}if(ve===j.WHATSAPP||ve===j.RCS){if(null!=Ee&&Ee>-1&&Ce){const l=Object.assign({},ge).cards.map(((l,i)=>{var a,n,o;return"BODY"===K?Object.assign(Object.assign({},l),{body:null===(a=l.body)||void 0===a?void 0:a.map(((t,l)=>q===l?Object.assign(Object.assign({},t),{type:d,updatedValue:e}):t))}):"TITLE"===K?Object.assign(Object.assign({},l),{title:null===(n=l.title)||void 0===n?void 0:n.map(((t,l)=>q===l?Object.assign(Object.assign({},t),{type:d,updatedValue:e}):t))}):"BUTTONS"===K?Object.assign(Object.assign({},l),{buttons:null===(o=l.buttons)||void 0===o?void 0:o.map(((l,i)=>i===q?Object.assign(Object.assign({},l),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===l.type?e:[e]}):l))}):l}));return void(null==he||he((e=>Object.assign(Object.assign({},e),{cards:l}))))}const i=null!=Ee&&Ee>-1?ge.cards[Ee]:ge;let r=i.body,c=i.title,p=i.header,m=i.buttons;if("BODY"===K?r=null===(a=i.body)||void 0===a?void 0:a.map(((t,l)=>l===q?Object.assign(Object.assign({},t),{type:d,updatedValue:e}):t)):"TITLE"===K?c=null===(n=null==i?void 0:i.title)||void 0===n?void 0:n.map(((t,l)=>l===q?Object.assign(Object.assign({},t),{type:d,updatedValue:e}):t)):"HEADER"===K?p=null===(s=i.header)||void 0===s?void 0:s.map(((t,l)=>l===q?Object.assign(Object.assign({},t),{type:d,updatedValue:e}):t)):"BUTTONS"===K&&(m=null===(u=i.buttons)||void 0===u?void 0:u.map(((i,a)=>a===q?Object.assign(Object.assign({},i),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===i.type?e:[e],queryParams:null!=l?l:[]}):i))),null!=Ee&&Ee>-1){const e=o(ge.cards);e[Ee]={header:p,body:r,buttons:m,title:c},null==he||he((t=>Object.assign(Object.assign({},t),{cards:e})))}else null==he||he((e=>Object.assign(Object.assign({},e),{header:p,body:r,buttons:m,title:c})))}}function Ne(e,t,l,i){var a,n,s,u,d,r,c,p,m,v,b,g;if(null!=Ee&&Ee>-1&&Ce){const n=Object.assign({},Oe).components.map((l=>{var i;return O(l.type)?Object.assign(Object.assign({},l),{cards:null===(i=l.cards)||void 0===i?void 0:i.map((l=>Object.assign(Object.assign({},l),{components:l.components.map((l=>{var i,a,n,o,s,u,d,r,c,p,m;if("BODY"===l.type&&"BODY"===K){if(null===(a=null===(i=l.example)||void 0===i?void 0:i.body_text)||void 0===a?void 0:a[0]){const i=[...null!==(s=null===(o=null===(n=l.example)||void 0===n?void 0:n.body_text)||void 0===o?void 0:o[0])&&void 0!==s?s:[]];i[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const a=Object.assign(Object.assign({},l.example),{body_text:[i]});return Object.assign(Object.assign({},l),{example:a})}return l}if("TITLE"===l.type&&"TITLE"===K){if(null===(d=null===(u=l.example)||void 0===u?void 0:u.title_text)||void 0===d?void 0:d[0]){const i=[...null!==(p=null===(c=null===(r=l.example)||void 0===r?void 0:r.title_text)||void 0===c?void 0:c[0])&&void 0!==p?p:[]];i[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const a=Object.assign(Object.assign({},l.example),{title_text:[i]});return Object.assign(Object.assign({},l),{example:a})}return l}if("BUTTONS"===l.type&&"BUTTONS"===K){const i=null===(m=l.buttons)||void 0===m?void 0:m.map(((l,i)=>i===e?Object.assign(Object.assign({},l),{example:[t]}):l));return i?Object.assign(Object.assign({},l),{buttons:i}):l}return l}))})))}):l})),s=o(Oe);if(l){const l=null===(a=Object.assign({},Oe).mapping.cards)||void 0===a?void 0:a.map(((l,a)=>{var n,o,s,u;if("BODY"===K)return Object.assign(Object.assign({},l),{body:null===(n=l.body)||void 0===n?void 0:n.map(((l,a)=>e===a?"custom_text"===i?`((editableVariable${a+10}))`:t:l))});if("TITLE"===K)return Object.assign(Object.assign({},l),{title:null===(o=null==l?void 0:l.title)||void 0===o?void 0:o.map(((l,a)=>e===a?"custom_text"===i?`((editableVariable${a+10}))`:t:l))});if("BUTTONS"===K&&(null==l?void 0:l.buttons)){let n=-1,o=-1;return null===(s=Oe.components[we].cards)||void 0===s||s[a].components.forEach((t=>{var l;"BUTTONS"===t.type&&(null===(l=t.buttons)||void 0===l||l.forEach(((t,l)=>{"URL"===t.type&&(n++,l===e&&"URL"==t.type&&(o=n))})))})),Object.assign(Object.assign({},l),{buttons:null===(u=l.buttons)||void 0===u?void 0:u.map(((e,l)=>l===o?"custom_link"===i?"((customPlaceholderName))":t:e))})}return l}));s.mapping.cards=l}return s.components=n,void(null==ye||ye(s))}const j=null!=Ee&&Ee>-1?{components:null===(n=Object.assign({},Oe).components[we].cards)||void 0===n?void 0:n[Ee].components,mapping:null===(s=Object.assign({},Oe).mapping.cards)||void 0===s?void 0:s[Ee]}:Object.assign({},Oe),y=null===(u=null==j?void 0:j.components)||void 0===u?void 0:u.map((l=>{var i,a,n,o,s,u,d,r,c,p,m,v,b,g,O,j;const y=Object.assign({},l);if("BODY"===l.type&&"BODY"===K&&(Array.isArray(null===(i=l.example)||void 0===i?void 0:i.body_text)||(null===(n=null===(a=l.example)||void 0===a?void 0:a.body_text)||void 0===n?void 0:n[0]))){const l=[...null!==(u=null===(s=null===(o=y.example)||void 0===o?void 0:o.body_text)||void 0===s?void 0:s[0])&&void 0!==u?u:[]];l[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const i=Object.assign(Object.assign({},y.example),{body_text:[l]});return Object.assign(Object.assign({},y),{example:i})}if("TITLE"===l.type&&"TITLE"===K){if(Array.isArray(null===(d=l.example)||void 0===d?void 0:d.title_text)||(null===(c=null===(r=l.example)||void 0===r?void 0:r.title_text)||void 0===c?void 0:c[0])){const l=[...null!==(v=null===(m=null===(p=y.example)||void 0===p?void 0:p.title_text)||void 0===m?void 0:m[0])&&void 0!==v?v:[]];l[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const i=Object.assign(Object.assign({},y.example),{title_text:[l]});return Object.assign(Object.assign({},y),{example:i})}}else if("HEADER"===l.type&&"HEADER"===K){if(null===(b=l.example)||void 0===b?void 0:b.header_text){const l=[...null!==(O=null===(g=y.example)||void 0===g?void 0:g.header_text)&&void 0!==O?O:[]];l[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const i=Object.assign(Object.assign({},y.example),{header_text:l});return Object.assign(Object.assign({},y),{example:i})}}else{if("BUTTONS"===l.type&&"BUTTONS"===K){const i=null===(j=l.buttons)||void 0===j?void 0:j.map(((l,i)=>i===e?Object.assign(Object.assign({},l),{example:"COPY_CODE"===l.type?t:[t]}):l));return i?Object.assign(Object.assign({},y),{buttons:i}):y}if("limited_time_offer"===l.type&&"limited_time_offer"===K)return Object.assign(Object.assign({},y),{example:Object.assign(Object.assign({},y.example),{limited_time_offer:t})})}return l}));if(j.components=y,l)if("BODY"===K&&(null===(d=null==j?void 0:j.mapping)||void 0===d?void 0:d.body))j.mapping=Object.assign(Object.assign({},j.mapping),{body:null===(c=null===(r=j.mapping)||void 0===r?void 0:r.body)||void 0===c?void 0:c.map(((l,a)=>e===a?"custom_text"===i?`((editableVariable${a+10}))`:t:l))});else if("TITLE"===K&&(null===(p=null==j?void 0:j.mapping)||void 0===p?void 0:p.title))j.mapping=Object.assign(Object.assign({},j.mapping),{title:null===(v=null===(m=j.mapping)||void 0===m?void 0:m.title)||void 0===v?void 0:v.map(((l,a)=>e===a?"custom_text"===i?`((editableVariable${a+10}))`:t:l))});else if("HEADER"===K&&(null===(b=null==j?void 0:j.mapping)||void 0===b?void 0:b.header))j.mapping=Object.assign(Object.assign({},j.mapping),{header:j.mapping.header.map(((l,a)=>e===a?"custom_text"===i?`((editableVariable${a+20}))`:t:l))});else if("BUTTONS"===K&&(null===(g=null==j?void 0:j.mapping)||void 0===g?void 0:g.buttons)){let l=-1,a=-1;y.forEach((t=>{var i;"BUTTONS"===t.type&&(null===(i=t.buttons)||void 0===i||i.forEach(((t,i)=>{"URL"===t.type&&(l++,i===e&&"URL"==t.type&&(a=l))})))})),j.mapping=Object.assign(Object.assign({},j.mapping),{buttons:j.mapping.buttons.map(((e,l)=>l===a?"custom_link"===i?"((customPlaceholderName))":t:e))})}if(null!=Ee&&Ee>-1&&Oe){const e=o(Oe);e.components[we].cards[Ee].components=j.components,e.mapping.cards[Ee]=j.mapping,null==ye||ye(e)}else null==ye||ye(Object.assign({},j))}u((()=>{X&&(null==z||z())}),[X]),u((()=>{!function(){var e,t,l,i,a;const n="mobile"===me?"template_html_mobile":"template_html_desktop",o=document.getElementById(n),s=(null!==(i=null===(l=null===(t=null===(e=null==o?void 0:o.contentWindow)||void 0===e?void 0:e.document)||void 0===t?void 0:t.body)||void 0===l?void 0:l.innerHTML)&&void 0!==i?i:"")+(null===(a=null==o?void 0:o.contentWindow)||void 0===a?void 0:a.document.head.innerHTML);ve===j.EMAIL&&(null==xe||xe(s))}()}),[je]),u((()=>{!function(){var e,t;const l=[];let i=[];if(ve!==j.MESSAGE||Te){"link"===(null==Z?void 0:Z.type)?(l.push({label:"",options:[P,w]}),oe(P)):"date_time"===(null==Z?void 0:Z.type)?(l.push({label:"",options:[P,w]}),oe(D)):(l.push({label:"",options:[P,w,D]}),oe(w));const e=null!=fe?fe:[];ae([...l,...e.map((e=>{var t,l;return Object.assign(Object.assign({},e),{label:_.toCapitilize(null===(l=null===(t=e.label)||void 0===t?void 0:t.replace(/([A-Z])/g," $1"))||void 0===l?void 0:l.toLowerCase())})}))]),i=[...l,...e]}else{const e=null!=fe?fe:[];ae([{label:"",options:[w,P]},...e]),i=[{label:"",options:[w,P]},...e]}if((ve===j.WHATSAPP||ve===j.EMAIL||ve===j.MESSAGE||ve===j.WEBPUSH||ve===j.RCS)&&Z.updatedValue)if(g.test(Z.updatedValue)&&(ve===j.WHATSAPP||ve===j.RCS)||Z.updatedValue.startsWith("{{")&&ve!==j.WHATSAPP&&ve!==j.RCS){const e=function(e,t,l){var i;let a={label:"",value:""};const n=l===(j.WHATSAPP||j.RCS)?e.updatedValue.replace("[[","").replace("]]",""):e.updatedValue.replace("{{","").replace("}}","");if(G){let t=e.updatedValue;if(_e===x.CHATBOT&&"BUTTONS"===K){const l=null==Q?void 0:Q.filter((t=>t.placeHolder===e.updatedValue));l&&l.length>0&&(t=l[0].label)}a={label:t?t.replace("{{","").replace("}}","").trim().replace("."," "):"",value:null!==(i=e.updatedValue)&&void 0!==i?i:""}}else t.map((e=>{e.options.map((e=>{var t;(null===(t=e.value)||void 0===t?void 0:t.replace("{{","").replace("}}","").trim())===n.trim()&&(a=e)}))}));return a}(Z,i,ve);e.value&&oe(e)}else"date_time"===Z.type?(oe(D),le(Z.updatedValue),Ne(null!==(e=Z.index)&&void 0!==e?e:0,Z.updatedValue)):(null===(t=Z.updatedValue)||void 0===t?void 0:t.startsWith("https"))?(oe(P),le(Z.updatedValue.split("https://")[1])):(oe(w),le(Z.updatedValue))}()}),[Ee]),u((()=>{me&&ne&&te&&setTimeout((()=>{He("custom_link"===(null==ne?void 0:ne.value)&&te?te.includes("https")?te:`https://${te}`:te,ne.value)}),100)}),[me]),u((()=>{!se&&ne&&Z.updatedValue&&setTimeout((()=>{He("custom_link"===(null==ne?void 0:ne.value)&&Z.updatedValue?Z.updatedValue.includes("https")?Z.updatedValue:`https://${Z.updatedValue}`:Z.updatedValue,ne.value),ue(!0)}),100)}),[ne]);const Re=e=>{null==F||F(!1),"{{custom.url}}"===e.actualValue?De({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?De({label:e.displayName,selected:!0,value:"custom_text"}):"{{static.expiry}}"==e.actualValue?De({label:e.displayName,selected:!0,value:"static_expiry"}):De({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})};function Ie(e,t){var l;const i=o(Oe),a=K.toLocaleLowerCase();(null===(l=i.webpushBroadcastConfig)||void 0===l?void 0:l[a])&&(i.webpushBroadcastConfig[a][e]=t),null==ye||ye(Object.assign({},i))}return e(A,Object.assign({channel:ve,focused:X,onMouseEnter:()=>ee(!0),onMouseLeave:()=>ee(!1)},{children:[t("div",Object.assign({style:{marginBottom:8}},{children:e(f,Object.assign({style:{color:be&&!ne?E.content.negative:E.content.primary}},{children:[null===(U=Z.variableName)||void 0===U?void 0:U.replace("{{","").replace("}}","")," ","link"===(null==Z?void 0:Z.type)?"link":"variable"]}))})),t("div",Object.assign({style:{marginBottom:12}},{children:G?e("div",Object.assign({style:{display:"flex",border:"#E0E0E0 1px solid",borderRadius:4,padding:10,justifyContent:(null==ne?void 0:ne.label)?"space-between":"flex-end",backgroundColor:"date_time"===(null==Z?void 0:Z.type)&&ke?E.background.base:void 0}},{children:[t(T,Object.assign({numberOfLines:1},{children:_e===x.CHATBOT?["static_expiry","custom_text","custom_link"].includes(null!==(H=null==ne?void 0:ne.value)&&void 0!==H?H:"")?null==ne?void 0:ne.label:null==ne?void 0:ne.value:b(null!==(N=null==ne?void 0:ne.label)&&void 0!==N?N:"",20,!0)})),Se||"date_time"===(null==Z?void 0:Z.type)&&ke?t(l,{}):t(i,{onClick:()=>{(()=>{let e=Array.isArray(de)?[...de]:[];const t=(t,l,i)=>{const a=V({variableList:e,categoryDisplayName:t,variableDisplayName:l,variableValue:i});Array.isArray(a)&&(e=a)};_e===x.CHATBOT&&J!==h.URL&&"limited_time_offer"!==K&&t("Custom Variables","Custom Text","{{custom.text}}"),J===h.URL&&_e===x.CHATBOT?t("Custom Variables","Custom URL","{{custom.url}}"):"limited_time_offer"===K?t("Static Variables","Static Expiry","{{static.expiry}}"):J===h.COPY_CODE&&t("Custom Variables","Custom Text","{{custom.text}}"),re(e)})(),ce((()=>Re)),pe(!0)},width:24,height:24,color:E.content.primary})]})):t(m,{disabled:Se,options:ie,isSearchable:!1,onSelect:De,defaultOptions:ne?[Object.assign(Object.assign({},ne),{selected:!0})]:[]})})),("custom_text"===(null==ne?void 0:ne.value)||"custom_link"===(null==ne?void 0:ne.value))&&t(v,{state:Se?"disabled":"none",labelText:"custom_text"===(null==ne?void 0:ne.value)?"Custom text value":"custom_link"===(null==ne?void 0:ne.value)?"Custom URL value":"",id:`variable-value-${null==ne?void 0:ne.value}-${q}`,value:te,errorMessage:be&&(null===(R=null==Ae?void 0:Ae.buttons)||void 0===R?void 0:R.includes(null!==(I=null==Z?void 0:Z.index)&&void 0!==I?I:-1))?te&&0!==te.trim().length?"custom_link"!==ne.value||/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$/.test(`https://${te.trim()}`)&&0!==te.trim().length?"custom_link"!==ne.value&&te.length>30?"Length cannot be more than 30":"BUTTONS"===K&&"custom_link"!==ne.value?"Enter valid alpha numeric code":"":"Enter valid URL":"Required field":"",maxCharLimit:Be||("custom_link"===(null==ne?void 0:ne.value)?2e3:"BUTTONS"===K?15:30),noKeyDownChange:!0,prefixText:"custom_link"===(null==ne?void 0:ne.value)?"https://":"",placeholder:"link"===Z.type||"custom_link"===ne.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{Ue(ne.value,e)}}),"static_expiry"===(null==ne?void 0:ne.value)&&e("div",Object.assign({style:{position:"relative"}},{children:[(Se||Le)&&e(B,Object.assign({onClick:e=>e.preventDefault(),style:{display:"flex",justifyContent:"space-between"}},{children:[t(L,{}),t(L,{})]})),t(p,{placement:"auto",time:n(te?new Date(te):new Date,"hh:mm a"),date:te?new Date(te):new Date,minDate:new Date,error:"",setError:()=>{},onChange:e=>{Ue("static_expiry",e.toISOString())}})]})),"static_expiry"===(null==ne?void 0:ne.value)&&Pe&&t("div",Object.assign({style:{marginTop:8}},{children:t(r,{containerStyle:{padding:"4px 8px"},icon:()=>t(a,{width:16,height:16,color:E.content.secondary}),type:c.NEUTRAL,text:"Please use the same expiration code that you applied when creating\nthe code on Shopify"})})),"link"===Z.type&&"custom_link"!==(null==ne?void 0:ne.value)&&!Ce&&!Ve&&_e===x.CHATBOT&&t(k,{isError:null!==($=null===(W=null==Ae?void 0:Ae.buttons)||void 0===W?void 0:W.includes(null!==(Y=null==Z?void 0:Z.index)&&void 0!==Y?Y:-1))&&void 0!==$&&$,params:null!==(M=Z.queryParams)&&void 0!==M?M:[],onChange:e=>{He(Z.updatedValue,"link",e)},variableValue:Z.updatedValue})]}))};export{A as Container,U as default};
+`,Y={value:"custom_link",label:"Custom URL"},$={value:"custom_text",label:"Custom text"},M={value:"static_expiry",label:"Static Expiry"},z=s=>{var P,B,L,w,D,U,j,z,Z;const{onFocus:q,variable:G,index:F,showVariableModal:K,setShowDiscountCheckBox:Q,componentType:J,CTAoptions:X,buttonType:ee}=s,[le,te]=u(!1),[ae,oe]=u(""),[ne,ie]=u([]),[ue,re]=u(),[se,pe]=u(!1),{variableList:de,setVariableList:me,setVariableCallback:ce,setShowVariablePicker:ve,device:be,channel:ye,isError:xe,originalVariableList:he,template:fe,templateSelectionTriggered:Te,setTemplate:_e,setDisplayContent:ge,setOriginalVariableList:Ee,globalNormalizedPlaceholders:Ce,enabledCustomText:Se,pod:Ve,selectedCarouselIndex:ke,isProductCarouselType:Oe,isWhatsappCarousel:Ae,disableEditVariable:Pe,disableEditExpiry:Be,templateErrorIndexes:Le,maxCharLimit:we,disableDatePicker:De,showDiscountCodeExpiryInfo:Ue,cardIndex:je=1}=V();function He(e,l){var t,a,o,n;const i=e;oe(""),re(i),ye===h.WHATSAPP||ye===h.RCS?"custom_text"!==i.value&&"custom_link"!==i.value&&"static_expiry"!==i.value?(Ie(null!=(t=i.value)?t:"","string"),null==Re||Re(null!=(a=G.index)?a:0,i.value,!0)):(null==Re||Re(null!=(o=G.index)?o:0,"",!0,i.value),Ie("","url"===i.bikPlaceholderType?"link":"string")):"custom_text"!==i.value&&"custom_link"!==i.value?(Ie(i.value,"url"===i.bikPlaceholderType?"link":"string"),ye==h.WEBPUSH&&(null==Ye||Ye(null!=(n=G.index)?n:0,i.value))):(oe(""),Ie("",i.value))}function Ne(e,l){var t,a;oe(l);const o="custom_link"===(null==ue?void 0:ue.value)&&l?l.includes("https")?l:`https://${l}`:l;Ie(o,"static_expiry"===e?"string":e),ye!==h.WHATSAPP&&ye!==h.RCS||null==Re||Re(null!=(t=G.index)?t:0,o,"custom_link"===e||Ve===T.CHATBOT&&"custom_text"===e,e),ye===h.WEBPUSH&&(null==Ye||Ye(null!=(a=G.index)?a:0,o))}function Ie(e,l,t){var a,o,n,u,r;const s="custom_link"===l?"link":"custom_text"===l?"string":l;if(ye!==h.WHATSAPP&&ye!==h.WEBPUSH&&ye!==h.RCS){const t=O(F+1),o=null==document?void 0:document.getElementById("mobile"===be?"template_html_mobile":"template_html_desktop"),n=ye===h.EMAIL?null==(a=null==o?void 0:o.contentWindow)?void 0:a.document.getElementById(t):document.getElementById(t);n&&(n.textContent="custom_text"!==l&&"custom_link"!==l||e?e:G.variableName);const i=he.map(((l,t)=>t===F?N(H({},l),{type:s,updatedValue:e}):l));null==Ee||Ee(i)}if(ye===h.WEBPUSH){const l=he,t=l=>null==l?void 0:l.map(((l,t)=>t===F?N(H({},l),{type:s,updatedValue:e}):l)),a={BODY:"BODY"===J?t(l.body):l.body,TITLE:J===f.TITLE.toUpperCase()?t(l.title):l.title};null==Ee||Ee((e=>N(H({},e),{title:a.TITLE,body:a.BODY,buttons:l.buttons})))}if(ye===h.WHATSAPP||ye===h.RCS){if(null!=ke&&ke>-1&&Oe){const t=H({},he).cards.map(((t,a)=>{var o,n,i;return"BODY"===J?N(H({},t),{body:null==(o=t.body)?void 0:o.map(((l,t)=>F===t?N(H({},l),{type:s,updatedValue:e}):l))}):"TITLE"===J?N(H({},t),{title:null==(n=t.title)?void 0:n.map(((l,t)=>F===t?N(H({},l),{type:s,updatedValue:e}):l))}):"BUTTONS"===J?N(H({},t),{buttons:null==(i=t.buttons)?void 0:i.map(((t,a)=>a===F?N(H({},t),{buttonVariable:"custom_link"===l?"((customPlaceholderName))":e,example:"COPY_CODE"===t.type?e:[e]}):t))}):t}));return void(null==Ee||Ee((e=>N(H({},e),{cards:t}))))}const a=null!=ke&&ke>-1?he.cards[ke]:he;let p=a.body,d=a.title,m=a.header,c=a.buttons;if("BODY"===J?p=null==(o=a.body)?void 0:o.map(((l,t)=>t===F?N(H({},l),{type:s,updatedValue:e}):l)):"TITLE"===J?d=null==(n=null==a?void 0:a.title)?void 0:n.map(((l,t)=>t===F?N(H({},l),{type:s,updatedValue:e}):l)):"HEADER"===J?m=null==(u=a.header)?void 0:u.map(((l,t)=>t===F?N(H({},l),{type:s,updatedValue:e}):l)):"BUTTONS"===J&&(c=null==(r=a.buttons)?void 0:r.map(((a,o)=>o===F?N(H({},a),{buttonVariable:"custom_link"===l?"((customPlaceholderName))":e,example:"COPY_CODE"===a.type?e:[e],queryParams:null!=t?t:[]}):a))),null!=ke&&ke>-1){const e=i(he.cards);e[ke]={header:m,body:p,buttons:c,title:d},null==Ee||Ee((l=>N(H({},l),{cards:e})))}else null==Ee||Ee((e=>N(H({},e),{header:m,body:p,buttons:c,title:d})))}}function Re(e,l,t,a){var o,n,u,r,s,p,d,m,c,v,b,y;if(null!=ke&&ke>-1&&Oe){const n=H({},fe).components.map((t=>{var a;return x(t.type)?N(H({},t),{cards:null==(a=t.cards)?void 0:a.map((t=>N(H({},t),{components:t.components.map((t=>{var a,o,n,i,u,r,s,p,d,m,c;if("BODY"===t.type&&"BODY"===J){if(null==(o=null==(a=t.example)?void 0:a.body_text)?void 0:o[0]){const a=[...null!=(u=null==(i=null==(n=t.example)?void 0:n.body_text)?void 0:i[0])?u:[]];a[e]=l.replace("{{","").replace("}}","").replace("((","").replace("))","");const o=N(H({},t.example),{body_text:[a]});return N(H({},t),{example:o})}return t}if("TITLE"===t.type&&"TITLE"===J){if(null==(s=null==(r=t.example)?void 0:r.title_text)?void 0:s[0]){const a=[...null!=(m=null==(d=null==(p=t.example)?void 0:p.title_text)?void 0:d[0])?m:[]];a[e]=l.replace("{{","").replace("}}","").replace("((","").replace("))","");const o=N(H({},t.example),{title_text:[a]});return N(H({},t),{example:o})}return t}if("BUTTONS"===t.type&&"BUTTONS"===J){const a=null==(c=t.buttons)?void 0:c.map(((t,a)=>a===e?N(H({},t),{example:[l]}):t));return a?N(H({},t),{buttons:a}):t}return t}))})))}):t})),u=i(fe);if(t){const t=null==(o=H({},fe).mapping.cards)?void 0:o.map(((t,o)=>{var n,i,u,r;if("BODY"===J)return N(H({},t),{body:null==(n=t.body)?void 0:n.map(((t,o)=>e===o?"custom_text"===a?`((editableVariable${o+10}))`:l:t))});if("TITLE"===J)return N(H({},t),{title:null==(i=null==t?void 0:t.title)?void 0:i.map(((t,o)=>e===o?"custom_text"===a?`((editableVariable${o+10}))`:l:t))});if("BUTTONS"===J&&(null==t?void 0:t.buttons)){let n=-1,i=-1;return null==(u=fe.components[je].cards)||u[o].components.forEach((l=>{var t;"BUTTONS"===l.type&&(null==(t=l.buttons)||t.forEach(((l,t)=>{"URL"===l.type&&(n++,t===e&&"URL"==l.type&&(i=n))})))})),N(H({},t),{buttons:null==(r=t.buttons)?void 0:r.map(((e,t)=>t===i?"custom_link"===a?"((customPlaceholderName))":l:e))})}return t}));u.mapping.cards=t}return u.components=n,void(null==_e||_e(u))}const h=null!=ke&&ke>-1?{components:null==(n=H({},fe).components[je].cards)?void 0:n[ke].components,mapping:null==(u=H({},fe).mapping.cards)?void 0:u[ke]}:H({},fe),f=null==(r=null==h?void 0:h.components)?void 0:r.map((t=>{var a,o,n,i,u,r,s,p,d,m,c,v,b,y,x,h;const f=H({},t);if("BODY"===t.type&&"BODY"===J&&(Array.isArray(null==(a=t.example)?void 0:a.body_text)||(null==(n=null==(o=t.example)?void 0:o.body_text)?void 0:n[0]))){const t=[...null!=(r=null==(u=null==(i=f.example)?void 0:i.body_text)?void 0:u[0])?r:[]];t[e]=l.replace("{{","").replace("}}","").replace("((","").replace("))","");const a=N(H({},f.example),{body_text:[t]});return N(H({},f),{example:a})}if("TITLE"===t.type&&"TITLE"===J){if(Array.isArray(null==(s=t.example)?void 0:s.title_text)||(null==(d=null==(p=t.example)?void 0:p.title_text)?void 0:d[0])){const t=[...null!=(v=null==(c=null==(m=f.example)?void 0:m.title_text)?void 0:c[0])?v:[]];t[e]=l.replace("{{","").replace("}}","").replace("((","").replace("))","");const a=N(H({},f.example),{title_text:[t]});return N(H({},f),{example:a})}}else if("HEADER"===t.type&&"HEADER"===J){if(null==(b=t.example)?void 0:b.header_text){const t=[...null!=(x=null==(y=f.example)?void 0:y.header_text)?x:[]];t[e]=l.replace("{{","").replace("}}","").replace("((","").replace("))","");const a=N(H({},f.example),{header_text:t});return N(H({},f),{example:a})}}else{if("BUTTONS"===t.type&&"BUTTONS"===J){const a=null==(h=t.buttons)?void 0:h.map(((t,a)=>a===e?N(H({},t),{example:"COPY_CODE"===t.type?l:[l]}):t));return a?N(H({},f),{buttons:a}):f}if("limited_time_offer"===t.type&&"limited_time_offer"===J)return N(H({},f),{example:N(H({},f.example),{limited_time_offer:l})})}return t}));if(h.components=f,t)if("BODY"===J&&(null==(s=null==h?void 0:h.mapping)?void 0:s.body))h.mapping=N(H({},h.mapping),{body:null==(d=null==(p=h.mapping)?void 0:p.body)?void 0:d.map(((t,o)=>e===o?"custom_text"===a?`((editableVariable${o+10}))`:l:t))});else if("TITLE"===J&&(null==(m=null==h?void 0:h.mapping)?void 0:m.title))h.mapping=N(H({},h.mapping),{title:null==(v=null==(c=h.mapping)?void 0:c.title)?void 0:v.map(((t,o)=>e===o?"custom_text"===a?`((editableVariable${o+10}))`:l:t))});else if("HEADER"===J&&(null==(b=null==h?void 0:h.mapping)?void 0:b.header))h.mapping=N(H({},h.mapping),{header:h.mapping.header.map(((t,o)=>e===o?"custom_text"===a?`((editableVariable${o+20}))`:l:t))});else if("BUTTONS"===J&&(null==(y=null==h?void 0:h.mapping)?void 0:y.buttons)){let t=-1,o=-1;f.forEach((l=>{var a;"BUTTONS"===l.type&&(null==(a=l.buttons)||a.forEach(((l,a)=>{"URL"===l.type&&(t++,a===e&&"URL"==l.type&&(o=t))})))})),h.mapping=N(H({},h.mapping),{buttons:h.mapping.buttons.map(((e,t)=>t===o?"custom_link"===a?"((customPlaceholderName))":l:e))})}if(null!=ke&&ke>-1&&fe){const e=i(fe);e.components[je].cards[ke].components=h.components,e.mapping.cards[ke]=h.mapping,null==_e||_e(e)}else null==_e||_e(H({},h))}r((()=>{le&&(null==q||q())}),[le]),r((()=>{!function(){var e,l,t,a,o;const n="mobile"===be?"template_html_mobile":"template_html_desktop",i=document.getElementById(n),u=(null!=(a=null==(t=null==(l=null==(e=null==i?void 0:i.contentWindow)?void 0:e.document)?void 0:l.body)?void 0:t.innerHTML)?a:"")+(null==(o=null==i?void 0:i.contentWindow)?void 0:o.document.head.innerHTML);ye===h.EMAIL&&(null==ge||ge(u))}()}),[Te]),r((()=>{!function(){var e,l;const t=[];let a=[];if(ye!==h.MESSAGE||Se){"link"===(null==G?void 0:G.type)?(t.push({label:"",options:[Y,$]}),re(Y)):"date_time"===(null==G?void 0:G.type)?(t.push({label:"",options:[Y,$]}),re(M)):(t.push({label:"",options:[Y,$,M]}),re($));const e=null!=Ce?Ce:[];ie([...t,...e.map((e=>{var l,t;return N(H({},e),{label:C.toCapitilize(null==(t=null==(l=e.label)?void 0:l.replace(/([A-Z])/g," $1"))?void 0:t.toLowerCase())})}))]),a=[...t,...e]}else{const e=null!=Ce?Ce:[];ie([{label:"",options:[$,Y]},...e]),a=[{label:"",options:[$,Y]},...e]}if((ye===h.WHATSAPP||ye===h.EMAIL||ye===h.MESSAGE||ye===h.WEBPUSH||ye===h.RCS)&&G.updatedValue)if(y.test(G.updatedValue)&&(ye===h.WHATSAPP||ye===h.RCS)||G.updatedValue.startsWith("{{")&&ye!==h.WHATSAPP&&ye!==h.RCS){const e=function(e,l,t){var a;let o={label:"",value:""};const n=t===(h.WHATSAPP||h.RCS)?e.updatedValue.replace("[[","").replace("]]",""):e.updatedValue.replace("{{","").replace("}}","");if(K){let l=e.updatedValue;if(Ve===T.CHATBOT&&"BUTTONS"===J){const t=null==X?void 0:X.filter((l=>l.placeHolder===e.updatedValue));t&&t.length>0&&(l=t[0].label)}o={label:l?l.replace("{{","").replace("}}","").trim().replace("."," "):"",value:null!=(a=e.updatedValue)?a:""}}else l.map((e=>{e.options.map((e=>{var l;(null==(l=e.value)?void 0:l.replace("{{","").replace("}}","").trim())===n.trim()&&(o=e)}))}));return o}(G,a,ye);e.value&&re(e)}else"date_time"===G.type?(re(M),oe(G.updatedValue),Re(null!=(e=G.index)?e:0,G.updatedValue)):(null==(l=G.updatedValue)?void 0:l.startsWith("https"))?(re(Y),oe(G.updatedValue.split("https://")[1])):(re($),oe(G.updatedValue))}()}),[ke]),r((()=>{be&&ue&&ae&&setTimeout((()=>{Ie("custom_link"===(null==ue?void 0:ue.value)&&ae?ae.includes("https")?ae:`https://${ae}`:ae,ue.value)}),100)}),[be]),r((()=>{!se&&ue&&G.updatedValue&&setTimeout((()=>{Ie("custom_link"===(null==ue?void 0:ue.value)&&G.updatedValue?G.updatedValue.includes("https")?G.updatedValue:`https://${G.updatedValue}`:G.updatedValue,ue.value),pe(!0)}),100)}),[ue]);const We=e=>{null==Q||Q(!1),"{{custom.url}}"===e.actualValue?He({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?He({label:e.displayName,selected:!0,value:"custom_text"}):"{{static.expiry}}"==e.actualValue?He({label:e.displayName,selected:!0,value:"static_expiry"}):He({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})};function Ye(e,l){var t;const a=i(fe),o=J.toLocaleLowerCase();(null==(t=a.webpushBroadcastConfig)?void 0:t[o])&&(a.webpushBroadcastConfig[o][e]=l),null==_e||_e(H({},a))}return e(I,{channel:ye,focused:le,onMouseEnter:()=>te(!0),onMouseLeave:()=>te(!1),children:[l("div",{style:{marginBottom:8},children:e(g,{style:{color:xe&&!ue?S.content.negative:S.content.primary},children:[null==(P=G.variableName)?void 0:P.replace("{{","").replace("}}","")," ","link"===(null==G?void 0:G.type)?"link":"variable"]})}),l("div",{style:{marginBottom:12},children:K?e("div",{style:{display:"flex",border:"#E0E0E0 1px solid",borderRadius:4,padding:10,justifyContent:(null==ue?void 0:ue.label)?"space-between":"flex-end",backgroundColor:"date_time"===(null==G?void 0:G.type)&&Be?S.background.base:void 0},children:[l(E,{numberOfLines:1,children:Ve===T.CHATBOT?["static_expiry","custom_text","custom_link"].includes(null!=(B=null==ue?void 0:ue.value)?B:"")?null==ue?void 0:ue.label:null==ue?void 0:ue.value:b(null!=(L=null==ue?void 0:ue.label)?L:"",20,!0)}),Pe||"date_time"===(null==G?void 0:G.type)&&Be?l(t,{}):l(a,{onClick:()=>{(()=>{let e=Array.isArray(de)?[...de]:[];const l=(l,t,a)=>{const o=k({variableList:e,categoryDisplayName:l,variableDisplayName:t,variableValue:a});Array.isArray(o)&&(e=o)};Ve===T.CHATBOT&&ee!==_.URL&&"limited_time_offer"!==J&&l("Custom Variables","Custom Text","{{custom.text}}"),ee===_.URL&&Ve===T.CHATBOT?l("Custom Variables","Custom URL","{{custom.url}}"):"limited_time_offer"===J?l("Static Variables","Static Expiry","{{static.expiry}}"):ee===_.COPY_CODE&&l("Custom Variables","Custom Text","{{custom.text}}"),me(e)})(),ce((()=>We)),ve(!0)},width:24,height:24,color:S.content.primary})]}):l(c,{disabled:Pe,options:ne,isSearchable:!1,onSelect:He,defaultOptions:ue?[N(H({},ue),{selected:!0})]:[]})}),("custom_text"===(null==ue?void 0:ue.value)||"custom_link"===(null==ue?void 0:ue.value))&&l(v,{state:Pe?"disabled":"none",labelText:"custom_text"===(null==ue?void 0:ue.value)?"Custom text value":"custom_link"===(null==ue?void 0:ue.value)?"Custom URL value":"",id:`variable-value-${null==ue?void 0:ue.value}-${F}`,value:ae,errorMessage:xe&&(null==(D=null==Le?void 0:Le.buttons)?void 0:D.includes(null!=(w=null==G?void 0:G.index)?w:-1))?ae&&0!==ae.trim().length?"custom_link"!==ue.value||/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$/.test(`https://${ae.trim()}`)&&0!==ae.trim().length?"custom_link"!==ue.value&&ae.length>30?"Length cannot be more than 30":"BUTTONS"===J&&"custom_link"!==ue.value?"Enter valid alpha numeric code":"":"Enter valid URL":"Required field":"",maxCharLimit:we||("custom_link"===(null==ue?void 0:ue.value)?2e3:"BUTTONS"===J?15:30),noKeyDownChange:!0,prefixText:"custom_link"===(null==ue?void 0:ue.value)?"https://":"",placeholder:"link"===G.type||"custom_link"===ue.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{Ne(ue.value,e)}}),"static_expiry"===(null==ue?void 0:ue.value)&&e("div",{style:{position:"relative"},children:[(Pe||De)&&e(R,{onClick:e=>e.preventDefault(),style:{display:"flex",justifyContent:"space-between"},children:[l(W,{}),l(W,{})]}),l(m,{placement:"auto",time:n(ae?new Date(ae):new Date,"hh:mm a"),date:ae?new Date(ae):new Date,minDate:new Date,error:"",setError:()=>{},onChange:e=>{Ne("static_expiry",e.toISOString())}})]}),"static_expiry"===(null==ue?void 0:ue.value)&&Ue&&l("div",{style:{marginTop:8},children:l(p,{containerStyle:{padding:"4px 8px"},icon:()=>l(o,{width:16,height:16,color:S.content.secondary}),type:d.NEUTRAL,text:"Please use the same expiration code that you applied when creating\nthe code on Shopify"})}),"link"===G.type&&"custom_link"!==(null==ue?void 0:ue.value)&&!Oe&&!Ae&&Ve===T.CHATBOT&&l(A,{isError:null!=(z=null==(j=null==Le?void 0:Le.buttons)?void 0:j.includes(null!=(U=null==G?void 0:G.index)?U:-1))&&z,params:null!=(Z=G.queryParams)?Z:[],onChange:e=>{Ie(G.updatedValue,"link",e)},variableValue:G.updatedValue})]})};export{I as Container,z as default};

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

@@ -1 +1 @@
-import{jsx as e,jsxs as i,Fragment as t}from"react/jsx-runtime";import{Input as a}from"../../input/Input.js";import"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import{COLORS as l}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 r}from"../../template-preview/models/Channels.js";import{BodySecondary as o}from"../../TypographyStyle.js";import{useTemplateModalContext as n}from"../context/templateModalContext.js";import p from"./VariableConnector.js";const d=d=>{var s,m,v,c,b,h,u;const{descriptionComponent:x,type:f,showVariableModal:j,originalList:y,channel:T}=d,{originalVariableList:w,disableEditVariable:E,selectedCarouselIndex:g,initialExpiryDateTime:C}=n();let L=w;T&&(T==r.WHATSAPP||T==r.RCS)&&y&&(L=y);const V=x.type;if("BODY"===V||"TITLE"===V.toLocaleUpperCase())return e("div",{children:null===(m=null!=g&&g>-1?"TITLE"===V.toLocaleUpperCase()?null===(s=L.cards[g])||void 0===s?void 0:s.title:L.cards[g].body:"TITLE"===V.toLocaleUpperCase()?(r.RCS,null==L?void 0:L.title):null==L?void 0:L.body)||void 0===m?void 0:m.map(((t,r)=>E||!t.isEditableVariable?i("div",Object.assign({style:{margin:"16px 8px"}},{children:[i(o,Object.assign({style:{color:l.content.primary}},{children:["HEADER"===f?"Header":""," Locked variable ",r+1]})),e(a,{state:"disabled",placeholder:t.variableName,onChangeText:()=>{}})]}),r):e(p,{index:r,variable:t,showVariableModal:j,componentType:V},`${r}-${t.index}`)))});if("HEADER"===V)return e("div",{children:null===(v=null!=g&&g>-1?L.cards[g].header:null==L?void 0:L.header)||void 0===v?void 0:v.map(((t,r)=>t.isEditableVariable?e(p,{index:r,variable:t,showVariableModal:j,componentType:V},`${r}-${t.index}`):i("div",Object.assign({style:{margin:"16px 8px"}},{children:[i(o,Object.assign({style:{color:l.content.primary}},{children:["HEADER"===f?"Header":""," Locked variable ",r+1]})),e(a,{state:"disabled",placeholder:t.variableName,onChangeText:()=>{}})]}),r)))});if("limited_time_offer"===V){let i=null!==(b=null===(c=x.example)||void 0===c?void 0:c.limited_time_offer)&&void 0!==b?b:(new Date).toISOString();return C&&(i=new Date(C).toISOString()),e("div",{children:e(p,{index:0,variable:{variableName:null!==(u=null===(h=null==x?void 0:x.limited_time_offer)||void 0===h?void 0:h.text)&&void 0!==u?u:"Expires after",updatedValue:i,type:"date_time",isEditableVariable:!0,index:0},showVariableModal:j,componentType:V},`${V}`)})}return e(t,{})};export{d as default};
+import{jsx as e,jsxs as i,Fragment as a}from"react/jsx-runtime";import{Input as t}from"../../input/Input.js";import"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import{COLORS as l}from"../../../constants/Theme.js";import"../../curtain/CurtainHelper.js";import{CHANNEL_TYPE as r}from"../../template-preview/models/Channels.js";import{BodySecondary as o}from"../../TypographyStyle.js";import{useTemplateModalContext as n}from"../context/templateModalContext.js";import p from"./VariableConnector.js";const d=d=>{var s,m,c,v,b,u,h;const{descriptionComponent:x,type:f,showVariableModal:y,originalList:T,channel:E}=d,{originalVariableList:w,disableEditVariable:C,selectedCarouselIndex:L,initialExpiryDateTime:V}=n();let j=w;E&&(E==r.WHATSAPP||E==r.RCS)&&T&&(j=T);const g=x.type;if("BODY"===g||"TITLE"===g.toLocaleUpperCase())return e("div",{children:null==(m=null!=L&&L>-1?"TITLE"===g.toLocaleUpperCase()?null==(s=j.cards[L])?void 0:s.title:j.cards[L].body:"TITLE"===g.toLocaleUpperCase()?(r.RCS,null==j?void 0:j.title):null==j?void 0:j.body)?void 0:m.map(((a,r)=>C||!a.isEditableVariable?i("div",{style:{margin:"16px 8px"},children:[i(o,{style:{color:l.content.primary},children:["HEADER"===f?"Header":""," Locked variable ",r+1]}),e(t,{state:"disabled",placeholder:a.variableName,onChangeText:()=>{}})]},r):e(p,{index:r,variable:a,showVariableModal:y,componentType:g},`${r}-${a.index}`)))});if("HEADER"===g)return e("div",{children:null==(c=null!=L&&L>-1?j.cards[L].header:null==j?void 0:j.header)?void 0:c.map(((a,r)=>a.isEditableVariable?e(p,{index:r,variable:a,showVariableModal:y,componentType:g},`${r}-${a.index}`):i("div",{style:{margin:"16px 8px"},children:[i(o,{style:{color:l.content.primary},children:["HEADER"===f?"Header":""," Locked variable ",r+1]}),e(t,{state:"disabled",placeholder:a.variableName,onChangeText:()=>{}})]},r)))});if("limited_time_offer"===g){let i=null!=(b=null==(v=x.example)?void 0:v.limited_time_offer)?b:(new Date).toISOString();return V&&(i=new Date(V).toISOString()),e("div",{children:e(p,{index:0,variable:{variableName:null!=(h=null==(u=null==x?void 0:x.limited_time_offer)?void 0:u.text)?h:"Expires after",updatedValue:i,type:"date_time",isEditableVariable:!0,index:0},showVariableModal:y,componentType:g},`${g}`)})}return e(a,{})};export{d as default};

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

@@ -1,8 +1,8 @@
-import{jsxs as e,jsx as i}from"react/jsx-runtime";import t from"../../../assets/icons/info.svg.js";import{useState as o,useRef as a,useEffect as r}from"react";import n from"styled-components";import{CheckBox as l}from"../../checkBox/CheckBox.js";import{Input as s}from"../../input/Input.js";import{Tooltip as c}from"../../tooltips/Tooltip.js";import{TitleRegular as d,BodySecondary as p,TitleSmall as h}from"../../TypographyStyle.js";import{COLORS as m}from"../../../constants/Theme.js";import g from"../../../assets/icons/plus.svg.js";import{useTemplateModalContext as b}from"../context/templateModalContext.js";import u from"./VariableConnector.js";const f=n.div`
+import{jsxs as e,jsx as i}from"react/jsx-runtime";import o from"../../../assets/icons/info.svg.js";import{useState as t,useRef as r,useEffect as l}from"react";import a from"styled-components";import{CheckBox as n}from"../../checkBox/CheckBox.js";import{Input as d}from"../../input/Input.js";import{Tooltip as c}from"../../tooltips/Tooltip.js";import{TitleRegular as s,BodySecondary as p,TitleSmall as h}from"../../TypographyStyle.js";import{COLORS as m}from"../../../constants/Theme.js";import u from"../../../assets/icons/plus.svg.js";import{useTemplateModalContext as f}from"../context/templateModalContext.js";import g from"./VariableConnector.js";const x=a.div`
 	display: flex;
 	flex-direction: column;
 	height: 100%;
-`,x=n=>{let{onFocus:x,showVariableModal:v,discountCode:j,setDiscountCode:O}=n;const{originalVariableList:k,disableEditVariable:w,setVariableCallback:V,setShowVariablePicker:C}=b(),[T,B]=o(!1),[E,L]=o(!1),[D,F]=o(""),[I,M]=o(!1),N=a(),S=a();r((()=>{O&&O(j+D)}),[D]);r((()=>{k.some((e=>"checkout.checkoutUrl"===e.updatedValue.replace("{{","").replace("}}","")))?(B(!0),j&&M(!0)):(B(!1),null==M||M(!1),null==O||O(""))}),[k]);const A=e=>{F(e.actualValue)};return e(f,{children:[e("div",Object.assign({style:{padding:8}},{children:[e("div",Object.assign({style:{display:"flex",gap:8,alignItems:"center",marginBottom:4}},{children:[i(d,Object.assign({style:{color:m.content.primary}},{children:"Edit variables and links"})),i(c,Object.assign({body:"Variables are placeholder texts which can either be filled by data, eg: customer name or can have any custom text within them"},{children:i("div",Object.assign({style:{display:"flex"}},{children:i(t,{width:20,height:20,color:m.content.placeholder})}))}))]})),i(p,Object.assign({style:{color:m.content.secondary}},{children:"You can view variables and links on the left underlined in purple colour."}))]})),null==k?void 0:k.map(((t,o)=>!t.isEditableVariable||w?e("div",Object.assign({style:{margin:"16px 8px"}},{children:[e(p,Object.assign({style:{color:m.content.primary}},{children:["Locked variable ",o+1]})),i(s,{state:"disabled",placeholder:t.variableName,onChangeText:()=>{}})]}),o):i("div",Object.assign({style:{marginTop:16}},{children:i(u,{index:o,variable:t,onFocus:()=>null==x?void 0:x(o),showVariableModal:v,setShowDiscountCheckBox:B})}),o))),(T||j)&&e("div",Object.assign({style:{display:"flex",flexDirection:"row",marginLeft:10,marginTop:8}},{children:[i(l,{isChecked:I,onValueChange:()=>{I&&O&&O(""),M(!I)}}),i(h,Object.assign({style:{marginLeft:8}},{children:"Add discount code"}))]})),I&&e("div",Object.assign({ref:N,style:{margin:10}},{children:[i(s,{placeholder:"Enter your discount code",onChangeText:e=>{O&&O(e)},value:j,onFocus:()=>{L(!0)},onBlur:e=>{var i;"addVar"===(null===(i=e.relatedTarget)||void 0===i?void 0:i.id)?(N.current&&N.current.focus(),L(!0)):L(!1)},noErrorHint:!0,validate:e=>[!0,""]}),E&&i(y,Object.assign({ref:S,id:"addVar",onClick:e=>{e.stopPropagation(),V((()=>A)),C(!0)}},{children:e("div",Object.assign({className:"add"},{children:[i(g,{width:20,height:20,color:"white"}),i("div",Object.assign({className:"variable"},{children:"Add variable"}))]}))}))]}))]})},y=n.button`
+`,y=a=>{let{onFocus:y,showVariableModal:v,discountCode:k,setDiscountCode:w}=a;const{originalVariableList:V,disableEditVariable:C,setVariableCallback:j,setShowVariablePicker:T}=f(),[B,E]=t(!1),[L,D]=t(!1),[F,I]=t(""),[M,N]=t(!1),S=r(),A=r();l((()=>{w&&w(k+F)}),[F]);l((()=>{V.some((e=>"checkout.checkoutUrl"===e.updatedValue.replace("{{","").replace("}}","")))?(E(!0),k&&N(!0)):(E(!1),null==N||N(!1),null==w||w(""))}),[V]);const P=e=>{I(e.actualValue)};return e(x,{children:[e("div",{style:{padding:8},children:[e("div",{style:{display:"flex",gap:8,alignItems:"center",marginBottom:4},children:[i(s,{style:{color:m.content.primary},children:"Edit variables and links"}),i(c,{body:"Variables are placeholder texts which can either be filled by data, eg: customer name or can have any custom text within them",children:i("div",{style:{display:"flex"},children:i(o,{width:20,height:20,color:m.content.placeholder})})})]}),i(p,{style:{color:m.content.secondary},children:"You can view variables and links on the left underlined in purple colour."})]}),null==V?void 0:V.map(((o,t)=>!o.isEditableVariable||C?e("div",{style:{margin:"16px 8px"},children:[e(p,{style:{color:m.content.primary},children:["Locked variable ",t+1]}),i(d,{state:"disabled",placeholder:o.variableName,onChangeText:()=>{}})]},t):i("div",{style:{marginTop:16},children:i(g,{index:t,variable:o,onFocus:()=>null==y?void 0:y(t),showVariableModal:v,setShowDiscountCheckBox:E})},t))),(B||k)&&e("div",{style:{display:"flex",flexDirection:"row",marginLeft:10,marginTop:8},children:[i(n,{isChecked:M,onValueChange:()=>{M&&w&&w(""),N(!M)}}),i(h,{style:{marginLeft:8},children:"Add discount code"})]}),M&&e("div",{ref:S,style:{margin:10},children:[i(d,{placeholder:"Enter your discount code",onChangeText:e=>{w&&w(e)},value:k,onFocus:()=>{D(!0)},onBlur:e=>{var i;"addVar"===(null==(i=e.relatedTarget)?void 0:i.id)?(S.current&&S.current.focus(),D(!0)):D(!1)},noErrorHint:!0,validate:e=>[!0,""]}),L&&i(b,{ref:A,id:"addVar",onClick:e=>{e.stopPropagation(),j((()=>P)),T(!0)},children:e("div",{className:"add",children:[i(u,{width:20,height:20,color:"white"}),i("div",{className:"variable",children:"Add variable"})]})})]})]})},b=a.button`
 	padding: 2px 8px;
 	cursor: pointer;
 	color: white;
@@ -25,4 +25,4 @@ import{jsxs as e,jsx as i}from"react/jsx-runtime";import t from"../../../assets/
 		align-items: center;
 		gap: 5px;
 	}
-`;export{y as AddVariableStyled,f as Container,x as default};
+`;export{b as AddVariableStyled,x as Container,y as default};

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

@@ -1,9 +1,9 @@
-import{jsxs as t,jsx as e}from"react/jsx-runtime";import o from"../../../assets/icons/info.svg.js";import i from"styled-components";import{Tooltip as n}from"../../tooltips/Tooltip.js";import{BodySecondary as r,TitleRegular as s}from"../../TypographyStyle.js";import{COLORS as l}from"../../../constants/Theme.js";const a=i(r)`
+import{jsxs as t,jsx as e}from"react/jsx-runtime";import o from"../../../assets/icons/info.svg.js";import r from"styled-components";import{Tooltip as i}from"../../tooltips/Tooltip.js";import{BodySecondary as n,TitleRegular as l}from"../../TypographyStyle.js";import{COLORS as p}from"../../../constants/Theme.js";var a=Object.defineProperty,c=Object.getOwnPropertySymbols,s=Object.prototype.hasOwnProperty,d=Object.prototype.propertyIsEnumerable,m=(t,e,o)=>e in t?a(t,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):t[e]=o,y=(t,e)=>{for(var o in e||(e={}))s.call(e,o)&&m(t,o,e[o]);if(c)for(var o of c(e))d.call(e,o)&&m(t,o,e[o]);return t};const h=r(n)`
 	line-height: 1.5 !important;
-`,c=i.div`
+`,f=r.div`
 	padding-top: 24px;
 	padding-left: 10px;
 	padding-right: 10px;
 	margin-bottom: 8px;
 	line-height: normal;
-`,p=i=>{let{headerText:r,subText:p,toolTipInfo:d,containerStyle:m}=i;return t(c,Object.assign({style:Object.assign({},m)},{children:[t("div",Object.assign({style:{display:"flex",gap:8}},{children:[e(s,Object.assign({style:{color:l.content.primary}},{children:r})),d&&e(n,Object.assign({body:d},{children:e("div",{children:e(o,{width:20,height:20,color:l.content.placeholder})})}))]})),e(a,Object.assign({style:{color:l.content.secondary,marginBottom:0,lineHeight:20,display:"block"}},{children:p}))]}))};export{p as default};
+`,g=r=>{let{headerText:n,subText:a,toolTipInfo:c,containerStyle:s}=r;return t(f,{style:y({},s),children:[t("div",{style:{display:"flex",gap:8},children:[e(l,{style:{color:p.content.primary},children:n}),c&&e(i,{body:c,children:e("div",{children:e(o,{width:20,height:20,color:p.content.placeholder})})})]}),e(h,{style:{color:p.content.secondary,marginBottom:0,lineHeight:20,display:"block"},children:a})]})};export{g as default};

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

@@ -1 +1 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import{cloneDeep as l}from"lodash";import{useState as s,useEffect as a}from"react";import{Dropdown as n}from"../../dropdown/Dropdown.js";import{Input as i}from"../../input/Input.js";import{editableVarPattern as o}from"../../template-preview/constants/regexPatterns.js";import{STATIC_URL_CTA_OPTION as r,CUSTOM_URL_NAME as u}from"../../template-preview/models/TemplateMeta.js";import{POD as c}from"../../template-preview/models/WhatsAppTemplate.js";import{BodySecondary as d}from"../../TypographyStyle.js";import{COLORS as b}from"../../../constants/Theme.js";import{useTemplateModalContext as p}from"../context/templateModalContext.js";import{STATIC_URL_VARIABLE_NAME as m}from"../utils/constants.js";import{validateIsUrl as j}from"../utils/validateIsUrl.js";import v,{Container as g}from"./VariableConnector.js";const O=O=>{let{variableListIndex:f,button:x,updateSelectedURLTemplateBtn:y,updateSelectedQRBTemplateBtn:h,currentVariableList:L,CTAoptions:R,QRBoptions:U,disableEdit:V}=O;var T,w,C,I,E;const[P,H]=s(""),[N,B]=s(),_=null==R?void 0:R.map((e=>Object.assign(Object.assign({},e),{selected:(null==N?void 0:N.value)===e.value&&N.label===e.label}))),Q=null==U?void 0:U.map((e=>Object.assign(Object.assign({},e),{selected:(null==N?void 0:N.value)===e.value}))),{isError:k,disableEditVariable:S,pod:K,selectedCarouselIndex:Y,originalVariableList:$,setOriginalVariableList:q,isProductCarouselType:A,ctaOptionsErrors:M,setCtaOptionsErrors:D}=p();function W(e){if(H(e),null!=Y&&Y>-1&&A){const t=l($);if("URL"===x.type){const l=t.cards.map((t=>{let l=t.buttons.filter((e=>"URL"===e.type))[f];l=Object.assign(Object.assign({},l),{buttonVariable:"((customPlaceholderName))",example:[`https://${e}`]});const s=t.buttons.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==l?void 0:l.text)?l:e));return Object.assign(Object.assign({},t),{buttons:s})}));null==q||q((e=>Object.assign(Object.assign({},e),{cards:l}))),null==y||y(`https://${e}`,"custom",f)}return}let t=L.buttons.filter((e=>"URL"===e.type))[f];t=Object.assign(Object.assign({},t),{buttonVariable:"((customPlaceholderName))",example:[`https://${e}`]});const s=L.buttons.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e)),a=Object.assign({},null!=Y&&Y>-1?$.cards[Y]:$);if(a.buttons=s,null!=Y&&Y>-1){const e=[...$.cards];e[Y]=a,null==q||q((t=>Object.assign(Object.assign({},t),{cards:e})))}else null==q||q((e=>Object.assign(Object.assign({},e),{buttons:[...s]})));null==y||y(`https://${e}`,"custom",f)}return a((()=>{var e;if(x.buttonVariable&&o.test(x.buttonVariable))x.buttonVariable===m?B(r):B(u),H((null===(e=x.example)||void 0===e?void 0:e[0].split("https://")[1])||"");else{let e=-1;const t="URL"===x.type?R:U;e="URL"===x.type?t.findIndex((e=>e.placeHolder===x.buttonVariable)):t.findIndex((e=>e.label===x.flowName)),e>-1?B(t[e]):null==D||D((e=>Object.assign(Object.assign({},e),{[f]:"Required field!"})))}}),[]),K!==c.CHATBOT?e(g,{children:[t("div",Object.assign({style:{marginBottom:8}},{children:e(d,Object.assign({style:{color:b.content.primary}},{children:[x.text," button"]}))})),t("div",Object.assign({style:{marginBottom:12}},{children:t(n,{disabled:S||V,truncatedText:!1,options:"URL"===x.type?"static_link"===(null==N?void 0:N.value)?[r]:_:Q,isSearchable:!0,onSelect:function(e,t){null==D||D((e=>(delete e[f],Object.assign({},e))));const s=e;B(s);const a=("URL"===x.type?R:U).find((e=>e.placeHolder===s.placeHolder));if(a)if("custom_link"!==a.value){if(null!=Y&&Y>-1&&A){const e=l($);if("URL"===x.type){const t=e.cards.map((e=>{let t=e.buttons.filter((e=>"URL"===e.type))[f];t=Object.assign(Object.assign({},t),{buttonVariable:s.placeHolder});const l=e.buttons.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e));return Object.assign(Object.assign({},e),{buttons:l})}));null==y||y({defaultValue:a.value,placeHolder:a.placeHolder},"placeholder",f),null==q||q((e=>Object.assign(Object.assign({},e),{cards:t})))}else if("QUICK_REPLY"===x.type){const t=e.cards.map((e=>{let t=e.buttons.filter((e=>"QUICK_REPLY"===e.type))[f];t=Object.assign(Object.assign({},t),{flowName:s.label,flowId:s.value});const l=e.buttons.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e));return Object.assign(Object.assign({},e),{buttons:l})}));null==h||h({flowName:s.label,flowId:s.value},"placeholder",f),null==q||q((e=>Object.assign(Object.assign({},e),{cards:t})))}return}let e;if("URL"===x.type){let t=L.buttons.filter((e=>"URL"===e.type))[f];t=Object.assign(Object.assign({},t),{buttonVariable:s.placeHolder,example:[(null==s?void 0:s.value)||"https://d.bik.ai/"]}),e=L.buttons.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e)),null==y||y({defaultValue:a.value,placeHolder:a.placeHolder},"placeholder",f)}else{let t=L.buttons.filter((e=>"QUICK_REPLY"===e.type))[f];t=Object.assign(Object.assign({},t),{flowName:s.label,flowId:s.value}),e=L.buttons.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e)),null==h||h({flowName:s.label,flowId:s.value},"placeholder",f)}const t=Object.assign({},null!=Y&&Y>-1?$.cards[Y]:$);if(t.buttons=e,null!=Y&&Y>-1){const e=[...$.cards];e[Y]=t,null==q||q((t=>Object.assign(Object.assign({},t),{cards:e})))}else null==q||q((t=>Object.assign(Object.assign({},t),{buttons:[...e]})))}else W("")},defaultOptions:N?[Object.assign(Object.assign({},N),{selected:!0})]:[],error:k?null==M?void 0:M[f]:void 0})})),("custom_link"===(null==N?void 0:N.value)||"static_link"===(null==N?void 0:N.value))&&t("div",Object.assign({style:{marginBottom:20}},{children:t(i,{state:S||V?"disabled":"none",errorMessage:k?P?j(P)?"":"Enter valid URL":"Required field":"",value:P,prefixText:"https://",placeholder:"Enter custom URL here",onChangeText:W,maxCharLimit:2e3})}))]}):t(v,{index:f,variable:{variableName:null!==(T=x.text)&&void 0!==T?T:"",updatedValue:"((customPlaceholderName))"===x.buttonVariable?`${null===(w=x.example)||void 0===w?void 0:w[0]}`:null!==(C=x.buttonVariable)&&void 0!==C?C:"",type:"link",isEditableVariable:!0,index:null!==(I=x.index)&&void 0!==I?I:0,queryParams:null!==(E=x.queryParams)&&void 0!==E?E:[]},showVariableModal:!0,componentType:"BUTTONS",buttonType:x.type,CTAoptions:R})};export{O as default};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import{cloneDeep as l}from"lodash";import{useState as o,useEffect as a}from"react";import{Dropdown as r}from"../../dropdown/Dropdown.js";import{Input as n}from"../../input/Input.js";import{editableVarPattern as i}from"../../template-preview/constants/regexPatterns.js";import{STATIC_URL_CTA_OPTION as s,CUSTOM_URL_NAME as u}from"../../template-preview/models/TemplateMeta.js";import{POD as p}from"../../template-preview/models/WhatsAppTemplate.js";import{BodySecondary as d}from"../../TypographyStyle.js";import{COLORS as c}from"../../../constants/Theme.js";import{useTemplateModalContext as m}from"../context/templateModalContext.js";import{STATIC_URL_VARIABLE_NAME as b}from"../utils/constants.js";import{validateIsUrl as f}from"../utils/validateIsUrl.js";import v,{Container as y}from"./VariableConnector.js";var x=Object.defineProperty,h=Object.defineProperties,L=Object.getOwnPropertyDescriptors,R=Object.getOwnPropertySymbols,U=Object.prototype.hasOwnProperty,V=Object.prototype.propertyIsEnumerable,w=(e,t,l)=>t in e?x(e,t,{enumerable:!0,configurable:!0,writable:!0,value:l}):e[t]=l,j=(e,t)=>{for(var l in t||(t={}))U.call(t,l)&&w(e,l,t[l]);if(R)for(var l of R(t))V.call(t,l)&&w(e,l,t[l]);return e},T=(e,t)=>h(e,L(t));const P=x=>{let{variableListIndex:h,button:L,updateSelectedURLTemplateBtn:R,updateSelectedQRBTemplateBtn:U,currentVariableList:V,CTAoptions:w,QRBoptions:P,disableEdit:I}=x;var C,O,E,g,H;const[N,B]=o(""),[_,Q]=o(),S=null==w?void 0:w.map((e=>T(j({},e),{selected:(null==_?void 0:_.value)===e.value&&_.label===e.label}))),k=null==P?void 0:P.map((e=>T(j({},e),{selected:(null==_?void 0:_.value)===e.value}))),{isError:K,disableEditVariable:Y,pod:$,selectedCarouselIndex:q,originalVariableList:A,setOriginalVariableList:M,isProductCarouselType:D,ctaOptionsErrors:W,setCtaOptionsErrors:z}=m();function F(e){if(B(e),null!=q&&q>-1&&D){const t=l(A);if("URL"===L.type){const l=t.cards.map((t=>{let l=t.buttons.filter((e=>"URL"===e.type))[h];l=T(j({},l),{buttonVariable:"((customPlaceholderName))",example:[`https://${e}`]});const o=t.buttons.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==l?void 0:l.text)?l:e));return T(j({},t),{buttons:o})}));null==M||M((e=>T(j({},e),{cards:l}))),null==R||R(`https://${e}`,"custom",h)}return}let t=V.buttons.filter((e=>"URL"===e.type))[h];t=T(j({},t),{buttonVariable:"((customPlaceholderName))",example:[`https://${e}`]});const o=V.buttons.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e)),a=j({},null!=q&&q>-1?A.cards[q]:A);if(a.buttons=o,null!=q&&q>-1){const e=[...A.cards];e[q]=a,null==M||M((t=>T(j({},t),{cards:e})))}else null==M||M((e=>T(j({},e),{buttons:[...o]})));null==R||R(`https://${e}`,"custom",h)}return a((()=>{var e;if(L.buttonVariable&&i.test(L.buttonVariable))L.buttonVariable===b?Q(s):Q(u),B((null==(e=L.example)?void 0:e[0].split("https://")[1])||"");else{let e=-1;const t="URL"===L.type?w:P;e="URL"===L.type?t.findIndex((e=>e.placeHolder===L.buttonVariable)):t.findIndex((e=>e.label===L.flowName)),e>-1?Q(t[e]):null==z||z((e=>T(j({},e),{[h]:"Required field!"})))}}),[]),$!==p.CHATBOT?e(y,{children:[t("div",{style:{marginBottom:8},children:e(d,{style:{color:c.content.primary},children:[L.text," button"]})}),t("div",{style:{marginBottom:12},children:t(r,{disabled:Y||I,truncatedText:!1,options:"URL"===L.type?"static_link"===(null==_?void 0:_.value)?[s]:S:k,isSearchable:!0,onSelect:function(e,t){null==z||z((e=>(delete e[h],j({},e))));const o=e;Q(o);const a=("URL"===L.type?w:P).find((e=>e.placeHolder===o.placeHolder));if(a)if("custom_link"!==a.value){if(null!=q&&q>-1&&D){const e=l(A);if("URL"===L.type){const t=e.cards.map((e=>{let t=e.buttons.filter((e=>"URL"===e.type))[h];t=T(j({},t),{buttonVariable:o.placeHolder});const l=e.buttons.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e));return T(j({},e),{buttons:l})}));null==R||R({defaultValue:a.value,placeHolder:a.placeHolder},"placeholder",h),null==M||M((e=>T(j({},e),{cards:t})))}else if("QUICK_REPLY"===L.type){const t=e.cards.map((e=>{let t=e.buttons.filter((e=>"QUICK_REPLY"===e.type))[h];t=T(j({},t),{flowName:o.label,flowId:o.value});const l=e.buttons.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e));return T(j({},e),{buttons:l})}));null==U||U({flowName:o.label,flowId:o.value},"placeholder",h),null==M||M((e=>T(j({},e),{cards:t})))}return}let e;if("URL"===L.type){let t=V.buttons.filter((e=>"URL"===e.type))[h];t=T(j({},t),{buttonVariable:o.placeHolder,example:[(null==o?void 0:o.value)||"https://d.bik.ai/"]}),e=V.buttons.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e)),null==R||R({defaultValue:a.value,placeHolder:a.placeHolder},"placeholder",h)}else{let t=V.buttons.filter((e=>"QUICK_REPLY"===e.type))[h];t=T(j({},t),{flowName:o.label,flowId:o.value}),e=V.buttons.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e)),null==U||U({flowName:o.label,flowId:o.value},"placeholder",h)}const t=j({},null!=q&&q>-1?A.cards[q]:A);if(t.buttons=e,null!=q&&q>-1){const e=[...A.cards];e[q]=t,null==M||M((t=>T(j({},t),{cards:e})))}else null==M||M((t=>T(j({},t),{buttons:[...e]})))}else F("")},defaultOptions:_?[T(j({},_),{selected:!0})]:[],error:K?null==W?void 0:W[h]:void 0})}),("custom_link"===(null==_?void 0:_.value)||"static_link"===(null==_?void 0:_.value))&&t("div",{style:{marginBottom:20},children:t(n,{state:Y||I?"disabled":"none",errorMessage:K?N?f(N)?"":"Enter valid URL":"Required field":"",value:N,prefixText:"https://",placeholder:"Enter custom URL here",onChangeText:F,maxCharLimit:2e3})})]}):t(v,{index:h,variable:{variableName:null!=(C=L.text)?C:"",updatedValue:"((customPlaceholderName))"===L.buttonVariable?`${null==(O=L.example)?void 0:O[0]}`:null!=(E=L.buttonVariable)?E:"",type:"link",isEditableVariable:!0,index:null!=(g=L.index)?g:0,queryParams:null!=(H=L.queryParams)?H:[]},showVariableModal:!0,componentType:"BUTTONS",buttonType:L.type,CTAoptions:w})};export{P as default};

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

@@ -1 +1 @@
-import{__awaiter as e}from"../../../_virtual/_tslib.js";import{cloneDeep as o}from"lodash";import{useState as i,useRef as n,useEffect as t}from"react";import{FileUploaderHelper as l}from"../../helpers/FileUploaderHelper.js";import{HEADER_TYPES as a}from"../../template-preview/models/TemplateMeta.js";import{useTemplateModalContext as s}from"../context/templateModalContext.js";import{isVariable as r}from"../utils/validateIsUrl.js";const d=d=>{const{uploadMediaLink:c,updateTemplateImageUrl:p,validateMimeType:m,mediaComponent:u,uploadMediaFiles:f,fileRef:v}=d,{template:g,selectedCarouselIndex:h,setTemplate:y}=s(),[b,I]=i(void 0),[M,j]=i(),[E,O]=i(!1),[U,C]=i(""),[T,k]=i(!1),[w,A]=i(),N=n(null);function x(o){var i;return e(this,void 0,void 0,(function*(){const e=new l;if(o instanceof Blob){if(m){const{isValid:e,mimeType:i}=yield m(o);if(!e)return void C(`MIME type ${i} is not supported`)}const n=e.validate({file:o});if(n)C(n),k(!1),O(!1);else{const e=u.format===a.IMAGE,n=yield f({file:o,fileName:b,isImage:e});if(n.success){const[e]=o.type.split("/");p(null!==(i=n.url)&&void 0!==i?i:"","application"===e?a.DOCUMENT:a[e.toUpperCase()])}else k(!1),C("An unknown technical error occurred");k(!1),O(!1)}}else C("An unknown technical error occurred"),k(!1)}))}function R(){var e;(null===(e=null==v?void 0:v.current)||void 0===e?void 0:e.click)&&v.current.click()}return t((()=>{I(void 0),A(void 0),j(void 0),O(!1),k(!1),C("")}),[h]),{uploadMedia:function(i){var n,t,s,d,m,f;return e(this,void 0,void 0,(function*(){if(C(""),j(""),i)if(i.startsWith("https"))try{if(k(!0),c){const e=yield c(i),{type:o,size:t,success:s}=e;if(s){const i=(new l).validate({linkData:{type:o,size:t}});if(i)return C(i),void k(!1);const[s]=o.split("/");p(null!==(n=e.url)&&void 0!==n?n:"",s.includes("application")?a.DOCUMENT:a[s.toUpperCase()])}else k(!1),C("An unknown technical error occurred");k(!1)}else{const e=yield fetch(i),o=yield e.blob();yield x(o)}}catch(e){k(!1),C("An unknown technical error occurred")}else if(r(i)){let e;if(j(i),e=null!=h&&h>-1?{components:null===(s=null===(t=g.components[1])||void 0===t?void 0:t.cards)||void 0===s?void 0:s[h].components,mapping:null===(m=null===(d=null==g?void 0:g.mapping)||void 0===d?void 0:d.cards)||void 0===m?void 0:m[h]}:Object.assign({},g),e.components){const o=null===(f=null==e?void 0:e.components)||void 0===f?void 0:f.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==o&&o>-1&&(null==e?void 0:e.components[o])){const n=Object.assign(Object.assign({},e.components[o]),{format:u.format,example:{header_handle:[i]}}),t=[...e.components];t[o]=n,e.components=t}}if(e.mapping&&(e.mapping=Object.assign(Object.assign({},e.mapping),{header:[i]})),k(!1),null!=h&&h>-1){const i=o(g);i.components[1].cards[h].components=e.components,i.mapping.cards[h]=e.mapping,null==y||y(Object.assign({},i))}else null==y||y(Object.assign({},e))}else k(!1),C("Invalid URL or variable");else R()}))},processImageUpload:x,handleImageUpload:function(e){var o;C(""),k(!0);const i=null===(o=e.target.files)||void 0===o?void 0:o[0];if(u.format===a.IMAGE){const e=new FileReader;A(""),I(""),e.onload=()=>{A(e.result),I(null==i?void 0:i.name)},i&&e.readAsDataURL(i)}else x(i)},handleImageChange:R,onCropComplete:function(o){return e(this,void 0,void 0,(function*(){k(!1),C("");const e=yield fetch(o),i=yield e.blob();yield x(i),A(void 0),O(!1)}))},editIconRef:N,fileName:b,setFileName:I,selectedVariable:M,setSelectedVariable:j,openEditMedia:E,setOpenEditMedia:O,selectedImage:w,setSelectedImage:A,loading:T,setLoading:k,error:U,setError:C}};export{d as useEditWhatsappTemplateMedia};
+import{cloneDeep as e}from"lodash";import{useState as n,useRef as t,useEffect as o}from"react";import{FileUploaderHelper as l}from"../../helpers/FileUploaderHelper.js";import{HEADER_TYPES as i}from"../../template-preview/models/TemplateMeta.js";import{useTemplateModalContext as r}from"../context/templateModalContext.js";import{isVariable as a}from"../utils/validateIsUrl.js";var s=Object.defineProperty,c=Object.defineProperties,p=Object.getOwnPropertyDescriptors,d=Object.getOwnPropertySymbols,m=Object.prototype.hasOwnProperty,u=Object.prototype.propertyIsEnumerable,f=(e,n,t)=>n in e?s(e,n,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[n]=t,v=(e,n)=>{for(var t in n||(n={}))m.call(n,t)&&f(e,t,n[t]);if(d)for(var t of d(n))u.call(n,t)&&f(e,t,n[t]);return e},y=(e,n)=>c(e,p(n)),h=(e,n,t)=>new Promise(((o,l)=>{var i=e=>{try{a(t.next(e))}catch(e){l(e)}},r=e=>{try{a(t.throw(e))}catch(e){l(e)}},a=e=>e.done?o(e.value):Promise.resolve(e.value).then(i,r);a((t=t.apply(e,n)).next())}));const g=s=>{const{uploadMediaLink:c,updateTemplateImageUrl:p,validateMimeType:d,mediaComponent:m,uploadMediaFiles:u,fileRef:f}=s,{template:g,selectedCarouselIndex:b,setTemplate:I}=r(),[w,M]=n(void 0),[E,O]=n(),[U,j]=n(!1),[C,T]=n(""),[k,x]=n(!1),[A,N]=n(),P=t(null);function D(e){return h(this,null,(function*(){var n;const t=new l;if(e instanceof Blob){if(d){const{isValid:n,mimeType:t}=yield d(e);if(!n)return void T(`MIME type ${t} is not supported`)}const o=t.validate({file:e});if(o)T(o),x(!1),j(!1);else{const t=m.format===i.IMAGE,o=yield u({file:e,fileName:w,isImage:t});if(o.success){const[t]=e.type.split("/");p(null!=(n=o.url)?n:"","application"===t?i.DOCUMENT:i[t.toUpperCase()])}else x(!1),T("An unknown technical error occurred");x(!1),j(!1)}}else T("An unknown technical error occurred"),x(!1)}))}function R(){var e;(null==(e=null==f?void 0:f.current)?void 0:e.click)&&f.current.click()}return o((()=>{M(void 0),N(void 0),O(void 0),j(!1),x(!1),T("")}),[b]),{uploadMedia:function(n){return h(this,null,(function*(){var t,o,r,s,d,u;if(T(""),O(""),n)if(n.startsWith("https"))try{if(x(!0),c){const e=yield c(n),{type:o,size:r,success:a}=e;if(a){const n=(new l).validate({linkData:{type:o,size:r}});if(n)return T(n),void x(!1);const[a]=o.split("/");p(null!=(t=e.url)?t:"",a.includes("application")?i.DOCUMENT:i[a.toUpperCase()])}else x(!1),T("An unknown technical error occurred");x(!1)}else{const e=yield fetch(n),t=yield e.blob();yield D(t)}}catch(e){x(!1),T("An unknown technical error occurred")}else if(a(n)){let t;if(O(n),t=null!=b&&b>-1?{components:null==(r=null==(o=g.components[1])?void 0:o.cards)?void 0:r[b].components,mapping:null==(d=null==(s=null==g?void 0:g.mapping)?void 0:s.cards)?void 0:d[b]}:v({},g),t.components){const e=null==(u=null==t?void 0:t.components)?void 0:u.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==e&&e>-1&&(null==t?void 0:t.components[e])){const o=y(v({},t.components[e]),{format:m.format,example:{header_handle:[n]}}),l=[...t.components];l[e]=o,t.components=l}}if(t.mapping&&(t.mapping=y(v({},t.mapping),{header:[n]})),x(!1),null!=b&&b>-1){const n=e(g);n.components[1].cards[b].components=t.components,n.mapping.cards[b]=t.mapping,null==I||I(v({},n))}else null==I||I(v({},t))}else x(!1),T("Invalid URL or variable");else R()}))},processImageUpload:D,handleImageUpload:function(e){var n;T(""),x(!0);const t=null==(n=e.target.files)?void 0:n[0];if(m.format===i.IMAGE){const e=new FileReader;N(""),M(""),e.onload=()=>{N(e.result),M(null==t?void 0:t.name)},t&&e.readAsDataURL(t)}else D(t)},handleImageChange:R,onCropComplete:function(e){return h(this,null,(function*(){x(!1),T("");const n=yield fetch(e),t=yield n.blob();yield D(t),N(void 0),j(!1)}))},editIconRef:P,fileName:w,setFileName:M,selectedVariable:E,setSelectedVariable:O,openEditMedia:U,setOpenEditMedia:j,selectedImage:A,setSelectedImage:N,loading:k,setLoading:x,error:C,setError:T}};export{g as useEditWhatsappTemplateMedia};

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

@@ -1 +1 @@
-import e from"../../../assets/icons/alert_triangle.svg.js";import t from"../../../assets/icons/send_template.svg.js";import a from"../../../assets/icons/tick.svg.js";import i from"../../../assets/icons/tick_double.svg.js";import"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import{COLORS as o}from"../../../constants/Theme.js";import"../../curtain/CurtainHelper.js";import"../../variable-picker-v3/model.js";import"../../template-preview/models/TemplateMeta.js";import{TEMPLATE_QUALITY as r}from"../../template-preview/models/WhatsAppTemplate.js";import"../../template-preview/models/Channels.js";import{Caption as n,TitleSmall as s}from"../../TypographyStyle.js";const l={[r.YELLOW]:{icon:e,title:"Medium quality template",sublineTextType:n,sublineColor:o.content.secondary,subline:"Meta has downgraded this template to a medium-quality rating due to negative feedback from multiple customers or low read rates. We recommend improving its content or choosing a different template to enhance delivery and engagement in your next campaign"},[r.RED]:{icon:e,title:"Low quality template",sublineTextType:n,sublineColor:o.content.secondary,subline:"Meta has downgraded this template to a low-quality rating due to negative feedback from multiple customers or low read rates. We recommend improving its content or choosing a different template to enhance delivery and engagement in your next campaign"},[r.GREEN]:{icon:"",title:"",sublineTextType:s,sublineColor:"",subline:"Here is your template's delivery and engagement stats from the last 30 days. Higher engagement today can lead to better delivery rates in the future."}},m=[{title:"Sent",icon:t,valName:"totalSent"},{title:"Delivered",icon:a,valName:"totalDelivered",percentValName:"deliveredPercentage"},{title:"Read",icon:i,valName:"totalReads",percentValName:"readPercentage"}];export{m as ANALYTICS_ENGAGEMENT_MAP,l as TEMPLATE_QUALITY_MAP};
+import e from"../../../assets/icons/alert_triangle.svg.js";import t from"../../../assets/icons/send_template.svg.js";import a from"../../../assets/icons/tick.svg.js";import i from"../../../assets/icons/tick_double.svg.js";import"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import{COLORS as o}from"../../../constants/Theme.js";import"../../curtain/CurtainHelper.js";import{TEMPLATE_QUALITY as r}from"../../template-preview/models/WhatsAppTemplate.js";import{Caption as n,TitleSmall as s}from"../../TypographyStyle.js";const l={[r.YELLOW]:{icon:e,title:"Medium quality template",sublineTextType:n,sublineColor:o.content.secondary,subline:"Meta has downgraded this template to a medium-quality rating due to negative feedback from multiple customers or low read rates. We recommend improving its content or choosing a different template to enhance delivery and engagement in your next campaign"},[r.RED]:{icon:e,title:"Low quality template",sublineTextType:n,sublineColor:o.content.secondary,subline:"Meta has downgraded this template to a low-quality rating due to negative feedback from multiple customers or low read rates. We recommend improving its content or choosing a different template to enhance delivery and engagement in your next campaign"},[r.GREEN]:{icon:"",title:"",sublineTextType:s,sublineColor:"",subline:"Here is your template's delivery and engagement stats from the last 30 days. Higher engagement today can lead to better delivery rates in the future."}},m=[{title:"Sent",icon:t,valName:"totalSent"},{title:"Delivered",icon:a,valName:"totalDelivered",percentValName:"deliveredPercentage"},{title:"Read",icon:i,valName:"totalReads",percentValName:"readPercentage"}];export{m as ANALYTICS_ENGAGEMENT_MAP,l as TEMPLATE_QUALITY_MAP};

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

@@ -1 +1 @@
-const l=l=>{const e=[];return l&&Object.keys(l).forEach((o=>{var t;const r=l[o],n=null!==(t=null==r?void 0:r.map((l=>{var e;return{label:l.title,value:l.placeHolder,bikPlaceholderType:null!==(e=l.type)&&void 0!==e?e:"string"}})))&&void 0!==t?t:[];e.push({label:o,options:n})})),e};export{l as convertPlaceholdersToBikDropdown};
+const l=l=>{const e=[];return l&&Object.keys(l).forEach((t=>{var r;const n=l[t],o=null!=(r=null==n?void 0:n.map((l=>{var e;return{label:l.title,value:l.placeHolder,bikPlaceholderType:null!=(e=l.type)?e:"string"}})))?r:[];e.push({label:t,options:o})})),e};export{l as convertPlaceholdersToBikDropdown};

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

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

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

@@ -1 +1 @@
-import{CHANNEL_TYPE as e}from"../../template-preview/models/Channels.js";function o(o,t,n,l,d){var m;const i=null===document||void 0===document?void 0:document.getElementById("mobile"===d?"template_html_mobile":"template_html_desktop"),u=l===e.EMAIL?null===(m=null==i?void 0:i.contentWindow)||void 0===m?void 0:m.document.getElementById(o):document.getElementById(o);if(u){const e=u.style.backgroundColor;u.style.backgroundColor=t,setTimeout((function(){u.style.backgroundColor=e}),1e3*n)}}export{o as highlightFor};
+import{CHANNEL_TYPE as e}from"../../template-preview/models/Channels.js";function t(t,o,l,n,m){var d;const u=null==document?void 0:document.getElementById("mobile"===m?"template_html_mobile":"template_html_desktop"),c=n===e.EMAIL?null==(d=null==u?void 0:u.contentWindow)?void 0:d.document.getElementById(t):document.getElementById(t);if(c){const e=c.style.backgroundColor;c.style.backgroundColor=o,setTimeout((function(){c.style.backgroundColor=e}),1e3*l)}}export{t as highlightFor};

package/dist/esm/components/template-preview/EmailTemplateThumbnailPreview.js

@@ -1 +1 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import{Button as a}from"../button/Button.js";import{TitleRegular as n}from"../TypographyStyle.js";import{EmailContainer as s,Header as r,IframeContainer as o,ImageContainer as i,CardLoadingContainer as p,ViewButton as l}from"./EmailTemplatePreview.styled.js";const d="https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c",c=c=>{let{template:m,handleViewTemplate:u,hideHeader:h,hideViewButton:y,containerStyle:b,emailHtmlContainerId:g,emailDisplayContent:f,applyBorderBottom:C,hidePointerEvents:j}=c;return e(s,Object.assign({hideHeader:h,style:Object.assign({},null!=b?b:{})},{children:[!h&&t(r,{children:t(n,Object.assign({style:{maxWidth:"100%"}},{children:m.name}))}),t(o,Object.assign({applyBorderBottom:C},{children:f?t("iframe",{title:"Email template preview",id:null!=g?g:"",width:"100%",srcDoc:(x=f,x.replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{##orderProducts}}<\/span><span>\s*<\/span>/g,"").replace(/src="<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{product.photoUrl}}<\/span><span> <\/span>"/g,`src=${d}`).replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{\/\/orderProducts}}<\/span><span>\s*<\/span>/g,"").replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{##abandonedCartProducts}}<\/span><span>\s*<\/span>/g,"").replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{\/\/abandonedCartProducts}}<\/span><span>\s*<\/span>/g,"")),height:"100%",style:{pointerEvents:j?void 0:"none"}}):t(i,Object.assign({hideHeader:h},{children:t(p,{})}))})),!y&&t(l,{children:t(a,{buttonType:"tertiary",buttonText:"View",onClick:()=>{u&&u()}})})]}));var x};export{d as DEFAULT_IMAGE,c as default};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import{Button as r}from"../button/Button.js";import{TitleRegular as a}from"../TypographyStyle.js";import{EmailContainer as n,Header as o,IframeContainer as p,ImageContainer as s,CardLoadingContainer as l,ViewButton as i}from"./EmailTemplatePreview.styled.js";var d=Object.defineProperty,c=Object.getOwnPropertySymbols,m=Object.prototype.hasOwnProperty,u=Object.prototype.propertyIsEnumerable,y=(e,t,r)=>t in e?d(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r,b=(e,t)=>{for(var r in t||(t={}))m.call(t,r)&&y(e,r,t[r]);if(c)for(var r of c(t))u.call(t,r)&&y(e,r,t[r]);return e};const h="https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c",f=d=>{let{template:c,handleViewTemplate:m,hideHeader:u,hideViewButton:y,containerStyle:f,emailHtmlContainerId:g,emailDisplayContent:v,applyBorderBottom:C,hidePointerEvents:w}=d;return e(n,{hideHeader:u,style:b({},null!=f?f:{}),children:[!u&&t(o,{children:t(a,{style:{maxWidth:"100%"},children:c.name})}),t(p,{applyBorderBottom:C,children:v?t("iframe",{title:"Email template preview",id:null!=g?g:"",width:"100%",srcDoc:(x=v,x.replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{##orderProducts}}<\/span><span>\s*<\/span>/g,"").replace(/src="<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{product.photoUrl}}<\/span><span> <\/span>"/g,`src=${h}`).replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{\/\/orderProducts}}<\/span><span>\s*<\/span>/g,"").replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{##abandonedCartProducts}}<\/span><span>\s*<\/span>/g,"").replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{\/\/abandonedCartProducts}}<\/span><span>\s*<\/span>/g,"")),height:"100%",style:{pointerEvents:w?void 0:"none"}}):t(s,{hideHeader:u,children:t(l,{})})}),!y&&t(i,{children:t(r,{buttonType:"tertiary",buttonText:"View",onClick:()=>{m&&m()}})})]});var x};export{h as DEFAULT_IMAGE,f as default};

package/dist/esm/components/template-preview/RCS/RCSButtons.js

@@ -1 +1 @@
-import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import{Caption as i,BodySecondary as n}from"../../TypographyStyle.js";import{COLORS as o}from"../../../constants/Theme.js";const l=l=>{let{Icon:c,text:s,extraContent:a,placeholder:p,textTypography:d,size:h}=l;const g=d||n;return e(t,{children:r("div",Object.assign({style:{textAlign:"center",maxWidth:"100%"}},{children:[r("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center"}},{children:[c&&e(c,{color:o.special.brand.facebook,height:16,width:16,style:{marginRight:8}}),e("div",Object.assign({style:{border:"1px solid #E0E0E0",width:"100%",borderRadius:30,padding:"8px 12px"}},{children:e(g,Object.assign({style:{color:o.special.brand.facebook,textAlign:"center",fontSize:"small"===h?12:14,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"}},{children:s}))}))]})),!!a&&e(i,Object.assign({style:{marginTop:2,color:o.content.placeholder,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"}},{children:p?function(e){return e.replace("[[","").replace("]]","").replace(/([A-Z])/g," $1").replace(/^./,(function(e){return e.toUpperCase()}))}(p):a}))]}))})};export{l as RCSButtons};
+import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import{Caption as o,BodySecondary as l}from"../../TypographyStyle.js";import{COLORS as i}from"../../../constants/Theme.js";const n=n=>{let{Icon:c,text:a,extraContent:p,placeholder:d,textTypography:s,size:h}=n;const x=s||l;return e(t,{children:r("div",{style:{textAlign:"center",maxWidth:"100%"},children:[r("div",{style:{display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center"},children:[c&&e(c,{color:i.special.brand.facebook,height:16,width:16,style:{marginRight:8}}),e("div",{style:{border:"1px solid #E0E0E0",width:"100%",borderRadius:30,padding:"8px 12px"},children:e(x,{style:{color:i.special.brand.facebook,textAlign:"center",fontSize:"small"===h?12:14,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"},children:a})})]}),!!p&&e(o,{style:{marginTop:2,color:i.content.placeholder,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"},children:d?(f=d,f.replace("[[","").replace("]]","").replace(/([A-Z])/g," $1").replace(/^./,(function(e){return e.toUpperCase()}))):p})]})});var f};export{n as RCSButtons};

package/dist/esm/components/template-preview/RCS/RCSChatHeader.js

@@ -1 +1 @@
-import{jsxs as o,jsx as t}from"react/jsx-runtime";import r from"../../../assets/icons/arrow_left.svg.js";import e from"../../../assets/icons/user_icon.svg.js";import s from"../../../assets/icons/vertical_dots.svg.js";import{BodyTiny as n}from"../../TypographyStyle.js";import{COLORS as i}from"../../../constants/Theme.js";import{HeaderContainer as c,LeftContainer as a,IconContainer as h,TitleContainer as m,SubTitle as d}from"./RCSPreview.styled.js";const l=()=>o(c,{children:[o(a,{children:[t(r,{height:16,width:16,color:i.content.secondary}),t(h,{children:t(e,{height:14,width:14,color:i.content.primaryInverse})}),o(m,{children:[t(n,Object.assign({color:i.content.secondary,style:{fontWeight:600}},{children:"Brand name"})),t(d,{children:"Business account"})]})]}),t(s,{height:16,width:16,color:i.content.secondary})]});export{l as default};
+import{jsxs as o,jsx as r}from"react/jsx-runtime";import t from"../../../assets/icons/arrow_left.svg.js";import e from"../../../assets/icons/user_icon.svg.js";import s from"../../../assets/icons/vertical_dots.svg.js";import{BodyTiny as n}from"../../TypographyStyle.js";import{COLORS as i}from"../../../constants/Theme.js";import{HeaderContainer as c,LeftContainer as h,IconContainer as m,TitleContainer as a,SubTitle as d}from"./RCSPreview.styled.js";const l=()=>o(c,{children:[o(h,{children:[r(t,{height:16,width:16,color:i.content.secondary}),r(m,{children:r(e,{height:14,width:14,color:i.content.primaryInverse})}),o(a,{children:[r(n,{color:i.content.secondary,style:{fontWeight:600},children:"Brand name"}),r(d,{children:"Business account"})]})]}),r(s,{height:16,width:16,color:i.content.secondary})]});export{l as default};

package/dist/esm/components/template-preview/RCS/RCSChatPreview.js

@@ -1 +1 @@
-import{jsxs as e,jsx as t,Fragment as r}from"react/jsx-runtime";import{useMemo as l}from"react";import{useTemplateModalContext as a}from"../../template-context-mapper/context/templateModalContext.js";import{isRichAndCarouselCards as i}from"../helpers/templateMiscHelper.js";import{VariableEditorHelper as s}from"../helpers/VariableEditorHelper.js";import{HEADER_TYPES as o}from"../models/TemplateMeta.js";import{ChatBtn as n}from"../WhatsApp/ChatBtn.js";import{RCSButtons as d}from"./RCSButtons.js";import{RCSMediaCard as m,PdfMediaCard as p}from"./RCSMediaCard.js";import{RCSPreviewContainer as h,HeaderTextContainer as u,TitleTextContainer as c,RcsHtmlContainer as g,RCSChatBtnContainer as T}from"./RCSPreview.styled.js";const y=new s,C=s=>{const{bodyText:C,titleText:v,headerMediaType:x,headerText:f,headerAssetLink:j,headerAssetName:M,imagePreviewStyles:N,size:A,bodyVariableList:O,headerVariableList:b,buttons:L,carouselCardIndex:w,isWhatsappCarousel:E,isPreview:H,titleVariableList:I,templateConfiguration:S}=s,P=y.format(null==C?void 0:C.replace(/</g,"&lt;").replace(/>/g,"&gt;"),O),_=y.format(null==f?void 0:f.replace(/</g,"&lt;").replace(/>/g,"&gt;"),b),z=y.format(null==v?void 0:v.replace(/</g,"&lt;").replace(/>/g,"&gt;"),I),{selectedCarouselIndex:B,isProductCarouselType:k,errorIndexes:D,isCarouselHovered:R}=a(),V=l((()=>i(null==S?void 0:S.templateType)),[null==S?void 0:S.templateType]),U=l((()=>"HORIZONTAL"==(null==S?void 0:S.orientation)),[S]);return e(h,Object.assign({isCarouselCard:null!=w&&w>-1,showBorder:null!=w&&w===B||k&&null!=w&&w>-1&&null!=B&&B>-1,hasError:null==D?void 0:D.includes(null!=w?w:-2),isWhatsappCarousel:E,isPreview:H,showDashedBorder:k&&R&&(null!=B?B:-1)<0&&(null!=w?w:-1)>-1,needBorder:V,isHorizontalOrientation:U},{children:[!U&&t(r,{children:x===o.TEXT?t(u,{dangerouslySetInnerHTML:{__html:_}}):x!==o.NONE&&j&&x!==o.DOCUMENT?t(m,{headerAssetLink:j,headerAssetName:M,mediaType:x,imagePreviewStyles:x===o.IMAGE?N:{}}):null}),e("div",Object.assign({style:{width:U?"50%":""}},{children:[e("div",Object.assign({className:V?"":"text--template"},{children:[!!v&&t(r,{children:t(c,{dangerouslySetInnerHTML:{__html:z}})}),!!C&&t(r,{children:t(g,{dangerouslySetInnerHTML:{__html:P},style:{paddingTop:v?0:12}})}),x===o.DOCUMENT?t(p,Object.assign({},{headerAssetLink:j,headerAssetName:M})):t(r,{})]})),L&&L.length>0?i(null==S?void 0:S.templateType)?t(r,{children:L.map(((e,r)=>t(n,{text:e.text,size:A},r)))}):t(T,{children:L.map(((e,r)=>t(d,{text:e.text,size:A},r)))}):null]})),U&&x!==o.NONE&&j&&x!==o.DOCUMENT&&t(m,{headerAssetLink:j,headerAssetName:M,mediaType:x,imagePreviewStyles:x===o.IMAGE?N:{},isHorizontal:U})]}))};export{C as RCSChatPreview};
+import{jsxs as e,jsx as r,Fragment as t}from"react/jsx-runtime";import{useMemo as l}from"react";import{useTemplateModalContext as a}from"../../template-context-mapper/context/templateModalContext.js";import{isRichAndCarouselCards as i}from"../helpers/templateMiscHelper.js";import{VariableEditorHelper as o}from"../helpers/VariableEditorHelper.js";import{HEADER_TYPES as s}from"../models/TemplateMeta.js";import{ChatBtn as n}from"../WhatsApp/ChatBtn.js";import{RCSButtons as d}from"./RCSButtons.js";import{RCSMediaCard as p,PdfMediaCard as m}from"./RCSMediaCard.js";import{RCSPreviewContainer as u,HeaderTextContainer as h,TitleTextContainer as c,RcsHtmlContainer as y,RCSChatBtnContainer as v}from"./RCSPreview.styled.js";var T=Object.defineProperty,f=Object.getOwnPropertySymbols,g=Object.prototype.hasOwnProperty,C=Object.prototype.propertyIsEnumerable,b=(e,r,t)=>r in e?T(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,x=(e,r)=>{for(var t in r||(r={}))g.call(r,t)&&b(e,t,r[t]);if(f)for(var t of f(r))C.call(r,t)&&b(e,t,r[t]);return e};const O=new o,j=o=>{const{bodyText:T,titleText:f,headerMediaType:g,headerText:C,headerAssetLink:b,headerAssetName:j,imagePreviewStyles:w,size:M,bodyVariableList:N,headerVariableList:A,buttons:E,carouselCardIndex:L,isWhatsappCarousel:I,isPreview:P,titleVariableList:S,templateConfiguration:H}=o,_=O.format(null==T?void 0:T.replace(/</g,"&lt;").replace(/>/g,"&gt;"),N),z=O.format(null==C?void 0:C.replace(/</g,"&lt;").replace(/>/g,"&gt;"),A),B=O.format(null==f?void 0:f.replace(/</g,"&lt;").replace(/>/g,"&gt;"),S),{selectedCarouselIndex:k,isProductCarouselType:D,errorIndexes:R,isCarouselHovered:V}=a(),U=l((()=>i(null==H?void 0:H.templateType)),[null==H?void 0:H.templateType]),W=l((()=>"HORIZONTAL"==(null==H?void 0:H.orientation)),[H]);return e(u,{isCarouselCard:null!=L&&L>-1,showBorder:null!=L&&L===k||D&&null!=L&&L>-1&&null!=k&&k>-1,hasError:null==R?void 0:R.includes(null!=L?L:-2),isWhatsappCarousel:I,isPreview:P,showDashedBorder:D&&V&&(null!=k?k:-1)<0&&(null!=L?L:-1)>-1,needBorder:U,isHorizontalOrientation:W,children:[!W&&r(t,{children:g===s.TEXT?r(h,{dangerouslySetInnerHTML:{__html:z}}):g!==s.NONE&&b&&g!==s.DOCUMENT?r(p,{headerAssetLink:b,headerAssetName:j,mediaType:g,imagePreviewStyles:g===s.IMAGE?w:{}}):null}),e("div",{style:{width:W?"50%":""},children:[e("div",{className:U?"":"text--template",children:[!!f&&r(t,{children:r(c,{dangerouslySetInnerHTML:{__html:B}})}),!!T&&r(t,{children:r(y,{dangerouslySetInnerHTML:{__html:_},style:{paddingTop:f?0:12}})}),g===s.DOCUMENT?r(m,x({},{headerAssetLink:b,headerAssetName:j})):r(t,{})]}),E&&E.length>0?i(null==H?void 0:H.templateType)?r(t,{children:E.map(((e,t)=>r(n,{text:e.text,size:M},t)))}):r(v,{children:E.map(((e,t)=>r(d,{text:e.text,size:M},t)))}):null]}),W&&g!==s.NONE&&b&&g!==s.DOCUMENT&&r(p,{headerAssetLink:b,headerAssetName:j,mediaType:g,imagePreviewStyles:g===s.IMAGE?w:{},isHorizontal:W})]})};export{j as RCSChatPreview};

package/dist/esm/components/template-preview/RCS/RCSMediaCard.js

@@ -1 +1 @@
-import{jsxs as e,jsx as i,Fragment as r}from"react/jsx-runtime";import t from"../../../assets/icons/RCS_PDF.svg.js";import{ShimmerImage as s}from"../../shimmer-image/ShimmerImage.js";import{COLORS as o}from"../../../constants/Theme.js";import{HEADER_TYPES as a}from"../models/TemplateMeta.js";import{RCSPdfContainer as d,PdfComineText as n,PdfText as m,RCSMediaContainer as l}from"./RCSPreview.styled.js";const c=r=>{let{headerAssetLink:s,headerAssetName:a}=r;var l;const c=t,h=a||(null===(l=null==s?void 0:s.split("/").pop())||void 0===l?void 0:l.replace(".pdf",""))||"xxxxxxxx";return e(d,{children:[i(c,{height:24,width:24,color:o.icon.placeholder}),!!h&&e(n,{children:[i(m,{children:h}),i(m,{children:".pdf"})]})]})},h=e=>{let{headerAssetLink:t,headerAssetName:o,mediaType:d,imagePreviewStyles:n,isHorizontal:m}=e;const c={width:"100%",minHeight:m?"100%":"240px",height:m?"100%":"240px",objectFit:"cover",borderRadius:m?"8px":""};return i(l,Object.assign({isHorizontal:!!m},{children:d===a.IMAGE?i(s,{imageUrl:t,alt:t,width:"100%",height:m?"100%":240,imagePreviewStyles:Object.assign(Object.assign({},n),{borderTopRightRadius:8,borderTopLeftRadius:8})}):d===a.VIDEO?i("video",Object.assign({src:t,style:c,controls:!0,muted:!0},{children:i("track",{default:!0,kind:"captions",srcLang:"en",src:t})})):i(r,{})}))};export{c as PdfMediaCard,h as RCSMediaCard};
+import{jsxs as e,jsx as r,Fragment as t}from"react/jsx-runtime";import i from"../../../assets/icons/RCS_PDF.svg.js";import{ShimmerImage as o}from"../../shimmer-image/ShimmerImage.js";import{COLORS as s}from"../../../constants/Theme.js";import{HEADER_TYPES as a}from"../models/TemplateMeta.js";import{RCSPdfContainer as l,PdfComineText as n,PdfText as c,RCSMediaContainer as p}from"./RCSPreview.styled.js";var d=Object.defineProperty,m=Object.defineProperties,h=Object.getOwnPropertyDescriptors,f=Object.getOwnPropertySymbols,b=Object.prototype.hasOwnProperty,g=Object.prototype.propertyIsEnumerable,u=(e,r,t)=>r in e?d(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,v=(e,r)=>{for(var t in r||(r={}))b.call(r,t)&&u(e,t,r[t]);if(f)for(var t of f(r))g.call(r,t)&&u(e,t,r[t]);return e};const j=t=>{let{headerAssetLink:o,headerAssetName:a}=t;var p;const d=i,m=a||(null==(p=null==o?void 0:o.split("/").pop())?void 0:p.replace(".pdf",""))||"xxxxxxxx";return e(l,{children:[r(d,{height:24,width:24,color:s.icon.placeholder}),!!m&&e(n,{children:[r(c,{children:m}),r(c,{children:".pdf"})]})]})},x=e=>{let{headerAssetLink:i,headerAssetName:s,mediaType:l,imagePreviewStyles:n,isHorizontal:c}=e;const d={width:"100%",minHeight:c?"100%":"240px",height:c?"100%":"240px",objectFit:"cover",borderRadius:c?"8px":""};return r(p,{isHorizontal:!!c,children:l===a.IMAGE?r(o,{imageUrl:i,alt:i,width:"100%",height:c?"100%":240,imagePreviewStyles:(f=v({},n),b={borderTopRightRadius:8,borderTopLeftRadius:8},m(f,h(b)))}):l===a.VIDEO?r("video",{src:i,style:d,controls:!0,muted:!0,children:r("track",{default:!0,kind:"captions",srcLang:"en",src:i})}):r(t,{})});var f,b};export{j as PdfMediaCard,x as RCSMediaCard};

package/dist/esm/components/template-preview/RCS/RCSPreview.styled.js

@@ -86,7 +86,7 @@ import e from"styled-components";import{COLORS as t}from"../../../constants/Them
 	position: relative;
 	height: 500px;
 	overflow-y: auto;
-	border-radius: ${e=>{var t;return null!==(t=e.borderRadius)&&void 0!==t?t:"8px"}};
+	border-radius: ${e=>{var t;return null!=(t=e.borderRadius)?t:"8px"}};
 	box-shadow: 0px 2px 8px 0px #0000001f;
 	background-color: white;
 `,c=e.div`

package/dist/esm/components/template-preview/RCS/RCSTemplateLikePreview.js

@@ -1,8 +1,8 @@
-import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import o from"styled-components";import{useTemplateModalContext as s}from"../../template-context-mapper/context/templateModalContext.js";import{TitleRegular as a}from"../../TypographyStyle.js";import{COLORS as i}from"../../../constants/Theme.js";import{getPreviewPropLen as p}from"../utils/getPreviewPropLen.js";import n from"./RCSChatHeader.js";import{RCSChatPreview as h}from"./RCSChatPreview.js";const l=o.div`
+import{jsx as e,Fragment as r,jsxs as t}from"react/jsx-runtime";import o from"styled-components";import{useTemplateModalContext as a}from"../../template-context-mapper/context/templateModalContext.js";import{TitleRegular as p}from"../../TypographyStyle.js";import{COLORS as i}from"../../../constants/Theme.js";import{getPreviewPropLen as s}from"../utils/getPreviewPropLen.js";import n from"./RCSChatHeader.js";import{RCSChatPreview as l}from"./RCSChatPreview.js";var h=Object.defineProperty,m=Object.getOwnPropertySymbols,d=Object.prototype.hasOwnProperty,c=Object.prototype.propertyIsEnumerable,u=(e,r,t)=>r in e?h(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,x=(e,r)=>{for(var t in r||(r={}))d.call(r,t)&&u(e,t,r[t]);if(m)for(var t of m(r))c.call(r,t)&&u(e,t,r[t]);return e};const w=o.div`
 	background-color: white;
 	border-radius: 4px;
 	position: relative;
 	height: ${e=>e.isWhatsappCarousel?"100%":"auto"};
-`,m=o(a)`
+`,y=o(p)`
 	color: ${i.content.primary};
-`,d=o=>{const{hideDeviceContainerInPreview:a}=s();return 3===p(o)?e(t,{children:o.zeroStateComponent}):a?e(h,Object.assign({showHeader:o.showHeader},o)):e(t,{children:r(l,Object.assign({style:o.containerStyle,showHeader:o.showHeader,isWhatsappCarousel:o.isWhatsappCarousel},{children:[o.showHeader&&e(n,{}),r("div",Object.assign({style:{padding:"small"===o.size?"10px 32px 10px 10px":`10px ${o.isWhatsappCarousel?"0px":"12px"} ${o.isWhatsappCarousel?"2px":"16px"} 16px`,height:o.isWhatsappCarousel?"100%":"auto"}},{children:[!o.hidePreviewText&&e("div",Object.assign({style:{marginBottom:16}},{children:e(m,{children:"Preview"})})),e(h,Object.assign({showHeader:o.showHeader},o))]}))]}))})};export{d as RCSTemplateLikePreview};
+`,f=o=>{const{hideDeviceContainerInPreview:p}=a();return 3===s(o)?e(r,{children:o.zeroStateComponent}):p?e(l,x({showHeader:o.showHeader},o)):e(r,{children:t(w,{style:o.containerStyle,showHeader:o.showHeader,isWhatsappCarousel:o.isWhatsappCarousel,children:[o.showHeader&&e(n,{}),t("div",{style:{padding:"small"===o.size?"10px 32px 10px 10px":`10px ${o.isWhatsappCarousel?"0px":"12px"} ${o.isWhatsappCarousel?"2px":"16px"} 16px`,height:o.isWhatsappCarousel?"100%":"auto"},children:[!o.hidePreviewText&&e("div",{style:{marginBottom:16},children:e(y,{children:"Preview"})}),e(l,x({showHeader:o.showHeader},o))]})]})})};export{f as RCSTemplateLikePreview};

package/dist/esm/components/template-preview/SmsTemplatePreview.js

@@ -1 +1 @@
-import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import l from"../../assets/icons/arrow_left.svg.js";import n from"../../assets/icons/more_vertical.svg.js";import o from"../../assets/icons/search.svg.js";import{COLORS as r}from"../../constants/Theme.js";import{useTemplateModalContext as s}from"../template-context-mapper/context/templateModalContext.js";import{TitleRegular as a,Caption as c}from"../TypographyStyle.js";import{renderVariableUIForPreview as d}from"./helpers/SmsTemplateHelper.js";import m from"./SMS/SMSBubble.js";import{SMSBubbleContainer as p,SMSCardHeader as h,SMSHeader as u}from"./SmsTemplatePreview.styled.js";const v=v=>{let{template:f,variableStore:g,hideHeader:j,display_content:y,onlyTemplateContent:x,size:b,uniqueId:w}=v;var S;const z=null==f?void 0:f.content,{hideDeviceContainerInPreview:O}=s();return O?e(p,Object.assign({size:b},{children:e(m,{size:null!=b?b:"large",content:null!=y?y:d(z,null!=g?g:[],void 0,null!=w?w:"")})})):t(i,{children:[!j&&!x&&e(h,{children:e(a,Object.assign({style:{maxWidth:"100%"}},{children:f.name}))}),!x&&e(u,{children:t(i,{children:[t("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8}},{children:[e(l,{width:16,height:16,color:r.content.secondary}),e(c,{children:null===(S=null==f?void 0:f.headers)||void 0===S?void 0:S[0]})]})),t("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8}},{children:[e(o,{width:16,height:16,color:r.content.secondary}),e(n,{width:16,height:16,color:r.content.secondary})]}))]})}),e(p,Object.assign({size:b},{children:e(m,{size:null!=b?b:"large",content:null!=y?y:d(z,null!=g?g:[],void 0,null!=w?w:"")})}))]})};export{v as default};
+import{jsx as e,jsxs as t,Fragment as l}from"react/jsx-runtime";import r from"../../assets/icons/arrow_left.svg.js";import o from"../../assets/icons/more_vertical.svg.js";import n from"../../assets/icons/search.svg.js";import{COLORS as i}from"../../constants/Theme.js";import{useTemplateModalContext as s}from"../template-context-mapper/context/templateModalContext.js";import{TitleRegular as a,Caption as c}from"../TypographyStyle.js";import{renderVariableUIForPreview as d}from"./helpers/SmsTemplateHelper.js";import m from"./SMS/SMSBubble.js";import{SMSBubbleContainer as p,SMSCardHeader as h,SMSHeader as u}from"./SmsTemplatePreview.styled.js";const f=f=>{let{template:v,variableStore:y,hideHeader:g,display_content:j,onlyTemplateContent:x,size:w,uniqueId:S}=f;var z;const T=null==v?void 0:v.content,{hideDeviceContainerInPreview:b}=s();return b?e(p,{size:w,children:e(m,{size:null!=w?w:"large",content:null!=j?j:d(T,null!=y?y:[],void 0,null!=S?S:"")})}):t(l,{children:[!g&&!x&&e(h,{children:e(a,{style:{maxWidth:"100%"},children:v.name})}),!x&&e(u,{children:t(l,{children:[t("div",{style:{display:"flex",flexDirection:"row",gap:8},children:[e(r,{width:16,height:16,color:i.content.secondary}),e(c,{children:null==(z=null==v?void 0:v.headers)?void 0:z[0]})]}),t("div",{style:{display:"flex",flexDirection:"row",gap:8},children:[e(n,{width:16,height:16,color:i.content.secondary}),e(o,{width:16,height:16,color:i.content.secondary})]})]})}),e(p,{size:w,children:e(m,{size:null!=w?w:"large",content:null!=j?j:d(T,null!=y?y:[],void 0,null!=S?S:"")})})]})};export{f as default};

package/dist/esm/components/template-preview/TemplatePreview.js

@@ -1 +1 @@
-import{jsx as e,jsxs as t,Fragment as l}from"react/jsx-runtime";import{useTemplateModalContext as i}from"../template-context-mapper/context/templateModalContext.js";import a from"../../utils/StringUtils.js";import{COLORS as n}from"../../constants/Theme.js";import{TitleRegular as o}from"../TypographyStyle.js";import r from"./EmailTemplateThumbnailPreview.js";import{CHANNEL_TYPE as s}from"./models/Channels.js";import d from"./SmsTemplatePreview.js";import p from"./webpush/WebpushPreview.js";import m from"./WhatsAppTemplatePreview.js";const u=u=>{let{template:v,channel:h,whatsAppSpecificMeta:b,templateCreationsInfo:C,hideHeader:S,size:y,onlyTemplateContent:g,emailSpecificMeta:j,smsSpecificMeta:f,showSampleValues:w,carouselCardIndex:T,isWhatsappCarousel:x,isPreview:P,applyBorderBottom:W,webPushSpecificMeta:O,hidePointerEvents:H}=u;var A,I;const{setSelectedCarouselIndex:B}=i();return h===s.SMS?e("div",Object.assign({style:Object.assign({marginTop:C?16:0,border:C?`1px solid ${n.stroke.primary}`:"none",borderRadius:4},null==f?void 0:f.templateContainerStyles)},{children:e(d,{template:v,hideHeader:S,onlyTemplateContent:g,size:null!=y?y:"large",variableStore:null==f?void 0:f.smsVariableStore,display_content:null==f?void 0:f.smsDisplayContent,uniqueId:null==f?void 0:f.uniqueId})})):h===s.EMAIL?e("div",Object.assign({style:Object.assign({marginTop:C?16:0},null==j?void 0:j.templateContainerStyles)},{children:e(r,{template:v,handleViewTemplate:()=>{var e;null===(e=null==j?void 0:j.handleViewTemplate)||void 0===e||e.call(j)},hideHeader:S,hideViewButton:null==j?void 0:j.hideViewButtonForEmail,containerStyle:null==j?void 0:j.containerStyle,emailDisplayContent:null==j?void 0:j.emailDisplayContent,emailHtmlContainerId:null==j?void 0:j.emailHtmlContainerId,applyBorderBottom:W,hidePointerEvents:H})})):h===s.WHATSAPP||h===s.RCS?t("div",Object.assign({style:Object.assign(Object.assign({},null==b?void 0:b.templateContainerStyles),C?c.WhatsAppWrapper:{}),onClick:()=>{var e,t;if(B&&x){if(-1===T&&!(null===(t=null===(e=null==v?void 0:v.mapping)||void 0===e?void 0:e.body)||void 0===t?void 0:t.length))return;B(null!=T?T:-1)}}},{children:[C?e("div",Object.assign({style:{padding:16}},{children:e(o,{children:a.convertToTitleCase(null!==(A=null==v?void 0:v.label)&&void 0!==A?A:"")})})):e(l,{}),e(m,{showSampleValues:w,showHeader:null==b?void 0:b.showWhatsAppHeader,extras:null==b?void 0:b.whatsAppExtras,template:v,size:C?"small":null!=y?y:"large",containerStyle:Object.assign(Object.assign({borderWidth:C?0:1,borderTopWidth:1},null!==(I=null==b?void 0:b.containerStyle)&&void 0!==I?I:{}),{height:"100%"}),zeroStateComponent:null==b?void 0:b.zeroStateComponent,usePlaceHolderName:null==b?void 0:b.usePlaceHolderName,carouselCardIndex:T,isWhatsappCarousel:x,isPreview:P,channel:h})]})):h==s.WEBPUSH?e("div",Object.assign({style:Object.assign({},null==O?void 0:O.containerStyle)},{children:e(p,{template:v,extraContainerCss:null==O?void 0:O.extraContainerCss})})):e(l,{})},c={WhatsAppWrapper:{backgroundColor:n.surface.standard,borderRadius:4,border:`1px solid ${n.background.inactive}`,marginTop:16}};export{u as TemplatePreview};
+import{jsx as e,jsxs as t,Fragment as l}from"react/jsx-runtime";import{useTemplateModalContext as r}from"../template-context-mapper/context/templateModalContext.js";import o from"../../utils/StringUtils.js";import{COLORS as i}from"../../constants/Theme.js";import{TitleRegular as a}from"../TypographyStyle.js";import n from"./EmailTemplateThumbnailPreview.js";import{CHANNEL_TYPE as p}from"./models/Channels.js";import s from"./SmsTemplatePreview.js";import d from"./webpush/WebpushPreview.js";import m from"./WhatsAppTemplatePreview.js";var u=Object.defineProperty,c=Object.defineProperties,v=Object.getOwnPropertyDescriptors,h=Object.getOwnPropertySymbols,y=Object.prototype.hasOwnProperty,C=Object.prototype.propertyIsEnumerable,S=(e,t,l)=>t in e?u(e,t,{enumerable:!0,configurable:!0,writable:!0,value:l}):e[t]=l,b=(e,t)=>{for(var l in t||(t={}))y.call(t,l)&&S(e,l,t[l]);if(h)for(var l of h(t))C.call(t,l)&&S(e,l,t[l]);return e};const f=u=>{let{template:h,channel:y,whatsAppSpecificMeta:C,templateCreationsInfo:S,hideHeader:f,size:P,onlyTemplateContent:T,emailSpecificMeta:g,smsSpecificMeta:j,showSampleValues:x,carouselCardIndex:W,isWhatsappCarousel:H,isPreview:I,applyBorderBottom:A,webPushSpecificMeta:O,hidePointerEvents:E}=u;var B,M;const{setSelectedCarouselIndex:V}=r();return y===p.SMS?e("div",{style:b({marginTop:S?16:0,border:S?`1px solid ${i.stroke.primary}`:"none",borderRadius:4},null==j?void 0:j.templateContainerStyles),children:e(s,{template:h,hideHeader:f,onlyTemplateContent:T,size:null!=P?P:"large",variableStore:null==j?void 0:j.smsVariableStore,display_content:null==j?void 0:j.smsDisplayContent,uniqueId:null==j?void 0:j.uniqueId})}):y===p.EMAIL?e("div",{style:b({marginTop:S?16:0},null==g?void 0:g.templateContainerStyles),children:e(n,{template:h,handleViewTemplate:()=>{var e;null==(e=null==g?void 0:g.handleViewTemplate)||e.call(g)},hideHeader:f,hideViewButton:null==g?void 0:g.hideViewButtonForEmail,containerStyle:null==g?void 0:g.containerStyle,emailDisplayContent:null==g?void 0:g.emailDisplayContent,emailHtmlContainerId:null==g?void 0:g.emailHtmlContainerId,applyBorderBottom:A,hidePointerEvents:E})}):y===p.WHATSAPP||y===p.RCS?t("div",{style:b(b({},null==C?void 0:C.templateContainerStyles),S?w.WhatsAppWrapper:{}),onClick:()=>{var e,t;if(V&&H){if(-1===W&&!(null==(t=null==(e=null==h?void 0:h.mapping)?void 0:e.body)?void 0:t.length))return;V(null!=W?W:-1)}},children:[S?e("div",{style:{padding:16},children:e(a,{children:o.convertToTitleCase(null!=(B=null==h?void 0:h.label)?B:"")})}):e(l,{}),e(m,{showSampleValues:x,showHeader:null==C?void 0:C.showWhatsAppHeader,extras:null==C?void 0:C.whatsAppExtras,template:h,size:S?"small":null!=P?P:"large",containerStyle:(z=b({borderWidth:S?0:1,borderTopWidth:1},null!=(M=null==C?void 0:C.containerStyle)?M:{}),k={height:"100%"},c(z,v(k))),zeroStateComponent:null==C?void 0:C.zeroStateComponent,usePlaceHolderName:null==C?void 0:C.usePlaceHolderName,carouselCardIndex:W,isWhatsappCarousel:H,isPreview:I,channel:y})]}):y==p.WEBPUSH?e("div",{style:b({},null==O?void 0:O.containerStyle),children:e(d,{template:h,extraContainerCss:null==O?void 0:O.extraContainerCss})}):e(l,{});var z,k},w={WhatsAppWrapper:{backgroundColor:i.surface.standard,borderRadius:4,border:`1px solid ${i.background.inactive}`,marginTop:16}};export{f as TemplatePreview};

package/dist/esm/components/template-preview/WhatsApp/ChatBtn.js

@@ -1 +1 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{Caption as r,BodySecondary as n}from"../../TypographyStyle.js";import{COLORS as o}from"../../../constants/Theme.js";import{ChatBtnContainer as i}from"./ChatUI.style.js";const l=l=>{let{Icon:c,text:s,extraContent:a,placeholder:p,textTypography:h,size:d}=l;const f=h||n;return e(i,{children:t("div",Object.assign({style:{textAlign:"center",maxWidth:"100%"}},{children:[t("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center"}},{children:[c&&e(c,{color:o.special.brand.facebook,height:16,width:16,style:{marginRight:8}}),e(f,Object.assign({style:{color:o.special.brand.facebook,textAlign:"center",fontSize:"small"===d?12:14,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"}},{children:s}))]})),!!a&&e(r,Object.assign({style:{marginTop:2,color:o.content.placeholder,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"}},{children:p?function(e){return e.replace("[[","").replace("]]","").replace(/([A-Z])/g," $1").replace(/^./,(function(e){return e.toUpperCase()}))}(p):a}))]}))})};export{l as ChatBtn};
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{Caption as r,BodySecondary as o}from"../../TypographyStyle.js";import{COLORS as l}from"../../../constants/Theme.js";import{ChatBtnContainer as i}from"./ChatUI.style.js";const n=n=>{let{Icon:c,text:a,extraContent:p,placeholder:s,textTypography:h,size:d}=n;const f=h||o;return e(i,{children:t("div",{style:{textAlign:"center",maxWidth:"100%"},children:[t("div",{style:{display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center"},children:[c&&e(c,{color:l.special.brand.facebook,height:16,width:16,style:{marginRight:8}}),e(f,{style:{color:l.special.brand.facebook,textAlign:"center",fontSize:"small"===d?12:14,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"},children:a})]}),!!p&&e(r,{style:{marginTop:2,color:l.content.placeholder,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"},children:s?(m=s,m.replace("[[","").replace("]]","").replace(/([A-Z])/g," $1").replace(/^./,(function(e){return e.toUpperCase()}))):p})]})});var m};export{n as ChatBtn};

package/dist/esm/components/template-preview/WhatsApp/ChatHeader.js

@@ -1 +1 @@
-import{jsxs as r,jsx as e}from"react/jsx-runtime";import t from"../../../assets/icons/arrow_left.svg.js";import s from"../../../assets/icons/user_icon.svg.js";import o from"../../../assets/icons/vertical_dots.svg.js";import{BodyTiny as i}from"../../TypographyStyle.js";import{COLORS as n}from"../../../constants/Theme.js";import{HeaderContainer as c,LeftContainer as m,IconContainer as a,TitleContainer as h,SubTitle as l}from"./ChatHeader.style.js";const p=()=>r(c,{children:[r(m,{children:[e(t,{height:16,width:16,color:n.content.primaryInverse}),e(a,{children:e(s,{height:14,width:14,color:n.content.primaryInverse})}),r(h,{children:[e(i,Object.assign({color:n.content.primaryInverse},{children:"Brand name"})),e(l,{children:"Business account"})]})]}),e(o,{height:16,width:16,color:n.content.primaryInverse})]});export{p as default};
+import{jsxs as r,jsx as e}from"react/jsx-runtime";import t from"../../../assets/icons/arrow_left.svg.js";import o from"../../../assets/icons/user_icon.svg.js";import s from"../../../assets/icons/vertical_dots.svg.js";import{BodyTiny as i}from"../../TypographyStyle.js";import{COLORS as n}from"../../../constants/Theme.js";import{HeaderContainer as c,LeftContainer as m,IconContainer as a,TitleContainer as h,SubTitle as l}from"./ChatHeader.style.js";const p=()=>r(c,{children:[r(m,{children:[e(t,{height:16,width:16,color:n.content.primaryInverse}),e(a,{children:e(o,{height:14,width:14,color:n.content.primaryInverse})}),r(h,{children:[e(i,{color:n.content.primaryInverse,children:"Brand name"}),e(l,{children:"Business account"})]})]}),e(s,{height:16,width:16,color:n.content.primaryInverse})]});export{p as default};

package/dist/esm/components/template-preview/WhatsApp/ChatUI.js

@@ -1,7 +1,7 @@
-import{jsxs as e,jsx as t,Fragment as r}from"react/jsx-runtime";import o from"../../../assets/icons/halfRectangle.svg.js";import i from"../../../assets/icons/phone.svg.js";import s from"../../../assets/icons/RedirectToNew.svg.js";import{useMemo as a}from"react";import n from"styled-components";import{Tooltip as l}from"../../tooltips/Tooltip.js";import{BodySecondary as p,Caption as m}from"../../TypographyStyle.js";import{COLORS as d,FONTS as c}from"../../../constants/Theme.js";import{WhatsAppFormatToHTML as h}from"../helpers/WhatsAppFormatToHTML.js";import{HEADER_TYPES as f,ACTIONS_TYPES as g}from"../models/TemplateMeta.js";import{ChatBtn as y}from"./ChatBtn.js";import{Container as T,FooterWrapper as x,FooterText as v,TimeStamp as j}from"./ChatUI.style.js";import{MediaCard as w}from"./MediaCard.js";import b from"./RenderTemplateWithVariable.js";const u=n.div`
+import{jsxs as e,jsx as t,Fragment as r}from"react/jsx-runtime";import o from"../../../assets/icons/halfRectangle.svg.js";import i from"../../../assets/icons/phone.svg.js";import a from"../../../assets/icons/RedirectToNew.svg.js";import{useMemo as s}from"react";import l from"styled-components";import{Tooltip as n}from"../../tooltips/Tooltip.js";import{BodySecondary as p,Caption as m}from"../../TypographyStyle.js";import{COLORS as d,FONTS as h}from"../../../constants/Theme.js";import{WhatsAppFormatToHTML as c}from"../helpers/WhatsAppFormatToHTML.js";import{HEADER_TYPES as f,ACTIONS_TYPES as y}from"../models/TemplateMeta.js";import{ChatBtn as T}from"./ChatBtn.js";import{Container as g,FooterWrapper as x,FooterText as v,TimeStamp as w}from"./ChatUI.style.js";import{MediaCard as j}from"./MediaCard.js";import u from"./RenderTemplateWithVariable.js";const b=l.div`
 	position: absolute;
 	width: 8px;
 	height: 8px;
 	left: -7.7px;
 	top: -8px;
-`,S=n=>{const{bodyText:S,footerText:N,headerMediaType:A,headerText:M,headerAssetLink:C,headerAssetName:L,quickReplybtn:k,ctaBtn:z,actionTypes:B,textType:E,extras:I,showHeader:P,imagePreviewStyles:R,size:W,children:H,isPreview:O}=n,_=new h,U=a((()=>({color:d.content.primary,margin:12,fontSize:P?c.caption.fontSize:c.bodySecondary.fontSize,fontWeight:c.bodySecondary.fontWeight,maxWidth:"100%",whiteSpace:"pre-wrap",marginBottom:0,marginTop:8,wordBreak:"break-word"})),[]);return e(T,Object.assign({isPreview:O},{children:[t(u,{children:t(o,{color:"white",height:8,width:8})}),A===f.TEXT?t(b,{bold:!0,text:null==M?void 0:M.replace(/</g,"&lt;").replace(/>/g,"&gt;")}):A!==f.NONE?t(w,{headerAssetLink:C,headerAssetName:L,mediaType:A,imagePreviewStyles:A===f.IMAGE?R:{}}):t(r,{}),!!S&&t(r,{children:t(r,H?{children:H}:{children:"html"===E?t("div",{className:"richTextEditor",style:U,dangerouslySetInnerHTML:{__html:_.convertToHTML(S)}}):t(p,{children:null==S?void 0:S.replace(/</g,"&lt;").replace(/>/g,"&gt;")})})}),e(x,{children:[t(l,Object.assign({body:null!=N?N:"",placement:"top"},{children:t(v,Object.assign({style:{flex:1}},{children:N}))})),t(j,{children:"16:48"})]}),B===g.QUICK_REPLY?t("div",{children:null==k?void 0:k.map(((e,r)=>t(y,{text:e.text},r)))}):B===g.CTA_BTN?t("div",{children:null==z?void 0:z.map(((e,r)=>t(y,{textTypography:P?m:p,extraContent:I?e.extra:void 0,placeholder:e.placeholder,text:e.text,Icon:"phoneNumber"===e.type?i:s,size:W},r)))}):t(r,{})]}))};export{S as default};
+`,S=l=>{const{bodyText:S,footerText:N,headerMediaType:A,headerText:M,headerAssetLink:C,headerAssetName:L,quickReplybtn:k,ctaBtn:z,actionTypes:B,textType:E,extras:I,showHeader:P,imagePreviewStyles:R,size:W,children:H,isPreview:_}=l,U=new c,q=s((()=>({color:d.content.primary,margin:12,fontSize:P?h.caption.fontSize:h.bodySecondary.fontSize,fontWeight:h.bodySecondary.fontWeight,maxWidth:"100%",whiteSpace:"pre-wrap",marginBottom:0,marginTop:8,wordBreak:"break-word"})),[]);return e(g,{isPreview:_,children:[t(b,{children:t(o,{color:"white",height:8,width:8})}),A===f.TEXT?t(u,{bold:!0,text:null==M?void 0:M.replace(/</g,"&lt;").replace(/>/g,"&gt;")}):A!==f.NONE?t(j,{headerAssetLink:C,headerAssetName:L,mediaType:A,imagePreviewStyles:A===f.IMAGE?R:{}}):t(r,{}),!!S&&t(r,{children:t(r,H?{children:H}:{children:"html"===E?t("div",{className:"richTextEditor",style:q,dangerouslySetInnerHTML:{__html:U.convertToHTML(S)}}):t(p,{children:null==S?void 0:S.replace(/</g,"&lt;").replace(/>/g,"&gt;")})})}),e(x,{children:[t(n,{body:null!=N?N:"",placement:"top",children:t(v,{style:{flex:1},children:N})}),t(w,{children:"16:48"})]}),B===y.QUICK_REPLY?t("div",{children:null==k?void 0:k.map(((e,r)=>t(T,{text:e.text},r)))}):B===y.CTA_BTN?t("div",{children:null==z?void 0:z.map(((e,r)=>t(T,{textTypography:P?m:p,extraContent:I?e.extra:void 0,placeholder:e.placeholder,text:e.text,Icon:"phoneNumber"===e.type?i:a,size:W},r)))}):t(r,{})]})};export{S as default};

package/dist/esm/components/template-preview/WhatsApp/ChatUiV2.js

@@ -1,4 +1,4 @@
-import{jsxs as e,jsx as t,Fragment as o}from"react/jsx-runtime";import r from"../../../assets/icons/copy-code-icon.svg.js";import i from"../../../assets/icons/halfRectangle.svg.js";import s from"../../../assets/icons/phone.svg.js";import l from"../../../assets/icons/qrb.svg.js";import a from"../../../assets/icons/RedirectToNew.svg.js";import n from"styled-components";import{useTemplateModalContext as p}from"../../template-context-mapper/context/templateModalContext.js";import{Tooltip as d}from"../../tooltips/Tooltip.js";import{Caption as m,BodySecondary as c}from"../../TypographyStyle.js";import{COLORS as h}from"../../../constants/Theme.js";import{VariableEditorHelper as f}from"../helpers/VariableEditorHelper.js";import{HEADER_TYPES as x,ACTIONS_TYPES as u}from"../models/TemplateMeta.js";import{ChatBtn as g}from"./ChatBtn.js";import{Container as y,FooterWrapper as T,FooterText as C,TimeStamp as v}from"./ChatUI.style.js";import{LimitedTimeOffer as j}from"./LimitedTimeOffer/LimitedTimeOffer.index.js";import{MediaCard as w}from"./MediaCard.js";const b=n.div`
+import{jsxs as e,jsx as t,Fragment as o}from"react/jsx-runtime";import r from"../../../assets/icons/copy-code-icon.svg.js";import i from"../../../assets/icons/halfRectangle.svg.js";import s from"../../../assets/icons/phone.svg.js";import l from"../../../assets/icons/qrb.svg.js";import a from"../../../assets/icons/RedirectToNew.svg.js";import n from"styled-components";import{useTemplateModalContext as p}from"../../template-context-mapper/context/templateModalContext.js";import{Tooltip as d}from"../../tooltips/Tooltip.js";import{Caption as m,BodySecondary as c}from"../../TypographyStyle.js";import{COLORS as h}from"../../../constants/Theme.js";import{VariableEditorHelper as f}from"../helpers/VariableEditorHelper.js";import{HEADER_TYPES as x,ACTIONS_TYPES as u}from"../models/TemplateMeta.js";import{ChatBtn as y}from"./ChatBtn.js";import{Container as g,FooterWrapper as T,FooterText as C,TimeStamp as v}from"./ChatUI.style.js";import{LimitedTimeOffer as w}from"./LimitedTimeOffer/LimitedTimeOffer.index.js";import{MediaCard as j}from"./MediaCard.js";const b=n.div`
 	position: absolute;
 	width: 8px;
 	height: 8px;
@@ -13,7 +13,7 @@ import{jsxs as e,jsx as t,Fragment as o}from"react/jsx-runtime";import r from"..
 	padding: 8px 12px 0px;
 	color: ${h.content.primary};
 	word-wrap: break-word;
-`,O=n(I)`
+`,E=n(I)`
 	font-weight: 600;
 	margin-bottom: 8px;
-`,E=new f,L=n=>{const{bodyText:h,footerText:f,headerMediaType:L,headerText:P,headerAssetLink:_,headerAssetName:N,quickReplybtn:M,ctaBtn:R,actionTypes:A,extras:B,showHeader:H,imagePreviewStyles:S,size:U,bodyVariableList:k,headerVariableList:z,buttons:Y,limitedTimeOfferComponent:D,carouselCardIndex:V,isWhatsappCarousel:q,isPreview:K}=n,Q=E.format(null==h?void 0:h.replace(/</g,"&lt;").replace(/>/g,"&gt;"),k),W=E.format(null==P?void 0:P.replace(/</g,"&lt;").replace(/>/g,"&gt;"),z),{selectedCarouselIndex:G,isProductCarouselType:X,errorIndexes:$,isCarouselHovered:F}=p(),J={COPY_CODE:r,PHONE_NUMBER:s,URL:a,QUICK_REPLY:l};return e(y,Object.assign({isCarouselCard:null!=V&&V>-1,showBorder:null!=V&&V===G||X&&null!=V&&V>-1&&null!=G&&G>-1,hasError:null==$?void 0:$.includes(null!=V?V:-2),isWhatsappCarousel:q,isPreview:K,showDashedBorder:X&&F&&(null!=G?G:-1)<0&&(null!=V?V:-1)>-1},{children:[!q&&t(b,{children:t(i,{color:"white",height:8,width:8})}),L===x.TEXT?t(O,{dangerouslySetInnerHTML:{__html:W}}):L!==x.NONE?t(w,{headerAssetLink:_,headerAssetName:N,mediaType:L,imagePreviewStyles:L===x.IMAGE?S:{}}):t(o,{}),(null==D?void 0:D.dateTime)?t(j,{text:D.text,dateTime:D.dateTime,code:D.code}):t(o,{}),!!h&&t(o,{children:t(I,{dangerouslySetInnerHTML:{__html:Q},style:{flex:1}})}),e(T,{children:[t(d,Object.assign({body:null!=f?f:"",placement:"top"},{children:t(C,Object.assign({style:{flex:1}},{children:f}))})),t(v,{children:"16:48"})]}),Y&&Y.length>0?Y.map(((e,o)=>t(g,{text:"COPY_CODE"===e.type?"Copy code":e.text,Icon:J[e.type],size:U},o))):A===u.QUICK_REPLY?t("div",{children:null==M?void 0:M.map(((e,o)=>t(g,{text:e.text},o)))}):A===u.CTA_BTN?t("div",{children:null==R?void 0:R.map(((e,o)=>t(g,{textTypography:H?m:c,extraContent:B?e.extra:void 0,placeholder:e.placeholder,text:e.text,Icon:"phoneNumber"===e.type?s:a,size:U},o)))}):t(o,{})]}))};export{L as ChatUIV2};
+`,L=new f,P=n=>{const{bodyText:h,footerText:f,headerMediaType:P,headerText:_,headerAssetLink:N,headerAssetName:O,quickReplybtn:M,ctaBtn:R,actionTypes:A,extras:B,showHeader:H,imagePreviewStyles:S,size:U,bodyVariableList:k,headerVariableList:z,buttons:Y,limitedTimeOfferComponent:D,carouselCardIndex:V,isWhatsappCarousel:q,isPreview:K}=n,Q=L.format(null==h?void 0:h.replace(/</g,"&lt;").replace(/>/g,"&gt;"),k),W=L.format(null==_?void 0:_.replace(/</g,"&lt;").replace(/>/g,"&gt;"),z),{selectedCarouselIndex:G,isProductCarouselType:X,errorIndexes:$,isCarouselHovered:F}=p(),J={COPY_CODE:r,PHONE_NUMBER:s,URL:a,QUICK_REPLY:l};return e(g,{isCarouselCard:null!=V&&V>-1,showBorder:null!=V&&V===G||X&&null!=V&&V>-1&&null!=G&&G>-1,hasError:null==$?void 0:$.includes(null!=V?V:-2),isWhatsappCarousel:q,isPreview:K,showDashedBorder:X&&F&&(null!=G?G:-1)<0&&(null!=V?V:-1)>-1,children:[!q&&t(b,{children:t(i,{color:"white",height:8,width:8})}),P===x.TEXT?t(E,{dangerouslySetInnerHTML:{__html:W}}):P!==x.NONE?t(j,{headerAssetLink:N,headerAssetName:O,mediaType:P,imagePreviewStyles:P===x.IMAGE?S:{}}):t(o,{}),(null==D?void 0:D.dateTime)?t(w,{text:D.text,dateTime:D.dateTime,code:D.code}):t(o,{}),!!h&&t(o,{children:t(I,{dangerouslySetInnerHTML:{__html:Q},style:{flex:1}})}),e(T,{children:[t(d,{body:null!=f?f:"",placement:"top",children:t(C,{style:{flex:1},children:f})}),t(v,{children:"16:48"})]}),Y&&Y.length>0?Y.map(((e,o)=>t(y,{text:"COPY_CODE"===e.type?"Copy code":e.text,Icon:J[e.type],size:U},o))):A===u.QUICK_REPLY?t("div",{children:null==M?void 0:M.map(((e,o)=>t(y,{text:e.text},o)))}):A===u.CTA_BTN?t("div",{children:null==R?void 0:R.map(((e,o)=>t(y,{textTypography:H?m:c,extraContent:B?e.extra:void 0,placeholder:e.placeholder,text:e.text,Icon:"phoneNumber"===e.type?s:a,size:U},o)))}):t(o,{})]})};export{P as ChatUIV2};