@bikdotai/bik-component-library 0.0.549-beta.14 → 0.0.549-beta.16

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

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

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

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

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

@@ -65,6 +65,7 @@ export declare const TemplateModalContext: React.Context<{
     sliderRef?: LegacyRef<Slider> | undefined;
     isCarouselHovered?: boolean | undefined;
     setIsCarouselHovered?: ((value: boolean) => void) | undefined;
+    maxCharLimit?: number | undefined;
 }>;
 export declare const useTemplateModalContext: () => {
     hideCrossButton: boolean;
@@ -122,4 +123,5 @@ export declare const useTemplateModalContext: () => {
     sliderRef?: LegacyRef<Slider> | undefined;
     isCarouselHovered?: boolean | undefined;
     setIsCarouselHovered?: ((value: boolean) => void) | undefined;
+    maxCharLimit?: number | undefined;
 };

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

@@ -13,4 +13,4 @@
 	background-color: rgba(0, 0, 0, 0.1);
 	z-index: 1000;
 	cursor: not-allowed;
-`,f={value:"custom_link",label:"Custom URL"},E={value:"custom_text",label:"Custom text"},C={value:"static_expiry",label:"Static Expiry"};exports.Container=h,exports.default=n=>{let{onFocus:x,variable:_,index:N,showVariableModal:P,setShowDiscountCheckBox:V,componentType:A,CTAoptions:k,buttonType:S}=n;var L,D,B,H,w,Y,U,q,R;const[M,W]=i.useState(!1),[I,$]=i.useState(""),[z,Z]=i.useState([]),[F,G]=i.useState(),[Q,K]=i.useState(!1),{variableList:J,setVariableList:X,setVariableCallback:ee,setShowVariablePicker:te,device:le,channel:ae,isError:ie,originalVariableList:ne,template:se,templateSelectionTriggered:oe,setTemplate:ue,setDisplayContent:de,setOriginalVariableList:re,globalNormalizedPlaceholders:ce,enabledCustomText:pe,pod:me,selectedCarouselIndex:ve,isProductCarouselType:be,isWhatsappCarousel:ge,disableEditVariable:Oe,disableEditExpiry:je,templateErrorIndexes:ye}=g.useTemplateModalContext();function xe(e,t){var l,a,i;const n=e;$(""),G(n),ae===c.CHANNEL_TYPE.WHATSAPP?"custom_text"!==n.value&&"custom_link"!==n.value&&"static_expiry"!==n.value?(he(null!==(l=n.value)&&void 0!==l?l:"","string"),null==Te||Te(null!==(a=_.index)&&void 0!==a?a:0,n.value,!0)):(null==Te||Te(null!==(i=_.index)&&void 0!==i?i:0,"",!0,n.value),he("","url"===n.bikPlaceholderType?"link":"string")):"custom_text"!==n.value&&"custom_link"!==n.value?he(n.value,"url"===n.bikPlaceholderType?"link":"string"):($(""),he("",n.value))}function _e(e,t){var l;$(t);const a="custom_link"===(null==F?void 0:F.value)&&t?t.includes("https")?t:`https://${t}`:t;he(a,"static_expiry"===e?"string":e),ae===c.CHANNEL_TYPE.WHATSAPP&&(null==Te||Te(null!==(l=_.index)&&void 0!==l?l:0,a,"custom_link"===e,e))}function he(e,t,l){var i,n,s,o;const u="custom_link"===t?"link":"custom_text"===t?"string":t;if(ae!==c.CHANNEL_TYPE.WHATSAPP){const l=j.getVariableNameForEmailByIndex(N+1),a=null===document||void 0===document?void 0:document.getElementById("mobile"===le?"template_html_mobile":"template_html_desktop"),n=ae===c.CHANNEL_TYPE.EMAIL?null===(i=null==a?void 0:a.contentWindow)||void 0===i?void 0:i.document.getElementById(l):document.getElementById(l);n&&(n.textContent="custom_text"!==t&&"custom_link"!==t||e?e:_.variableName);const s=ne.map(((t,l)=>l===N?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t));null==re||re(s)}if(ae===c.CHANNEL_TYPE.WHATSAPP){if(null!=ve&&ve>-1&&be){const l=Object.assign({},ne).cards.map(((l,a)=>{var i,n;return"BODY"===A?Object.assign(Object.assign({},l),{body:null===(i=l.body)||void 0===i?void 0:i.map(((t,l)=>N===l?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t))}):"BUTTONS"===A?Object.assign(Object.assign({},l),{buttons:null===(n=l.buttons)||void 0===n?void 0:n.map(((l,a)=>a===N?Object.assign(Object.assign({},l),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===l.type?e:[e]}):l))}):l}));return void(null==re||re((e=>Object.assign(Object.assign({},e),{cards:l}))))}const i=null!=ve&&ve>-1?ne.cards[ve]:ne;let d=i.body,r=i.header,c=i.buttons;if("BODY"===A?d=null===(n=i.body)||void 0===n?void 0:n.map(((t,l)=>l===N?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)):"HEADER"===A?r=null===(s=i.header)||void 0===s?void 0:s.map(((t,l)=>l===N?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)):"BUTTONS"===A&&(c=null===(o=i.buttons)||void 0===o?void 0:o.map(((a,i)=>i===N?Object.assign(Object.assign({},a),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===a.type?e:[e],queryParams:null!=l?l:[]}):a))),null!=ve&&ve>-1){const e=a.cloneDeep(ne.cards);e[ve]={header:r,body:d,buttons:c},null==re||re((t=>Object.assign(Object.assign({},t),{cards:e})))}else null==re||re((e=>Object.assign(Object.assign({},e),{header:r,body:d,buttons:c})))}}function Te(e,t,l,i){var n,s,o,u,d,r,c;if(null!=ve&&ve>-1&&be){const s=Object.assign({},se).components.map((l=>{var a;return"CAROUSEL"===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"===A){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"===A){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=a.cloneDeep(se);if(l){const l=null===(n=Object.assign({},se).mapping.cards)||void 0===n?void 0:n.map(((l,a)=>{var n,s,o;if("BODY"===A)return Object.assign(Object.assign({},l),{body:null===(n=l.body)||void 0===n?void 0:n.map(((l,a)=>e===a?"custom_text"===i?`((editableVariable${a+10}))`:t:l))});if("BUTTONS"===A&&(null==l?void 0:l.buttons)){let n=-1,u=-1;return null===(s=se.components[1].cards)||void 0===s||s[a].components.forEach((t=>{var l;"BUTTONS"===t.type&&(null===(l=t.buttons)||void 0===l||l.forEach(((t,l)=>{"URL"===t.type&&(n++,l===e&&"URL"==t.type&&(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"===i?"((customPlaceholderName))":t:e))})}return l}));o.mapping.cards=l}return o.components=s,void(null==ue||ue(o))}const p=null!=ve&&ve>-1?{components:null===(s=Object.assign({},se).components[1].cards)||void 0===s?void 0:s[ve].components,mapping:null===(o=Object.assign({},se).mapping.cards)||void 0===o?void 0:o[ve]}:Object.assign({},se),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"===A){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"===A){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"===A){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"===A)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"===A&&(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,a)=>e===a?"custom_text"===i?`((editableVariable${a+10}))`:t:l))});else if("HEADER"===A&&(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,a)=>e===a?"custom_text"===i?`((editableVariable${a+20}))`:t:l))});else if("BUTTONS"===A&&(null===(c=null==p?void 0:p.mapping)||void 0===c?void 0:c.buttons)){let l=-1,a=-1;m.forEach((t=>{var i;"BUTTONS"===t.type&&(null===(i=t.buttons)||void 0===i||i.forEach(((t,i)=>{"URL"===t.type&&(l++,i===e&&"URL"==t.type&&(a=l))})))})),p.mapping=Object.assign(Object.assign({},p.mapping),{buttons:p.mapping.buttons.map(((e,l)=>l===a?"custom_link"===i?"((customPlaceholderName))":t:e))})}if(null!=ve&&ve>-1&&se){const e=a.cloneDeep(se);e.components[1].cards[ve].components=p.components,e.mapping.cards[ve]=p.mapping,null==ue||ue(e)}else null==ue||ue(Object.assign({},p))}i.useEffect((()=>{M&&(null==x||x())}),[M]),i.useEffect((()=>{!function(){var e,t,l,a,i;const n="mobile"===le?"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);ae===c.CHANNEL_TYPE.EMAIL&&(null==de||de(o))}()}),[oe]),i.useEffect((()=>{!function(){var e,t;const l=[];let a=[];if(ae!==c.CHANNEL_TYPE.MESSAGE||pe){"link"===(null==_?void 0:_.type)?(l.push({label:"",options:[f,E]}),G(f)):"date_time"===(null==_?void 0:_.type)?(l.push({label:"",options:[f,E]}),G(C)):(l.push({label:"",options:[f,E,C]}),G(E));const e=null!=ce?ce:[];Z([...l,...e.map((e=>{var t,l;return Object.assign(Object.assign({},e),{label:v.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!=ce?ce:[];Z([{label:"",options:[E,f]},...e]),a=[{label:"",options:[E,f]},...e]}if((ae===c.CHANNEL_TYPE.WHATSAPP||ae===c.CHANNEL_TYPE.EMAIL||ae===c.CHANNEL_TYPE.MESSAGE)&&_.updatedValue)if(r.placeHolderNamePattern.test(_.updatedValue)&&ae===c.CHANNEL_TYPE.WHATSAPP||_.updatedValue.startsWith("{{")&&ae!==c.CHANNEL_TYPE.WHATSAPP){const e=function(e,t,l){var a;let i={label:"",value:""};const n=l===c.CHANNEL_TYPE.WHATSAPP?e.updatedValue.replace("[[","").replace("]]",""):e.updatedValue.replace("{{","").replace("}}","");if(P){let t=e.updatedValue;if(me===p.POD.CHATBOT&&"BUTTONS"===A){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}(_,a,ae);e.value&&G(e)}else"date_time"===_.type?(G(C),$(_.updatedValue),Te(null!==(e=_.index)&&void 0!==e?e:0,_.updatedValue)):(null===(t=_.updatedValue)||void 0===t?void 0:t.startsWith("https"))?(G(f),$(_.updatedValue.split("https://")[1])):(G(E),$(_.updatedValue))}()}),[ve]),i.useEffect((()=>{le&&F&&I&&setTimeout((()=>{he("custom_link"===(null==F?void 0:F.value)&&I?I.includes("https")?I:`https://${I}`:I,F.value)}),100)}),[le]),i.useEffect((()=>{!Q&&F&&_.updatedValue&&setTimeout((()=>{he("custom_link"===(null==F?void 0:F.value)&&_.updatedValue?_.updatedValue.includes("https")?_.updatedValue:`https://${_.updatedValue}`:_.updatedValue,F.value),K(!0)}),100)}),[F]);const fe=e=>{null==V||V(!1),"{{custom.url}}"===e.actualValue?xe({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?xe({label:e.displayName,selected:!0,value:"custom_text"}):"{{static.expiry}}"==e.actualValue?xe({label:e.displayName,selected:!0,value:"static_expiry"}):xe({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})};return e.jsxs(h,Object.assign({channel:ae,focused:M,onMouseEnter:()=>W(!0),onMouseLeave:()=>W(!1)},{children:[e.jsx("div",Object.assign({style:{marginBottom:8}},{children:e.jsxs(m.BodySecondary,Object.assign({style:{color:ie&&!F?b.COLORS.content.negative:b.COLORS.content.primary}},{children:[null===(L=_.variableName)||void 0===L?void 0:L.replace("{{","").replace("}}","")," ","link"===(null==_?void 0:_.type)?"link":"variable"]}))})),e.jsx("div",Object.assign({style:{marginBottom:12}},{children:P?e.jsxs("div",Object.assign({style:{display:"flex",border:"#E0E0E0 1px solid",borderRadius:4,padding:10,justifyContent:(null==F?void 0:F.label)?"space-between":"flex-end"}},{children:[e.jsx(m.BodyPrimary,Object.assign({numberOfLines:1},{children:me===p.POD.CHATBOT?["static_expiry","custom_text","custom_link"].includes(null!==(D=null==F?void 0:F.value)&&void 0!==D?D:"")?null==F?void 0:F.label:null==F?void 0:F.value:d.truncate(null!==(B=null==F?void 0:F.label)&&void 0!==B?B:"",20,!0)})),Oe||"date_time"===(null==_?void 0:_.type)&&je?e.jsx(e.Fragment,{}):e.jsx(t.default,{onClick:()=>{(()=>{if(S===p.BUTTON_TYPE.URL&&me===p.POD.CHATBOT){const e=O.updateVariables({variableList:J,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom URL",variableValue:"{{custom.url}}"});X(e)}else if("limited_time_offer"===A){const e=O.updateVariables({variableList:J,categoryDisplayName:"Static Variables",variableDisplayName:"Static Expiry",variableValue:"{{static.expiry}}"});X(e)}else if(S===p.BUTTON_TYPE.COPY_CODE){const e=O.updateVariables({variableList:J,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom Text",variableValue:"{{custom.text}}"});X(e)}})(),ee((()=>fe)),te(!0)},width:24,height:24,color:b.COLORS.content.primary})]})):e.jsx(o.Dropdown,{disabled:Oe,options:z,isSearchable:!1,onSelect:xe,defaultOptions:F?[Object.assign(Object.assign({},F),{selected:!0})]:[]})})),("custom_text"===(null==F?void 0:F.value)||"custom_link"===(null==F?void 0:F.value))&&e.jsx(u.Input,{state:Oe?"disabled":"none",labelText:"custom_text"===(null==F?void 0:F.value)?"Custom text value":"custom_link"===(null==F?void 0:F.value)?"Custom URL value":"",id:`variable-value-${null==F?void 0:F.value}-${N}`,value:I,errorMessage:ie&&(null===(H=null==ye?void 0:ye.buttons)||void 0===H?void 0:H.includes(null!==(w=null==_?void 0:_.index)&&void 0!==w?w:-1))?I&&0!==I.trim().length?"custom_link"!==F.value||/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$/.test(`https://${I.trim()}`)&&0!==I.trim().length?"custom_link"!==F.value&&I.length>30?"Length cannot be more than 30":"BUTTONS"===A&&"custom_link"!==F.value?"Enter valid alpha numeric code":"":"Enter valid URL":"Required field":"",maxCharLimit:"custom_link"===(null==F?void 0:F.value)?2e3:"BUTTONS"===A?15:30,noKeyDownChange:!0,prefixText:"custom_link"===(null==F?void 0:F.value)?"https://":"",placeholder:"link"===_.type||"custom_link"===F.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{_e(F.value,e)}}),"static_expiry"===(null==F?void 0:F.value)&&e.jsxs("div",Object.assign({style:{position:"relative"}},{children:[Oe&&e.jsx(T,{onClick:e=>e.preventDefault()}),e.jsx(s.CustomDateTime,{placement:"auto",time:I?l.format(new Date(I),"hh:mm a"):l.format(new Date,"hh:mm a"),date:I?new Date(I):new Date,minDate:new Date,error:"",setError:()=>{},onChange:e=>{_e("static_expiry",e.toISOString())}})]})),"link"===_.type&&"custom_link"!==(null==F?void 0:F.value)&&!be&&!ge&&me===p.POD.CHATBOT&&e.jsx(y.QueryParamsComponent,{isError:null!==(q=null===(Y=null==ye?void 0:ye.buttons)||void 0===Y?void 0:Y.includes(null!==(U=null==_?void 0:_.index)&&void 0!==U?U:-1))&&void 0!==q&&q,params:null!==(R=_.queryParams)&&void 0!==R?R:[],onChange:e=>{he(_.updatedValue,"link",e)},variableValue:_.updatedValue})]}))};
+`,f={value:"custom_link",label:"Custom URL"},E={value:"custom_text",label:"Custom text"},C={value:"static_expiry",label:"Static Expiry"};exports.Container=h,exports.default=n=>{let{onFocus:x,variable:_,index:N,showVariableModal:P,setShowDiscountCheckBox:V,componentType:A,CTAoptions:k,buttonType:S}=n;var L,D,B,H,w,Y,U,q,R;const[M,W]=i.useState(!1),[I,$]=i.useState(""),[z,Z]=i.useState([]),[F,G]=i.useState(),[Q,K]=i.useState(!1),{variableList:J,setVariableList:X,setVariableCallback:ee,setShowVariablePicker:te,device:le,channel:ae,isError:ie,originalVariableList:ne,template:se,templateSelectionTriggered:oe,setTemplate:ue,setDisplayContent:de,setOriginalVariableList:re,globalNormalizedPlaceholders:ce,enabledCustomText:pe,pod:me,selectedCarouselIndex:ve,isProductCarouselType:be,isWhatsappCarousel:ge,disableEditVariable:Oe,disableEditExpiry:je,templateErrorIndexes:ye,maxCharLimit:xe}=g.useTemplateModalContext();function _e(e,t){var l,a,i;const n=e;$(""),G(n),ae===c.CHANNEL_TYPE.WHATSAPP?"custom_text"!==n.value&&"custom_link"!==n.value&&"static_expiry"!==n.value?(Te(null!==(l=n.value)&&void 0!==l?l:"","string"),null==fe||fe(null!==(a=_.index)&&void 0!==a?a:0,n.value,!0)):(null==fe||fe(null!==(i=_.index)&&void 0!==i?i:0,"",!0,n.value),Te("","url"===n.bikPlaceholderType?"link":"string")):"custom_text"!==n.value&&"custom_link"!==n.value?Te(n.value,"url"===n.bikPlaceholderType?"link":"string"):($(""),Te("",n.value))}function he(e,t){var l;$(t);const a="custom_link"===(null==F?void 0:F.value)&&t?t.includes("https")?t:`https://${t}`:t;Te(a,"static_expiry"===e?"string":e),ae===c.CHANNEL_TYPE.WHATSAPP&&(null==fe||fe(null!==(l=_.index)&&void 0!==l?l:0,a,"custom_link"===e,e))}function Te(e,t,l){var i,n,s,o;const u="custom_link"===t?"link":"custom_text"===t?"string":t;if(ae!==c.CHANNEL_TYPE.WHATSAPP){const l=j.getVariableNameForEmailByIndex(N+1),a=null===document||void 0===document?void 0:document.getElementById("mobile"===le?"template_html_mobile":"template_html_desktop"),n=ae===c.CHANNEL_TYPE.EMAIL?null===(i=null==a?void 0:a.contentWindow)||void 0===i?void 0:i.document.getElementById(l):document.getElementById(l);n&&(n.textContent="custom_text"!==t&&"custom_link"!==t||e?e:_.variableName);const s=ne.map(((t,l)=>l===N?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t));null==re||re(s)}if(ae===c.CHANNEL_TYPE.WHATSAPP){if(null!=ve&&ve>-1&&be){const l=Object.assign({},ne).cards.map(((l,a)=>{var i,n;return"BODY"===A?Object.assign(Object.assign({},l),{body:null===(i=l.body)||void 0===i?void 0:i.map(((t,l)=>N===l?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t))}):"BUTTONS"===A?Object.assign(Object.assign({},l),{buttons:null===(n=l.buttons)||void 0===n?void 0:n.map(((l,a)=>a===N?Object.assign(Object.assign({},l),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===l.type?e:[e]}):l))}):l}));return void(null==re||re((e=>Object.assign(Object.assign({},e),{cards:l}))))}const i=null!=ve&&ve>-1?ne.cards[ve]:ne;let d=i.body,r=i.header,c=i.buttons;if("BODY"===A?d=null===(n=i.body)||void 0===n?void 0:n.map(((t,l)=>l===N?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)):"HEADER"===A?r=null===(s=i.header)||void 0===s?void 0:s.map(((t,l)=>l===N?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)):"BUTTONS"===A&&(c=null===(o=i.buttons)||void 0===o?void 0:o.map(((a,i)=>i===N?Object.assign(Object.assign({},a),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===a.type?e:[e],queryParams:null!=l?l:[]}):a))),null!=ve&&ve>-1){const e=a.cloneDeep(ne.cards);e[ve]={header:r,body:d,buttons:c},null==re||re((t=>Object.assign(Object.assign({},t),{cards:e})))}else null==re||re((e=>Object.assign(Object.assign({},e),{header:r,body:d,buttons:c})))}}function fe(e,t,l,i){var n,s,o,u,d,r,c;if(null!=ve&&ve>-1&&be){const s=Object.assign({},se).components.map((l=>{var a;return"CAROUSEL"===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"===A){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"===A){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=a.cloneDeep(se);if(l){const l=null===(n=Object.assign({},se).mapping.cards)||void 0===n?void 0:n.map(((l,a)=>{var n,s,o;if("BODY"===A)return Object.assign(Object.assign({},l),{body:null===(n=l.body)||void 0===n?void 0:n.map(((l,a)=>e===a?"custom_text"===i?`((editableVariable${a+10}))`:t:l))});if("BUTTONS"===A&&(null==l?void 0:l.buttons)){let n=-1,u=-1;return null===(s=se.components[1].cards)||void 0===s||s[a].components.forEach((t=>{var l;"BUTTONS"===t.type&&(null===(l=t.buttons)||void 0===l||l.forEach(((t,l)=>{"URL"===t.type&&(n++,l===e&&"URL"==t.type&&(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"===i?"((customPlaceholderName))":t:e))})}return l}));o.mapping.cards=l}return o.components=s,void(null==ue||ue(o))}const p=null!=ve&&ve>-1?{components:null===(s=Object.assign({},se).components[1].cards)||void 0===s?void 0:s[ve].components,mapping:null===(o=Object.assign({},se).mapping.cards)||void 0===o?void 0:o[ve]}:Object.assign({},se),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"===A){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"===A){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"===A){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"===A)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"===A&&(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,a)=>e===a?"custom_text"===i?`((editableVariable${a+10}))`:t:l))});else if("HEADER"===A&&(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,a)=>e===a?"custom_text"===i?`((editableVariable${a+20}))`:t:l))});else if("BUTTONS"===A&&(null===(c=null==p?void 0:p.mapping)||void 0===c?void 0:c.buttons)){let l=-1,a=-1;m.forEach((t=>{var i;"BUTTONS"===t.type&&(null===(i=t.buttons)||void 0===i||i.forEach(((t,i)=>{"URL"===t.type&&(l++,i===e&&"URL"==t.type&&(a=l))})))})),p.mapping=Object.assign(Object.assign({},p.mapping),{buttons:p.mapping.buttons.map(((e,l)=>l===a?"custom_link"===i?"((customPlaceholderName))":t:e))})}if(null!=ve&&ve>-1&&se){const e=a.cloneDeep(se);e.components[1].cards[ve].components=p.components,e.mapping.cards[ve]=p.mapping,null==ue||ue(e)}else null==ue||ue(Object.assign({},p))}i.useEffect((()=>{M&&(null==x||x())}),[M]),i.useEffect((()=>{!function(){var e,t,l,a,i;const n="mobile"===le?"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);ae===c.CHANNEL_TYPE.EMAIL&&(null==de||de(o))}()}),[oe]),i.useEffect((()=>{!function(){var e,t;const l=[];let a=[];if(ae!==c.CHANNEL_TYPE.MESSAGE||pe){"link"===(null==_?void 0:_.type)?(l.push({label:"",options:[f,E]}),G(f)):"date_time"===(null==_?void 0:_.type)?(l.push({label:"",options:[f,E]}),G(C)):(l.push({label:"",options:[f,E,C]}),G(E));const e=null!=ce?ce:[];Z([...l,...e.map((e=>{var t,l;return Object.assign(Object.assign({},e),{label:v.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!=ce?ce:[];Z([{label:"",options:[E,f]},...e]),a=[{label:"",options:[E,f]},...e]}if((ae===c.CHANNEL_TYPE.WHATSAPP||ae===c.CHANNEL_TYPE.EMAIL||ae===c.CHANNEL_TYPE.MESSAGE)&&_.updatedValue)if(r.placeHolderNamePattern.test(_.updatedValue)&&ae===c.CHANNEL_TYPE.WHATSAPP||_.updatedValue.startsWith("{{")&&ae!==c.CHANNEL_TYPE.WHATSAPP){const e=function(e,t,l){var a;let i={label:"",value:""};const n=l===c.CHANNEL_TYPE.WHATSAPP?e.updatedValue.replace("[[","").replace("]]",""):e.updatedValue.replace("{{","").replace("}}","");if(P){let t=e.updatedValue;if(me===p.POD.CHATBOT&&"BUTTONS"===A){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}(_,a,ae);e.value&&G(e)}else"date_time"===_.type?(G(C),$(_.updatedValue),fe(null!==(e=_.index)&&void 0!==e?e:0,_.updatedValue)):(null===(t=_.updatedValue)||void 0===t?void 0:t.startsWith("https"))?(G(f),$(_.updatedValue.split("https://")[1])):(G(E),$(_.updatedValue))}()}),[ve]),i.useEffect((()=>{le&&F&&I&&setTimeout((()=>{Te("custom_link"===(null==F?void 0:F.value)&&I?I.includes("https")?I:`https://${I}`:I,F.value)}),100)}),[le]),i.useEffect((()=>{!Q&&F&&_.updatedValue&&setTimeout((()=>{Te("custom_link"===(null==F?void 0:F.value)&&_.updatedValue?_.updatedValue.includes("https")?_.updatedValue:`https://${_.updatedValue}`:_.updatedValue,F.value),K(!0)}),100)}),[F]);const Ee=e=>{null==V||V(!1),"{{custom.url}}"===e.actualValue?_e({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?_e({label:e.displayName,selected:!0,value:"custom_text"}):"{{static.expiry}}"==e.actualValue?_e({label:e.displayName,selected:!0,value:"static_expiry"}):_e({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})};return e.jsxs(h,Object.assign({channel:ae,focused:M,onMouseEnter:()=>W(!0),onMouseLeave:()=>W(!1)},{children:[e.jsx("div",Object.assign({style:{marginBottom:8}},{children:e.jsxs(m.BodySecondary,Object.assign({style:{color:ie&&!F?b.COLORS.content.negative:b.COLORS.content.primary}},{children:[null===(L=_.variableName)||void 0===L?void 0:L.replace("{{","").replace("}}","")," ","link"===(null==_?void 0:_.type)?"link":"variable"]}))})),e.jsx("div",Object.assign({style:{marginBottom:12}},{children:P?e.jsxs("div",Object.assign({style:{display:"flex",border:"#E0E0E0 1px solid",borderRadius:4,padding:10,justifyContent:(null==F?void 0:F.label)?"space-between":"flex-end"}},{children:[e.jsx(m.BodyPrimary,Object.assign({numberOfLines:1},{children:me===p.POD.CHATBOT?["static_expiry","custom_text","custom_link"].includes(null!==(D=null==F?void 0:F.value)&&void 0!==D?D:"")?null==F?void 0:F.label:null==F?void 0:F.value:d.truncate(null!==(B=null==F?void 0:F.label)&&void 0!==B?B:"",20,!0)})),Oe||"date_time"===(null==_?void 0:_.type)&&je?e.jsx(e.Fragment,{}):e.jsx(t.default,{onClick:()=>{(()=>{if(S===p.BUTTON_TYPE.URL&&me===p.POD.CHATBOT){const e=O.updateVariables({variableList:J,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom URL",variableValue:"{{custom.url}}"});X(e)}else if("limited_time_offer"===A){const e=O.updateVariables({variableList:J,categoryDisplayName:"Static Variables",variableDisplayName:"Static Expiry",variableValue:"{{static.expiry}}"});X(e)}else if(S===p.BUTTON_TYPE.COPY_CODE){const e=O.updateVariables({variableList:J,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom Text",variableValue:"{{custom.text}}"});X(e)}})(),ee((()=>Ee)),te(!0)},width:24,height:24,color:b.COLORS.content.primary})]})):e.jsx(o.Dropdown,{disabled:Oe,options:z,isSearchable:!1,onSelect:_e,defaultOptions:F?[Object.assign(Object.assign({},F),{selected:!0})]:[]})})),("custom_text"===(null==F?void 0:F.value)||"custom_link"===(null==F?void 0:F.value))&&e.jsx(u.Input,{state:Oe?"disabled":"none",labelText:"custom_text"===(null==F?void 0:F.value)?"Custom text value":"custom_link"===(null==F?void 0:F.value)?"Custom URL value":"",id:`variable-value-${null==F?void 0:F.value}-${N}`,value:I,errorMessage:ie&&(null===(H=null==ye?void 0:ye.buttons)||void 0===H?void 0:H.includes(null!==(w=null==_?void 0:_.index)&&void 0!==w?w:-1))?I&&0!==I.trim().length?"custom_link"!==F.value||/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$/.test(`https://${I.trim()}`)&&0!==I.trim().length?"custom_link"!==F.value&&I.length>30?"Length cannot be more than 30":"BUTTONS"===A&&"custom_link"!==F.value?"Enter valid alpha numeric code":"":"Enter valid URL":"Required field":"",maxCharLimit:xe||("custom_link"===(null==F?void 0:F.value)?2e3:"BUTTONS"===A?15:30),noKeyDownChange:!0,prefixText:"custom_link"===(null==F?void 0:F.value)?"https://":"",placeholder:"link"===_.type||"custom_link"===F.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{he(F.value,e)}}),"static_expiry"===(null==F?void 0:F.value)&&e.jsxs("div",Object.assign({style:{position:"relative"}},{children:[Oe&&e.jsx(T,{onClick:e=>e.preventDefault()}),e.jsx(s.CustomDateTime,{placement:"auto",time:I?l.format(new Date(I),"hh:mm a"):l.format(new Date,"hh:mm a"),date:I?new Date(I):new Date,minDate:new Date,error:"",setError:()=>{},onChange:e=>{he("static_expiry",e.toISOString())}})]})),"link"===_.type&&"custom_link"!==(null==F?void 0:F.value)&&!be&&!ge&&me===p.POD.CHATBOT&&e.jsx(y.QueryParamsComponent,{isError:null!==(q=null===(Y=null==ye?void 0:ye.buttons)||void 0===Y?void 0:Y.includes(null!==(U=null==_?void 0:_.index)&&void 0!==U?U:-1))&&void 0!==q&&q,params:null!==(R=_.queryParams)&&void 0!==R?R:[],onChange:e=>{Te(_.updatedValue,"link",e)},variableValue:_.updatedValue})]}))};

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

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

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

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

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

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

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

@@ -65,6 +65,7 @@ export declare const TemplateModalContext: React.Context<{
     sliderRef?: LegacyRef<Slider> | undefined;
     isCarouselHovered?: boolean | undefined;
     setIsCarouselHovered?: ((value: boolean) => void) | undefined;
+    maxCharLimit?: number | undefined;
 }>;
 export declare const useTemplateModalContext: () => {
     hideCrossButton: boolean;
@@ -122,4 +123,5 @@ export declare const useTemplateModalContext: () => {
     sliderRef?: LegacyRef<Slider> | undefined;
     isCarouselHovered?: boolean | undefined;
     setIsCarouselHovered?: ((value: boolean) => void) | undefined;
+    maxCharLimit?: number | undefined;
 };

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

@@ -13,4 +13,4 @@ import{jsxs as e,jsx as t,Fragment as l}from"react/jsx-runtime";import a from"..
 	background-color: rgba(0, 0, 0, 0.1);
 	z-index: 1000;
 	cursor: not-allowed;
-`,E={value:"custom_link",label:"Custom URL"},C={value:"custom_text",label:"Custom text"},S={value:"static_expiry",label:"Static Expiry"},A=u=>{let{onFocus:A,variable:D,index:P,showVariableModal:B,setShowDiscountCheckBox:N,componentType:L,CTAoptions:w,buttonType:U}=u;var H,R,W,M,$,I,Y,z,Z;const[q,G]=o(!1),[F,K]=o(""),[Q,J]=o([]),[X,ee]=o(),[te,le]=o(!1),{variableList:ae,setVariableList:ie,setVariableCallback:ne,setShowVariablePicker:oe,device:se,channel:ue,isError:de,originalVariableList:re,template:ce,templateSelectionTriggered:pe,setTemplate:me,setDisplayContent:ve,setOriginalVariableList:be,globalNormalizedPlaceholders:ge,enabledCustomText:Oe,pod:ye,selectedCarouselIndex:je,isProductCarouselType:he,isWhatsappCarousel:xe,disableEditVariable:fe,disableEditExpiry:_e,templateErrorIndexes:Te}=x();function Ve(e,t){var l,a,i;const n=e;K(""),ee(n),ue===v.WHATSAPP?"custom_text"!==n.value&&"custom_link"!==n.value&&"static_expiry"!==n.value?(Ee(null!==(l=n.value)&&void 0!==l?l:"","string"),null==Ce||Ce(null!==(a=D.index)&&void 0!==a?a:0,n.value,!0)):(null==Ce||Ce(null!==(i=D.index)&&void 0!==i?i:0,"",!0,n.value),Ee("","url"===n.bikPlaceholderType?"link":"string")):"custom_text"!==n.value&&"custom_link"!==n.value?Ee(n.value,"url"===n.bikPlaceholderType?"link":"string"):(K(""),Ee("",n.value))}function ke(e,t){var l;K(t);const a="custom_link"===(null==X?void 0:X.value)&&t?t.includes("https")?t:`https://${t}`:t;Ee(a,"static_expiry"===e?"string":e),ue===v.WHATSAPP&&(null==Ce||Ce(null!==(l=D.index)&&void 0!==l?l:0,a,"custom_link"===e,e))}function Ee(e,t,l){var a,i,o,s;const u="custom_link"===t?"link":"custom_text"===t?"string":t;if(ue!==v.WHATSAPP){const l=_(P+1),i=null===document||void 0===document?void 0:document.getElementById("mobile"===se?"template_html_mobile":"template_html_desktop"),n=ue===v.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:D.variableName);const o=re.map(((t,l)=>l===P?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t));null==be||be(o)}if(ue===v.WHATSAPP){if(null!=je&&je>-1&&he){const l=Object.assign({},re).cards.map(((l,a)=>{var i,n;return"BODY"===L?Object.assign(Object.assign({},l),{body:null===(i=l.body)||void 0===i?void 0:i.map(((t,l)=>P===l?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t))}):"BUTTONS"===L?Object.assign(Object.assign({},l),{buttons:null===(n=l.buttons)||void 0===n?void 0:n.map(((l,a)=>a===P?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!=je&&je>-1?re.cards[je]:re;let d=a.body,r=a.header,c=a.buttons;if("BODY"===L?d=null===(i=a.body)||void 0===i?void 0:i.map(((t,l)=>l===P?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)):"HEADER"===L?r=null===(o=a.header)||void 0===o?void 0:o.map(((t,l)=>l===P?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)):"BUTTONS"===L&&(c=null===(s=a.buttons)||void 0===s?void 0:s.map(((a,i)=>i===P?Object.assign(Object.assign({},a),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===a.type?e:[e],queryParams:null!=l?l:[]}):a))),null!=je&&je>-1){const e=n(re.cards);e[je]={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 Ce(e,t,l,a){var i,o,s,u,d,r,c;if(null!=je&&je>-1&&he){const o=Object.assign({},ce).components.map((l=>{var a;return"CAROUSEL"===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"===L){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"===L){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=n(ce);if(l){const l=null===(i=Object.assign({},ce).mapping.cards)||void 0===i?void 0:i.map(((l,i)=>{var n,o,s;if("BODY"===L)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"===L&&(null==l?void 0:l.buttons)){let n=-1,u=-1;return null===(o=ce.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=o,void(null==me||me(s))}const p=null!=je&&je>-1?{components:null===(o=Object.assign({},ce).components[1].cards)||void 0===o?void 0:o[je].components,mapping:null===(s=Object.assign({},ce).mapping.cards)||void 0===s?void 0:s[je]}:Object.assign({},ce),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"===L){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"===L){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"===L){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"===L)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"===L&&(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"===L&&(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"===L&&(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!=je&&je>-1&&ce){const e=n(ce);e.components[1].cards[je].components=p.components,e.mapping.cards[je]=p.mapping,null==me||me(e)}else null==me||me(Object.assign({},p))}s((()=>{q&&(null==A||A())}),[q]),s((()=>{!function(){var e,t,l,a,i;const n="mobile"===se?"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);ue===v.EMAIL&&(null==ve||ve(s))}()}),[pe]),s((()=>{!function(){var e,t;const l=[];let a=[];if(ue!==v.MESSAGE||Oe){"link"===(null==D?void 0:D.type)?(l.push({label:"",options:[E,C]}),ee(E)):"date_time"===(null==D?void 0:D.type)?(l.push({label:"",options:[E,C]}),ee(S)):(l.push({label:"",options:[E,C,S]}),ee(C));const e=null!=ge?ge:[];J([...l,...e.map((e=>{var t,l;return Object.assign(Object.assign({},e),{label:j.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:[C,E]},...e]),a=[{label:"",options:[C,E]},...e]}if((ue===v.WHATSAPP||ue===v.EMAIL||ue===v.MESSAGE)&&D.updatedValue)if(m.test(D.updatedValue)&&ue===v.WHATSAPP||D.updatedValue.startsWith("{{")&&ue!==v.WHATSAPP){const e=function(e,t,l){var a;let i={label:"",value:""};const n=l===v.WHATSAPP?e.updatedValue.replace("[[","").replace("]]",""):e.updatedValue.replace("{{","").replace("}}","");if(B){let t=e.updatedValue;if(ye===b.CHATBOT&&"BUTTONS"===L){const l=null==w?void 0:w.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}(D,a,ue);e.value&&ee(e)}else"date_time"===D.type?(ee(S),K(D.updatedValue),Ce(null!==(e=D.index)&&void 0!==e?e:0,D.updatedValue)):(null===(t=D.updatedValue)||void 0===t?void 0:t.startsWith("https"))?(ee(E),K(D.updatedValue.split("https://")[1])):(ee(C),K(D.updatedValue))}()}),[je]),s((()=>{se&&X&&F&&setTimeout((()=>{Ee("custom_link"===(null==X?void 0:X.value)&&F?F.includes("https")?F:`https://${F}`:F,X.value)}),100)}),[se]),s((()=>{!te&&X&&D.updatedValue&&setTimeout((()=>{Ee("custom_link"===(null==X?void 0:X.value)&&D.updatedValue?D.updatedValue.includes("https")?D.updatedValue:`https://${D.updatedValue}`:D.updatedValue,X.value),le(!0)}),100)}),[X]);const Se=e=>{null==N||N(!1),"{{custom.url}}"===e.actualValue?Ve({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?Ve({label:e.displayName,selected:!0,value:"custom_text"}):"{{static.expiry}}"==e.actualValue?Ve({label:e.displayName,selected:!0,value:"static_expiry"}):Ve({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})};return e(V,Object.assign({channel:ue,focused:q,onMouseEnter:()=>G(!0),onMouseLeave:()=>G(!1)},{children:[t("div",Object.assign({style:{marginBottom:8}},{children:e(O,Object.assign({style:{color:de&&!X?h.content.negative:h.content.primary}},{children:[null===(H=D.variableName)||void 0===H?void 0:H.replace("{{","").replace("}}","")," ","link"===(null==D?void 0:D.type)?"link":"variable"]}))})),t("div",Object.assign({style:{marginBottom:12}},{children:B?e("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:[t(y,Object.assign({numberOfLines:1},{children:ye===b.CHATBOT?["static_expiry","custom_text","custom_link"].includes(null!==(R=null==X?void 0:X.value)&&void 0!==R?R:"")?null==X?void 0:X.label:null==X?void 0:X.value:p(null!==(W=null==X?void 0:X.label)&&void 0!==W?W:"",20,!0)})),fe||"date_time"===(null==D?void 0:D.type)&&_e?t(l,{}):t(a,{onClick:()=>{(()=>{if(U===g.URL&&ye===b.CHATBOT){const e=f({variableList:ae,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom URL",variableValue:"{{custom.url}}"});ie(e)}else if("limited_time_offer"===L){const e=f({variableList:ae,categoryDisplayName:"Static Variables",variableDisplayName:"Static Expiry",variableValue:"{{static.expiry}}"});ie(e)}else if(U===g.COPY_CODE){const e=f({variableList:ae,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom Text",variableValue:"{{custom.text}}"});ie(e)}})(),ne((()=>Se)),oe(!0)},width:24,height:24,color:h.content.primary})]})):t(r,{disabled:fe,options:Q,isSearchable:!1,onSelect:Ve,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))&&t(c,{state:fe?"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}-${P}`,value:F,errorMessage:de&&(null===(M=null==Te?void 0:Te.buttons)||void 0===M?void 0:M.includes(null!==($=null==D?void 0:D.index)&&void 0!==$?$:-1))?F&&0!==F.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://${F.trim()}`)&&0!==F.trim().length?"custom_link"!==X.value&&F.length>30?"Length cannot be more than 30":"BUTTONS"===L&&"custom_link"!==X.value?"Enter valid alpha numeric code":"":"Enter valid URL":"Required field":"",maxCharLimit:"custom_link"===(null==X?void 0:X.value)?2e3:"BUTTONS"===L?15:30,noKeyDownChange:!0,prefixText:"custom_link"===(null==X?void 0:X.value)?"https://":"",placeholder:"link"===D.type||"custom_link"===X.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{ke(X.value,e)}}),"static_expiry"===(null==X?void 0:X.value)&&e("div",Object.assign({style:{position:"relative"}},{children:[fe&&t(k,{onClick:e=>e.preventDefault()}),t(d,{placement:"auto",time:i(F?new Date(F):new Date,"hh:mm a"),date:F?new Date(F):new Date,minDate:new Date,error:"",setError:()=>{},onChange:e=>{ke("static_expiry",e.toISOString())}})]})),"link"===D.type&&"custom_link"!==(null==X?void 0:X.value)&&!he&&!xe&&ye===b.CHATBOT&&t(T,{isError:null!==(z=null===(I=null==Te?void 0:Te.buttons)||void 0===I?void 0:I.includes(null!==(Y=null==D?void 0:D.index)&&void 0!==Y?Y:-1))&&void 0!==z&&z,params:null!==(Z=D.queryParams)&&void 0!==Z?Z:[],onChange:e=>{Ee(D.updatedValue,"link",e)},variableValue:D.updatedValue})]}))};export{V as Container,A as default};
+`,E={value:"custom_link",label:"Custom URL"},C={value:"custom_text",label:"Custom text"},S={value:"static_expiry",label:"Static Expiry"},A=u=>{let{onFocus:A,variable:D,index:P,showVariableModal:B,setShowDiscountCheckBox:N,componentType:L,CTAoptions:w,buttonType:U}=u;var H,R,W,M,$,I,Y,z,Z;const[q,G]=o(!1),[F,K]=o(""),[Q,J]=o([]),[X,ee]=o(),[te,le]=o(!1),{variableList:ae,setVariableList:ie,setVariableCallback:ne,setShowVariablePicker:oe,device:se,channel:ue,isError:de,originalVariableList:re,template:ce,templateSelectionTriggered:pe,setTemplate:me,setDisplayContent:ve,setOriginalVariableList:be,globalNormalizedPlaceholders:ge,enabledCustomText:Oe,pod:ye,selectedCarouselIndex:je,isProductCarouselType:he,isWhatsappCarousel:xe,disableEditVariable:fe,disableEditExpiry:_e,templateErrorIndexes:Te,maxCharLimit:Ve}=x();function ke(e,t){var l,a,i;const n=e;K(""),ee(n),ue===v.WHATSAPP?"custom_text"!==n.value&&"custom_link"!==n.value&&"static_expiry"!==n.value?(Ce(null!==(l=n.value)&&void 0!==l?l:"","string"),null==Se||Se(null!==(a=D.index)&&void 0!==a?a:0,n.value,!0)):(null==Se||Se(null!==(i=D.index)&&void 0!==i?i:0,"",!0,n.value),Ce("","url"===n.bikPlaceholderType?"link":"string")):"custom_text"!==n.value&&"custom_link"!==n.value?Ce(n.value,"url"===n.bikPlaceholderType?"link":"string"):(K(""),Ce("",n.value))}function Ee(e,t){var l;K(t);const a="custom_link"===(null==X?void 0:X.value)&&t?t.includes("https")?t:`https://${t}`:t;Ce(a,"static_expiry"===e?"string":e),ue===v.WHATSAPP&&(null==Se||Se(null!==(l=D.index)&&void 0!==l?l:0,a,"custom_link"===e,e))}function Ce(e,t,l){var a,i,o,s;const u="custom_link"===t?"link":"custom_text"===t?"string":t;if(ue!==v.WHATSAPP){const l=_(P+1),i=null===document||void 0===document?void 0:document.getElementById("mobile"===se?"template_html_mobile":"template_html_desktop"),n=ue===v.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:D.variableName);const o=re.map(((t,l)=>l===P?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t));null==be||be(o)}if(ue===v.WHATSAPP){if(null!=je&&je>-1&&he){const l=Object.assign({},re).cards.map(((l,a)=>{var i,n;return"BODY"===L?Object.assign(Object.assign({},l),{body:null===(i=l.body)||void 0===i?void 0:i.map(((t,l)=>P===l?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t))}):"BUTTONS"===L?Object.assign(Object.assign({},l),{buttons:null===(n=l.buttons)||void 0===n?void 0:n.map(((l,a)=>a===P?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!=je&&je>-1?re.cards[je]:re;let d=a.body,r=a.header,c=a.buttons;if("BODY"===L?d=null===(i=a.body)||void 0===i?void 0:i.map(((t,l)=>l===P?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)):"HEADER"===L?r=null===(o=a.header)||void 0===o?void 0:o.map(((t,l)=>l===P?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)):"BUTTONS"===L&&(c=null===(s=a.buttons)||void 0===s?void 0:s.map(((a,i)=>i===P?Object.assign(Object.assign({},a),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===a.type?e:[e],queryParams:null!=l?l:[]}):a))),null!=je&&je>-1){const e=n(re.cards);e[je]={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 i,o,s,u,d,r,c;if(null!=je&&je>-1&&he){const o=Object.assign({},ce).components.map((l=>{var a;return"CAROUSEL"===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"===L){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"===L){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=n(ce);if(l){const l=null===(i=Object.assign({},ce).mapping.cards)||void 0===i?void 0:i.map(((l,i)=>{var n,o,s;if("BODY"===L)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"===L&&(null==l?void 0:l.buttons)){let n=-1,u=-1;return null===(o=ce.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=o,void(null==me||me(s))}const p=null!=je&&je>-1?{components:null===(o=Object.assign({},ce).components[1].cards)||void 0===o?void 0:o[je].components,mapping:null===(s=Object.assign({},ce).mapping.cards)||void 0===s?void 0:s[je]}:Object.assign({},ce),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"===L){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"===L){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"===L){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"===L)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"===L&&(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"===L&&(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"===L&&(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!=je&&je>-1&&ce){const e=n(ce);e.components[1].cards[je].components=p.components,e.mapping.cards[je]=p.mapping,null==me||me(e)}else null==me||me(Object.assign({},p))}s((()=>{q&&(null==A||A())}),[q]),s((()=>{!function(){var e,t,l,a,i;const n="mobile"===se?"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);ue===v.EMAIL&&(null==ve||ve(s))}()}),[pe]),s((()=>{!function(){var e,t;const l=[];let a=[];if(ue!==v.MESSAGE||Oe){"link"===(null==D?void 0:D.type)?(l.push({label:"",options:[E,C]}),ee(E)):"date_time"===(null==D?void 0:D.type)?(l.push({label:"",options:[E,C]}),ee(S)):(l.push({label:"",options:[E,C,S]}),ee(C));const e=null!=ge?ge:[];J([...l,...e.map((e=>{var t,l;return Object.assign(Object.assign({},e),{label:j.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:[C,E]},...e]),a=[{label:"",options:[C,E]},...e]}if((ue===v.WHATSAPP||ue===v.EMAIL||ue===v.MESSAGE)&&D.updatedValue)if(m.test(D.updatedValue)&&ue===v.WHATSAPP||D.updatedValue.startsWith("{{")&&ue!==v.WHATSAPP){const e=function(e,t,l){var a;let i={label:"",value:""};const n=l===v.WHATSAPP?e.updatedValue.replace("[[","").replace("]]",""):e.updatedValue.replace("{{","").replace("}}","");if(B){let t=e.updatedValue;if(ye===b.CHATBOT&&"BUTTONS"===L){const l=null==w?void 0:w.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}(D,a,ue);e.value&&ee(e)}else"date_time"===D.type?(ee(S),K(D.updatedValue),Se(null!==(e=D.index)&&void 0!==e?e:0,D.updatedValue)):(null===(t=D.updatedValue)||void 0===t?void 0:t.startsWith("https"))?(ee(E),K(D.updatedValue.split("https://")[1])):(ee(C),K(D.updatedValue))}()}),[je]),s((()=>{se&&X&&F&&setTimeout((()=>{Ce("custom_link"===(null==X?void 0:X.value)&&F?F.includes("https")?F:`https://${F}`:F,X.value)}),100)}),[se]),s((()=>{!te&&X&&D.updatedValue&&setTimeout((()=>{Ce("custom_link"===(null==X?void 0:X.value)&&D.updatedValue?D.updatedValue.includes("https")?D.updatedValue:`https://${D.updatedValue}`:D.updatedValue,X.value),le(!0)}),100)}),[X]);const Ae=e=>{null==N||N(!1),"{{custom.url}}"===e.actualValue?ke({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?ke({label:e.displayName,selected:!0,value:"custom_text"}):"{{static.expiry}}"==e.actualValue?ke({label:e.displayName,selected:!0,value:"static_expiry"}):ke({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})};return e(V,Object.assign({channel:ue,focused:q,onMouseEnter:()=>G(!0),onMouseLeave:()=>G(!1)},{children:[t("div",Object.assign({style:{marginBottom:8}},{children:e(O,Object.assign({style:{color:de&&!X?h.content.negative:h.content.primary}},{children:[null===(H=D.variableName)||void 0===H?void 0:H.replace("{{","").replace("}}","")," ","link"===(null==D?void 0:D.type)?"link":"variable"]}))})),t("div",Object.assign({style:{marginBottom:12}},{children:B?e("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:[t(y,Object.assign({numberOfLines:1},{children:ye===b.CHATBOT?["static_expiry","custom_text","custom_link"].includes(null!==(R=null==X?void 0:X.value)&&void 0!==R?R:"")?null==X?void 0:X.label:null==X?void 0:X.value:p(null!==(W=null==X?void 0:X.label)&&void 0!==W?W:"",20,!0)})),fe||"date_time"===(null==D?void 0:D.type)&&_e?t(l,{}):t(a,{onClick:()=>{(()=>{if(U===g.URL&&ye===b.CHATBOT){const e=f({variableList:ae,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom URL",variableValue:"{{custom.url}}"});ie(e)}else if("limited_time_offer"===L){const e=f({variableList:ae,categoryDisplayName:"Static Variables",variableDisplayName:"Static Expiry",variableValue:"{{static.expiry}}"});ie(e)}else if(U===g.COPY_CODE){const e=f({variableList:ae,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom Text",variableValue:"{{custom.text}}"});ie(e)}})(),ne((()=>Ae)),oe(!0)},width:24,height:24,color:h.content.primary})]})):t(r,{disabled:fe,options:Q,isSearchable:!1,onSelect:ke,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))&&t(c,{state:fe?"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}-${P}`,value:F,errorMessage:de&&(null===(M=null==Te?void 0:Te.buttons)||void 0===M?void 0:M.includes(null!==($=null==D?void 0:D.index)&&void 0!==$?$:-1))?F&&0!==F.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://${F.trim()}`)&&0!==F.trim().length?"custom_link"!==X.value&&F.length>30?"Length cannot be more than 30":"BUTTONS"===L&&"custom_link"!==X.value?"Enter valid alpha numeric code":"":"Enter valid URL":"Required field":"",maxCharLimit:Ve||("custom_link"===(null==X?void 0:X.value)?2e3:"BUTTONS"===L?15:30),noKeyDownChange:!0,prefixText:"custom_link"===(null==X?void 0:X.value)?"https://":"",placeholder:"link"===D.type||"custom_link"===X.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{Ee(X.value,e)}}),"static_expiry"===(null==X?void 0:X.value)&&e("div",Object.assign({style:{position:"relative"}},{children:[fe&&t(k,{onClick:e=>e.preventDefault()}),t(d,{placement:"auto",time:i(F?new Date(F):new Date,"hh:mm a"),date:F?new Date(F):new Date,minDate:new Date,error:"",setError:()=>{},onChange:e=>{Ee("static_expiry",e.toISOString())}})]})),"link"===D.type&&"custom_link"!==(null==X?void 0:X.value)&&!he&&!xe&&ye===b.CHATBOT&&t(T,{isError:null!==(z=null===(I=null==Te?void 0:Te.buttons)||void 0===I?void 0:I.includes(null!==(Y=null==D?void 0:D.index)&&void 0!==Y?Y:-1))&&void 0!==z&&z,params:null!==(Z=D.queryParams)&&void 0!==Z?Z:[],onChange:e=>{Ce(D.updatedValue,"link",e)},variableValue:D.updatedValue})]}))};export{V as Container,A as default};

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

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

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bikdotai/bik-component-library",
-	"version": "0.0.549-beta.14",
+	"version": "0.0.549-beta.16",
 	"description": "Bik Component Library",
 	"repository": {
 		"type": "git",