@bikdotai/bik-component-library 0.0.432-beta.1 → 0.0.432
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.
- package/dist/cjs/components/bik-layout/MockMenus.d.ts +1 -0
- package/dist/cjs/components/template-context-mapper/modalElements/VariableConnector.js +3 -3
- package/dist/esm/components/bik-layout/MockMenus.d.ts +1 -0
- package/dist/esm/components/template-context-mapper/modalElements/VariableConnector.js +3 -3
- package/package.json +1 -1
|
@@ -1,7 +1,7 @@
|
|
|
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("react"),i=require("styled-components"),n=require("../../add-variableV2/AddVariableV2SideModal.js"),o=require("../../custom-date-time/CustomDateTime.js"),s=require("../../dropdown/Dropdown.js"),u=require("../../input/Input.js"),d=require("../../template-preview/constants/regexPatterns.js"),
|
|
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("react"),i=require("styled-components"),n=require("../../add-variableV2/AddVariableV2SideModal.js"),o=require("../../custom-date-time/CustomDateTime.js"),s=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"),h=require("../utils/getVariableNameEmail.js");function x(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const _=x(i).default.div`
|
|
2
2
|
/* surface/$color-background-warning-light */
|
|
3
3
|
|
|
4
|
-
background: ${e=>e.focused&&e.channel===
|
|
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
|
-
`,_={value:"custom_link",label:"Custom URL"},O={value:"custom_text",label:"Custom text"},j={value:"static_expiry",label:"Static Expiry"};exports.Container=x,exports.default=i=>{let{onFocus:h,variable:E,index:y,showVariableModal:f,variableList:T,setShowDiscountCheckBox:A,componentType:N,CTAoptions:C}=i;var S,P;const[V,L]=a.useState(!1),[k,H]=a.useState(""),[w,B]=a.useState([]),[D,q]=a.useState(),[Y,M]=a.useState(!1),[R,U]=a.useState(!1),{device:W,channel:I,isError:$,originalVariableList:z,template:Z,templateSelectionTriggered:F,setTemplate:G,setDisplayContent:K,setOriginalVariableList:J,globalNormalizedPlaceholders:Q,enabledCustomText:X,pod:ee}=b.useTemplateModalContext();function te(e,t){var l,a,i;const n=e;H(""),q(n),I===r.CHANNEL_TYPE.WHATSAPP?"custom_text"!==n.value&&"custom_link"!==n.value&&"static_expiry"!==n.value?(ae(null!==(l=n.value)&&void 0!==l?l:"","string"),null==ie||ie(null!==(a=E.index)&&void 0!==a?a:0,n.value,!0)):(null==ie||ie(null!==(i=E.index)&&void 0!==i?i:0,k,!0,n.value),ae("","url"===n.bikPlaceholderType?"link":"string")):"custom_text"!==n.value&&"custom_link"!==n.value?ae(n.value,"url"===n.bikPlaceholderType?"link":"string"):(H(""),ae("",n.value))}function le(e,t){var l;H(t);const a="custom_link"===(null==D?void 0:D.value)&&t?t.includes("https")?t:`https://${t}`:t;ae(a,"static_expiry"===e?"string":e),I===r.CHANNEL_TYPE.WHATSAPP&&(null==ie||ie(null!==(l=E.index)&&void 0!==l?l:0,a,"custom_link"===e,e))}function ae(e,t){var l,a,i,n;const o="custom_link"===t?"link":"custom_text"===t?"string":t;if(I!==r.CHANNEL_TYPE.WHATSAPP){const a=g.getVariableNameForEmailByIndex(y+1),i=null===document||void 0===document?void 0:document.getElementById("mobile"===W?"template_html_mobile":"template_html_desktop"),n=I===r.CHANNEL_TYPE.EMAIL?null===(l=null==i?void 0:i.contentWindow)||void 0===l?void 0:l.document.getElementById(a):document.getElementById(a);n&&(n.textContent="custom_text"!==t&&"custom_link"!==t||e?e:E.variableName);const s=z.map(((t,l)=>l===y?Object.assign(Object.assign({},t),{type:o,updatedValue:e}):t));null==J||J(s)}if(I===r.CHANNEL_TYPE.WHATSAPP){const l=z;let s=l.body,u=l.header,d=l.buttons;"BODY"===N?s=null===(a=l.body)||void 0===a?void 0:a.map(((t,l)=>l===y?Object.assign(Object.assign({},t),{type:o,updatedValue:e}):t)):"HEADER"===N?u=null===(i=l.header)||void 0===i?void 0:i.map(((t,l)=>l===y?Object.assign(Object.assign({},t),{type:o,updatedValue:e}):t)):"BUTTONS"===N&&(d=null===(n=l.buttons)||void 0===n?void 0:n.map(((l,a)=>a===y?Object.assign(Object.assign({},l),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:[e]}):l))),null==J||J((e=>Object.assign(Object.assign({},e),{header:u,body:s,buttons:d})))}}function ie(e,t,l,a){var i,n,o,s;const u=Object.assign({},Z),d=null===(i=null==u?void 0:u.components)||void 0===i?void 0:i.map((l=>{var a,i,n,o,s,u,d,r,c,p;const m=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=m.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({},m.example),{body_text:[l]});return Object.assign(Object.assign({},m),{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!==(r=null===(d=m.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({},m.example),{header_text:l});return Object.assign(Object.assign({},m),{example:a})}}else if("BUTTONS"===l.type&&"BUTTONS"===N){if(null===(p=null===(c=l.buttons)||void 0===c?void 0:c[e])||void 0===p?void 0:p.example){const a=l.buttons.map(((l,a)=>a===e?Object.assign(Object.assign({},l),{example:[t]}):l));return Object.assign(Object.assign({},m),{buttons:a})}}else if("limited_time_offer"===l.type&&"limited_time_offer"===N)return Object.assign(Object.assign({},m),{example:Object.assign(Object.assign({},m.example),{limited_time_offer:t})});return l}));if(u.components=d,l)if("BODY"===N&&(null===(n=null==u?void 0:u.mapping)||void 0===n?void 0:n.body))u.mapping=Object.assign(Object.assign({},u.mapping),{body:u.mapping.body.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+10}))`:t:l))});else if("HEADER"===N&&(null===(o=null==u?void 0:u.mapping)||void 0===o?void 0:o.header))u.mapping=Object.assign(Object.assign({},u.mapping),{header:u.mapping.header.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+20}))`:t:l))});else if("BUTTONS"===N&&(null===(s=null==u?void 0:u.mapping)||void 0===s?void 0:s.buttons)){let l=-1,i=-1;d.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))})))})),u.mapping=Object.assign(Object.assign({},u.mapping),{buttons:u.mapping.buttons.map(((e,l)=>l===i?"custom_link"===a?"((customPlaceholderName))":t:e))})}null==G||G(Object.assign({},u))}return a.useEffect((()=>{V&&(null==h||h())}),[V]),a.useEffect((()=>{!function(){var e,t,l,a,i;const n="mobile"===W?"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);I===r.CHANNEL_TYPE.EMAIL&&(null==K||K(s))}()}),[F]),a.useEffect((()=>{var e,t;const l=[];let a=[];if(I!==r.CHANNEL_TYPE.MESSAGE||X){"link"===(null==E?void 0:E.type)?(l.push({label:"",options:[_,O]}),q(_)):"date_time"===(null==E?void 0:E.type)?(l.push({label:"",options:[_,O]}),q(j)):(l.push({label:"",options:[_,O,j]}),q(O));const e=null!=Q?Q:[];B([...l,...e.map((e=>{var t,l;return Object.assign(Object.assign({},e),{label:m.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!=Q?Q:[];B([{label:"",options:[O,_]},...e]),a=[{label:"",options:[O,_]},...e]}if((I===r.CHANNEL_TYPE.WHATSAPP||I===r.CHANNEL_TYPE.EMAIL||I===r.CHANNEL_TYPE.MESSAGE)&&E.updatedValue)if(d.placeHolderNamePattern.test(E.updatedValue)&&I===r.CHANNEL_TYPE.WHATSAPP||E.updatedValue.startsWith("{{")&&I!==r.CHANNEL_TYPE.WHATSAPP){const e=function(e,t,l){var a;let i={label:"",value:""};const n=l===r.CHANNEL_TYPE.WHATSAPP?e.updatedValue.replace("[[","").replace("]]",""):e.updatedValue.replace("{{","").replace("}}","");if(f){let t=e.updatedValue;if(ee===c.POD.CHATBOT&&"BUTTONS"===N){const l=null==C?void 0:C.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}(E,a,I);e.value&&q(e)}else"date_time"===E.type?(q(j),H(E.updatedValue),ie(null!==(e=E.index)&&void 0!==e?e:0,E.updatedValue)):(null===(t=E.updatedValue)||void 0===t?void 0:t.startsWith("https"))?(q(_),H(E.updatedValue.split("https://")[1])):(q(O),H(E.updatedValue))}),[]),a.useEffect((()=>{W&&D&&k&&setTimeout((()=>{ae("custom_link"===(null==D?void 0:D.value)&&k?k.includes("https")?k:`https://${k}`:k,D.value)}),100)}),[W]),a.useEffect((()=>{!R&&D&&E.updatedValue&&setTimeout((()=>{ae("custom_link"===(null==D?void 0:D.value)&&E.updatedValue?E.updatedValue.includes("https")?E.updatedValue:`https://${E.updatedValue}`:E.updatedValue,D.value),U(!0)}),100)}),[D]),e.jsxs(x,Object.assign({channel:I,focused:V,onMouseEnter:()=>L(!0),onMouseLeave:()=>L(!1)},{children:[e.jsx("div",Object.assign({style:{marginBottom:8}},{children:e.jsxs(p.BodySecondary,Object.assign({style:{color:$&&!D?v.COLORS.content.negative:v.COLORS.content.primary}},{children:[null===(S=E.variableName)||void 0===S?void 0:S.replace("{{","").replace("}}","")," ","link"===(null==E?void 0:E.type)?"link":"variable"]}))})),e.jsx("div",Object.assign({style:{marginBottom:12}},{children:f?e.jsxs("div",Object.assign({style:{display:"flex",border:"#E0E0E0 1px solid",borderRadius:4,padding:10,justifyContent:(null==D?void 0:D.label)?"space-between":"flex-end"}},{children:[e.jsx(p.BodyPrimary,Object.assign({numberOfLines:1},{children:ee===c.POD.CHATBOT?null==D?void 0:D.value:null!==(P=null==D?void 0:D.label)&&void 0!==P?P:""})),e.jsx(t.default,{onClick:()=>{M(!Y)},width:24,height:24,color:v.COLORS.content.primary})]})):e.jsx(s.Dropdown,{options:w,isSearchable:!1,onSelect:te,defaultOptions:D?[Object.assign(Object.assign({},D),{selected:!0})]:[]})})),("custom_text"===(null==D?void 0:D.value)||"custom_link"===(null==D?void 0:D.value))&&e.jsx(u.Input,{labelText:"custom_text"===(null==D?void 0:D.value)?"Custom text value":"custom_link"===(null==D?void 0:D.value)?"Custom URL value":"",id:`variable-value-${null==D?void 0:D.value}-${y}`,value:k,errorMessage:$?k&&0!==k.trim().length?"custom_link"!==D.value||/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$/.test(`https://${k.trim()}`)&&0!==k.trim().length?"custom_link"!==D.value&&k.length>30?"Length cannot be more than 30":"BUTTONS"===N&&"custom_link"!==D.value?"Enter valid alpha numeric code":"":"Enter valid URL":"Required field":"",maxCharLimit:"custom_link"===(null==D?void 0:D.value)?2e3:"BUTTONS"===N?15:30,noKeyDownChange:!0,prefixText:"custom_link"===(null==D?void 0:D.value)?"https://":"",placeholder:"link"===E.type||"custom_link"===D.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{le(D.value,e)}}),"static_expiry"===(null==D?void 0:D.value)&&e.jsx(o.CustomDateTime,{placement:"auto",time:k?l.format(new Date(k),"hh:mm a"):l.format(new Date,"hh:mm a"),date:k?new Date(k):new Date,minDate:new Date,error:"",setError:()=>{},onChange:e=>{le("static_expiry",e.toISOString())}}),Y&&e.jsx(n.AddVariableV2SideModal,{zIndex:2e3,data:null!=T?T:[],showVariable:Y,setShowVariable:M,placeholder:"Add a variable",customTrigger:e=>{null==A||A(!1),"{{custom.url}}"===e.actualValue?te({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?te({label:e.displayName,selected:!0,value:"custom_text"}):"{{static.expiry}}"==e.actualValue?te({label:e.displayName,selected:!0,value:"static_expiry"}):te({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})}})]}))};
|
|
7
|
+
`,j={value:"custom_link",label:"Custom URL"},O={value:"custom_text",label:"Custom text"},E={value:"static_expiry",label:"Static Expiry"};exports.Container=_,exports.default=i=>{let{onFocus:x,variable:y,index:f,showVariableModal:T,variableList:A,setShowDiscountCheckBox:N,componentType:S,CTAoptions:C}=i;var P,V;const[k,L]=a.useState(!1),[H,w]=a.useState(""),[B,D]=a.useState([]),[q,Y]=a.useState(),[M,R]=a.useState(!1),[U,W]=a.useState(!1),{device:I,channel:$,isError:z,originalVariableList:Z,template:F,templateSelectionTriggered:G,setTemplate:K,setDisplayContent:J,setOriginalVariableList:Q,globalNormalizedPlaceholders:X,enabledCustomText:ee,pod:te}=g.useTemplateModalContext();function le(e,t){var l,a,i;const n=e;w(""),Y(n),$===c.CHANNEL_TYPE.WHATSAPP?"custom_text"!==n.value&&"custom_link"!==n.value&&"static_expiry"!==n.value?(ie(null!==(l=n.value)&&void 0!==l?l:"","string"),null==ne||ne(null!==(a=y.index)&&void 0!==a?a:0,n.value,!0)):(null==ne||ne(null!==(i=y.index)&&void 0!==i?i:0,H,!0,n.value),ie("","url"===n.bikPlaceholderType?"link":"string")):"custom_text"!==n.value&&"custom_link"!==n.value?ie(n.value,"url"===n.bikPlaceholderType?"link":"string"):(w(""),ie("",n.value))}function ae(e,t){var l;w(t);const a="custom_link"===(null==q?void 0:q.value)&&t?t.includes("https")?t:`https://${t}`:t;ie(a,"static_expiry"===e?"string":e),$===c.CHANNEL_TYPE.WHATSAPP&&(null==ne||ne(null!==(l=y.index)&&void 0!==l?l:0,a,"custom_link"===e,e))}function ie(e,t){var l,a,i,n;const o="custom_link"===t?"link":"custom_text"===t?"string":t;if($!==c.CHANNEL_TYPE.WHATSAPP){const a=h.getVariableNameForEmailByIndex(f+1),i=null===document||void 0===document?void 0:document.getElementById("mobile"===I?"template_html_mobile":"template_html_desktop"),n=$===c.CHANNEL_TYPE.EMAIL?null===(l=null==i?void 0:i.contentWindow)||void 0===l?void 0:l.document.getElementById(a):document.getElementById(a);n&&(n.textContent="custom_text"!==t&&"custom_link"!==t||e?e:y.variableName);const s=Z.map(((t,l)=>l===f?Object.assign(Object.assign({},t),{type:o,updatedValue:e}):t));null==Q||Q(s)}if($===c.CHANNEL_TYPE.WHATSAPP){const l=Z;let s=l.body,u=l.header,d=l.buttons;"BODY"===S?s=null===(a=l.body)||void 0===a?void 0:a.map(((t,l)=>l===f?Object.assign(Object.assign({},t),{type:o,updatedValue:e}):t)):"HEADER"===S?u=null===(i=l.header)||void 0===i?void 0:i.map(((t,l)=>l===f?Object.assign(Object.assign({},t),{type:o,updatedValue:e}):t)):"BUTTONS"===S&&(d=null===(n=l.buttons)||void 0===n?void 0:n.map(((l,a)=>a===f?Object.assign(Object.assign({},l),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:[e]}):l))),null==Q||Q((e=>Object.assign(Object.assign({},e),{header:u,body:s,buttons:d})))}}function ne(e,t,l,a){var i,n,o,s;const u=Object.assign({},F),d=null===(i=null==u?void 0:u.components)||void 0===i?void 0:i.map((l=>{var a,i,n,o,s,u,d,r,c,p;const m=Object.assign({},l);if("BODY"===l.type&&"BODY"===S){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=m.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({},m.example),{body_text:[l]});return Object.assign(Object.assign({},m),{example:a})}}else if("HEADER"===l.type&&"HEADER"===S){if(null===(u=l.example)||void 0===u?void 0:u.header_text){const l=[...null!==(r=null===(d=m.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({},m.example),{header_text:l});return Object.assign(Object.assign({},m),{example:a})}}else if("BUTTONS"===l.type&&"BUTTONS"===S){if(null===(p=null===(c=l.buttons)||void 0===c?void 0:c[e])||void 0===p?void 0:p.example){const a=l.buttons.map(((l,a)=>a===e?Object.assign(Object.assign({},l),{example:[t]}):l));return Object.assign(Object.assign({},m),{buttons:a})}}else if("limited_time_offer"===l.type&&"limited_time_offer"===S)return Object.assign(Object.assign({},m),{example:Object.assign(Object.assign({},m.example),{limited_time_offer:t})});return l}));if(u.components=d,l)if("BODY"===S&&(null===(n=null==u?void 0:u.mapping)||void 0===n?void 0:n.body))u.mapping=Object.assign(Object.assign({},u.mapping),{body:u.mapping.body.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+10}))`:t:l))});else if("HEADER"===S&&(null===(o=null==u?void 0:u.mapping)||void 0===o?void 0:o.header))u.mapping=Object.assign(Object.assign({},u.mapping),{header:u.mapping.header.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+20}))`:t:l))});else if("BUTTONS"===S&&(null===(s=null==u?void 0:u.mapping)||void 0===s?void 0:s.buttons)){let l=-1,i=-1;d.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))})))})),u.mapping=Object.assign(Object.assign({},u.mapping),{buttons:u.mapping.buttons.map(((e,l)=>l===i?"custom_link"===a?"((customPlaceholderName))":t:e))})}null==K||K(Object.assign({},u))}return a.useEffect((()=>{k&&(null==x||x())}),[k]),a.useEffect((()=>{!function(){var e,t,l,a,i;const n="mobile"===I?"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);$===c.CHANNEL_TYPE.EMAIL&&(null==J||J(s))}()}),[G]),a.useEffect((()=>{var e,t;const l=[];let a=[];if($!==c.CHANNEL_TYPE.MESSAGE||ee){"link"===(null==y?void 0:y.type)?(l.push({label:"",options:[j,O]}),Y(j)):"date_time"===(null==y?void 0:y.type)?(l.push({label:"",options:[j,O]}),Y(E)):(l.push({label:"",options:[j,O,E]}),Y(O));const e=null!=X?X:[];D([...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!=X?X:[];D([{label:"",options:[O,j]},...e]),a=[{label:"",options:[O,j]},...e]}if(($===c.CHANNEL_TYPE.WHATSAPP||$===c.CHANNEL_TYPE.EMAIL||$===c.CHANNEL_TYPE.MESSAGE)&&y.updatedValue)if(r.placeHolderNamePattern.test(y.updatedValue)&&$===c.CHANNEL_TYPE.WHATSAPP||y.updatedValue.startsWith("{{")&&$!==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(T){let t=e.updatedValue;if(te===p.POD.CHATBOT&&"BUTTONS"===S){const l=null==C?void 0:C.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}(y,a,$);e.value&&Y(e)}else"date_time"===y.type?(Y(E),w(y.updatedValue),ne(null!==(e=y.index)&&void 0!==e?e:0,y.updatedValue)):(null===(t=y.updatedValue)||void 0===t?void 0:t.startsWith("https"))?(Y(j),w(y.updatedValue.split("https://")[1])):(Y(O),w(y.updatedValue))}),[]),a.useEffect((()=>{I&&q&&H&&setTimeout((()=>{ie("custom_link"===(null==q?void 0:q.value)&&H?H.includes("https")?H:`https://${H}`:H,q.value)}),100)}),[I]),a.useEffect((()=>{!U&&q&&y.updatedValue&&setTimeout((()=>{ie("custom_link"===(null==q?void 0:q.value)&&y.updatedValue?y.updatedValue.includes("https")?y.updatedValue:`https://${y.updatedValue}`:y.updatedValue,q.value),W(!0)}),100)}),[q]),e.jsxs(_,Object.assign({channel:$,focused:k,onMouseEnter:()=>L(!0),onMouseLeave:()=>L(!1)},{children:[e.jsx("div",Object.assign({style:{marginBottom:8}},{children:e.jsxs(m.BodySecondary,Object.assign({style:{color:z&&!q?b.COLORS.content.negative:b.COLORS.content.primary}},{children:[null===(P=y.variableName)||void 0===P?void 0:P.replace("{{","").replace("}}","")," ","link"===(null==y?void 0:y.type)?"link":"variable"]}))})),e.jsx("div",Object.assign({style:{marginBottom:12}},{children:T?e.jsxs("div",Object.assign({style:{display:"flex",border:"#E0E0E0 1px solid",borderRadius:4,padding:10,justifyContent:(null==q?void 0:q.label)?"space-between":"flex-end"}},{children:[e.jsx(m.BodyPrimary,{children:d.truncate(null!==(V=null==q?void 0:q.label)&&void 0!==V?V:"",20,!0)}),e.jsx(t.default,{onClick:()=>{R(!M)},width:24,height:24,color:b.COLORS.content.primary})]})):e.jsx(s.Dropdown,{options:B,isSearchable:!1,onSelect:le,defaultOptions:q?[Object.assign(Object.assign({},q),{selected:!0})]:[]})})),("custom_text"===(null==q?void 0:q.value)||"custom_link"===(null==q?void 0:q.value))&&e.jsx(u.Input,{labelText:"custom_text"===(null==q?void 0:q.value)?"Custom text value":"custom_link"===(null==q?void 0:q.value)?"Custom URL value":"",id:`variable-value-${null==q?void 0:q.value}-${f}`,value:H,errorMessage:z?H&&0!==H.trim().length?"custom_link"!==q.value||/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$/.test(`https://${H.trim()}`)&&0!==H.trim().length?"custom_link"!==q.value&&H.length>30?"Length cannot be more than 30":"BUTTONS"===S&&"custom_link"!==q.value?"Enter valid alpha numeric code":"":"Enter valid URL":"Required field":"",maxCharLimit:"custom_link"===(null==q?void 0:q.value)?2e3:"BUTTONS"===S?15:30,noKeyDownChange:!0,prefixText:"custom_link"===(null==q?void 0:q.value)?"https://":"",placeholder:"link"===y.type||"custom_link"===q.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{ae(q.value,e)}}),"static_expiry"===(null==q?void 0:q.value)&&e.jsx(o.CustomDateTime,{placement:"auto",time:H?l.format(new Date(H),"hh:mm a"):l.format(new Date,"hh:mm a"),date:H?new Date(H):new Date,minDate:new Date,error:"",setError:()=>{},onChange:e=>{ae("static_expiry",e.toISOString())}}),M&&e.jsx(n.AddVariableV2SideModal,{zIndex:2e3,data:null!=A?A:[],showVariable:M,setShowVariable:R,placeholder:"Add a variable",customTrigger:e=>{null==N||N(!1),"{{custom.url}}"===e.actualValue?le({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?le({label:e.displayName,selected:!0,value:"custom_text"}):"{{static.expiry}}"==e.actualValue?le({label:e.displayName,selected:!0,value:"static_expiry"}):le({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})}})]}))};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import{jsxs as e,jsx as t}from"react/jsx-runtime";import l from"../../../assets/icons/edit.svg.js";import{format as a}from"date-fns";import{useState as i,useEffect as n}from"react";import o from"styled-components";import{AddVariableV2SideModal as s}from"../../add-variableV2/AddVariableV2SideModal.js";import{CustomDateTime as u}from"../../custom-date-time/CustomDateTime.js";import{Dropdown as d}from"../../dropdown/Dropdown.js";import{Input as r}from"../../input/Input.js";import{
|
|
1
|
+
import{jsxs as e,jsx as t}from"react/jsx-runtime";import l from"../../../assets/icons/edit.svg.js";import{format as a}from"date-fns";import{useState as i,useEffect as n}from"react";import o from"styled-components";import{AddVariableV2SideModal as s}from"../../add-variableV2/AddVariableV2SideModal.js";import{CustomDateTime as u}from"../../custom-date-time/CustomDateTime.js";import{Dropdown as d}from"../../dropdown/Dropdown.js";import{Input as r}from"../../input/Input.js";import{truncate as c}from"../../product-picker-v2/collectionScreen.js";import{placeHolderNamePattern as p}from"../../template-preview/constants/regexPatterns.js";import{CHANNEL_TYPE as m}from"../../template-preview/models/Channels.js";import{POD as v}from"../../template-preview/models/WhatsAppTemplate.js";import{BodySecondary as b,BodyPrimary as g}from"../../TypographyStyle.js";import h from"../../../utils/StringUtils.js";import{COLORS as x}from"../../../constants/Theme.js";import{useTemplateModalContext as f}from"../context/templateModalContext.js";import{getVariableNameForEmailByIndex as j}from"../utils/getVariableNameEmail.js";const O=o.div`
|
|
2
2
|
/* surface/$color-background-warning-light */
|
|
3
3
|
|
|
4
|
-
background: ${e=>e.focused&&e.channel===
|
|
4
|
+
background: ${e=>e.focused&&e.channel===m.EMAIL?x.background.warning.light:"transparent"};
|
|
5
5
|
border-radius: 4px;
|
|
6
6
|
padding: 8px 10px;
|
|
7
|
-
`,j={value:"custom_link",label:"Custom URL"},_={value:"custom_text",label:"Custom text"},y={value:"static_expiry",label:"Static Expiry"},T=o=>{let{onFocus:T,variable:V,index:k,showVariableModal:A,variableList:E,setShowDiscountCheckBox:S,componentType:w,CTAoptions:P}=o;var C,B;const[L,D]=i(!1),[N,H]=i(""),[U,M]=i([]),[W,R]=i(),[$,I]=i(!1),[z,Y]=i(!1),{device:Z,channel:G,isError:q,originalVariableList:F,template:K,templateSelectionTriggered:J,setTemplate:Q,setDisplayContent:X,setOriginalVariableList:ee,globalNormalizedPlaceholders:te,enabledCustomText:le,pod:ae}=x();function ie(e,t){var l,a,i;const n=e;H(""),R(n),G===p.WHATSAPP?"custom_text"!==n.value&&"custom_link"!==n.value&&"static_expiry"!==n.value?(oe(null!==(l=n.value)&&void 0!==l?l:"","string"),null==se||se(null!==(a=V.index)&&void 0!==a?a:0,n.value,!0)):(null==se||se(null!==(i=V.index)&&void 0!==i?i:0,N,!0,n.value),oe("","url"===n.bikPlaceholderType?"link":"string")):"custom_text"!==n.value&&"custom_link"!==n.value?oe(n.value,"url"===n.bikPlaceholderType?"link":"string"):(H(""),oe("",n.value))}function ne(e,t){var l;H(t);const a="custom_link"===(null==W?void 0:W.value)&&t?t.includes("https")?t:`https://${t}`:t;oe(a,"static_expiry"===e?"string":e),G===p.WHATSAPP&&(null==se||se(null!==(l=V.index)&&void 0!==l?l:0,a,"custom_link"===e,e))}function oe(e,t){var l,a,i,n;const o="custom_link"===t?"link":"custom_text"===t?"string":t;if(G!==p.WHATSAPP){const a=O(k+1),i=null===document||void 0===document?void 0:document.getElementById("mobile"===Z?"template_html_mobile":"template_html_desktop"),n=G===p.EMAIL?null===(l=null==i?void 0:i.contentWindow)||void 0===l?void 0:l.document.getElementById(a):document.getElementById(a);n&&(n.textContent="custom_text"!==t&&"custom_link"!==t||e?e:V.variableName);const s=F.map(((t,l)=>l===k?Object.assign(Object.assign({},t),{type:o,updatedValue:e}):t));null==ee||ee(s)}if(G===p.WHATSAPP){const l=F;let s=l.body,u=l.header,d=l.buttons;"BODY"===w?s=null===(a=l.body)||void 0===a?void 0:a.map(((t,l)=>l===k?Object.assign(Object.assign({},t),{type:o,updatedValue:e}):t)):"HEADER"===w?u=null===(i=l.header)||void 0===i?void 0:i.map(((t,l)=>l===k?Object.assign(Object.assign({},t),{type:o,updatedValue:e}):t)):"BUTTONS"===w&&(d=null===(n=l.buttons)||void 0===n?void 0:n.map(((l,a)=>a===k?Object.assign(Object.assign({},l),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:[e]}):l))),null==ee||ee((e=>Object.assign(Object.assign({},e),{header:u,body:s,buttons:d})))}}function se(e,t,l,a){var i,n,o,s;const u=Object.assign({},K),d=null===(i=null==u?void 0:u.components)||void 0===i?void 0:i.map((l=>{var a,i,n,o,s,u,d,r,c,p;const m=Object.assign({},l);if("BODY"===l.type&&"BODY"===w){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=m.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({},m.example),{body_text:[l]});return Object.assign(Object.assign({},m),{example:a})}}else if("HEADER"===l.type&&"HEADER"===w){if(null===(u=l.example)||void 0===u?void 0:u.header_text){const l=[...null!==(r=null===(d=m.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({},m.example),{header_text:l});return Object.assign(Object.assign({},m),{example:a})}}else if("BUTTONS"===l.type&&"BUTTONS"===w){if(null===(p=null===(c=l.buttons)||void 0===c?void 0:c[e])||void 0===p?void 0:p.example){const a=l.buttons.map(((l,a)=>a===e?Object.assign(Object.assign({},l),{example:[t]}):l));return Object.assign(Object.assign({},m),{buttons:a})}}else if("limited_time_offer"===l.type&&"limited_time_offer"===w)return Object.assign(Object.assign({},m),{example:Object.assign(Object.assign({},m.example),{limited_time_offer:t})});return l}));if(u.components=d,l)if("BODY"===w&&(null===(n=null==u?void 0:u.mapping)||void 0===n?void 0:n.body))u.mapping=Object.assign(Object.assign({},u.mapping),{body:u.mapping.body.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+10}))`:t:l))});else if("HEADER"===w&&(null===(o=null==u?void 0:u.mapping)||void 0===o?void 0:o.header))u.mapping=Object.assign(Object.assign({},u.mapping),{header:u.mapping.header.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+20}))`:t:l))});else if("BUTTONS"===w&&(null===(s=null==u?void 0:u.mapping)||void 0===s?void 0:s.buttons)){let l=-1,i=-1;d.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))})))})),u.mapping=Object.assign(Object.assign({},u.mapping),{buttons:u.mapping.buttons.map(((e,l)=>l===i?"custom_link"===a?"((customPlaceholderName))":t:e))})}null==Q||Q(Object.assign({},u))}return n((()=>{L&&(null==T||T())}),[L]),n((()=>{!function(){var e,t,l,a,i;const n="mobile"===Z?"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);G===p.EMAIL&&(null==X||X(s))}()}),[J]),n((()=>{var e,t;const l=[];let a=[];if(G!==p.MESSAGE||le){"link"===(null==V?void 0:V.type)?(l.push({label:"",options:[j,_]}),R(j)):"date_time"===(null==V?void 0:V.type)?(l.push({label:"",options:[j,_]}),R(y)):(l.push({label:"",options:[j,_,y]}),R(_));const e=null!=te?te:[];M([...l,...e.map((e=>{var t,l;return Object.assign(Object.assign({},e),{label:g.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!=te?te:[];M([{label:"",options:[_,j]},...e]),a=[{label:"",options:[_,j]},...e]}if((G===p.WHATSAPP||G===p.EMAIL||G===p.MESSAGE)&&V.updatedValue)if(c.test(V.updatedValue)&&G===p.WHATSAPP||V.updatedValue.startsWith("{{")&&G!==p.WHATSAPP){const e=function(e,t,l){var a;let i={label:"",value:""};const n=l===p.WHATSAPP?e.updatedValue.replace("[[","").replace("]]",""):e.updatedValue.replace("{{","").replace("}}","");if(A){let t=e.updatedValue;if(ae===m.CHATBOT&&"BUTTONS"===w){const l=null==P?void 0:P.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}(V,a,G);e.value&&R(e)}else"date_time"===V.type?(R(y),H(V.updatedValue),se(null!==(e=V.index)&&void 0!==e?e:0,V.updatedValue)):(null===(t=V.updatedValue)||void 0===t?void 0:t.startsWith("https"))?(R(j),H(V.updatedValue.split("https://")[1])):(R(_),H(V.updatedValue))}),[]),n((()=>{Z&&W&&N&&setTimeout((()=>{oe("custom_link"===(null==W?void 0:W.value)&&N?N.includes("https")?N:`https://${N}`:N,W.value)}),100)}),[Z]),n((()=>{!z&&W&&V.updatedValue&&setTimeout((()=>{oe("custom_link"===(null==W?void 0:W.value)&&V.updatedValue?V.updatedValue.includes("https")?V.updatedValue:`https://${V.updatedValue}`:V.updatedValue,W.value),Y(!0)}),100)}),[W]),e(f,Object.assign({channel:G,focused:L,onMouseEnter:()=>D(!0),onMouseLeave:()=>D(!1)},{children:[t("div",Object.assign({style:{marginBottom:8}},{children:e(v,Object.assign({style:{color:q&&!W?h.content.negative:h.content.primary}},{children:[null===(C=V.variableName)||void 0===C?void 0:C.replace("{{","").replace("}}","")," ","link"===(null==V?void 0:V.type)?"link":"variable"]}))})),t("div",Object.assign({style:{marginBottom:12}},{children:A?e("div",Object.assign({style:{display:"flex",border:"#E0E0E0 1px solid",borderRadius:4,padding:10,justifyContent:(null==W?void 0:W.label)?"space-between":"flex-end"}},{children:[t(b,Object.assign({numberOfLines:1},{children:ae===m.CHATBOT?null==W?void 0:W.value:null!==(B=null==W?void 0:W.label)&&void 0!==B?B:""})),t(l,{onClick:()=>{I(!$)},width:24,height:24,color:h.content.primary})]})):t(d,{options:U,isSearchable:!1,onSelect:ie,defaultOptions:W?[Object.assign(Object.assign({},W),{selected:!0})]:[]})})),("custom_text"===(null==W?void 0:W.value)||"custom_link"===(null==W?void 0:W.value))&&t(r,{labelText:"custom_text"===(null==W?void 0:W.value)?"Custom text value":"custom_link"===(null==W?void 0:W.value)?"Custom URL value":"",id:`variable-value-${null==W?void 0:W.value}-${k}`,value:N,errorMessage:q?N&&0!==N.trim().length?"custom_link"!==W.value||/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$/.test(`https://${N.trim()}`)&&0!==N.trim().length?"custom_link"!==W.value&&N.length>30?"Length cannot be more than 30":"BUTTONS"===w&&"custom_link"!==W.value?"Enter valid alpha numeric code":"":"Enter valid URL":"Required field":"",maxCharLimit:"custom_link"===(null==W?void 0:W.value)?2e3:"BUTTONS"===w?15:30,noKeyDownChange:!0,prefixText:"custom_link"===(null==W?void 0:W.value)?"https://":"",placeholder:"link"===V.type||"custom_link"===W.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{ne(W.value,e)}}),"static_expiry"===(null==W?void 0:W.value)&&t(u,{placement:"auto",time:a(N?new Date(N):new Date,"hh:mm a"),date:N?new Date(N):new Date,minDate:new Date,error:"",setError:()=>{},onChange:e=>{ne("static_expiry",e.toISOString())}}),$&&t(s,{zIndex:2e3,data:null!=E?E:[],showVariable:$,setShowVariable:I,placeholder:"Add a variable",customTrigger:e=>{null==S||S(!1),"{{custom.url}}"===e.actualValue?ie({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?ie({label:e.displayName,selected:!0,value:"custom_text"}):"{{static.expiry}}"==e.actualValue?ie({label:e.displayName,selected:!0,value:"static_expiry"}):ie({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})}})]}))};export{f as Container,T as default};
|
|
7
|
+
`,_={value:"custom_link",label:"Custom URL"},y={value:"custom_text",label:"Custom text"},T={value:"static_expiry",label:"Static Expiry"},k=o=>{let{onFocus:k,variable:V,index:A,showVariableModal:E,variableList:S,setShowDiscountCheckBox:w,componentType:P,CTAoptions:C}=o;var B,D;const[L,N]=i(!1),[H,U]=i(""),[M,W]=i([]),[R,$]=i(),[I,z]=i(!1),[Y,Z]=i(!1),{device:G,channel:q,isError:F,originalVariableList:K,template:J,templateSelectionTriggered:Q,setTemplate:X,setDisplayContent:ee,setOriginalVariableList:te,globalNormalizedPlaceholders:le,enabledCustomText:ae,pod:ie}=f();function ne(e,t){var l,a,i;const n=e;U(""),$(n),q===m.WHATSAPP?"custom_text"!==n.value&&"custom_link"!==n.value&&"static_expiry"!==n.value?(se(null!==(l=n.value)&&void 0!==l?l:"","string"),null==ue||ue(null!==(a=V.index)&&void 0!==a?a:0,n.value,!0)):(null==ue||ue(null!==(i=V.index)&&void 0!==i?i:0,H,!0,n.value),se("","url"===n.bikPlaceholderType?"link":"string")):"custom_text"!==n.value&&"custom_link"!==n.value?se(n.value,"url"===n.bikPlaceholderType?"link":"string"):(U(""),se("",n.value))}function oe(e,t){var l;U(t);const a="custom_link"===(null==R?void 0:R.value)&&t?t.includes("https")?t:`https://${t}`:t;se(a,"static_expiry"===e?"string":e),q===m.WHATSAPP&&(null==ue||ue(null!==(l=V.index)&&void 0!==l?l:0,a,"custom_link"===e,e))}function se(e,t){var l,a,i,n;const o="custom_link"===t?"link":"custom_text"===t?"string":t;if(q!==m.WHATSAPP){const a=j(A+1),i=null===document||void 0===document?void 0:document.getElementById("mobile"===G?"template_html_mobile":"template_html_desktop"),n=q===m.EMAIL?null===(l=null==i?void 0:i.contentWindow)||void 0===l?void 0:l.document.getElementById(a):document.getElementById(a);n&&(n.textContent="custom_text"!==t&&"custom_link"!==t||e?e:V.variableName);const s=K.map(((t,l)=>l===A?Object.assign(Object.assign({},t),{type:o,updatedValue:e}):t));null==te||te(s)}if(q===m.WHATSAPP){const l=K;let s=l.body,u=l.header,d=l.buttons;"BODY"===P?s=null===(a=l.body)||void 0===a?void 0:a.map(((t,l)=>l===A?Object.assign(Object.assign({},t),{type:o,updatedValue:e}):t)):"HEADER"===P?u=null===(i=l.header)||void 0===i?void 0:i.map(((t,l)=>l===A?Object.assign(Object.assign({},t),{type:o,updatedValue:e}):t)):"BUTTONS"===P&&(d=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:[e]}):l))),null==te||te((e=>Object.assign(Object.assign({},e),{header:u,body:s,buttons:d})))}}function ue(e,t,l,a){var i,n,o,s;const u=Object.assign({},J),d=null===(i=null==u?void 0:u.components)||void 0===i?void 0:i.map((l=>{var a,i,n,o,s,u,d,r,c,p;const m=Object.assign({},l);if("BODY"===l.type&&"BODY"===P){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=m.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({},m.example),{body_text:[l]});return Object.assign(Object.assign({},m),{example:a})}}else if("HEADER"===l.type&&"HEADER"===P){if(null===(u=l.example)||void 0===u?void 0:u.header_text){const l=[...null!==(r=null===(d=m.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({},m.example),{header_text:l});return Object.assign(Object.assign({},m),{example:a})}}else if("BUTTONS"===l.type&&"BUTTONS"===P){if(null===(p=null===(c=l.buttons)||void 0===c?void 0:c[e])||void 0===p?void 0:p.example){const a=l.buttons.map(((l,a)=>a===e?Object.assign(Object.assign({},l),{example:[t]}):l));return Object.assign(Object.assign({},m),{buttons:a})}}else if("limited_time_offer"===l.type&&"limited_time_offer"===P)return Object.assign(Object.assign({},m),{example:Object.assign(Object.assign({},m.example),{limited_time_offer:t})});return l}));if(u.components=d,l)if("BODY"===P&&(null===(n=null==u?void 0:u.mapping)||void 0===n?void 0:n.body))u.mapping=Object.assign(Object.assign({},u.mapping),{body:u.mapping.body.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+10}))`:t:l))});else if("HEADER"===P&&(null===(o=null==u?void 0:u.mapping)||void 0===o?void 0:o.header))u.mapping=Object.assign(Object.assign({},u.mapping),{header:u.mapping.header.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+20}))`:t:l))});else if("BUTTONS"===P&&(null===(s=null==u?void 0:u.mapping)||void 0===s?void 0:s.buttons)){let l=-1,i=-1;d.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))})))})),u.mapping=Object.assign(Object.assign({},u.mapping),{buttons:u.mapping.buttons.map(((e,l)=>l===i?"custom_link"===a?"((customPlaceholderName))":t:e))})}null==X||X(Object.assign({},u))}return n((()=>{L&&(null==k||k())}),[L]),n((()=>{!function(){var e,t,l,a,i;const n="mobile"===G?"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);q===m.EMAIL&&(null==ee||ee(s))}()}),[Q]),n((()=>{var e,t;const l=[];let a=[];if(q!==m.MESSAGE||ae){"link"===(null==V?void 0:V.type)?(l.push({label:"",options:[_,y]}),$(_)):"date_time"===(null==V?void 0:V.type)?(l.push({label:"",options:[_,y]}),$(T)):(l.push({label:"",options:[_,y,T]}),$(y));const e=null!=le?le:[];W([...l,...e.map((e=>{var t,l;return Object.assign(Object.assign({},e),{label:h.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!=le?le:[];W([{label:"",options:[y,_]},...e]),a=[{label:"",options:[y,_]},...e]}if((q===m.WHATSAPP||q===m.EMAIL||q===m.MESSAGE)&&V.updatedValue)if(p.test(V.updatedValue)&&q===m.WHATSAPP||V.updatedValue.startsWith("{{")&&q!==m.WHATSAPP){const e=function(e,t,l){var a;let i={label:"",value:""};const n=l===m.WHATSAPP?e.updatedValue.replace("[[","").replace("]]",""):e.updatedValue.replace("{{","").replace("}}","");if(E){let t=e.updatedValue;if(ie===v.CHATBOT&&"BUTTONS"===P){const l=null==C?void 0:C.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}(V,a,q);e.value&&$(e)}else"date_time"===V.type?($(T),U(V.updatedValue),ue(null!==(e=V.index)&&void 0!==e?e:0,V.updatedValue)):(null===(t=V.updatedValue)||void 0===t?void 0:t.startsWith("https"))?($(_),U(V.updatedValue.split("https://")[1])):($(y),U(V.updatedValue))}),[]),n((()=>{G&&R&&H&&setTimeout((()=>{se("custom_link"===(null==R?void 0:R.value)&&H?H.includes("https")?H:`https://${H}`:H,R.value)}),100)}),[G]),n((()=>{!Y&&R&&V.updatedValue&&setTimeout((()=>{se("custom_link"===(null==R?void 0:R.value)&&V.updatedValue?V.updatedValue.includes("https")?V.updatedValue:`https://${V.updatedValue}`:V.updatedValue,R.value),Z(!0)}),100)}),[R]),e(O,Object.assign({channel:q,focused:L,onMouseEnter:()=>N(!0),onMouseLeave:()=>N(!1)},{children:[t("div",Object.assign({style:{marginBottom:8}},{children:e(b,Object.assign({style:{color:F&&!R?x.content.negative:x.content.primary}},{children:[null===(B=V.variableName)||void 0===B?void 0:B.replace("{{","").replace("}}","")," ","link"===(null==V?void 0:V.type)?"link":"variable"]}))})),t("div",Object.assign({style:{marginBottom:12}},{children:E?e("div",Object.assign({style:{display:"flex",border:"#E0E0E0 1px solid",borderRadius:4,padding:10,justifyContent:(null==R?void 0:R.label)?"space-between":"flex-end"}},{children:[t(g,{children:c(null!==(D=null==R?void 0:R.label)&&void 0!==D?D:"",20,!0)}),t(l,{onClick:()=>{z(!I)},width:24,height:24,color:x.content.primary})]})):t(d,{options:M,isSearchable:!1,onSelect:ne,defaultOptions:R?[Object.assign(Object.assign({},R),{selected:!0})]:[]})})),("custom_text"===(null==R?void 0:R.value)||"custom_link"===(null==R?void 0:R.value))&&t(r,{labelText:"custom_text"===(null==R?void 0:R.value)?"Custom text value":"custom_link"===(null==R?void 0:R.value)?"Custom URL value":"",id:`variable-value-${null==R?void 0:R.value}-${A}`,value:H,errorMessage:F?H&&0!==H.trim().length?"custom_link"!==R.value||/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$/.test(`https://${H.trim()}`)&&0!==H.trim().length?"custom_link"!==R.value&&H.length>30?"Length cannot be more than 30":"BUTTONS"===P&&"custom_link"!==R.value?"Enter valid alpha numeric code":"":"Enter valid URL":"Required field":"",maxCharLimit:"custom_link"===(null==R?void 0:R.value)?2e3:"BUTTONS"===P?15:30,noKeyDownChange:!0,prefixText:"custom_link"===(null==R?void 0:R.value)?"https://":"",placeholder:"link"===V.type||"custom_link"===R.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{oe(R.value,e)}}),"static_expiry"===(null==R?void 0:R.value)&&t(u,{placement:"auto",time:a(H?new Date(H):new Date,"hh:mm a"),date:H?new Date(H):new Date,minDate:new Date,error:"",setError:()=>{},onChange:e=>{oe("static_expiry",e.toISOString())}}),I&&t(s,{zIndex:2e3,data:null!=S?S:[],showVariable:I,setShowVariable:z,placeholder:"Add a variable",customTrigger:e=>{null==w||w(!1),"{{custom.url}}"===e.actualValue?ne({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?ne({label:e.displayName,selected:!0,value:"custom_text"}):"{{static.expiry}}"==e.actualValue?ne({label:e.displayName,selected:!0,value:"static_expiry"}):ne({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})}})]}))};export{O as Container,k as default};
|