@bikdotai/bik-component-library 0.0.400-beta.8 → 0.0.400-beta.9
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/template-context-mapper/modalElements/VariableConnector.js +2 -2
- package/dist/cjs/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.js +1 -1
- package/dist/esm/components/template-context-mapper/modalElements/VariableConnector.js +3 -3
- package/dist/esm/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.js +1 -1
- 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("react"),a=require("styled-components"),n=require("../../add-variableV2/AddVariableV2SideModal.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("react"),a=require("styled-components"),n=require("../../add-variableV2/AddVariableV2SideModal.js"),i=require("../../dropdown/Dropdown.js"),o=require("../../input/Input.js"),s=require("../../product-picker-v2/collectionScreen.js"),u=require("../../template-preview/constants/regexPatterns.js"),d=require("../../template-preview/models/Channels.js"),r=require("../../template-preview/models/WhatsAppTemplate.js"),c=require("../../TypographyStyle.js"),p=require("../../../utils/StringUtils.js"),v=require("../../../constants/Theme.js"),m=require("../context/templateModalContext.js"),b=require("../utils/getVariableNameEmail.js");function g(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const h=g(a).default.div`
|
|
2
2
|
/* surface/$color-background-warning-light */
|
|
3
3
|
|
|
4
4
|
background: ${e=>e.focused&&e.channel===d.CHANNEL_TYPE.EMAIL?v.COLORS.background.warning.light:"transparent"};
|
|
5
5
|
border-radius: 4px;
|
|
6
6
|
padding: 8px 10px;
|
|
7
|
-
`,h={value:"custom_link",label:"Custom URL"},x={value:"custom_text",label:"Custom text"};exports.Container=j,exports.default=a=>{let{onFocus:g,variable:E,index:O,showVariableModal:_,variableList:T,setShowDiscountCheckBox:y,componentType:A,CTAoptions:f}=a;var N,V;const[C,P]=l.useState(!1),[k,L]=l.useState(""),[S,H]=l.useState([]),[w,B]=l.useState(),[Y,M]=l.useState(!1),[q,R]=l.useState(!1),{device:W,channel:D,isError:I,originalVariableList:U,template:$,templateSelectionTriggered:z,setTemplate:Z,setDisplayContent:F,setOriginalVariableList:G,globalNormalizedPlaceholders:J,enabledCustomText:K,pod:Q}=m.useTemplateModalContext();function X(e,t){var l,a,n;const o=e;L(""),B(o),console.log("vj: handleoptionselect",e),D===d.CHANNEL_TYPE.WHATSAPP?"custom_text"!==o.value&&"custom_link"!==o.value?(ee(null!==(l=o.value)&&void 0!==l?l:"","string"),null==te||te(null!==(a=E.index)&&void 0!==a?a:0,o.value,!0)):(null==te||te(null!==(n=E.index)&&void 0!==n?n:0,E.variableName,!0,"custom_text"),ee("","url"===o.bikPlaceholderType?"link":"string")):"custom_text"!==o.value&&"custom_link"!==o.value?ee(o.value,"url"===o.bikPlaceholderType?"link":"string"):(L(""),ee("",o.value))}function ee(e,t){var l,a,n,o;console.log("vj: updatevarlist",{updateValue:e,type:t});const i="custom_link"===t?"link":"custom_text"===t?"string":t;if(D!==d.CHANNEL_TYPE.WHATSAPP){const a=b.getVariableNameForEmailByIndex(O+1),n=null===document||void 0===document?void 0:document.getElementById("mobile"===W?"template_html_mobile":"template_html_desktop"),o=D===d.CHANNEL_TYPE.EMAIL?null===(l=null==n?void 0:n.contentWindow)||void 0===l?void 0:l.document.getElementById(a):document.getElementById(a);o&&(o.textContent="custom_text"!==t&&"custom_link"!==t||e?e:E.variableName);const s=U.map(((t,l)=>l===O?Object.assign(Object.assign({},t),{type:i,updatedValue:e}):t));null==G||G(s)}if(D===d.CHANNEL_TYPE.WHATSAPP){const t=U;let l=t.body,s=t.header,u=t.buttons;"BODY"===A?l=null===(a=t.body)||void 0===a?void 0:a.map(((t,l)=>l===O?Object.assign(Object.assign({},t),{type:i,updatedValue:e}):t)):"HEADER"===A?s=null===(n=t.header)||void 0===n?void 0:n.map(((t,l)=>l===O?Object.assign(Object.assign({},t),{type:i,updatedValue:e}):t)):"BUTTONS"===A&&(u=null===(o=t.buttons)||void 0===o?void 0:o.map(((t,l)=>(console.log("vj: check",{normalizedType:i,ind:l,index:O,currVar:t}),l===O?Object.assign(Object.assign({},t),{type:r.BUTTON_TYPE.URL,buttonVariable:e}):t)))),console.log("vj: buttonvariablelist",u),null==G||G((e=>Object.assign(Object.assign({},e),{header:s,body:l,buttons:u})))}}function te(e,t,l,a){var n,o,i,s;const u=Object.assign({},$);console.log("vj: update component",{index:e,newValue:t,updateMapping:l,type:a});const d=null===(n=null==u?void 0:u.components)||void 0===n?void 0:n.map((l=>{var a,n,o,i,s,u,d,r,c,p;const v=Object.assign({},l);if("BODY"===l.type&&"BODY"===A){if(null===(n=null===(a=l.example)||void 0===a?void 0:a.body_text)||void 0===n?void 0:n[0]){const l=[...null!==(s=null===(i=null===(o=v.example)||void 0===o?void 0:o.body_text)||void 0===i?void 0:i[0])&&void 0!==s?s:[]];l[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const a=Object.assign(Object.assign({},v.example),{body_text:[l]});return Object.assign(Object.assign({},v),{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=v.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({},v.example),{header_text:l});return Object.assign(Object.assign({},v),{example:a})}}else if("BUTTONS"===l.type&&"BUTTONS"===A&&(console.log("vj: updatecomponent in buttons",{updateComponent:v}),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 console.log("vj: updating button",{updateComponent:v,updateComponentButtons:a}),Object.assign(Object.assign({},v),{buttons:a})}return l}));u.components=d,l&&("BODY"===A&&(null===(o=null==u?void 0:u.mapping)||void 0===o?void 0:o.body)?u.mapping=Object.assign(Object.assign({},u.mapping),{body:u.mapping.body.map(((l,n)=>e===n?"custom_text"===a?`((editableVariable${n+10}))`:t:l))}):"HEADER"===A&&(null===(i=null==u?void 0:u.mapping)||void 0===i?void 0:i.header)?u.mapping=Object.assign(Object.assign({},u.mapping),{header:u.mapping.header.map(((l,n)=>e===n?"custom_text"===a?`((editableVariable${n+20}))`:t:l))}):"BUTTONS"===A&&(null===(s=null==u?void 0:u.mapping)||void 0===s?void 0:s.buttons)&&(u.mapping=Object.assign(Object.assign({},u.mapping),{buttons:u.mapping.buttons.map(((l,n)=>(console.log("vj: button type",{button:l,type:a,i:n,index:e}),0===n?"custom_link"===a?"((customPlaceholderName))":t:l)))}))),null==Z||Z(Object.assign({},u))}return console.log("vj: variableconnector",{variable:E,originalVariableList:U,index:O}),l.useEffect((()=>{C&&(null==g||g())}),[C]),l.useEffect((()=>{!function(){var e,t,l,a,n;const o="mobile"===W?"template_html_mobile":"template_html_desktop",i=document.getElementById(o),s=(null!==(a=null===(l=null===(t=null===(e=null==i?void 0:i.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===(n=null==i?void 0:i.contentWindow)||void 0===n?void 0:n.document.head.innerHTML);D===d.CHANNEL_TYPE.EMAIL&&(null==F||F(s))}()}),[z]),l.useEffect((()=>{var e;const t=[];let l=[];if(D!==d.CHANNEL_TYPE.MESSAGE||K){"link"===(null==E?void 0:E.type)?(t.push({label:"",options:[h,x]}),console.log("vj: variable type is link"),B(h)):(console.log("vj: variable type is somethingelse"),t.push({label:"",options:[h,x]}),B(x));const e=null!=J?J:[];H([...t,...e.map((e=>{var t,l;return Object.assign(Object.assign({},e),{label:p.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())})}))]),l=[...t,...e],console.log("vj: alloptions",l)}else{const e=null!=J?J:[];H([{label:"",options:[x,h]},...e]),l=[{label:"",options:[x,h]},...e]}if((D===d.CHANNEL_TYPE.WHATSAPP||D===d.CHANNEL_TYPE.EMAIL||D===d.CHANNEL_TYPE.MESSAGE)&&E.updatedValue)if(u.placeHolderNamePattern.test(E.updatedValue)&&D===d.CHANNEL_TYPE.WHATSAPP||E.updatedValue.startsWith("{{")&&D!==d.CHANNEL_TYPE.WHATSAPP){const e=function(e,t,l){var a;let n={label:"",value:""};const o=l===d.CHANNEL_TYPE.WHATSAPP?e.updatedValue.replace("[[","").replace("]]",""):e.updatedValue.replace("{{","").replace("}}","");if(_){let t=e.updatedValue;if(console.log("vj: variableLabel",t),Q===r.POD.CHATBOT&&"BUTTONS"===A){const l=null==f?void 0:f.filter((t=>t.placeHolder===e.updatedValue));l&&l.length>0&&(t=l[0].label)}n={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())===o.trim()&&(n=e)}))}));return n}(E,l,D);console.log("vj: preselected option",e),e.value&&B(e)}else(null===(e=E.updatedValue)||void 0===e?void 0:e.startsWith("https"))?(B(h),L(E.updatedValue.split("https://")[1])):(B(x),L(E.updatedValue))}),[]),l.useEffect((()=>{W&&w&&k&&setTimeout((()=>{ee("custom_link"===(null==w?void 0:w.value)&&k?k.includes("https")?k:`https://${k}`:k,w.value)}),100)}),[W]),l.useEffect((()=>{console.log("vj:",{renderFirstTime:q,selectedOption:w,variable:E,enteredVariableValue:k}),!q&&w&&E.updatedValue&&setTimeout((()=>{const e="custom_link"===(null==w?void 0:w.value)&&E.updatedValue?E.updatedValue.includes("https")?E.updatedValue:`https://${E.updatedValue}`:E.updatedValue;console.log("vj: inputvalue",e),ee(e,w.value),R(!0)}),100)}),[w]),e.jsxs(j,Object.assign({channel:D,focused:C,onMouseEnter:()=>P(!0),onMouseLeave:()=>P(!1)},{children:[e.jsx("div",Object.assign({style:{marginBottom:8}},{children:e.jsxs(c.BodySecondary,Object.assign({style:{color:I&&!w?v.COLORS.content.negative:v.COLORS.content.primary}},{children:[null===(N=E.variableName)||void 0===N?void 0:N.replace("{{","").replace("}}","")," ","link"===(null==E?void 0:E.type)?"link":"variable"]}))})),e.jsx("div",Object.assign({style:{marginBottom:12}},{children:_?e.jsxs("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:[e.jsx(c.BodyPrimary,{children:s.truncate(null!==(V=null==w?void 0:w.label)&&void 0!==V?V:"",20,!0)}),e.jsx(t.default,{onClick:()=>{M(!Y)},width:24,height:24,color:v.COLORS.content.primary})]})):e.jsx(o.Dropdown,{options:S,isSearchable:!1,onSelect:X,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))&&e.jsx(i.Input,{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}-${O}`,value:k,errorMessage:I?k&&0!==k.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://${k.trim()}`)&&0!==k.trim().length?"custom_link"!==w.value&&k.length>30?"Length cannot be more than 30":"":"Enter valid URL":"Required field":"",maxCharLimit:"custom_link"===(null==w?void 0:w.value)?void 0:30,prefixText:"custom_link"===(null==w?void 0:w.value)?"https://":"",placeholder:"link"===E.type||"custom_link"===w.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{!function(e,t){var l;L(t);const a="custom_link"===(null==w?void 0:w.value)&&t?t.includes("https")?t:`https://${t}`:t;ee(a,e),D===d.CHANNEL_TYPE.WHATSAPP&&(console.log("vj: handlecustominput",{variable:E}),null==te||te(null!==(l=E.index)&&void 0!==l?l:0,a,"custom_link"===e,e))}(w.value,e)}}),Y&&e.jsx(n.AddVariableV2SideModal,{zIndex:2e3,data:null!=T?T:[],showVariable:Y,setShowVariable:M,placeholder:"Add a variable",customTrigger:e=>{console.log("vj: customtrigger",e),null==y||y(!1),"{{custom.url}}"===e.actualValue?X({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?X({label:e.displayName,selected:!0,value:"custom_text"}):X({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})}})]}))};
|
|
7
|
+
`,x={value:"custom_link",label:"Custom URL"},j={value:"custom_text",label:"Custom text"};exports.Container=h,exports.default=a=>{let{onFocus:g,variable:E,index:O,showVariableModal:_,variableList:T,setShowDiscountCheckBox:y,componentType:A,CTAoptions:f}=a;var N,P;const[C,S]=l.useState(!1),[V,k]=l.useState(""),[L,H]=l.useState([]),[w,B]=l.useState(),[Y,q]=l.useState(!1),[M,R]=l.useState(!1),{device:W,channel:D,isError:I,originalVariableList:$,template:U,templateSelectionTriggered:z,setTemplate:Z,setDisplayContent:F,setOriginalVariableList:G,globalNormalizedPlaceholders:J,enabledCustomText:K,pod:Q}=m.useTemplateModalContext();function X(e,t){var l,a,n;const i=e;k(""),B(i),D===d.CHANNEL_TYPE.WHATSAPP?"custom_text"!==i.value&&"custom_link"!==i.value?(ee(null!==(l=i.value)&&void 0!==l?l:"","string"),null==te||te(null!==(a=E.index)&&void 0!==a?a:0,i.value,!0)):(null==te||te(null!==(n=E.index)&&void 0!==n?n:0,E.variableName,!0,"custom_text"),ee("","url"===i.bikPlaceholderType?"link":"string")):"custom_text"!==i.value&&"custom_link"!==i.value?ee(i.value,"url"===i.bikPlaceholderType?"link":"string"):(k(""),ee("",i.value))}function ee(e,t){var l,a,n,i;const o="custom_link"===t?"link":"custom_text"===t?"string":t;if(D!==d.CHANNEL_TYPE.WHATSAPP){const a=b.getVariableNameForEmailByIndex(O+1),n=null===document||void 0===document?void 0:document.getElementById("mobile"===W?"template_html_mobile":"template_html_desktop"),i=D===d.CHANNEL_TYPE.EMAIL?null===(l=null==n?void 0:n.contentWindow)||void 0===l?void 0:l.document.getElementById(a):document.getElementById(a);i&&(i.textContent="custom_text"!==t&&"custom_link"!==t||e?e:E.variableName);const s=$.map(((t,l)=>l===O?Object.assign(Object.assign({},t),{type:o,updatedValue:e}):t));null==G||G(s)}if(D===d.CHANNEL_TYPE.WHATSAPP){const t=$;let l=t.body,s=t.header,u=t.buttons;"BODY"===A?l=null===(a=t.body)||void 0===a?void 0:a.map(((t,l)=>l===O?Object.assign(Object.assign({},t),{type:o,updatedValue:e}):t)):"HEADER"===A?s=null===(n=t.header)||void 0===n?void 0:n.map(((t,l)=>l===O?Object.assign(Object.assign({},t),{type:o,updatedValue:e}):t)):"BUTTONS"===A&&(u=null===(i=t.buttons)||void 0===i?void 0:i.map(((t,l)=>l===O?Object.assign(Object.assign({},t),{buttonVariable:e,example:[e]}):t))),null==G||G((e=>Object.assign(Object.assign({},e),{header:s,body:l,buttons:u})))}}function te(e,t,l,a){var n,i,o,s;const u=Object.assign({},U),d=null===(n=null==u?void 0:u.components)||void 0===n?void 0:n.map((l=>{var a,n,i,o,s,u,d,r,c,p;const v=Object.assign({},l);if("BODY"===l.type&&"BODY"===A){if(null===(n=null===(a=l.example)||void 0===a?void 0:a.body_text)||void 0===n?void 0:n[0]){const l=[...null!==(s=null===(o=null===(i=v.example)||void 0===i?void 0:i.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({},v.example),{body_text:[l]});return Object.assign(Object.assign({},v),{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=v.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({},v.example),{header_text:l});return Object.assign(Object.assign({},v),{example:a})}}else if("BUTTONS"===l.type&&"BUTTONS"===A&&(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({},v),{buttons:a})}return l}));u.components=d,l&&("BODY"===A&&(null===(i=null==u?void 0:u.mapping)||void 0===i?void 0:i.body)?u.mapping=Object.assign(Object.assign({},u.mapping),{body:u.mapping.body.map(((l,n)=>e===n?"custom_text"===a?`((editableVariable${n+10}))`:t:l))}):"HEADER"===A&&(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,n)=>e===n?"custom_text"===a?`((editableVariable${n+20}))`:t:l))}):"BUTTONS"===A&&(null===(s=null==u?void 0:u.mapping)||void 0===s?void 0:s.buttons)&&(u.mapping=Object.assign(Object.assign({},u.mapping),{buttons:u.mapping.buttons.map(((e,l)=>0===l?"custom_link"===a?"((customPlaceholderName))":t:e))}))),null==Z||Z(Object.assign({},u))}return l.useEffect((()=>{C&&(null==g||g())}),[C]),l.useEffect((()=>{!function(){var e,t,l,a,n;const i="mobile"===W?"template_html_mobile":"template_html_desktop",o=document.getElementById(i),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===(n=null==o?void 0:o.contentWindow)||void 0===n?void 0:n.document.head.innerHTML);D===d.CHANNEL_TYPE.EMAIL&&(null==F||F(s))}()}),[z]),l.useEffect((()=>{var e;const t=[];let l=[];if(D!==d.CHANNEL_TYPE.MESSAGE||K){"link"===(null==E?void 0:E.type)?(t.push({label:"",options:[x,j]}),B(x)):(t.push({label:"",options:[x,j]}),B(j));const e=null!=J?J:[];H([...t,...e.map((e=>{var t,l;return Object.assign(Object.assign({},e),{label:p.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())})}))]),l=[...t,...e]}else{const e=null!=J?J:[];H([{label:"",options:[j,x]},...e]),l=[{label:"",options:[j,x]},...e]}if((D===d.CHANNEL_TYPE.WHATSAPP||D===d.CHANNEL_TYPE.EMAIL||D===d.CHANNEL_TYPE.MESSAGE)&&E.updatedValue)if(u.placeHolderNamePattern.test(E.updatedValue)&&D===d.CHANNEL_TYPE.WHATSAPP||E.updatedValue.startsWith("{{")&&D!==d.CHANNEL_TYPE.WHATSAPP){const e=function(e,t,l){var a;let n={label:"",value:""};const i=l===d.CHANNEL_TYPE.WHATSAPP?e.updatedValue.replace("[[","").replace("]]",""):e.updatedValue.replace("{{","").replace("}}","");if(_){let t=e.updatedValue;if(Q===r.POD.CHATBOT&&"BUTTONS"===A){const l=null==f?void 0:f.filter((t=>t.placeHolder===e.updatedValue));l&&l.length>0&&(t=l[0].label)}n={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())===i.trim()&&(n=e)}))}));return n}(E,l,D);e.value&&B(e)}else(null===(e=E.updatedValue)||void 0===e?void 0:e.startsWith("https"))?(B(x),k(E.updatedValue.split("https://")[1])):(B(j),k(E.updatedValue))}),[]),l.useEffect((()=>{W&&w&&V&&setTimeout((()=>{ee("custom_link"===(null==w?void 0:w.value)&&V?V.includes("https")?V:`https://${V}`:V,w.value)}),100)}),[W]),l.useEffect((()=>{!M&&w&&E.updatedValue&&setTimeout((()=>{ee("custom_link"===(null==w?void 0:w.value)&&E.updatedValue?E.updatedValue.includes("https")?E.updatedValue:`https://${E.updatedValue}`:E.updatedValue,w.value),R(!0)}),100)}),[w]),e.jsxs(h,Object.assign({channel:D,focused:C,onMouseEnter:()=>S(!0),onMouseLeave:()=>S(!1)},{children:[e.jsx("div",Object.assign({style:{marginBottom:8}},{children:e.jsxs(c.BodySecondary,Object.assign({style:{color:I&&!w?v.COLORS.content.negative:v.COLORS.content.primary}},{children:[null===(N=E.variableName)||void 0===N?void 0:N.replace("{{","").replace("}}","")," ","link"===(null==E?void 0:E.type)?"link":"variable"]}))})),e.jsx("div",Object.assign({style:{marginBottom:12}},{children:_?e.jsxs("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:[e.jsx(c.BodyPrimary,{children:s.truncate(null!==(P=null==w?void 0:w.label)&&void 0!==P?P:"",20,!0)}),e.jsx(t.default,{onClick:()=>{q(!Y)},width:24,height:24,color:v.COLORS.content.primary})]})):e.jsx(i.Dropdown,{options:L,isSearchable:!1,onSelect:X,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))&&e.jsx(o.Input,{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}-${O}`,value:V,errorMessage:I?V&&0!==V.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://${V.trim()}`)&&0!==V.trim().length?"custom_link"!==w.value&&V.length>30?"Length cannot be more than 30":"":"Enter valid URL":"Required field":"",maxCharLimit:"custom_link"===(null==w?void 0:w.value)?void 0:30,prefixText:"custom_link"===(null==w?void 0:w.value)?"https://":"",placeholder:"link"===E.type||"custom_link"===w.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{!function(e,t){var l;k(t);const a="custom_link"===(null==w?void 0:w.value)&&t?t.includes("https")?t:`https://${t}`:t;ee(a,e),D===d.CHANNEL_TYPE.WHATSAPP&&(null==te||te(null!==(l=E.index)&&void 0!==l?l:0,a,"custom_link"===e,e))}(w.value,e)}}),Y&&e.jsx(n.AddVariableV2SideModal,{zIndex:2e3,data:null!=T?T:[],showVariable:Y,setShowVariable:q,placeholder:"Add a variable",customTrigger:e=>{null==y||y(!1),"{{custom.url}}"===e.actualValue?X({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?X({label:e.displayName,selected:!0,value:"custom_text"}):X({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})}})]}))};
|
package/dist/cjs/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),a=require("../../dropdown/Dropdown.js"),l=require("../../input/Input.js"),s=require("../../template-preview/constants/regexPatterns.js"),i=require("../../template-preview/models/TemplateMeta.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),a=require("../../dropdown/Dropdown.js"),l=require("../../input/Input.js"),s=require("../../template-preview/constants/regexPatterns.js"),i=require("../../template-preview/models/TemplateMeta.js"),o=require("../../template-preview/models/WhatsAppTemplate.js"),r=require("../../TypographyStyle.js"),n=require("../../../constants/Theme.js"),d=require("../context/templateModalContext.js"),u=require("../utils/validateIsUrl.js"),p=require("./VariableConnector.js");exports.default=c=>{let{button:b,updateSelectedURLTemplateBtn:m,updateSelectedQRBTemplateBtn:v,originalVariableList:j,CTAoptions:x,QRBoptions:y,variableList:O}=c;var g,f,h,T;const[L,U]=t.useState(""),[V,R]=t.useState(),C=t.useCallback((()=>O?[...O,{description:"",displayName:"Custom variables",orderId:1,variables:{"Custom url":{description:void 0,displayName:"Custom url",actualValue:"{{custom.url}}",variableType:"any",isAvailable:!0}}}].sort(((e,t)=>e.orderId-t.orderId)):O),[O]),q=t.useMemo((()=>C()),[C]),{setOriginalVariableList:w,isError:I,disableEditVariable:B,pod:N}=d.useTemplateModalContext();function S(e){U(e);const t=[Object.assign(Object.assign({},j.buttons[0]),{type:o.BUTTON_TYPE.URL,buttonVariable:"((customPlaceholderName))",example:[`https://${e}`]})];null==w||w((e=>Object.assign(Object.assign({},e),{body:[...j.body],buttons:[...t]}))),null==m||m(`https://${e}`,"custom")}return t.useEffect((()=>{var e;if(b.buttonVariable&&s.editableVarPattern.test(b.buttonVariable))R(i.CUSTOM_URL_NAME),U((null===(e=b.example)||void 0===e?void 0:e[0].split("https://")[1])||"");else{let e=-1;const t="URL"===b.type?x:y;e="URL"===b.type?t.findIndex((e=>e.placeHolder===b.buttonVariable)):t.findIndex((e=>e.label===b.flowName)),e>-1&&R(t[e])}}),[]),N!==o.POD.CHATBOT?e.jsxs(p.Container,{children:[e.jsx("div",Object.assign({style:{marginBottom:8}},{children:e.jsxs(r.BodySecondary,Object.assign({style:{color:n.COLORS.content.primary}},{children:[b.text," button"]}))})),e.jsx("div",Object.assign({style:{marginBottom:12}},{children:e.jsx(a.Dropdown,{disabled:B,options:"URL"===b.type?x:y,isSearchable:!1,onSelect:function(e,t){const a=e;R(a);const l=("URL"===b.type?x:y).find((e=>e.placeHolder===a.placeHolder));if(l)if("custom_link"!==l.value){let e;"URL"===b.type?(e=[Object.assign(Object.assign({},j.buttons[0]),{type:"URL",buttonVariable:a.placeHolder,example:["https://bik.ai/"]})],null==m||m({defaultValue:l.value,placeHolder:l.placeHolder},"placeholder")):(e=j.buttons.map(((e,t)=>t===b.index?Object.assign(Object.assign({},e),{type:"QUICK_REPLY",flowName:a.label,flowId:a.value}):e)),null==v||v({flowName:a.label,flowId:a.value},"placeholder",b.index)),null==w||w((t=>Object.assign(Object.assign({},t),{body:[...j.body],buttons:[...e]})))}else S("")},defaultOptions:V?[Object.assign(Object.assign({},V),{selected:!0})]:[]})})),"custom_link"===(null==V?void 0:V.value)&&e.jsx("div",Object.assign({style:{marginBottom:20}},{children:e.jsx(l.Input,{state:B?"disabled":"none",errorMessage:I?L?u.validateIsUrl(L)?"":"Enter valid URL":"Required field":"",value:L,prefixText:"custom_link"===(null==V?void 0:V.value)?"https://":"",placeholder:"Enter custom URL here",onChangeText:S})}))]}):e.jsx(p.default,{index:0,variable:{variableName:null!==(g=b.text)&&void 0!==g?g:"",updatedValue:"((customPlaceholderName))"===b.buttonVariable?`${null===(f=b.example)||void 0===f?void 0:f[0]}`:null!==(h=b.buttonVariable)&&void 0!==h?h:"",type:"link",isEditableVariable:!0,index:null!==(T=b.index)&&void 0!==T?T:0},showVariableModal:!0,componentType:"BUTTONS",variableList:q,CTAoptions:x})};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import{jsxs as e,jsx as
|
|
1
|
+
import{jsxs as e,jsx as t}from"react/jsx-runtime";import l from"../../../assets/icons/edit.svg.js";import{useState as a,useEffect as i}from"react";import n from"styled-components";import{AddVariableV2SideModal as o}from"../../add-variableV2/AddVariableV2SideModal.js";import{Dropdown as s}from"../../dropdown/Dropdown.js";import{Input as u}from"../../input/Input.js";import{truncate as d}from"../../product-picker-v2/collectionScreen.js";import{placeHolderNamePattern as r}from"../../template-preview/constants/regexPatterns.js";import{CHANNEL_TYPE as c}from"../../template-preview/models/Channels.js";import{POD as p}from"../../template-preview/models/WhatsAppTemplate.js";import{BodySecondary as m,BodyPrimary as v}from"../../TypographyStyle.js";import b from"../../../utils/StringUtils.js";import{COLORS as g}from"../../../constants/Theme.js";import{useTemplateModalContext as h}from"../context/templateModalContext.js";import{getVariableNameForEmailByIndex as x}from"../utils/getVariableNameEmail.js";const j=n.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.EMAIL?g.background.warning.light:"transparent"};
|
|
5
5
|
border-radius: 4px;
|
|
6
6
|
padding: 8px 10px;
|
|
7
|
-
`,
|
|
7
|
+
`,O={value:"custom_link",label:"Custom URL"},f={value:"custom_text",label:"Custom text"},_=n=>{let{onFocus:_,variable:y,index:T,showVariableModal:k,variableList:A,setShowDiscountCheckBox:V,componentType:E,CTAoptions:S}=n;var P,w;const[C,B]=a(!1),[L,H]=a(""),[M,N]=a([]),[W,$]=a(),[D,I]=a(!1),[R,U]=a(!1),{device:z,channel:Y,isError:Z,originalVariableList:G,template:q,templateSelectionTriggered:F,setTemplate:J,setDisplayContent:K,setOriginalVariableList:Q,globalNormalizedPlaceholders:X,enabledCustomText:ee,pod:te}=h();function le(e,t){var l,a,i;const n=e;H(""),$(n),Y===c.WHATSAPP?"custom_text"!==n.value&&"custom_link"!==n.value?(ae(null!==(l=n.value)&&void 0!==l?l:"","string"),null==ie||ie(null!==(a=y.index)&&void 0!==a?a:0,n.value,!0)):(null==ie||ie(null!==(i=y.index)&&void 0!==i?i:0,y.variableName,!0,"custom_text"),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 ae(e,t){var l,a,i,n;const o="custom_link"===t?"link":"custom_text"===t?"string":t;if(Y!==c.WHATSAPP){const a=x(T+1),i=null===document||void 0===document?void 0:document.getElementById("mobile"===z?"template_html_mobile":"template_html_desktop"),n=Y===c.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=G.map(((t,l)=>l===T?Object.assign(Object.assign({},t),{type:o,updatedValue:e}):t));null==Q||Q(s)}if(Y===c.WHATSAPP){const t=G;let l=t.body,s=t.header,u=t.buttons;"BODY"===E?l=null===(a=t.body)||void 0===a?void 0:a.map(((t,l)=>l===T?Object.assign(Object.assign({},t),{type:o,updatedValue:e}):t)):"HEADER"===E?s=null===(i=t.header)||void 0===i?void 0:i.map(((t,l)=>l===T?Object.assign(Object.assign({},t),{type:o,updatedValue:e}):t)):"BUTTONS"===E&&(u=null===(n=t.buttons)||void 0===n?void 0:n.map(((t,l)=>l===T?Object.assign(Object.assign({},t),{buttonVariable:e,example:[e]}):t))),null==Q||Q((e=>Object.assign(Object.assign({},e),{header:s,body:l,buttons:u})))}}function ie(e,t,l,a){var i,n,o,s;const u=Object.assign({},q),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"===E){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"===E){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"===E&&(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})}return l}));u.components=d,l&&("BODY"===E&&(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))}):"HEADER"===E&&(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))}):"BUTTONS"===E&&(null===(s=null==u?void 0:u.mapping)||void 0===s?void 0:s.buttons)&&(u.mapping=Object.assign(Object.assign({},u.mapping),{buttons:u.mapping.buttons.map(((e,l)=>0===l?"custom_link"===a?"((customPlaceholderName))":t:e))}))),null==J||J(Object.assign({},u))}return i((()=>{C&&(null==_||_())}),[C]),i((()=>{!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);Y===c.EMAIL&&(null==K||K(s))}()}),[F]),i((()=>{var e;const t=[];let l=[];if(Y!==c.MESSAGE||ee){"link"===(null==y?void 0:y.type)?(t.push({label:"",options:[O,f]}),$(O)):(t.push({label:"",options:[O,f]}),$(f));const e=null!=X?X:[];N([...t,...e.map((e=>{var t,l;return Object.assign(Object.assign({},e),{label:b.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())})}))]),l=[...t,...e]}else{const e=null!=X?X:[];N([{label:"",options:[f,O]},...e]),l=[{label:"",options:[f,O]},...e]}if((Y===c.WHATSAPP||Y===c.EMAIL||Y===c.MESSAGE)&&y.updatedValue)if(r.test(y.updatedValue)&&Y===c.WHATSAPP||y.updatedValue.startsWith("{{")&&Y!==c.WHATSAPP){const e=function(e,t,l){var a;let i={label:"",value:""};const n=l===c.WHATSAPP?e.updatedValue.replace("[[","").replace("]]",""):e.updatedValue.replace("{{","").replace("}}","");if(k){let t=e.updatedValue;if(te===p.CHATBOT&&"BUTTONS"===E){const l=null==S?void 0:S.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,l,Y);e.value&&$(e)}else(null===(e=y.updatedValue)||void 0===e?void 0:e.startsWith("https"))?($(O),H(y.updatedValue.split("https://")[1])):($(f),H(y.updatedValue))}),[]),i((()=>{z&&W&&L&&setTimeout((()=>{ae("custom_link"===(null==W?void 0:W.value)&&L?L.includes("https")?L:`https://${L}`:L,W.value)}),100)}),[z]),i((()=>{!R&&W&&y.updatedValue&&setTimeout((()=>{ae("custom_link"===(null==W?void 0:W.value)&&y.updatedValue?y.updatedValue.includes("https")?y.updatedValue:`https://${y.updatedValue}`:y.updatedValue,W.value),U(!0)}),100)}),[W]),e(j,Object.assign({channel:Y,focused:C,onMouseEnter:()=>B(!0),onMouseLeave:()=>B(!1)},{children:[t("div",Object.assign({style:{marginBottom:8}},{children:e(m,Object.assign({style:{color:Z&&!W?g.content.negative:g.content.primary}},{children:[null===(P=y.variableName)||void 0===P?void 0:P.replace("{{","").replace("}}","")," ","link"===(null==y?void 0:y.type)?"link":"variable"]}))})),t("div",Object.assign({style:{marginBottom:12}},{children:k?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(v,{children:d(null!==(w=null==W?void 0:W.label)&&void 0!==w?w:"",20,!0)}),t(l,{onClick:()=>{I(!D)},width:24,height:24,color:g.content.primary})]})):t(s,{options:M,isSearchable:!1,onSelect:le,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(u,{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}-${T}`,value:L,errorMessage:Z?L&&0!==L.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://${L.trim()}`)&&0!==L.trim().length?"custom_link"!==W.value&&L.length>30?"Length cannot be more than 30":"":"Enter valid URL":"Required field":"",maxCharLimit:"custom_link"===(null==W?void 0:W.value)?void 0:30,prefixText:"custom_link"===(null==W?void 0:W.value)?"https://":"",placeholder:"link"===y.type||"custom_link"===W.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{!function(e,t){var l;H(t);const a="custom_link"===(null==W?void 0:W.value)&&t?t.includes("https")?t:`https://${t}`:t;ae(a,e),Y===c.WHATSAPP&&(null==ie||ie(null!==(l=y.index)&&void 0!==l?l:0,a,"custom_link"===e,e))}(W.value,e)}}),D&&t(o,{zIndex:2e3,data:null!=A?A:[],showVariable:D,setShowVariable:I,placeholder:"Add a variable",customTrigger:e=>{null==V||V(!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"}):le({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})}})]}))};export{j as Container,_ as default};
|
package/dist/esm/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as l,
|
|
1
|
+
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as l,useCallback as a,useMemo as o,useEffect as i}from"react";import{Dropdown as s}from"../../dropdown/Dropdown.js";import{Input as n}from"../../input/Input.js";import{editableVarPattern as r}from"../../template-preview/constants/regexPatterns.js";import{CUSTOM_URL_NAME as d}from"../../template-preview/models/TemplateMeta.js";import{POD as p,BUTTON_TYPE as m}from"../../template-preview/models/WhatsAppTemplate.js";import{BodySecondary as c}from"../../TypographyStyle.js";import{COLORS as u}from"../../../constants/Theme.js";import{useTemplateModalContext as b}from"../context/templateModalContext.js";import{validateIsUrl as v}from"../utils/validateIsUrl.js";import f,{Container as j}from"./VariableConnector.js";const y=y=>{let{button:g,updateSelectedURLTemplateBtn:h,updateSelectedQRBTemplateBtn:x,originalVariableList:O,CTAoptions:T,QRBoptions:V,variableList:L}=y;var R,U,w,C;const[I,B]=l(""),[N,H]=l(),E=a((()=>L?[...L,{description:"",displayName:"Custom variables",orderId:1,variables:{"Custom url":{description:void 0,displayName:"Custom url",actualValue:"{{custom.url}}",variableType:"any",isAvailable:!0}}}].sort(((e,t)=>e.orderId-t.orderId)):L),[L]),S=o((()=>E()),[E]),{setOriginalVariableList:k,isError:A,disableEditVariable:M,pod:P}=b();function _(e){B(e);const t=[Object.assign(Object.assign({},O.buttons[0]),{type:m.URL,buttonVariable:"((customPlaceholderName))",example:[`https://${e}`]})];null==k||k((e=>Object.assign(Object.assign({},e),{body:[...O.body],buttons:[...t]}))),null==h||h(`https://${e}`,"custom")}return i((()=>{var e;if(g.buttonVariable&&r.test(g.buttonVariable))H(d),B((null===(e=g.example)||void 0===e?void 0:e[0].split("https://")[1])||"");else{let e=-1;const t="URL"===g.type?T:V;e="URL"===g.type?t.findIndex((e=>e.placeHolder===g.buttonVariable)):t.findIndex((e=>e.label===g.flowName)),e>-1&&H(t[e])}}),[]),P!==p.CHATBOT?e(j,{children:[t("div",Object.assign({style:{marginBottom:8}},{children:e(c,Object.assign({style:{color:u.content.primary}},{children:[g.text," button"]}))})),t("div",Object.assign({style:{marginBottom:12}},{children:t(s,{disabled:M,options:"URL"===g.type?T:V,isSearchable:!1,onSelect:function(e,t){const l=e;H(l);const a=("URL"===g.type?T:V).find((e=>e.placeHolder===l.placeHolder));if(a)if("custom_link"!==a.value){let e;"URL"===g.type?(e=[Object.assign(Object.assign({},O.buttons[0]),{type:"URL",buttonVariable:l.placeHolder,example:["https://bik.ai/"]})],null==h||h({defaultValue:a.value,placeHolder:a.placeHolder},"placeholder")):(e=O.buttons.map(((e,t)=>t===g.index?Object.assign(Object.assign({},e),{type:"QUICK_REPLY",flowName:l.label,flowId:l.value}):e)),null==x||x({flowName:l.label,flowId:l.value},"placeholder",g.index)),null==k||k((t=>Object.assign(Object.assign({},t),{body:[...O.body],buttons:[...e]})))}else _("")},defaultOptions:N?[Object.assign(Object.assign({},N),{selected:!0})]:[]})})),"custom_link"===(null==N?void 0:N.value)&&t("div",Object.assign({style:{marginBottom:20}},{children:t(n,{state:M?"disabled":"none",errorMessage:A?I?v(I)?"":"Enter valid URL":"Required field":"",value:I,prefixText:"custom_link"===(null==N?void 0:N.value)?"https://":"",placeholder:"Enter custom URL here",onChangeText:_})}))]}):t(f,{index:0,variable:{variableName:null!==(R=g.text)&&void 0!==R?R:"",updatedValue:"((customPlaceholderName))"===g.buttonVariable?`${null===(U=g.example)||void 0===U?void 0:U[0]}`:null!==(w=g.buttonVariable)&&void 0!==w?w:"",type:"link",isEditableVariable:!0,index:null!==(C=g.index)&&void 0!==C?C:0},showVariableModal:!0,componentType:"BUTTONS",variableList:S,CTAoptions:T})};export{y as default};
|