@bikdotai/bik-component-library 0.0.570-beta-4 → 0.0.570-beta-5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/dist/cjs/components/template-context-mapper/modalElements/EditWebpushTemplate.js +1 -1
  2. package/dist/cjs/components/template-context-mapper/modalElements/VariableConnector.js +3 -3
  3. package/dist/cjs/components/template-preview/models/TemplateMeta.d.ts +1 -2
  4. package/dist/esm/components/template-context-mapper/modalElements/EditWebpushTemplate.js +1 -1
  5. package/dist/esm/components/template-context-mapper/modalElements/VariableConnector.js +2 -2
  6. package/dist/esm/components/template-preview/models/TemplateMeta.d.ts +1 -2
  7. package/package.json +1 -1
package/dist/cjs/components/template-context-mapper/modalElements/EditWebpushTemplate.js CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),a=require("lodash"),t=require("react"),i=require("../../template-preview/models/TemplateMeta.js"),n=require("../context/templateModalContext.js"),l=require("../utils/getDataFromTemplateComponent.js"),o=require("./EditMediaModal.js"),d=require("./EditMediaV2.js"),s=require("./EditMediaV2.style.js"),r=require("./useEditWhtasappTemplateMedia.js"),p=require("./VariableConnectorsPanel.js"),u=require("./VariableConnectorWhatsApp.js"),m=require("./VariableEditorHeader.js"),c=require("./WhatsAppTemplateCardButtonV2.js");exports.default=h=>{let{template:g,onTemplateChange:b,whatsappSpecificPickerMeta:M,showVariableModal:E,variableListForImage:f}=h;var T,j,v;const{originalVariableList:C}=n.useTemplateModalContext(),{descriptionComponents:x,bodyVariables:I,titleVariables:y,iconImage:V,bannerImage:q}=l.getAllDataFromWebpushTemplateComponent(g,C),{uploadMediaLink:w,uploadMediaFiles:O,validateMimeType:A}=M,L=t.useRef(null),R=r.useEditWhatsappTemplateMedia({uploadMediaLink:w,uploadMediaFiles:O,updateTemplateImageUrl:e=>F(e,"icon"),validateMimeType:A,mediaComponent:V,fileRef:L}),D=r.useEditWhatsappTemplateMedia({uploadMediaLink:w,uploadMediaFiles:O,updateTemplateImageUrl:e=>F(e,"image"),validateMimeType:A,mediaComponent:q,fileRef:L});function F(e,a){const t=Object.assign({},g);"icon"===a?t.webpushBroadcastConfig.icon[0]=e:"image"===a&&(t.webpushBroadcastConfig.image[0]=e),null==b||b(Object.assign({},t))}function W(e,t,i){var n;const l=Object.assign({},g),o=a.cloneDeep(l),d="custom"===t&&"string"==typeof e,s=null===(n=null==o?void 0:o.webpushBroadcastConfig)||void 0===n?void 0:n.buttons;if(s&&s.length>0){s[i]=d?e:"string"!=typeof e?e.placeHolder:"";const a=Object.assign(Object.assign({},o.webpushBroadcastConfig),{buttons:s});o.webpushBroadcastConfig=a}null==b||b(o)}const B=R.openEditMedia?R:D.openEditMedia?D:null;return B?e.jsx(p.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsx(o.default,{mediaComponentFormat:i.HEADER_TYPES.IMAGE,uploadMedia:B.uploadMedia,variableListForImage:f||[],useEditWhatsappTemplateMediaResponse:B,setOpenEditMedia:B.setOpenEditMedia,openEditMedia:B.openEditMedia,editIconRef:B.editIconRef,fileRef:L,skipAddVariable:!0})})):e.jsxs(p.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:"auto"}},{children:[!!V&&V.length&&e.jsx(s.EditTemplateMediaContainer,{children:e.jsx(d.default,{imageName:V,handleImageChange:R.handleImageChange,mediaType:i.HEADER_TYPES.IMAGE,error:R.error,isLoading:R.loading,setOpenEditMedia:R.setOpenEditMedia})}),!!q&&q.length&&e.jsx(s.EditTemplateMediaContainer,{children:e.jsx(d.default,{imageName:q,handleImageChange:D.handleImageChange,mediaType:i.HEADER_TYPES.IMAGE,error:D.error,isLoading:D.loading,setOpenEditMedia:D.setOpenEditMedia})}),(null==I?void 0:I.length)||(null==y?void 0:y.length)?e.jsx(m.default,{containerStyle:{paddingTop:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}):null,null==x?void 0:x.map(((a,t)=>e.jsx(u.default,{originalVariableList:C,type:a.type,descriptionComponent:a.component,showVariableModal:E},t))),(null===(j=null===(T=null==C?void 0:C.buttons)||void 0===T?void 0:T.filter((e=>"URL"===e.type)))||void 0===j?void 0:j.length)>0&&e.jsx(m.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(v=null==C?void 0:C.buttons)||void 0===v?void 0:v.map(((a,t)=>e.jsx(c.default,{variableListIndex:t,CTAoptions:null==M?void 0:M.CTAoptions,button:a,currentVariableList:C,updateSelectedURLTemplateBtn:W},`${t}`)))]}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),a=require("lodash"),t=require("react"),i=require("../../template-preview/models/TemplateMeta.js"),n=require("../context/templateModalContext.js"),l=require("../utils/getDataFromTemplateComponent.js"),o=require("./EditMediaModal.js"),d=require("./EditMediaV2.js"),s=require("./EditMediaV2.style.js"),r=require("./useEditWhtasappTemplateMedia.js"),p=require("./VariableConnectorsPanel.js"),u=require("./VariableConnectorWhatsApp.js"),m=require("./VariableEditorHeader.js"),c=require("./WhatsAppTemplateCardButtonV2.js");exports.default=h=>{let{template:g,onTemplateChange:b,whatsappSpecificPickerMeta:M,showVariableModal:E,variableListForImage:f}=h;var T,j,v;const{originalVariableList:C}=n.useTemplateModalContext(),{descriptionComponents:x,bodyVariables:I,titleVariables:y,iconImage:V,bannerImage:q}=l.getAllDataFromWebpushTemplateComponent(g,C),{uploadMediaLink:w,uploadMediaFiles:O,validateMimeType:A}=M,L=t.useRef(null),R=r.useEditWhatsappTemplateMedia({uploadMediaLink:w,uploadMediaFiles:O,updateTemplateImageUrl:e=>F(e,"icon"),validateMimeType:A,mediaComponent:V,fileRef:L}),D=r.useEditWhatsappTemplateMedia({uploadMediaLink:w,uploadMediaFiles:O,updateTemplateImageUrl:e=>F(e,"image"),validateMimeType:A,mediaComponent:q,fileRef:L});function F(e,a){const t=Object.assign({},g);"icon"===a?t.webpushBroadcastConfig.icon=[e]:"image"===a&&(t.webpushBroadcastConfig.image=[e]),null==b||b(Object.assign({},t))}function W(e,t,i){var n;const l=Object.assign({},g),o=a.cloneDeep(l),d="custom"===t&&"string"==typeof e,s=null===(n=null==o?void 0:o.webpushBroadcastConfig)||void 0===n?void 0:n.buttons;if(s&&s.length>0){s[i]=d?e:"string"!=typeof e?e.placeHolder:"";const a=Object.assign(Object.assign({},o.webpushBroadcastConfig),{buttons:s});o.webpushBroadcastConfig=a}null==b||b(o)}const B=R.openEditMedia?R:D.openEditMedia?D:null;return B?e.jsx(p.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsx(o.default,{mediaComponentFormat:i.HEADER_TYPES.IMAGE,uploadMedia:B.uploadMedia,variableListForImage:f||[],useEditWhatsappTemplateMediaResponse:B,setOpenEditMedia:B.setOpenEditMedia,openEditMedia:B.openEditMedia,editIconRef:B.editIconRef,fileRef:L,skipAddVariable:!0})})):e.jsxs(p.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:"auto"}},{children:[V&&V.length?e.jsx(s.EditTemplateMediaContainer,{children:e.jsx(d.default,{imageName:V,handleImageChange:R.handleImageChange,mediaType:i.HEADER_TYPES.IMAGE,error:R.error,isLoading:R.loading,setOpenEditMedia:R.setOpenEditMedia})}):null,q&&q.length?e.jsx(s.EditTemplateMediaContainer,{children:e.jsx(d.default,{imageName:q,handleImageChange:D.handleImageChange,mediaType:i.HEADER_TYPES.IMAGE,error:D.error,isLoading:D.loading,setOpenEditMedia:D.setOpenEditMedia})}):null,(null==I?void 0:I.length)||(null==y?void 0:y.length)?e.jsx(m.default,{containerStyle:{paddingTop:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}):null,null==x?void 0:x.map(((a,t)=>e.jsx(u.default,{originalVariableList:C,type:a.type,descriptionComponent:a.component,showVariableModal:E},t))),(null===(j=null===(T=null==C?void 0:C.buttons)||void 0===T?void 0:T.filter((e=>"URL"===e.type)))||void 0===j?void 0:j.length)>0&&e.jsx(m.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(v=null==C?void 0:C.buttons)||void 0===v?void 0:v.map(((a,t)=>e.jsx(c.default,{variableListIndex:t,CTAoptions:null==M?void 0:M.CTAoptions,button:a,currentVariableList:C,updateSelectedURLTemplateBtn:W},`${t}`)))]}))};
package/dist/cjs/components/template-context-mapper/modalElements/VariableConnector.js CHANGED
@@ -1,10 +1,10 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../assets/icons/edit.svg.js"),l=require("date-fns"),a=require("lodash"),i=require("react"),n=require("styled-components"),s=require("../../custom-date-time/CustomDateTime.js"),o=require("../../dropdown/Dropdown.js"),u=require("../../input/Input.js"),d=require("../../product-picker-v2/collectionScreen.js"),r=require("../../template-preview/constants/regexPatterns.js"),c=require("../../template-preview/models/Channels.js"),p=require("../../template-preview/models/WhatsAppTemplate.js"),m=require("../../TypographyStyle.js"),v=require("../../../utils/StringUtils.js"),b=require("../../../constants/Theme.js"),g=require("../context/templateModalContext.js"),O=require("../custom-hooks/useAdditionalVariables.js"),j=require("../utils/getVariableNameEmail.js"),y=require("./QueryParamsComponent.js");function x(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var _=x(n);const T=_.default.div`
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../assets/icons/edit.svg.js"),l=require("date-fns"),a=require("lodash"),i=require("react"),n=require("styled-components"),s=require("../../custom-date-time/CustomDateTime.js"),o=require("../../dropdown/Dropdown.js"),u=require("../../input/Input.js"),d=require("../../product-picker-v2/collectionScreen.js"),r=require("../../template-preview/constants/regexPatterns.js"),c=require("../../template-preview/models/Channels.js"),p=require("../../template-preview/models/WhatsAppTemplate.js"),m=require("../../TypographyStyle.js"),v=require("../../../utils/StringUtils.js"),b=require("../../../constants/Theme.js"),g=require("../context/templateModalContext.js"),O=require("../custom-hooks/useAdditionalVariables.js"),j=require("../utils/getVariableNameEmail.js"),y=require("./QueryParamsComponent.js");function x(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var h=x(n);const _=h.default.div`
2
2
  /* surface/$color-background-warning-light */
3
3
 
4
4
  background: ${e=>e.focused&&e.channel===c.CHANNEL_TYPE.EMAIL?b.COLORS.background.warning.light:"transparent"};
5
5
  border-radius: 4px;
6
6
  padding: 8px 10px;
7
- `,E=_.default.div`
7
+ `,T=h.default.div`
8
8
  position: absolute;
9
9
  top: 0;
10
10
  left: 0;
@@ -13,4 +13,4 @@
13
13
  background-color: rgba(0, 0, 0, 0.1);
14
14
  z-index: 1000;
15
15
  cursor: not-allowed;
16
- `,h={value:"custom_link",label:"Custom URL"},f={value:"custom_text",label:"Custom text"},C={value:"static_expiry",label:"Static Expiry"};exports.Container=T,exports.default=n=>{let{onFocus:x,variable:_,index:N,showVariableModal:P,setShowDiscountCheckBox:L,componentType:A,CTAoptions:V,buttonType:S}=n;var k,B,D,H,Y,U,w,q,R;const[W,I]=i.useState(!1),[M,$]=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,n;const s=e;$(""),G(s),ae===c.CHANNEL_TYPE.WHATSAPP?"custom_text"!==s.value&&"custom_link"!==s.value&&"static_expiry"!==s.value?(Ee(null!==(l=s.value)&&void 0!==l?l:"","string"),null==he||he(null!==(a=_.index)&&void 0!==a?a:0,s.value,!0)):(null==he||he(null!==(i=_.index)&&void 0!==i?i:0,"",!0,s.value),Ee("","url"===s.bikPlaceholderType?"link":"string")):"custom_text"!==s.value&&"custom_link"!==s.value?(Ee(s.value,"url"===s.bikPlaceholderType?"link":"string"),ae==c.CHANNEL_TYPE.WEBPUSH&&(null==Ce||Ce(null!==(n=_.index)&&void 0!==n?n:0,s.value))):($(""),Ee("",s.value))}function Te(e,t){var l;$(t);const a="custom_link"===(null==F?void 0:F.value)&&t?t.includes("https")?t:`https://${t}`:t;Ee(a,"static_expiry"===e?"string":e),ae===c.CHANNEL_TYPE.WHATSAPP&&(null==he||he(null!==(l=_.index)&&void 0!==l?l:0,a,"custom_link"===e,e))}function Ee(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&&ae!==c.CHANNEL_TYPE.WEBPUSH){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.WEBPUSH){const a=ne,i=(t,a,i)=>null==t?void 0:t.map(((t,n)=>n===N?Object.assign(Object.assign({},t),{[a]:u,updatedValue:"custom_link"===i?"((customPlaceholderName))":e,example:[e],queryParams:null!=l?l:[]}):t)),n={BODY:i(a.body,"type",e),TITLE:i(a.title,"type",e),BUTTONS:i(a.buttons,"buttonVariable",t)};null==re||re((e=>Object.assign(Object.assign({},e),{title:n.TITLE,body:n.BODY,buttons:n.BUTTONS})))}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 he(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((()=>{W&&(null==x||x())}),[W]),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:[h,f]}),G(h)):"date_time"===(null==_?void 0:_.type)?(l.push({label:"",options:[h,f]}),G(C)):(l.push({label:"",options:[h,f,C]}),G(f));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:[f,h]},...e]),a=[{label:"",options:[f,h]},...e]}if((ae===c.CHANNEL_TYPE.WHATSAPP||ae===c.CHANNEL_TYPE.EMAIL||ae===c.CHANNEL_TYPE.MESSAGE||ae===c.CHANNEL_TYPE.WEBPUSH)&&_.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==V?void 0:V.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),he(null!==(e=_.index)&&void 0!==e?e:0,_.updatedValue)):(null===(t=_.updatedValue)||void 0===t?void 0:t.startsWith("https"))?(G(h),$(_.updatedValue.split("https://")[1])):(G(f),$(_.updatedValue))}()}),[ve]),i.useEffect((()=>{le&&F&&M&&setTimeout((()=>{Ee("custom_link"===(null==F?void 0:F.value)&&M?M.includes("https")?M:`https://${M}`:M,F.value)}),100)}),[le]),i.useEffect((()=>{!Q&&F&&_.updatedValue&&setTimeout((()=>{Ee("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==L||L(!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"})};function Ce(e,t){var l;const a=Object.assign({},se);(null===(l=a.webpushBroadcastConfig)||void 0===l?void 0:l[A.toLocaleLowerCase()])&&(a.webpushBroadcastConfig[A.toLocaleLowerCase()][e]=t),null==ue||ue(Object.assign({},a))}return e.jsxs(T,Object.assign({channel:ae,focused:W,onMouseEnter:()=>I(!0),onMouseLeave:()=>I(!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===(k=_.variableName)||void 0===k?void 0:k.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!==(B=null==F?void 0:F.value)&&void 0!==B?B:"")?null==F?void 0:F.label:null==F?void 0:F.value:d.truncate(null!==(D=null==F?void 0:F.label)&&void 0!==D?D:"",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:_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:M,errorMessage:ie&&(null===(H=null==ye?void 0:ye.buttons)||void 0===H?void 0:H.includes(null!==(Y=null==_?void 0:_.index)&&void 0!==Y?Y:-1))?M&&0!==M.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://${M.trim()}`)&&0!==M.trim().length?"custom_link"!==F.value&&M.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=>{Te(F.value,e)}}),"static_expiry"===(null==F?void 0:F.value)&&e.jsxs("div",Object.assign({style:{position:"relative"}},{children:[Oe&&e.jsx(E,{onClick:e=>e.preventDefault()}),e.jsx(s.CustomDateTime,{placement:"auto",time:M?l.format(new Date(M),"hh:mm a"):l.format(new Date,"hh:mm a"),date:M?new Date(M):new Date,minDate:new Date,error:"",setError:()=>{},onChange:e=>{Te("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===(U=null==ye?void 0:ye.buttons)||void 0===U?void 0:U.includes(null!==(w=null==_?void 0:_.index)&&void 0!==w?w:-1))&&void 0!==q&&q,params:null!==(R=_.queryParams)&&void 0!==R?R:[],onChange:e=>{Ee(_.updatedValue,"link",e)},variableValue:_.updatedValue})]}))};
16
+ `,E={value:"custom_link",label:"Custom URL"},f={value:"custom_text",label:"Custom text"},C={value:"static_expiry",label:"Static Expiry"};exports.Container=_,exports.default=n=>{let{onFocus:x,variable:h,index:N,showVariableModal:P,setShowDiscountCheckBox:L,componentType:A,CTAoptions:V,buttonType:S}=n;var k,B,D,H,Y,U,w,q,R;const[W,I]=i.useState(!1),[M,$]=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 he(e,t){var l,a,i,n;const s=e;$(""),G(s),ae===c.CHANNEL_TYPE.WHATSAPP?"custom_text"!==s.value&&"custom_link"!==s.value&&"static_expiry"!==s.value?(Te(null!==(l=s.value)&&void 0!==l?l:"","string"),null==Ee||Ee(null!==(a=h.index)&&void 0!==a?a:0,s.value,!0)):(null==Ee||Ee(null!==(i=h.index)&&void 0!==i?i:0,"",!0,s.value),Te("","url"===s.bikPlaceholderType?"link":"string")):"custom_text"!==s.value&&"custom_link"!==s.value?(Te(s.value,"url"===s.bikPlaceholderType?"link":"string"),ae==c.CHANNEL_TYPE.WEBPUSH&&(console.log("jahaaaa aarha aaaahkj",e),null==Ce||Ce(null!==(n=h.index)&&void 0!==n?n:0,s.value))):($(""),Te("",s.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;Te(a,"static_expiry"===e?"string":e),console.log("yaha aya kya",e,t),ae===c.CHANNEL_TYPE.WHATSAPP&&(null==Ee||Ee(null!==(l=h.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&&ae!==c.CHANNEL_TYPE.WEBPUSH){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:h.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.WEBPUSH){const a=ne,i=(t,a,i)=>null==t?void 0:t.map(((t,n)=>n===N?Object.assign(Object.assign({},t),{[a]:u,updatedValue:"custom_link"===i?"((customPlaceholderName))":e,example:[e],queryParams:null!=l?l:[]}):t)),n={BODY:i(a.body,"type",e),TITLE:i(a.title,"type",e),BUTTONS:i(a.buttons,"buttonVariable",t)};null==re||re((e=>Object.assign(Object.assign({},e),{title:n.TITLE,body:n.BODY,buttons:n.BUTTONS})))}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 Ee(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((()=>{W&&(null==x||x())}),[W]),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==h?void 0:h.type)?(l.push({label:"",options:[E,f]}),G(E)):"date_time"===(null==h?void 0:h.type)?(l.push({label:"",options:[E,f]}),G(C)):(l.push({label:"",options:[E,f,C]}),G(f));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:[f,E]},...e]),a=[{label:"",options:[f,E]},...e]}if((ae===c.CHANNEL_TYPE.WHATSAPP||ae===c.CHANNEL_TYPE.EMAIL||ae===c.CHANNEL_TYPE.MESSAGE||ae===c.CHANNEL_TYPE.WEBPUSH)&&h.updatedValue)if(r.placeHolderNamePattern.test(h.updatedValue)&&ae===c.CHANNEL_TYPE.WHATSAPP||h.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==V?void 0:V.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}(h,a,ae);e.value&&G(e)}else"date_time"===h.type?(G(C),$(h.updatedValue),Ee(null!==(e=h.index)&&void 0!==e?e:0,h.updatedValue)):(null===(t=h.updatedValue)||void 0===t?void 0:t.startsWith("https"))?(G(E),$(h.updatedValue.split("https://")[1])):(G(f),$(h.updatedValue))}()}),[ve]),i.useEffect((()=>{le&&F&&M&&setTimeout((()=>{Te("custom_link"===(null==F?void 0:F.value)&&M?M.includes("https")?M:`https://${M}`:M,F.value)}),100)}),[le]),i.useEffect((()=>{!Q&&F&&h.updatedValue&&setTimeout((()=>{Te("custom_link"===(null==F?void 0:F.value)&&h.updatedValue?h.updatedValue.includes("https")?h.updatedValue:`https://${h.updatedValue}`:h.updatedValue,F.value),K(!0)}),100)}),[F]);const fe=e=>{null==L||L(!1),"{{custom.url}}"===e.actualValue?he({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?he({label:e.displayName,selected:!0,value:"custom_text"}):"{{static.expiry}}"==e.actualValue?he({label:e.displayName,selected:!0,value:"static_expiry"}):he({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})};function Ce(e,t){var l;const a=Object.assign({},se);(null===(l=a.webpushBroadcastConfig)||void 0===l?void 0:l[A.toLocaleLowerCase()])&&(a.webpushBroadcastConfig[A.toLocaleLowerCase()][e]=t),null==ue||ue(Object.assign({},a))}return e.jsxs(_,Object.assign({channel:ae,focused:W,onMouseEnter:()=>I(!0),onMouseLeave:()=>I(!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===(k=h.variableName)||void 0===k?void 0:k.replace("{{","").replace("}}","")," ","link"===(null==h?void 0:h.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!==(B=null==F?void 0:F.value)&&void 0!==B?B:"")?null==F?void 0:F.label:null==F?void 0:F.value:d.truncate(null!==(D=null==F?void 0:F.label)&&void 0!==D?D:"",20,!0)})),Oe||"date_time"===(null==h?void 0:h.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:he,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:M,errorMessage:ie&&(null===(H=null==ye?void 0:ye.buttons)||void 0===H?void 0:H.includes(null!==(Y=null==h?void 0:h.index)&&void 0!==Y?Y:-1))?M&&0!==M.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://${M.trim()}`)&&0!==M.trim().length?"custom_link"!==F.value&&M.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"===h.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:M?l.format(new Date(M),"hh:mm a"):l.format(new Date,"hh:mm a"),date:M?new Date(M):new Date,minDate:new Date,error:"",setError:()=>{},onChange:e=>{_e("static_expiry",e.toISOString())}})]})),"link"===h.type&&"custom_link"!==(null==F?void 0:F.value)&&!be&&!ge&&me===p.POD.CHATBOT&&e.jsx(y.QueryParamsComponent,{isError:null!==(q=null===(U=null==ye?void 0:ye.buttons)||void 0===U?void 0:U.includes(null!==(w=null==h?void 0:h.index)&&void 0!==w?w:-1))&&void 0!==q&&q,params:null!==(R=h.queryParams)&&void 0!==R?R:[],onChange:e=>{Te(h.updatedValue,"link",e)},variableValue:h.updatedValue})]}))};
package/dist/cjs/components/template-preview/models/TemplateMeta.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import { SingleOption } from "../../dropdown/type";
2
2
  export type CUSTOM_VARIABLE = {
3
3
  variableName: string;
4
- type: CustomVariableType;
4
+ type: 'string' | 'link' | 'image' | 'button' | 'date_time';
5
5
  isEditableVariable: boolean;
6
6
  updatedValue: string;
7
7
  index?: number;
@@ -11,7 +11,6 @@ export type CUSTOM_VARIABLE = {
11
11
  value: string;
12
12
  }[];
13
13
  };
14
- export type CustomVariableType = 'string' | 'link' | 'image' | 'button' | 'date_time';
15
14
  export type QueryParamtype = {
16
15
  key: string;
17
16
  value: string;
package/dist/esm/components/template-context-mapper/modalElements/EditWebpushTemplate.js CHANGED
@@ -1 +1 @@
1
- import{jsx as e,jsxs as t}from"react/jsx-runtime";import{cloneDeep as i}from"lodash";import{useRef as a}from"react";import{HEADER_TYPES as o}from"../../template-preview/models/TemplateMeta.js";import{useTemplateModalContext as n}from"../context/templateModalContext.js";import{getAllDataFromWebpushTemplateComponent as l}from"../utils/getDataFromTemplateComponent.js";import d from"./EditMediaModal.js";import r from"./EditMediaV2.js";import{EditTemplateMediaContainer as s}from"./EditMediaV2.style.js";import{useEditWhatsappTemplateMedia as p}from"./useEditWhtasappTemplateMedia.js";import{Container as m}from"./VariableConnectorsPanel.js";import u from"./VariableConnectorWhatsApp.js";import c from"./VariableEditorHeader.js";import g from"./WhatsAppTemplateCardButtonV2.js";const h=h=>{let{template:b,onTemplateChange:f,whatsappSpecificPickerMeta:M,showVariableModal:v,variableListForImage:T}=h;var C,E,j;const{originalVariableList:I}=n(),{descriptionComponents:x,bodyVariables:y,titleVariables:V,iconImage:w,bannerImage:L}=l(b,I),{uploadMediaLink:O,uploadMediaFiles:A,validateMimeType:R}=M,B=a(null),F=p({uploadMediaLink:O,uploadMediaFiles:A,updateTemplateImageUrl:e=>W(e,"icon"),validateMimeType:R,mediaComponent:w,fileRef:B}),k=p({uploadMediaLink:O,uploadMediaFiles:A,updateTemplateImageUrl:e=>W(e,"image"),validateMimeType:R,mediaComponent:L,fileRef:B});function W(e,t){const i=Object.assign({},b);"icon"===t?i.webpushBroadcastConfig.icon[0]=e:"image"===t&&(i.webpushBroadcastConfig.image[0]=e),null==f||f(Object.assign({},i))}function H(e,t,a){var o;const n=Object.assign({},b),l=i(n),d="custom"===t&&"string"==typeof e,r=null===(o=null==l?void 0:l.webpushBroadcastConfig)||void 0===o?void 0:o.buttons;if(r&&r.length>0){r[a]=d?e:"string"!=typeof e?e.placeHolder:"";const t=Object.assign(Object.assign({},l.webpushBroadcastConfig),{buttons:r});l.webpushBroadcastConfig=t}null==f||f(l)}const U=F.openEditMedia?F:k.openEditMedia?k:null;return U?e(m,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e(d,{mediaComponentFormat:o.IMAGE,uploadMedia:U.uploadMedia,variableListForImage:T||[],useEditWhatsappTemplateMediaResponse:U,setOpenEditMedia:U.setOpenEditMedia,openEditMedia:U.openEditMedia,editIconRef:U.editIconRef,fileRef:B,skipAddVariable:!0})})):t(m,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:"auto"}},{children:[!!w&&w.length&&e(s,{children:e(r,{imageName:w,handleImageChange:F.handleImageChange,mediaType:o.IMAGE,error:F.error,isLoading:F.loading,setOpenEditMedia:F.setOpenEditMedia})}),!!L&&L.length&&e(s,{children:e(r,{imageName:L,handleImageChange:k.handleImageChange,mediaType:o.IMAGE,error:k.error,isLoading:k.loading,setOpenEditMedia:k.setOpenEditMedia})}),(null==y?void 0:y.length)||(null==V?void 0:V.length)?e(c,{containerStyle:{paddingTop:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}):null,null==x?void 0:x.map(((t,i)=>e(u,{originalVariableList:I,type:t.type,descriptionComponent:t.component,showVariableModal:v},i))),(null===(E=null===(C=null==I?void 0:I.buttons)||void 0===C?void 0:C.filter((e=>"URL"===e.type)))||void 0===E?void 0:E.length)>0&&e(c,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(j=null==I?void 0:I.buttons)||void 0===j?void 0:j.map(((t,i)=>e(g,{variableListIndex:i,CTAoptions:null==M?void 0:M.CTAoptions,button:t,currentVariableList:I,updateSelectedURLTemplateBtn:H},`${i}`)))]}))};export{h as default};
1
+ import{jsx as e,jsxs as t}from"react/jsx-runtime";import{cloneDeep as i}from"lodash";import{useRef as a}from"react";import{HEADER_TYPES as o}from"../../template-preview/models/TemplateMeta.js";import{useTemplateModalContext as n}from"../context/templateModalContext.js";import{getAllDataFromWebpushTemplateComponent as l}from"../utils/getDataFromTemplateComponent.js";import d from"./EditMediaModal.js";import r from"./EditMediaV2.js";import{EditTemplateMediaContainer as s}from"./EditMediaV2.style.js";import{useEditWhatsappTemplateMedia as p}from"./useEditWhtasappTemplateMedia.js";import{Container as m}from"./VariableConnectorsPanel.js";import u from"./VariableConnectorWhatsApp.js";import c from"./VariableEditorHeader.js";import g from"./WhatsAppTemplateCardButtonV2.js";const h=h=>{let{template:b,onTemplateChange:f,whatsappSpecificPickerMeta:M,showVariableModal:v,variableListForImage:T}=h;var C,E,j;const{originalVariableList:I}=n(),{descriptionComponents:x,bodyVariables:y,titleVariables:V,iconImage:w,bannerImage:L}=l(b,I),{uploadMediaLink:O,uploadMediaFiles:A,validateMimeType:R}=M,B=a(null),F=p({uploadMediaLink:O,uploadMediaFiles:A,updateTemplateImageUrl:e=>W(e,"icon"),validateMimeType:R,mediaComponent:w,fileRef:B}),k=p({uploadMediaLink:O,uploadMediaFiles:A,updateTemplateImageUrl:e=>W(e,"image"),validateMimeType:R,mediaComponent:L,fileRef:B});function W(e,t){const i=Object.assign({},b);"icon"===t?i.webpushBroadcastConfig.icon=[e]:"image"===t&&(i.webpushBroadcastConfig.image=[e]),null==f||f(Object.assign({},i))}function H(e,t,a){var o;const n=Object.assign({},b),l=i(n),d="custom"===t&&"string"==typeof e,r=null===(o=null==l?void 0:l.webpushBroadcastConfig)||void 0===o?void 0:o.buttons;if(r&&r.length>0){r[a]=d?e:"string"!=typeof e?e.placeHolder:"";const t=Object.assign(Object.assign({},l.webpushBroadcastConfig),{buttons:r});l.webpushBroadcastConfig=t}null==f||f(l)}const U=F.openEditMedia?F:k.openEditMedia?k:null;return U?e(m,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e(d,{mediaComponentFormat:o.IMAGE,uploadMedia:U.uploadMedia,variableListForImage:T||[],useEditWhatsappTemplateMediaResponse:U,setOpenEditMedia:U.setOpenEditMedia,openEditMedia:U.openEditMedia,editIconRef:U.editIconRef,fileRef:B,skipAddVariable:!0})})):t(m,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:"auto"}},{children:[w&&w.length?e(s,{children:e(r,{imageName:w,handleImageChange:F.handleImageChange,mediaType:o.IMAGE,error:F.error,isLoading:F.loading,setOpenEditMedia:F.setOpenEditMedia})}):null,L&&L.length?e(s,{children:e(r,{imageName:L,handleImageChange:k.handleImageChange,mediaType:o.IMAGE,error:k.error,isLoading:k.loading,setOpenEditMedia:k.setOpenEditMedia})}):null,(null==y?void 0:y.length)||(null==V?void 0:V.length)?e(c,{containerStyle:{paddingTop:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}):null,null==x?void 0:x.map(((t,i)=>e(u,{originalVariableList:I,type:t.type,descriptionComponent:t.component,showVariableModal:v},i))),(null===(E=null===(C=null==I?void 0:I.buttons)||void 0===C?void 0:C.filter((e=>"URL"===e.type)))||void 0===E?void 0:E.length)>0&&e(c,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(j=null==I?void 0:I.buttons)||void 0===j?void 0:j.map(((t,i)=>e(g,{variableListIndex:i,CTAoptions:null==M?void 0:M.CTAoptions,button:t,currentVariableList:I,updateSelectedURLTemplateBtn:H},`${i}`)))]}))};export{h as default};
package/dist/esm/components/template-context-mapper/modalElements/VariableConnector.js CHANGED
@@ -4,7 +4,7 @@ import{jsxs as e,jsx as t,Fragment as l}from"react/jsx-runtime";import a from"..
4
4
  background: ${e=>e.focused&&e.channel===v.EMAIL?h.background.warning.light:"transparent"};
5
5
  border-radius: 4px;
6
6
  padding: 8px 10px;
7
- `,V=u.div`
7
+ `,k=u.div`
8
8
  position: absolute;
9
9
  top: 0;
10
10
  left: 0;
@@ -13,4 +13,4 @@ import{jsxs as e,jsx as t,Fragment as l}from"react/jsx-runtime";import a from"..
13
13
  background-color: rgba(0, 0, 0, 0.1);
14
14
  z-index: 1000;
15
15
  cursor: not-allowed;
16
- `,k={value:"custom_link",label:"Custom URL"},C={value:"custom_text",label:"Custom text"},S={value:"static_expiry",label:"Static Expiry"},B=u=>{let{onFocus:B,variable:P,index:A,showVariableModal:D,setShowDiscountCheckBox:L,componentType:N,CTAoptions:w,buttonType:U}=u;var H,W,R,I,Y,M,$,z,q;const[Z,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:ce,template:re,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:Ee}=x();function Ve(e,t){var l,a,i,n;const o=e;K(""),ee(o),ue===v.WHATSAPP?"custom_text"!==o.value&&"custom_link"!==o.value&&"static_expiry"!==o.value?(Ce(null!==(l=o.value)&&void 0!==l?l:"","string"),null==Se||Se(null!==(a=P.index)&&void 0!==a?a:0,o.value,!0)):(null==Se||Se(null!==(i=P.index)&&void 0!==i?i:0,"",!0,o.value),Ce("","url"===o.bikPlaceholderType?"link":"string")):"custom_text"!==o.value&&"custom_link"!==o.value?(Ce(o.value,"url"===o.bikPlaceholderType?"link":"string"),ue==v.WEBPUSH&&(null==Pe||Pe(null!==(n=P.index)&&void 0!==n?n:0,o.value))):(K(""),Ce("",o.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;Ce(a,"static_expiry"===e?"string":e),ue===v.WHATSAPP&&(null==Se||Se(null!==(l=P.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&&ue!==v.WEBPUSH){const l=_(A+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:P.variableName);const o=ce.map(((t,l)=>l===A?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t));null==be||be(o)}if(ue===v.WEBPUSH){const a=ce,i=(t,a,i)=>null==t?void 0:t.map(((t,n)=>n===A?Object.assign(Object.assign({},t),{[a]:u,updatedValue:"custom_link"===i?"((customPlaceholderName))":e,example:[e],queryParams:null!=l?l:[]}):t)),n={BODY:i(a.body,"type",e),TITLE:i(a.title,"type",e),BUTTONS:i(a.buttons,"buttonVariable",t)};null==be||be((e=>Object.assign(Object.assign({},e),{title:n.TITLE,body:n.BODY,buttons:n.BUTTONS})))}if(ue===v.WHATSAPP){if(null!=je&&je>-1&&he){const l=Object.assign({},ce).cards.map(((l,a)=>{var i,n;return"BODY"===N?Object.assign(Object.assign({},l),{body:null===(i=l.body)||void 0===i?void 0:i.map(((t,l)=>A===l?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t))}):"BUTTONS"===N?Object.assign(Object.assign({},l),{buttons:null===(n=l.buttons)||void 0===n?void 0:n.map(((l,a)=>a===A?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?ce.cards[je]:ce;let d=a.body,c=a.header,r=a.buttons;if("BODY"===N?d=null===(i=a.body)||void 0===i?void 0:i.map(((t,l)=>l===A?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)):"HEADER"===N?c=null===(o=a.header)||void 0===o?void 0:o.map(((t,l)=>l===A?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)):"BUTTONS"===N&&(r=null===(s=a.buttons)||void 0===s?void 0:s.map(((a,i)=>i===A?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(ce.cards);e[je]={header:c,body:d,buttons:r},null==be||be((t=>Object.assign(Object.assign({},t),{cards:e})))}else null==be||be((e=>Object.assign(Object.assign({},e),{header:c,body:d,buttons:r})))}}function Se(e,t,l,a){var i,o,s,u,d,c,r;if(null!=je&&je>-1&&he){const o=Object.assign({},re).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"===N){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"===N){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(re);if(l){const l=null===(i=Object.assign({},re).mapping.cards)||void 0===i?void 0:i.map(((l,i)=>{var n,o,s;if("BODY"===N)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"===N&&(null==l?void 0:l.buttons)){let n=-1,u=-1;return null===(o=re.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({},re).components[1].cards)||void 0===o?void 0:o[je].components,mapping:null===(s=Object.assign({},re).mapping.cards)||void 0===s?void 0:s[je]}:Object.assign({},re),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,c,r;const p=Object.assign({},l);if("BODY"===l.type&&"BODY"===N){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"===N){if(null===(u=l.example)||void 0===u?void 0:u.header_text){const l=[...null!==(c=null===(d=p.example)||void 0===d?void 0:d.header_text)&&void 0!==c?c:[]];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"===N){const a=null===(r=l.buttons)||void 0===r?void 0:r.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"===N)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"===N&&(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"===N&&(null===(c=null==p?void 0:p.mapping)||void 0===c?void 0:c.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"===N&&(null===(r=null==p?void 0:p.mapping)||void 0===r?void 0:r.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&&re){const e=n(re);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((()=>{Z&&(null==B||B())}),[Z]),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==P?void 0:P.type)?(l.push({label:"",options:[k,C]}),ee(k)):"date_time"===(null==P?void 0:P.type)?(l.push({label:"",options:[k,C]}),ee(S)):(l.push({label:"",options:[k,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,k]},...e]),a=[{label:"",options:[C,k]},...e]}if((ue===v.WHATSAPP||ue===v.EMAIL||ue===v.MESSAGE||ue===v.WEBPUSH)&&P.updatedValue)if(m.test(P.updatedValue)&&ue===v.WHATSAPP||P.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(D){let t=e.updatedValue;if(ye===b.CHATBOT&&"BUTTONS"===N){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}(P,a,ue);e.value&&ee(e)}else"date_time"===P.type?(ee(S),K(P.updatedValue),Se(null!==(e=P.index)&&void 0!==e?e:0,P.updatedValue)):(null===(t=P.updatedValue)||void 0===t?void 0:t.startsWith("https"))?(ee(k),K(P.updatedValue.split("https://")[1])):(ee(C),K(P.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&&P.updatedValue&&setTimeout((()=>{Ce("custom_link"===(null==X?void 0:X.value)&&P.updatedValue?P.updatedValue.includes("https")?P.updatedValue:`https://${P.updatedValue}`:P.updatedValue,X.value),le(!0)}),100)}),[X]);const Be=e=>{null==L||L(!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"})};function Pe(e,t){var l;const a=Object.assign({},re);(null===(l=a.webpushBroadcastConfig)||void 0===l?void 0:l[N.toLocaleLowerCase()])&&(a.webpushBroadcastConfig[N.toLocaleLowerCase()][e]=t),null==me||me(Object.assign({},a))}return e(E,Object.assign({channel:ue,focused:Z,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=P.variableName)||void 0===H?void 0:H.replace("{{","").replace("}}","")," ","link"===(null==P?void 0:P.type)?"link":"variable"]}))})),t("div",Object.assign({style:{marginBottom:12}},{children:D?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!==(W=null==X?void 0:X.value)&&void 0!==W?W:"")?null==X?void 0:X.label:null==X?void 0:X.value:p(null!==(R=null==X?void 0:X.label)&&void 0!==R?R:"",20,!0)})),fe||"date_time"===(null==P?void 0:P.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"===N){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((()=>Be)),oe(!0)},width:24,height:24,color:h.content.primary})]})):t(c,{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(r,{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}-${A}`,value:F,errorMessage:de&&(null===(I=null==Te?void 0:Te.buttons)||void 0===I?void 0:I.includes(null!==(Y=null==P?void 0:P.index)&&void 0!==Y?Y:-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"===N&&"custom_link"!==X.value?"Enter valid alpha numeric code":"":"Enter valid URL":"Required field":"",maxCharLimit:Ee||("custom_link"===(null==X?void 0:X.value)?2e3:"BUTTONS"===N?15:30),noKeyDownChange:!0,prefixText:"custom_link"===(null==X?void 0:X.value)?"https://":"",placeholder:"link"===P.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(V,{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"===P.type&&"custom_link"!==(null==X?void 0:X.value)&&!he&&!xe&&ye===b.CHATBOT&&t(T,{isError:null!==(z=null===(M=null==Te?void 0:Te.buttons)||void 0===M?void 0:M.includes(null!==($=null==P?void 0:P.index)&&void 0!==$?$:-1))&&void 0!==z&&z,params:null!==(q=P.queryParams)&&void 0!==q?q:[],onChange:e=>{Ce(P.updatedValue,"link",e)},variableValue:P.updatedValue})]}))};export{E as Container,B as default};
16
+ `,V={value:"custom_link",label:"Custom URL"},C={value:"custom_text",label:"Custom text"},S={value:"static_expiry",label:"Static Expiry"},B=u=>{let{onFocus:B,variable:P,index:A,showVariableModal:D,setShowDiscountCheckBox:L,componentType:N,CTAoptions:w,buttonType:U}=u;var H,W,R,I,Y,M,$,z,q;const[Z,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:ce,template:re,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:Ee}=x();function ke(e,t){var l,a,i,n;const o=e;K(""),ee(o),ue===v.WHATSAPP?"custom_text"!==o.value&&"custom_link"!==o.value&&"static_expiry"!==o.value?(Ce(null!==(l=o.value)&&void 0!==l?l:"","string"),null==Se||Se(null!==(a=P.index)&&void 0!==a?a:0,o.value,!0)):(null==Se||Se(null!==(i=P.index)&&void 0!==i?i:0,"",!0,o.value),Ce("","url"===o.bikPlaceholderType?"link":"string")):"custom_text"!==o.value&&"custom_link"!==o.value?(Ce(o.value,"url"===o.bikPlaceholderType?"link":"string"),ue==v.WEBPUSH&&(console.log("jahaaaa aarha aaaahkj",e),null==Pe||Pe(null!==(n=P.index)&&void 0!==n?n:0,o.value))):(K(""),Ce("",o.value))}function Ve(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),console.log("yaha aya kya",e,t),ue===v.WHATSAPP&&(null==Se||Se(null!==(l=P.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&&ue!==v.WEBPUSH){const l=_(A+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:P.variableName);const o=ce.map(((t,l)=>l===A?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t));null==be||be(o)}if(ue===v.WEBPUSH){const a=ce,i=(t,a,i)=>null==t?void 0:t.map(((t,n)=>n===A?Object.assign(Object.assign({},t),{[a]:u,updatedValue:"custom_link"===i?"((customPlaceholderName))":e,example:[e],queryParams:null!=l?l:[]}):t)),n={BODY:i(a.body,"type",e),TITLE:i(a.title,"type",e),BUTTONS:i(a.buttons,"buttonVariable",t)};null==be||be((e=>Object.assign(Object.assign({},e),{title:n.TITLE,body:n.BODY,buttons:n.BUTTONS})))}if(ue===v.WHATSAPP){if(null!=je&&je>-1&&he){const l=Object.assign({},ce).cards.map(((l,a)=>{var i,n;return"BODY"===N?Object.assign(Object.assign({},l),{body:null===(i=l.body)||void 0===i?void 0:i.map(((t,l)=>A===l?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t))}):"BUTTONS"===N?Object.assign(Object.assign({},l),{buttons:null===(n=l.buttons)||void 0===n?void 0:n.map(((l,a)=>a===A?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?ce.cards[je]:ce;let d=a.body,c=a.header,r=a.buttons;if("BODY"===N?d=null===(i=a.body)||void 0===i?void 0:i.map(((t,l)=>l===A?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)):"HEADER"===N?c=null===(o=a.header)||void 0===o?void 0:o.map(((t,l)=>l===A?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)):"BUTTONS"===N&&(r=null===(s=a.buttons)||void 0===s?void 0:s.map(((a,i)=>i===A?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(ce.cards);e[je]={header:c,body:d,buttons:r},null==be||be((t=>Object.assign(Object.assign({},t),{cards:e})))}else null==be||be((e=>Object.assign(Object.assign({},e),{header:c,body:d,buttons:r})))}}function Se(e,t,l,a){var i,o,s,u,d,c,r;if(null!=je&&je>-1&&he){const o=Object.assign({},re).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"===N){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"===N){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(re);if(l){const l=null===(i=Object.assign({},re).mapping.cards)||void 0===i?void 0:i.map(((l,i)=>{var n,o,s;if("BODY"===N)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"===N&&(null==l?void 0:l.buttons)){let n=-1,u=-1;return null===(o=re.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({},re).components[1].cards)||void 0===o?void 0:o[je].components,mapping:null===(s=Object.assign({},re).mapping.cards)||void 0===s?void 0:s[je]}:Object.assign({},re),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,c,r;const p=Object.assign({},l);if("BODY"===l.type&&"BODY"===N){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"===N){if(null===(u=l.example)||void 0===u?void 0:u.header_text){const l=[...null!==(c=null===(d=p.example)||void 0===d?void 0:d.header_text)&&void 0!==c?c:[]];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"===N){const a=null===(r=l.buttons)||void 0===r?void 0:r.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"===N)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"===N&&(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"===N&&(null===(c=null==p?void 0:p.mapping)||void 0===c?void 0:c.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"===N&&(null===(r=null==p?void 0:p.mapping)||void 0===r?void 0:r.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&&re){const e=n(re);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((()=>{Z&&(null==B||B())}),[Z]),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==P?void 0:P.type)?(l.push({label:"",options:[V,C]}),ee(V)):"date_time"===(null==P?void 0:P.type)?(l.push({label:"",options:[V,C]}),ee(S)):(l.push({label:"",options:[V,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,V]},...e]),a=[{label:"",options:[C,V]},...e]}if((ue===v.WHATSAPP||ue===v.EMAIL||ue===v.MESSAGE||ue===v.WEBPUSH)&&P.updatedValue)if(m.test(P.updatedValue)&&ue===v.WHATSAPP||P.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(D){let t=e.updatedValue;if(ye===b.CHATBOT&&"BUTTONS"===N){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}(P,a,ue);e.value&&ee(e)}else"date_time"===P.type?(ee(S),K(P.updatedValue),Se(null!==(e=P.index)&&void 0!==e?e:0,P.updatedValue)):(null===(t=P.updatedValue)||void 0===t?void 0:t.startsWith("https"))?(ee(V),K(P.updatedValue.split("https://")[1])):(ee(C),K(P.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&&P.updatedValue&&setTimeout((()=>{Ce("custom_link"===(null==X?void 0:X.value)&&P.updatedValue?P.updatedValue.includes("https")?P.updatedValue:`https://${P.updatedValue}`:P.updatedValue,X.value),le(!0)}),100)}),[X]);const Be=e=>{null==L||L(!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"})};function Pe(e,t){var l;const a=Object.assign({},re);(null===(l=a.webpushBroadcastConfig)||void 0===l?void 0:l[N.toLocaleLowerCase()])&&(a.webpushBroadcastConfig[N.toLocaleLowerCase()][e]=t),null==me||me(Object.assign({},a))}return e(E,Object.assign({channel:ue,focused:Z,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=P.variableName)||void 0===H?void 0:H.replace("{{","").replace("}}","")," ","link"===(null==P?void 0:P.type)?"link":"variable"]}))})),t("div",Object.assign({style:{marginBottom:12}},{children:D?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!==(W=null==X?void 0:X.value)&&void 0!==W?W:"")?null==X?void 0:X.label:null==X?void 0:X.value:p(null!==(R=null==X?void 0:X.label)&&void 0!==R?R:"",20,!0)})),fe||"date_time"===(null==P?void 0:P.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"===N){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((()=>Be)),oe(!0)},width:24,height:24,color:h.content.primary})]})):t(c,{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(r,{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}-${A}`,value:F,errorMessage:de&&(null===(I=null==Te?void 0:Te.buttons)||void 0===I?void 0:I.includes(null!==(Y=null==P?void 0:P.index)&&void 0!==Y?Y:-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"===N&&"custom_link"!==X.value?"Enter valid alpha numeric code":"":"Enter valid URL":"Required field":"",maxCharLimit:Ee||("custom_link"===(null==X?void 0:X.value)?2e3:"BUTTONS"===N?15:30),noKeyDownChange:!0,prefixText:"custom_link"===(null==X?void 0:X.value)?"https://":"",placeholder:"link"===P.type||"custom_link"===X.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{Ve(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=>{Ve("static_expiry",e.toISOString())}})]})),"link"===P.type&&"custom_link"!==(null==X?void 0:X.value)&&!he&&!xe&&ye===b.CHATBOT&&t(T,{isError:null!==(z=null===(M=null==Te?void 0:Te.buttons)||void 0===M?void 0:M.includes(null!==($=null==P?void 0:P.index)&&void 0!==$?$:-1))&&void 0!==z&&z,params:null!==(q=P.queryParams)&&void 0!==q?q:[],onChange:e=>{Ce(P.updatedValue,"link",e)},variableValue:P.updatedValue})]}))};export{E as Container,B as default};
package/dist/esm/components/template-preview/models/TemplateMeta.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import { SingleOption } from "../../dropdown/type";
2
2
  export type CUSTOM_VARIABLE = {
3
3
  variableName: string;
4
- type: CustomVariableType;
4
+ type: 'string' | 'link' | 'image' | 'button' | 'date_time';
5
5
  isEditableVariable: boolean;
6
6
  updatedValue: string;
7
7
  index?: number;
@@ -11,7 +11,6 @@ export type CUSTOM_VARIABLE = {
11
11
  value: string;
12
12
  }[];
13
13
  };
14
- export type CustomVariableType = 'string' | 'link' | 'image' | 'button' | 'date_time';
15
14
  export type QueryParamtype = {
16
15
  key: string;
17
16
  value: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bikdotai/bik-component-library",
3
- "version": "0.0.570-beta-4",
3
+ "version": "0.0.570-beta-5",
4
4
  "description": "Bik Component Library",
5
5
  "repository": {
6
6
  "type": "git",