@bikdotai/bik-component-library 0.0.639--bik-comp-lib--beta → 0.0.639--bik-comp-lib--beta0.2

package/dist/cjs/components/bik-layout/MockMenus.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export declare const Menus: ({
     displayName: string;
     key: number;

package/dist/cjs/components/carousel-preview/CustomCarouselArrows.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../../assets/icons/chevronLeft.svg.js"),t=require("../../assets/icons/chevronRight.svg.js"),l=require("../../constants/Theme.js"),n=require("../template-context-mapper/context/templateModalContext.js");exports.CustomCarouselLeftArrow=t=>{const{className:o,style:r,onClick:a,isPreview:c}=t,{selectedCarouselIndex:i,setSelectedCarouselIndex:u}=n.useTemplateModalContext();return e.jsx("div",Object.assign({className:o,style:Object.assign(Object.assign({},r),{display:a&&(null!=i?i:-1)>-1||c?"flex":"none",content:"none"}),onClick:e=>{null==a||a(e),(null!=i?i:-1)<1||c||null==u||u((null!=i?i:-1)-1)}},{children:e.jsx(s.default,{height:10,width:10,color:l.COLORS.content.primary})}))},exports.CustomCarouselRightArrow=s=>{const{className:o,style:r,onClick:a,isPreview:c}=s,{selectedCarouselIndex:i,setSelectedCarouselIndex:u,cardCount:d}=n.useTemplateModalContext();return e.jsx("div",Object.assign({className:o,style:Object.assign(Object.assign({},r),{display:a&&(null!=i?i:-1)>-1||c?"flex":"none",content:"none"}),onClick:e=>{console.log("onClick",i,d),null==a||a(e),(null!=i?i:-1)>=(null!=d?d:-1)-1||c||null==u||u((null!=i?i:-1)+1)}},{children:e.jsx(t.default,{height:10,width:10,color:l.COLORS.content.primary})}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../../assets/icons/chevronLeft.svg.js"),t=require("../../assets/icons/chevronRight.svg.js"),l=require("../../constants/Theme.js"),n=require("../template-context-mapper/context/templateModalContext.js");exports.CustomCarouselLeftArrow=t=>{const{className:o,style:r,onClick:a,isPreview:c}=t,{selectedCarouselIndex:i,setSelectedCarouselIndex:u}=n.useTemplateModalContext();return e.jsx("div",Object.assign({className:o,style:Object.assign(Object.assign({},r),{display:a&&(null!=i?i:-1)>-1||c?"flex":"none",content:"none"}),onClick:e=>{null==a||a(e),(null!=i?i:-1)<1||c||null==u||u((null!=i?i:-1)-1)}},{children:e.jsx(s.default,{height:10,width:10,color:l.COLORS.content.primary})}))},exports.CustomCarouselRightArrow=s=>{const{className:o,style:r,onClick:a,isPreview:c}=s,{selectedCarouselIndex:i,setSelectedCarouselIndex:u,cardCount:d}=n.useTemplateModalContext();return e.jsx("div",Object.assign({className:o,style:Object.assign(Object.assign({},r),{display:a&&(null!=i?i:-1)>-1||c?"flex":"none",content:"none"}),onClick:e=>{null==a||a(e),(null!=i?i:-1)>=(null!=d?d:-1)-1||c||null==u||u((null!=i?i:-1)+1)}},{children:e.jsx(t.default,{height:10,width:10,color:l.COLORS.content.primary})}))};

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

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

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

@@ -5,4 +5,4 @@
 	height: ${e=>e.isWhatsappCarousel?"100%":"auto"};
 `,d=p.default(s.TitleRegular)`
 	color: ${a.COLORS.content.primary};
-`;exports.RCSTemplateLikePreview=t=>{const{hideDeviceContainerInPreview:s}=r.useTemplateModalContext();return 3===i.getPreviewPropLen(t)?e.jsx(e.Fragment,{children:t.zeroStateComponent}):s?e.jsx(o.RCSChatPreview,Object.assign({showHeader:t.showHeader},t)):e.jsx(e.Fragment,{children:e.jsx(l,Object.assign({style:t.containerStyle,showHeader:t.showHeader,isWhatsappCarousel:t.isWhatsappCarousel},{children:e.jsxs("div",Object.assign({style:{padding:"small"===t.size?"12px 32px 12px 12px":`16px ${t.isWhatsappCarousel?"0px":"56px"} ${t.isWhatsappCarousel?"2px":"16px"} 16px`,height:t.isWhatsappCarousel?"100%":"auto"}},{children:[!t.hidePreviewText&&e.jsx("div",Object.assign({style:{marginBottom:16}},{children:e.jsx(d,{children:"Preview"})})),e.jsx(o.RCSChatPreview,Object.assign({showHeader:t.showHeader},t))]}))}))})};
+`;exports.RCSTemplateLikePreview=t=>{const{hideDeviceContainerInPreview:s}=r.useTemplateModalContext();return 3===i.getPreviewPropLen(t)?e.jsx(e.Fragment,{children:t.zeroStateComponent}):s?e.jsx(o.RCSChatPreview,Object.assign({showHeader:t.showHeader},t)):e.jsx(e.Fragment,{children:e.jsx(l,Object.assign({style:t.containerStyle,showHeader:t.showHeader,isWhatsappCarousel:t.isWhatsappCarousel},{children:e.jsxs("div",Object.assign({style:{padding:"small"===t.size?"10px 32px 10px 10px":`10px ${t.isWhatsappCarousel?"0px":"36px"} ${t.isWhatsappCarousel?"2px":"16px"} 16px`,height:t.isWhatsappCarousel?"100%":"auto"}},{children:[!t.hidePreviewText&&e.jsx("div",Object.assign({style:{marginBottom:16}},{children:e.jsx(d,{children:"Preview"})})),e.jsx(o.RCSChatPreview,Object.assign({showHeader:t.showHeader},t))]}))}))})};

package/dist/cjs/components/template-preview/WhatsAppTemplatePreview.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("react"),t=require("../template-context-mapper/context/templateModalContext.js"),a=require("./helpers/TemplateCreatorHelper.js"),i=require("./helpers/templateMiscHelper.js"),r=require("./models/TemplateMeta.js"),n=require("./RCS/RCSTemplateLikePreview.js"),o=require("./utils/TemplateHelperUtils.js"),d=require("./WhatsApp/WhatsAppLikePreview.js"),s=require("./WhatsApp/WhatsAppLikePreviewV2.js");exports.default=u=>{let{template:p,extras:v,containerStyle:h,usePlaceHolderName:x,showHeader:m,zeroStateComponent:c,size:b,showSampleValues:T,carouselCardIndex:y,isWhatsappCarousel:w,isPreview:C,channel:N}=u;var k,V,P,j,S,B,L,A,f,q,g,E,F,H,R,O,W,I,M,D,U,z,_,Y,G,J,K,Q;const{selectedCarouselIndex:X}=t.useTemplateModalContext(),[Z,$]=l.useState(),ee=new a.TemplateCreatorHelper,le=new o.TemplateHelperUtils,te=[];return(null===(V=null===(k=null==Z?void 0:Z.ctaBtn)||void 0===k?void 0:k.phoneNumber)||void 0===V?void 0:V.isChecked)&&te.push({type:"phoneNumber",text:null!==(P=Z.ctaBtn.phoneNumber.btnText)&&void 0!==P?P:"",extra:null!==(j=Z.ctaBtn.phoneNumber.phoneNumber)&&void 0!==j?j:""}),(null===(B=null===(S=null==Z?void 0:Z.ctaBtn)||void 0===S?void 0:S.websiteLinkBtn)||void 0===B?void 0:B.isChecked)&&te.push({type:"website",text:null!==(L=Z.ctaBtn.websiteLinkBtn.btnText)&&void 0!==L?L:"",extra:null!==(f=null===(A=Z.ctaBtn.websiteLinkBtn)||void 0===A?void 0:A.linkOpens)&&void 0!==f?f:"",placeholder:null!==(q=Z.ctaBtn.websiteLinkBtn.placeholder)&&void 0!==q?q:""}),l.useEffect((()=>{p&&ee.parseUITemplateFromDBFormat({dbFormattedTemplate:p,isDuplicate:!1,showSampleValues:T,isV2:!p.htmlContentUrl}).then((e=>{$(Object.assign({},e))}))}),[p,T]),l.useEffect((()=>{p&&ee.parseUITemplateFromDBFormat({dbFormattedTemplate:p,isDuplicate:!1,showSampleValues:T,isV2:!p.htmlContentUrl}).then((e=>{$(Object.assign({},e))}))}),[X]),p?i.isRCSChannel(N||(null==p?void 0:p.channel))?e.jsx(n.RCSTemplateLikePreview,{showHeader:m,containerPadding:"large"===b?"16px 56px 12px 16px":"12px 56px 12px 12px",containerStyle:h,textType:"html",bodyText:null==Z?void 0:Z.bodyText,titleText:null==Z?void 0:Z.titleText,footerText:null==Z?void 0:Z.footerText,headerMediaType:(null==Z?void 0:Z.headerType)||r.HEADER_TYPES.NONE,headerText:null==Z?void 0:Z.headerText,headerAssetLink:null!==(g=null==Z?void 0:Z.headerAssetLink)&&void 0!==g?g:"",headerAssetName:null!==(E=null==Z?void 0:Z.headerAssetName)&&void 0!==E?E:"",quickReplybtn:null==Z?void 0:Z.quickReply,ctaBtn:te,actionTypes:null==Z?void 0:Z.actionsType,extras:v,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},carouselCardIndex:y,zeroStateComponent:null!=c?c:e.jsx(e.Fragment,{children:" "}),bodyVariableList:null!==(H=null===(F=null==Z?void 0:Z.bodyVariables)||void 0===F?void 0:F.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==H?H:[],headerVariableList:null!==(O=null===(R=null==Z?void 0:Z.headerVariables)||void 0===R?void 0:R.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==O?O:[],buttons:null==Z?void 0:Z.allButtons,isWhatsappCarousel:w,isPreview:C}):p.htmlContentUrl?e.jsx(d.WhatsappLikePreview,{showHeader:m,containerPadding:"large"===b?"16px 56px 12px 16px":"12px 56px 12px 12px",containerStyle:h,textType:"html",bodyText:le.whatsappOnlyFillVariablesValueInBodyText(null!==(_=null==Z?void 0:Z.bodyText)&&void 0!==_?_:"",null!==(Y=null==Z?void 0:Z.bodyVariables)&&void 0!==Y?Y:[],x),footerText:null==Z?void 0:Z.footerText,headerMediaType:(null==Z?void 0:Z.headerType)||r.HEADER_TYPES.NONE,headerText:le.fillVariablesValInBodyText(null!==(G=null==Z?void 0:Z.headerText)&&void 0!==G?G:"",null!==(J=null==Z?void 0:Z.headerVariables)&&void 0!==J?J:[],x),headerAssetLink:null!==(K=null==Z?void 0:Z.headerAssetLink)&&void 0!==K?K:"",headerAssetName:null!==(Q=null==Z?void 0:Z.headerAssetName)&&void 0!==Q?Q:"",quickReplybtn:null==Z?void 0:Z.quickReply,ctaBtn:te,actionTypes:null==Z?void 0:Z.actionsType,extras:v,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},zeroStateComponent:null!=c?c:e.jsx(e.Fragment,{children:" "}),isPreview:C}):e.jsx(s.WhatsappLikePreviewV2,{showHeader:m,containerPadding:"large"===b?"16px 56px 12px 16px":"12px 56px 12px 12px",containerStyle:h,textType:"html",bodyText:null==Z?void 0:Z.bodyText,footerText:null==Z?void 0:Z.footerText,headerMediaType:(null==Z?void 0:Z.headerType)||r.HEADER_TYPES.NONE,headerText:null==Z?void 0:Z.headerText,headerAssetLink:null!==(W=null==Z?void 0:Z.headerAssetLink)&&void 0!==W?W:"",headerAssetName:null!==(I=null==Z?void 0:Z.headerAssetName)&&void 0!==I?I:"",quickReplybtn:null==Z?void 0:Z.quickReply,ctaBtn:te,actionTypes:null==Z?void 0:Z.actionsType,extras:v,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},carouselCardIndex:y,zeroStateComponent:null!=c?c:e.jsx(e.Fragment,{children:" "}),bodyVariableList:null!==(D=null===(M=null==Z?void 0:Z.bodyVariables)||void 0===M?void 0:M.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==D?D:[],headerVariableList:null!==(z=null===(U=null==Z?void 0:Z.headerVariables)||void 0===U?void 0:U.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==z?z:[],buttons:null==Z?void 0:Z.allButtons,limitedTimeOfferComponent:null==Z?void 0:Z.limitedTimeOfferComponent,isWhatsappCarousel:w,isPreview:C}):e.jsx(e.Fragment,{children:c})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("react"),t=require("../template-context-mapper/context/templateModalContext.js"),a=require("./helpers/TemplateCreatorHelper.js"),i=require("./helpers/templateMiscHelper.js"),r=require("./models/TemplateMeta.js"),n=require("./RCS/RCSTemplateLikePreview.js"),o=require("./utils/TemplateHelperUtils.js"),d=require("./WhatsApp/WhatsAppLikePreview.js"),s=require("./WhatsApp/WhatsAppLikePreviewV2.js");exports.default=u=>{let{template:p,extras:v,containerStyle:h,usePlaceHolderName:x,showHeader:m,zeroStateComponent:c,size:b,showSampleValues:T,carouselCardIndex:y,isWhatsappCarousel:w,isPreview:C,channel:N}=u;var k,V,P,j,S,B,L,A,f,q,g,E,F,H,R,O,W,I,M,D,U,z,_,Y,G,J,K,Q;const{selectedCarouselIndex:X}=t.useTemplateModalContext(),[Z,$]=l.useState(),ee=new a.TemplateCreatorHelper,le=new o.TemplateHelperUtils,te=[];return(null===(V=null===(k=null==Z?void 0:Z.ctaBtn)||void 0===k?void 0:k.phoneNumber)||void 0===V?void 0:V.isChecked)&&te.push({type:"phoneNumber",text:null!==(P=Z.ctaBtn.phoneNumber.btnText)&&void 0!==P?P:"",extra:null!==(j=Z.ctaBtn.phoneNumber.phoneNumber)&&void 0!==j?j:""}),(null===(B=null===(S=null==Z?void 0:Z.ctaBtn)||void 0===S?void 0:S.websiteLinkBtn)||void 0===B?void 0:B.isChecked)&&te.push({type:"website",text:null!==(L=Z.ctaBtn.websiteLinkBtn.btnText)&&void 0!==L?L:"",extra:null!==(f=null===(A=Z.ctaBtn.websiteLinkBtn)||void 0===A?void 0:A.linkOpens)&&void 0!==f?f:"",placeholder:null!==(q=Z.ctaBtn.websiteLinkBtn.placeholder)&&void 0!==q?q:""}),l.useEffect((()=>{p&&ee.parseUITemplateFromDBFormat({dbFormattedTemplate:p,isDuplicate:!1,showSampleValues:T,isV2:!p.htmlContentUrl}).then((e=>{$(Object.assign({},e))}))}),[p,T]),l.useEffect((()=>{p&&ee.parseUITemplateFromDBFormat({dbFormattedTemplate:p,isDuplicate:!1,showSampleValues:T,isV2:!p.htmlContentUrl}).then((e=>{$(Object.assign({},e))}))}),[X]),p?i.isRCSChannel(N||(null==p?void 0:p.channel))?e.jsx(n.RCSTemplateLikePreview,{showHeader:m,containerPadding:"large"===b?"16px 36px 12px 16px":"12px 36px 12px 12px",containerStyle:h,textType:"html",bodyText:null==Z?void 0:Z.bodyText,titleText:null==Z?void 0:Z.titleText,footerText:null==Z?void 0:Z.footerText,headerMediaType:(null==Z?void 0:Z.headerType)||r.HEADER_TYPES.NONE,headerText:null==Z?void 0:Z.headerText,headerAssetLink:null!==(g=null==Z?void 0:Z.headerAssetLink)&&void 0!==g?g:"",headerAssetName:null!==(E=null==Z?void 0:Z.headerAssetName)&&void 0!==E?E:"",quickReplybtn:null==Z?void 0:Z.quickReply,ctaBtn:te,actionTypes:null==Z?void 0:Z.actionsType,extras:v,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},carouselCardIndex:y,zeroStateComponent:null!=c?c:e.jsx(e.Fragment,{children:" "}),bodyVariableList:null!==(H=null===(F=null==Z?void 0:Z.bodyVariables)||void 0===F?void 0:F.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==H?H:[],headerVariableList:null!==(O=null===(R=null==Z?void 0:Z.headerVariables)||void 0===R?void 0:R.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==O?O:[],buttons:null==Z?void 0:Z.allButtons,isWhatsappCarousel:w,isPreview:C}):p.htmlContentUrl?e.jsx(d.WhatsappLikePreview,{showHeader:m,containerPadding:"large"===b?"16px 56px 12px 16px":"12px 56px 12px 12px",containerStyle:h,textType:"html",bodyText:le.whatsappOnlyFillVariablesValueInBodyText(null!==(_=null==Z?void 0:Z.bodyText)&&void 0!==_?_:"",null!==(Y=null==Z?void 0:Z.bodyVariables)&&void 0!==Y?Y:[],x),footerText:null==Z?void 0:Z.footerText,headerMediaType:(null==Z?void 0:Z.headerType)||r.HEADER_TYPES.NONE,headerText:le.fillVariablesValInBodyText(null!==(G=null==Z?void 0:Z.headerText)&&void 0!==G?G:"",null!==(J=null==Z?void 0:Z.headerVariables)&&void 0!==J?J:[],x),headerAssetLink:null!==(K=null==Z?void 0:Z.headerAssetLink)&&void 0!==K?K:"",headerAssetName:null!==(Q=null==Z?void 0:Z.headerAssetName)&&void 0!==Q?Q:"",quickReplybtn:null==Z?void 0:Z.quickReply,ctaBtn:te,actionTypes:null==Z?void 0:Z.actionsType,extras:v,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},zeroStateComponent:null!=c?c:e.jsx(e.Fragment,{children:" "}),isPreview:C}):e.jsx(s.WhatsappLikePreviewV2,{showHeader:m,containerPadding:"large"===b?"16px 56px 12px 16px":"12px 56px 12px 12px",containerStyle:h,textType:"html",bodyText:null==Z?void 0:Z.bodyText,footerText:null==Z?void 0:Z.footerText,headerMediaType:(null==Z?void 0:Z.headerType)||r.HEADER_TYPES.NONE,headerText:null==Z?void 0:Z.headerText,headerAssetLink:null!==(W=null==Z?void 0:Z.headerAssetLink)&&void 0!==W?W:"",headerAssetName:null!==(I=null==Z?void 0:Z.headerAssetName)&&void 0!==I?I:"",quickReplybtn:null==Z?void 0:Z.quickReply,ctaBtn:te,actionTypes:null==Z?void 0:Z.actionsType,extras:v,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},carouselCardIndex:y,zeroStateComponent:null!=c?c:e.jsx(e.Fragment,{children:" "}),bodyVariableList:null!==(D=null===(M=null==Z?void 0:Z.bodyVariables)||void 0===M?void 0:M.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==D?D:[],headerVariableList:null!==(z=null===(U=null==Z?void 0:Z.headerVariables)||void 0===U?void 0:U.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==z?z:[],buttons:null==Z?void 0:Z.allButtons,limitedTimeOfferComponent:null==Z?void 0:Z.limitedTimeOfferComponent,isWhatsappCarousel:w,isPreview:C}):e.jsx(e.Fragment,{children:c})};

package/dist/esm/components/bik-layout/MockMenus.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export declare const Menus: ({
     displayName: string;
     key: number;

package/dist/esm/components/carousel-preview/CustomCarouselArrows.js

@@ -1 +1 @@
-import{jsx as e}from"react/jsx-runtime";import n from"../../assets/icons/chevronLeft.svg.js";import t from"../../assets/icons/chevronRight.svg.js";import{COLORS as s}from"../../constants/Theme.js";import{useTemplateModalContext as l}from"../template-context-mapper/context/templateModalContext.js";const o=t=>{const{className:o,style:c,onClick:i,isPreview:r}=t,{selectedCarouselIndex:a,setSelectedCarouselIndex:m}=l();return e("div",Object.assign({className:o,style:Object.assign(Object.assign({},c),{display:i&&(null!=a?a:-1)>-1||r?"flex":"none",content:"none"}),onClick:e=>{null==i||i(e),(null!=a?a:-1)<1||r||null==m||m((null!=a?a:-1)-1)}},{children:e(n,{height:10,width:10,color:s.content.primary})}))},c=n=>{const{className:o,style:c,onClick:i,isPreview:r}=n,{selectedCarouselIndex:a,setSelectedCarouselIndex:m,cardCount:u}=l();return e("div",Object.assign({className:o,style:Object.assign(Object.assign({},c),{display:i&&(null!=a?a:-1)>-1||r?"flex":"none",content:"none"}),onClick:e=>{console.log("onClick",a,u),null==i||i(e),(null!=a?a:-1)>=(null!=u?u:-1)-1||r||null==m||m((null!=a?a:-1)+1)}},{children:e(t,{height:10,width:10,color:s.content.primary})}))};export{o as CustomCarouselLeftArrow,c as CustomCarouselRightArrow};
+import{jsx as e}from"react/jsx-runtime";import n from"../../assets/icons/chevronLeft.svg.js";import t from"../../assets/icons/chevronRight.svg.js";import{COLORS as s}from"../../constants/Theme.js";import{useTemplateModalContext as l}from"../template-context-mapper/context/templateModalContext.js";const o=t=>{const{className:o,style:c,onClick:i,isPreview:r}=t,{selectedCarouselIndex:a,setSelectedCarouselIndex:m}=l();return e("div",Object.assign({className:o,style:Object.assign(Object.assign({},c),{display:i&&(null!=a?a:-1)>-1||r?"flex":"none",content:"none"}),onClick:e=>{null==i||i(e),(null!=a?a:-1)<1||r||null==m||m((null!=a?a:-1)-1)}},{children:e(n,{height:10,width:10,color:s.content.primary})}))},c=n=>{const{className:o,style:c,onClick:i,isPreview:r}=n,{selectedCarouselIndex:a,setSelectedCarouselIndex:m,cardCount:u}=l();return e("div",Object.assign({className:o,style:Object.assign(Object.assign({},c),{display:i&&(null!=a?a:-1)>-1||r?"flex":"none",content:"none"}),onClick:e=>{null==i||i(e),(null!=a?a:-1)>=(null!=u?u:-1)-1||r||null==m||m((null!=a?a:-1)+1)}},{children:e(t,{height:10,width:10,color:s.content.primary})}))};export{o as CustomCarouselLeftArrow,c as CustomCarouselRightArrow};

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

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

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

@@ -5,4 +5,4 @@ import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import o from"st
 	height: ${e=>e.isWhatsappCarousel?"100%":"auto"};
 `,l=o(i)`
 	color: ${a.content.primary};
-`,m=o=>{const{hideDeviceContainerInPreview:i}=s();return 3===p(o)?e(t,{children:o.zeroStateComponent}):i?e(n,Object.assign({showHeader:o.showHeader},o)):e(t,{children:e(h,Object.assign({style:o.containerStyle,showHeader:o.showHeader,isWhatsappCarousel:o.isWhatsappCarousel},{children:r("div",Object.assign({style:{padding:"small"===o.size?"12px 32px 12px 12px":`16px ${o.isWhatsappCarousel?"0px":"56px"} ${o.isWhatsappCarousel?"2px":"16px"} 16px`,height:o.isWhatsappCarousel?"100%":"auto"}},{children:[!o.hidePreviewText&&e("div",Object.assign({style:{marginBottom:16}},{children:e(l,{children:"Preview"})})),e(n,Object.assign({showHeader:o.showHeader},o))]}))}))})};export{m as RCSTemplateLikePreview};
+`,m=o=>{const{hideDeviceContainerInPreview:i}=s();return 3===p(o)?e(t,{children:o.zeroStateComponent}):i?e(n,Object.assign({showHeader:o.showHeader},o)):e(t,{children:e(h,Object.assign({style:o.containerStyle,showHeader:o.showHeader,isWhatsappCarousel:o.isWhatsappCarousel},{children:r("div",Object.assign({style:{padding:"small"===o.size?"10px 32px 10px 10px":`10px ${o.isWhatsappCarousel?"0px":"36px"} ${o.isWhatsappCarousel?"2px":"16px"} 16px`,height:o.isWhatsappCarousel?"100%":"auto"}},{children:[!o.hidePreviewText&&e("div",Object.assign({style:{marginBottom:16}},{children:e(l,{children:"Preview"})})),e(n,Object.assign({showHeader:o.showHeader},o))]}))}))})};export{m as RCSTemplateLikePreview};

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

@@ -1 +1 @@
-import{jsx as e,Fragment as l}from"react/jsx-runtime";import{useState as t,useEffect as a}from"react";import{useTemplateModalContext as i}from"../template-context-mapper/context/templateModalContext.js";import{TemplateCreatorHelper as o}from"./helpers/TemplateCreatorHelper.js";import{isRCSChannel as n}from"./helpers/templateMiscHelper.js";import{HEADER_TYPES as r}from"./models/TemplateMeta.js";import{RCSTemplateLikePreview as d}from"./RCS/RCSTemplateLikePreview.js";import{TemplateHelperUtils as s}from"./utils/TemplateHelperUtils.js";import{WhatsappLikePreview as p}from"./WhatsApp/WhatsAppLikePreview.js";import{WhatsappLikePreviewV2 as u}from"./WhatsApp/WhatsAppLikePreviewV2.js";const v=v=>{let{template:m,extras:h,containerStyle:x,usePlaceHolderName:c,showHeader:b,zeroStateComponent:T,size:y,showSampleValues:w,carouselCardIndex:N,isWhatsappCarousel:V,isPreview:f,channel:k}=v;var C,B,L,P,A,S,j,g,F,O,H,I,R,W,q,M,U,z,D,E,G,J,K,Q,X,Y,Z,$;const{selectedCarouselIndex:_}=i(),[ee,le]=t(),te=new o,ae=new s,ie=[];return(null===(B=null===(C=null==ee?void 0:ee.ctaBtn)||void 0===C?void 0:C.phoneNumber)||void 0===B?void 0:B.isChecked)&&ie.push({type:"phoneNumber",text:null!==(L=ee.ctaBtn.phoneNumber.btnText)&&void 0!==L?L:"",extra:null!==(P=ee.ctaBtn.phoneNumber.phoneNumber)&&void 0!==P?P:""}),(null===(S=null===(A=null==ee?void 0:ee.ctaBtn)||void 0===A?void 0:A.websiteLinkBtn)||void 0===S?void 0:S.isChecked)&&ie.push({type:"website",text:null!==(j=ee.ctaBtn.websiteLinkBtn.btnText)&&void 0!==j?j:"",extra:null!==(F=null===(g=ee.ctaBtn.websiteLinkBtn)||void 0===g?void 0:g.linkOpens)&&void 0!==F?F:"",placeholder:null!==(O=ee.ctaBtn.websiteLinkBtn.placeholder)&&void 0!==O?O:""}),a((()=>{m&&te.parseUITemplateFromDBFormat({dbFormattedTemplate:m,isDuplicate:!1,showSampleValues:w,isV2:!m.htmlContentUrl}).then((e=>{le(Object.assign({},e))}))}),[m,w]),a((()=>{m&&te.parseUITemplateFromDBFormat({dbFormattedTemplate:m,isDuplicate:!1,showSampleValues:w,isV2:!m.htmlContentUrl}).then((e=>{le(Object.assign({},e))}))}),[_]),m?n(k||(null==m?void 0:m.channel))?e(d,{showHeader:b,containerPadding:"large"===y?"16px 56px 12px 16px":"12px 56px 12px 12px",containerStyle:x,textType:"html",bodyText:null==ee?void 0:ee.bodyText,titleText:null==ee?void 0:ee.titleText,footerText:null==ee?void 0:ee.footerText,headerMediaType:(null==ee?void 0:ee.headerType)||r.NONE,headerText:null==ee?void 0:ee.headerText,headerAssetLink:null!==(H=null==ee?void 0:ee.headerAssetLink)&&void 0!==H?H:"",headerAssetName:null!==(I=null==ee?void 0:ee.headerAssetName)&&void 0!==I?I:"",quickReplybtn:null==ee?void 0:ee.quickReply,ctaBtn:ie,actionTypes:null==ee?void 0:ee.actionsType,extras:h,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},carouselCardIndex:N,zeroStateComponent:null!=T?T:e(l,{children:" "}),bodyVariableList:null!==(W=null===(R=null==ee?void 0:ee.bodyVariables)||void 0===R?void 0:R.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==W?W:[],headerVariableList:null!==(M=null===(q=null==ee?void 0:ee.headerVariables)||void 0===q?void 0:q.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==M?M:[],buttons:null==ee?void 0:ee.allButtons,isWhatsappCarousel:V,isPreview:f}):m.htmlContentUrl?e(p,{showHeader:b,containerPadding:"large"===y?"16px 56px 12px 16px":"12px 56px 12px 12px",containerStyle:x,textType:"html",bodyText:ae.whatsappOnlyFillVariablesValueInBodyText(null!==(K=null==ee?void 0:ee.bodyText)&&void 0!==K?K:"",null!==(Q=null==ee?void 0:ee.bodyVariables)&&void 0!==Q?Q:[],c),footerText:null==ee?void 0:ee.footerText,headerMediaType:(null==ee?void 0:ee.headerType)||r.NONE,headerText:ae.fillVariablesValInBodyText(null!==(X=null==ee?void 0:ee.headerText)&&void 0!==X?X:"",null!==(Y=null==ee?void 0:ee.headerVariables)&&void 0!==Y?Y:[],c),headerAssetLink:null!==(Z=null==ee?void 0:ee.headerAssetLink)&&void 0!==Z?Z:"",headerAssetName:null!==($=null==ee?void 0:ee.headerAssetName)&&void 0!==$?$:"",quickReplybtn:null==ee?void 0:ee.quickReply,ctaBtn:ie,actionTypes:null==ee?void 0:ee.actionsType,extras:h,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},zeroStateComponent:null!=T?T:e(l,{children:" "}),isPreview:f}):e(u,{showHeader:b,containerPadding:"large"===y?"16px 56px 12px 16px":"12px 56px 12px 12px",containerStyle:x,textType:"html",bodyText:null==ee?void 0:ee.bodyText,footerText:null==ee?void 0:ee.footerText,headerMediaType:(null==ee?void 0:ee.headerType)||r.NONE,headerText:null==ee?void 0:ee.headerText,headerAssetLink:null!==(U=null==ee?void 0:ee.headerAssetLink)&&void 0!==U?U:"",headerAssetName:null!==(z=null==ee?void 0:ee.headerAssetName)&&void 0!==z?z:"",quickReplybtn:null==ee?void 0:ee.quickReply,ctaBtn:ie,actionTypes:null==ee?void 0:ee.actionsType,extras:h,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},carouselCardIndex:N,zeroStateComponent:null!=T?T:e(l,{children:" "}),bodyVariableList:null!==(E=null===(D=null==ee?void 0:ee.bodyVariables)||void 0===D?void 0:D.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==E?E:[],headerVariableList:null!==(J=null===(G=null==ee?void 0:ee.headerVariables)||void 0===G?void 0:G.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==J?J:[],buttons:null==ee?void 0:ee.allButtons,limitedTimeOfferComponent:null==ee?void 0:ee.limitedTimeOfferComponent,isWhatsappCarousel:V,isPreview:f}):e(l,{children:T})};export{v as default};
+import{jsx as e,Fragment as l}from"react/jsx-runtime";import{useState as t,useEffect as a}from"react";import{useTemplateModalContext as i}from"../template-context-mapper/context/templateModalContext.js";import{TemplateCreatorHelper as o}from"./helpers/TemplateCreatorHelper.js";import{isRCSChannel as n}from"./helpers/templateMiscHelper.js";import{HEADER_TYPES as r}from"./models/TemplateMeta.js";import{RCSTemplateLikePreview as d}from"./RCS/RCSTemplateLikePreview.js";import{TemplateHelperUtils as s}from"./utils/TemplateHelperUtils.js";import{WhatsappLikePreview as p}from"./WhatsApp/WhatsAppLikePreview.js";import{WhatsappLikePreviewV2 as u}from"./WhatsApp/WhatsAppLikePreviewV2.js";const v=v=>{let{template:m,extras:h,containerStyle:x,usePlaceHolderName:c,showHeader:b,zeroStateComponent:T,size:y,showSampleValues:w,carouselCardIndex:N,isWhatsappCarousel:V,isPreview:f,channel:k}=v;var C,B,L,P,A,S,j,g,F,O,H,I,R,W,q,M,U,z,D,E,G,J,K,Q,X,Y,Z,$;const{selectedCarouselIndex:_}=i(),[ee,le]=t(),te=new o,ae=new s,ie=[];return(null===(B=null===(C=null==ee?void 0:ee.ctaBtn)||void 0===C?void 0:C.phoneNumber)||void 0===B?void 0:B.isChecked)&&ie.push({type:"phoneNumber",text:null!==(L=ee.ctaBtn.phoneNumber.btnText)&&void 0!==L?L:"",extra:null!==(P=ee.ctaBtn.phoneNumber.phoneNumber)&&void 0!==P?P:""}),(null===(S=null===(A=null==ee?void 0:ee.ctaBtn)||void 0===A?void 0:A.websiteLinkBtn)||void 0===S?void 0:S.isChecked)&&ie.push({type:"website",text:null!==(j=ee.ctaBtn.websiteLinkBtn.btnText)&&void 0!==j?j:"",extra:null!==(F=null===(g=ee.ctaBtn.websiteLinkBtn)||void 0===g?void 0:g.linkOpens)&&void 0!==F?F:"",placeholder:null!==(O=ee.ctaBtn.websiteLinkBtn.placeholder)&&void 0!==O?O:""}),a((()=>{m&&te.parseUITemplateFromDBFormat({dbFormattedTemplate:m,isDuplicate:!1,showSampleValues:w,isV2:!m.htmlContentUrl}).then((e=>{le(Object.assign({},e))}))}),[m,w]),a((()=>{m&&te.parseUITemplateFromDBFormat({dbFormattedTemplate:m,isDuplicate:!1,showSampleValues:w,isV2:!m.htmlContentUrl}).then((e=>{le(Object.assign({},e))}))}),[_]),m?n(k||(null==m?void 0:m.channel))?e(d,{showHeader:b,containerPadding:"large"===y?"16px 36px 12px 16px":"12px 36px 12px 12px",containerStyle:x,textType:"html",bodyText:null==ee?void 0:ee.bodyText,titleText:null==ee?void 0:ee.titleText,footerText:null==ee?void 0:ee.footerText,headerMediaType:(null==ee?void 0:ee.headerType)||r.NONE,headerText:null==ee?void 0:ee.headerText,headerAssetLink:null!==(H=null==ee?void 0:ee.headerAssetLink)&&void 0!==H?H:"",headerAssetName:null!==(I=null==ee?void 0:ee.headerAssetName)&&void 0!==I?I:"",quickReplybtn:null==ee?void 0:ee.quickReply,ctaBtn:ie,actionTypes:null==ee?void 0:ee.actionsType,extras:h,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},carouselCardIndex:N,zeroStateComponent:null!=T?T:e(l,{children:" "}),bodyVariableList:null!==(W=null===(R=null==ee?void 0:ee.bodyVariables)||void 0===R?void 0:R.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==W?W:[],headerVariableList:null!==(M=null===(q=null==ee?void 0:ee.headerVariables)||void 0===q?void 0:q.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==M?M:[],buttons:null==ee?void 0:ee.allButtons,isWhatsappCarousel:V,isPreview:f}):m.htmlContentUrl?e(p,{showHeader:b,containerPadding:"large"===y?"16px 56px 12px 16px":"12px 56px 12px 12px",containerStyle:x,textType:"html",bodyText:ae.whatsappOnlyFillVariablesValueInBodyText(null!==(K=null==ee?void 0:ee.bodyText)&&void 0!==K?K:"",null!==(Q=null==ee?void 0:ee.bodyVariables)&&void 0!==Q?Q:[],c),footerText:null==ee?void 0:ee.footerText,headerMediaType:(null==ee?void 0:ee.headerType)||r.NONE,headerText:ae.fillVariablesValInBodyText(null!==(X=null==ee?void 0:ee.headerText)&&void 0!==X?X:"",null!==(Y=null==ee?void 0:ee.headerVariables)&&void 0!==Y?Y:[],c),headerAssetLink:null!==(Z=null==ee?void 0:ee.headerAssetLink)&&void 0!==Z?Z:"",headerAssetName:null!==($=null==ee?void 0:ee.headerAssetName)&&void 0!==$?$:"",quickReplybtn:null==ee?void 0:ee.quickReply,ctaBtn:ie,actionTypes:null==ee?void 0:ee.actionsType,extras:h,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},zeroStateComponent:null!=T?T:e(l,{children:" "}),isPreview:f}):e(u,{showHeader:b,containerPadding:"large"===y?"16px 56px 12px 16px":"12px 56px 12px 12px",containerStyle:x,textType:"html",bodyText:null==ee?void 0:ee.bodyText,footerText:null==ee?void 0:ee.footerText,headerMediaType:(null==ee?void 0:ee.headerType)||r.NONE,headerText:null==ee?void 0:ee.headerText,headerAssetLink:null!==(U=null==ee?void 0:ee.headerAssetLink)&&void 0!==U?U:"",headerAssetName:null!==(z=null==ee?void 0:ee.headerAssetName)&&void 0!==z?z:"",quickReplybtn:null==ee?void 0:ee.quickReply,ctaBtn:ie,actionTypes:null==ee?void 0:ee.actionsType,extras:h,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},carouselCardIndex:N,zeroStateComponent:null!=T?T:e(l,{children:" "}),bodyVariableList:null!==(E=null===(D=null==ee?void 0:ee.bodyVariables)||void 0===D?void 0:D.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==E?E:[],headerVariableList:null!==(J=null===(G=null==ee?void 0:ee.headerVariables)||void 0===G?void 0:G.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==J?J:[],buttons:null==ee?void 0:ee.allButtons,limitedTimeOfferComponent:null==ee?void 0:ee.limitedTimeOfferComponent,isWhatsappCarousel:V,isPreview:f}):e(l,{children:T})};export{v as default};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bikdotai/bik-component-library",
-	"version": "0.0.639--bik-comp-lib--beta",
+	"version": "0.0.639--bik-comp-lib--beta0.2",
 	"description": "Bik Component Library",
 	"repository": {
 		"type": "git",