@bikdotai/bik-component-library 0.0.447-beta.1 → 0.0.447-beta.2
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/EditWhatsAppTemplateV2.js +1 -1
- package/dist/esm/components/bik-layout/MockMenus.d.ts +1 -0
- package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("lodash"),n=require("react"),o=require("../../template-preview/models/WhatsAppTemplate.js"),i=require("../context/templateModalContext.js"),s=require("../custom-hooks/useAdditionalVariables.js"),l=require("../utils/getDataFromTemplateComponent.js"),a=require("./BackTrackComponent.js"),d=require("./DiscountCodeComponent.js"),r=require("./EditMediaV2.style.js"),u=require("./EditWhatsAppTemplateMediaV2.js"),c=require("./VariableConnector.js"),p=require("./VariableConnectorsPanel.js"),m=require("./VariableConnectorWhatsApp.js"),v=require("./VariableEditorHeader.js"),b=require("./WhatsAppTemplateCardButtonV2.js");exports.default=g=>{let{template:j,onTemplateChange:f,whatsappSpecificPickerMeta:C,showVariableModal:O,variableList:h,variableListForImage:x,discountCode:T,setDiscountCode:y}=g;var V,B,E,L,U,k,q,I,w,D,R,A,P,S;const N=j.isCarouselType,{originalVariableList:M,pod:_,extras:Q,selectedCarouselIndex:H,isProductCarouselType:Y}=i.useTemplateModalContext(),{descriptionComponents:F,urlBtns:K,qrbBtns:W,imageComponent:$,bodyVariables:X,headerVariables:z}=l.getAllDataFromTemplateComponent(j),[G,J]=n.useState(!1),[Z,ee]=n.useState(-1===H?{descriptionComponents:F,urlBtns:K,qrbBtns:W,imageComponent:$,bodyVariables:X,headerVariables:z}:{}),[te,ne]=n.useState(!1);function oe(e,n,o){var i,s,l,a,d,r,u,c,p,m;const v=null!=H&&H>-1?{components:null===(i=Object.assign({},j).components[1].cards)||void 0===i?void 0:i[H].components,mapping:null===(s=Object.assign({},j).mapping.cards)||void 0===s?void 0:s[H]}:Object.assign({},j),b="custom"===n&&"string"==typeof e,g=b?e:"string"!=typeof e?e.defaultValue:"";if(null!=H&&H>-1&&Y){const n=Object.assign({},j).components.map((e=>{var t;return"CAROUSEL"===e.type?Object.assign(Object.assign({},e),{cards:null===(t=e.cards)||void 0===t?void 0:t.map((e=>Object.assign(Object.assign({},e),{components:e.components.map((e=>{var t,n,i;if("BUTTONS"===e.type){const s=null===(t=e.buttons)||void 0===t?void 0:t.filter((e=>"URL"===e.type));let l=null!==(n=null==s?void 0:s[o])&&void 0!==n?n:{};l=Object.assign(Object.assign({},l),{url:"https://d.bik.ai/{{1}}",example:[g]});const a=null===(i=e.buttons)||void 0===i?void 0:i.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==l?void 0:l.text)?l:e));return Object.assign(Object.assign({},e),{buttons:a})}return e}))})))}):e})),i=null===(a=null===(l=Object.assign({},j).mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a.map((t=>{var n;return Object.assign(Object.assign({},t),{buttons:null===(n=null==t?void 0:t.buttons)||void 0===n?void 0:n.map((t=>b?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:""))})})),s=t.cloneDeep(j);return s.components=n,s.mapping.cards=i,void(null==f||f(Object.assign({},s)))}const C=null==v?void 0:v.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==C&&C>-1){const t=null===(d=null==v?void 0:v.components[C].buttons)||void 0===d?void 0:d.filter((e=>"URL"===e.type));if((null==t?void 0:t.length)>0){const i="custom"===n&&"string"==typeof e,s=i?e:"string"!=typeof e?e.defaultValue:"";let l=t[o];l=Object.assign(Object.assign({},l),{url:"https://d.bik.ai/{{1}}",example:[s]});const a=[...null!==(c=null===(u=null===(r=v.components)||void 0===r?void 0:r[C])||void 0===u?void 0:u.buttons)&&void 0!==c?c:[]].map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==l?void 0:l.text)?l:e)),d=Object.assign(Object.assign({},v.components[C]),{buttons:a}),m=null===(p=v.mapping)||void 0===p?void 0:p.buttons;m&&m.length>0&&(m[o]=i?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"");const b=Object.assign(Object.assign({},v.mapping),{buttons:m});v.mapping=b;const g=[...v.components];g[C]=d,v.components=g}}if("string"!=typeof e){"checkout.checkoutUrl"===(null===(m=e.placeHolder)||void 0===m?void 0:m.slice(2,-2))?J(!0):(J(!1),null==y||y(""))}if(null!=H&&H>-1){const e=t.cloneDeep(j);e.components[1].cards[H].components=v.components,e.mapping.cards[H]=v.mapping,null==f||f(Object.assign({},e))}else null==f||f(v)}function ie(e,n,o){var i,s,l,a,d,r;const u=null!=H&&H>-1?{components:null===(i=Object.assign({},j).components[1].cards)||void 0===i?void 0:i[H].components,mapping:null===(s=Object.assign({},j).mapping.cards)||void 0===s?void 0:s[H]}:Object.assign({},j);if(null!=H&&H>-1&&Y){const n=Object.assign({},j).components.map((t=>{var n;return"CAROUSEL"===t.type?Object.assign(Object.assign({},t),{cards:null===(n=t.cards)||void 0===n?void 0:n.map((t=>Object.assign(Object.assign({},t),{components:t.components.map((t=>{var n,i,s;if("BUTTONS"===t.type){const l=null===(n=t.buttons)||void 0===n?void 0:n.filter((e=>"QUICK_REPLY"===e.type));let a=null!==(i=null==l?void 0:l[o])&&void 0!==i?i:{};a=Object.assign(Object.assign({},a),{flowId:e.flowId,flowName:e.flowName});const d=null===(s=t.buttons)||void 0===s?void 0:s.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e));return Object.assign(Object.assign({},t),{buttons:d})}return t}))})))}):t})),i=t.cloneDeep(j);return i.components=n,void(null==f||f(Object.assign({},i)))}const c=null==u?void 0:u.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==c&&c>-1){const t=null===(l=null==u?void 0:u.components[c].buttons)||void 0===l?void 0:l.filter((e=>"QUICK_REPLY"===e.type));if(t){let n=t[o];n=Object.assign(Object.assign({},n),{flowId:e.flowId,flowName:e.flowName});const i=[...null!==(r=null===(d=null===(a=u.components)||void 0===a?void 0:a[c])||void 0===d?void 0:d.buttons)&&void 0!==r?r:[]].map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==n?void 0:n.text)?n:e)),s=Object.assign(Object.assign({},u.components[c]),{buttons:i}),l=[...u.components];l[c]=s,u.components=l}}if(null!=H&&H>-1){const e=t.cloneDeep(j);e.components[1].cards[H].components=u.components,null==f||f(Object.assign({},e))}else null==f||f(u)}n.useEffect((()=>{var e,t;if(null===(e=j.mapping.buttons)||void 0===e?void 0:e.find((e=>"checkout.checkoutUrl"===e.slice(2,-2))))J(!0);else{J(!1);const e=null===(t=null==Q?void 0:Q.discountCodeExtra)||void 0===t?void 0:t[1];null==e||e("")}}),[j]),n.useEffect((()=>{var e,t,n,o;if(null!=H&&H>-1){const i={components:null===(t=null===(e=j.components[1])||void 0===e?void 0:e.cards)||void 0===t?void 0:t[H].components,mapping:null===(o=null===(n=null==j?void 0:j.mapping)||void 0===n?void 0:n.cards)||void 0===o?void 0:o[H]},{descriptionComponents:s,urlBtns:a,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:c}=l.getAllDataFromTemplateComponent(i);ee({descriptionComponents:s,urlBtns:a,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:c})}else if(null!=H&&-1===H){const{descriptionComponents:e,urlBtns:t,qrbBtns:n,imageComponent:o,bodyVariables:i,headerVariables:s}=l.getAllDataFromTemplateComponent(j);ee({descriptionComponents:e,urlBtns:t,qrbBtns:n,imageComponent:o,bodyVariables:i,headerVariables:s})}}),[H]),n.useEffect((()=>{var e,t,n,o;if(null!=H&&H>-1&&te){const i={components:null===(t=null===(e=j.components[1])||void 0===e?void 0:e.cards)||void 0===t?void 0:t[H].components,mapping:null===(o=null===(n=null==j?void 0:j.mapping)||void 0===n?void 0:n.cards)||void 0===o?void 0:o[H]},{descriptionComponents:s,urlBtns:a,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:c}=l.getAllDataFromTemplateComponent(i);ee({descriptionComponents:s,urlBtns:a,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:c}),ne(!1)}}),[te]);const se=s.useAdditionalVariables({variableList:h,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom Text",variableValue:"{{custom.text}}"});return e.jsxs(p.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:[!!Z.imageComponent&&!Y&&e.jsx(r.EditTemplateMediaContainer,{children:e.jsx(u.default,{whatsappSpecificPickerMeta:C,mediaComponent:N?Z.imageComponent:$,updateTemplateImageUrl:function(e,n){var o,i,s,l,a;let d;d=null!=H&&H>-1?{components:null===(i=null===(o=j.components[1])||void 0===o?void 0:o.cards)||void 0===i?void 0:i[H].components,mapping:null===(l=null===(s=null==j?void 0:j.mapping)||void 0===s?void 0:s.cards)||void 0===l?void 0:l[H]}:Object.assign({},j);const r=null===(a=null==d?void 0:d.components)||void 0===a?void 0:a.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==r&&r>-1&&(null==d?void 0:d.components[r])){const t=Object.assign(Object.assign({},d.components[r]),{format:n,example:{header_handle:[e]}}),o=[...d.components];o[r]=t,d=Object.assign(Object.assign({},d),{components:o})}if(d.mapping&&(d.mapping=Object.assign(Object.assign({},d.mapping),{header:void 0})),null!=H&&H>-1){const e=t.cloneDeep(j);e.components[1].cards[H].components=d.components,e.mapping.cards[H]=d.mapping,null==f||f(Object.assign({},e)),ne(!0)}else null==f||f(Object.assign({},d))},template:j,variableListForImage:x})}),(Z.bodyVariables.length>0||Z.headerVariables.length>0)&&e.jsx(v.default,{containerStyle:{paddingTop:Z.mediaComponent?24: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===(V=Z.descriptionComponents)||void 0===V?void 0:V.map(((t,n)=>e.jsx(m.default,{originalVariableList:null!=H&&H>-1?M.cards[H]:M,type:t.type,descriptionComponent:t.component,showVariableModal:O,variableList:h},n))),(null===(E=null===(B=null!=H&&H>-1?M.cards[H].buttons:null==M?void 0:M.buttons)||void 0===B?void 0:B.filter((e=>"URL"===e.type)))||void 0===E?void 0:E.length)>0&&e.jsx(v.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(U=null===(L=null!=H&&H>-1?M.cards[H].buttons:null==M?void 0:M.buttons)||void 0===L?void 0:L.filter((e=>"URL"===e.type)))||void 0===U?void 0:U.map(((t,n)=>{if("URL"===t.type)return e.jsx(b.default,{variableListIndex:n,CTAoptions:null==C?void 0:C.CTAoptions,button:t,currentVariableList:null!=H&&H>-1?Object.assign({},M.cards[H]):Object.assign({},M),updateSelectedURLTemplateBtn:oe,variableList:h},`${n}_${H}`)})),(null===(q=null===(k=null!=H&&H>-1?M.cards[H].buttons:null==M?void 0:M.buttons)||void 0===k?void 0:k.filter((e=>"QUICK_REPLY"===e.type)))||void 0===q?void 0:q.length)>0&&(_!==o.POD.CHATBOT?e.jsx(v.default,{headerText:"Edit buttons",subText:"Edit the chatflows triggered on clicking the buttons",toolTipInfo:"There is an option to trigger chatflows through the buttons which can keep the user engaged"}):e.jsx(a.BackTrackComponent,{backTrackMessage:null===(I=null==Q?void 0:Q.backTrackExtra)||void 0===I?void 0:I[0],setBackTrackMessage:null===(w=null==Q?void 0:Q.backTrackExtra)||void 0===w?void 0:w[1]})),null===(R=null===(D=null!=H&&H>-1?M.cards[H].buttons:null==M?void 0:M.buttons)||void 0===D?void 0:D.filter((e=>"QUICK_REPLY"===e.type)))||void 0===R?void 0:R.map(((t,n)=>{if("QUICK_REPLY"===t.type)return e.jsx(b.default,{variableListIndex:n,QRBoptions:null==C?void 0:C.QRBoptions,button:t,currentVariableList:null!=H&&H>-1?Object.assign({},M.cards[H]):Object.assign({},M),updateSelectedQRBTemplateBtn:ie},`${n}_${H}`)})),_===o.POD.CHATBOT&&G&&e.jsx(d.DiscountCodeComponent,{discountCode:null===(A=null==Q?void 0:Q.discountCodeExtra)||void 0===A?void 0:A[0],setDiscountCode:null===(P=null==Q?void 0:Q.discountCodeExtra)||void 0===P?void 0:P[1],variableList:h}),null===(S=null!=H&&H>-1?M.cards[H].buttons:null==M?void 0:M.buttons)||void 0===S?void 0:S.map(((t,n)=>{var o,i,s;if("COPY_CODE"===t.type)return e.jsx(c.default,{index:n,variable:{variableName:null!==(o=t.text)&&void 0!==o?o:"Copy Code",updatedValue:null!==(i=t.buttonVariable)&&void 0!==i?i:"",type:"string",isEditableVariable:!0,index:null!==(s=t.index)&&void 0!==s?s:0},showVariableModal:!0,variableList:se,componentType:"BUTTONS"},n)}))]}))};
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("lodash"),n=require("react"),o=require("../../template-preview/models/WhatsAppTemplate.js"),i=require("../context/templateModalContext.js"),s=require("../custom-hooks/useAdditionalVariables.js"),l=require("../utils/getDataFromTemplateComponent.js"),a=require("./BackTrackComponent.js"),d=require("./DiscountCodeComponent.js"),r=require("./EditMediaV2.style.js"),u=require("./EditWhatsAppTemplateMediaV2.js"),c=require("./VariableConnector.js"),p=require("./VariableConnectorsPanel.js"),m=require("./VariableConnectorWhatsApp.js"),v=require("./VariableEditorHeader.js"),b=require("./WhatsAppTemplateCardButtonV2.js");exports.default=g=>{let{template:j,onTemplateChange:f,whatsappSpecificPickerMeta:C,showVariableModal:O,variableList:h,variableListForImage:x,discountCode:T,setDiscountCode:y}=g;var V,B,E,L,U,k,q,D,I,w,R,A,P,S;const N=j.isCarouselType,{originalVariableList:M,pod:_,extras:Q,selectedCarouselIndex:H,isProductCarouselType:Y}=i.useTemplateModalContext(),{descriptionComponents:F,urlBtns:K,qrbBtns:W,imageComponent:$,bodyVariables:X,headerVariables:z}=l.getAllDataFromTemplateComponent(j),[G,J]=n.useState(!1),[Z,ee]=n.useState(-1===H?{descriptionComponents:F,urlBtns:K,qrbBtns:W,imageComponent:$,bodyVariables:X,headerVariables:z}:{}),[te,ne]=n.useState(!1);function oe(e,n,o){var i,s,l,a,d,r,u,c,p,m;const v=null!=H&&H>-1?{components:null===(i=Object.assign({},j).components[1].cards)||void 0===i?void 0:i[H].components,mapping:null===(s=Object.assign({},j).mapping.cards)||void 0===s?void 0:s[H]}:Object.assign({},j),b=t.cloneDeep(v),g="custom"===n&&"string"==typeof e,C=g?e:"string"!=typeof e?e.defaultValue:"";if(null!=H&&H>-1&&Y){const n=Object.assign({},j).components.map((e=>{var t;return"CAROUSEL"===e.type?Object.assign(Object.assign({},e),{cards:null===(t=e.cards)||void 0===t?void 0:t.map((e=>Object.assign(Object.assign({},e),{components:e.components.map((e=>{var t,n,i;if("BUTTONS"===e.type){const s=null===(t=e.buttons)||void 0===t?void 0:t.filter((e=>"URL"===e.type));let l=null!==(n=null==s?void 0:s[o])&&void 0!==n?n:{};l=Object.assign(Object.assign({},l),{url:"https://d.bik.ai/{{1}}",example:[C]});const a=null===(i=e.buttons)||void 0===i?void 0:i.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==l?void 0:l.text)?l:e));return Object.assign(Object.assign({},e),{buttons:a})}return e}))})))}):e})),i=null===(a=null===(l=Object.assign({},j).mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a.map((t=>{var n;return Object.assign(Object.assign({},t),{buttons:null===(n=null==t?void 0:t.buttons)||void 0===n?void 0:n.map((t=>g?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:""))})})),s=t.cloneDeep(j);return s.components=n,s.mapping.cards=i,void(null==f||f(Object.assign({},s)))}const O=null==b?void 0:b.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==O&&O>-1){const t=null===(d=null==b?void 0:b.components[O].buttons)||void 0===d?void 0:d.filter((e=>"URL"===e.type));if((null==t?void 0:t.length)>0){const i="custom"===n&&"string"==typeof e,s=i?e:"string"!=typeof e?e.defaultValue:"";let l=t[o];l=Object.assign(Object.assign({},l),{url:"https://d.bik.ai/{{1}}",example:[s]});const a=[...null!==(c=null===(u=null===(r=b.components)||void 0===r?void 0:r[O])||void 0===u?void 0:u.buttons)&&void 0!==c?c:[]].map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==l?void 0:l.text)?l:e)),d=Object.assign(Object.assign({},b.components[O]),{buttons:a}),m=null===(p=b.mapping)||void 0===p?void 0:p.buttons;m&&m.length>0&&(m[o]=i?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"");const v=Object.assign(Object.assign({},b.mapping),{buttons:m});b.mapping=v;const g=[...b.components];g[O]=d,b.components=g}}if("string"!=typeof e){"checkout.checkoutUrl"===(null===(m=e.placeHolder)||void 0===m?void 0:m.slice(2,-2))?J(!0):(J(!1),null==y||y(""))}if(null!=H&&H>-1){const e=t.cloneDeep(j);e.components[1].cards[H].components=b.components,e.mapping.cards[H]=b.mapping,null==f||f(Object.assign({},e))}else null==f||f(b)}function ie(e,n,o){var i,s,l,a,d,r;const u=null!=H&&H>-1?{components:null===(i=Object.assign({},j).components[1].cards)||void 0===i?void 0:i[H].components,mapping:null===(s=Object.assign({},j).mapping.cards)||void 0===s?void 0:s[H]}:Object.assign({},j);if(null!=H&&H>-1&&Y){const n=Object.assign({},j).components.map((t=>{var n;return"CAROUSEL"===t.type?Object.assign(Object.assign({},t),{cards:null===(n=t.cards)||void 0===n?void 0:n.map((t=>Object.assign(Object.assign({},t),{components:t.components.map((t=>{var n,i,s;if("BUTTONS"===t.type){const l=null===(n=t.buttons)||void 0===n?void 0:n.filter((e=>"QUICK_REPLY"===e.type));let a=null!==(i=null==l?void 0:l[o])&&void 0!==i?i:{};a=Object.assign(Object.assign({},a),{flowId:e.flowId,flowName:e.flowName});const d=null===(s=t.buttons)||void 0===s?void 0:s.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e));return Object.assign(Object.assign({},t),{buttons:d})}return t}))})))}):t})),i=t.cloneDeep(j);return i.components=n,void(null==f||f(Object.assign({},i)))}const c=null==u?void 0:u.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==c&&c>-1){const t=null===(l=null==u?void 0:u.components[c].buttons)||void 0===l?void 0:l.filter((e=>"QUICK_REPLY"===e.type));if(t){let n=t[o];n=Object.assign(Object.assign({},n),{flowId:e.flowId,flowName:e.flowName});const i=[...null!==(r=null===(d=null===(a=u.components)||void 0===a?void 0:a[c])||void 0===d?void 0:d.buttons)&&void 0!==r?r:[]].map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==n?void 0:n.text)?n:e)),s=Object.assign(Object.assign({},u.components[c]),{buttons:i}),l=[...u.components];l[c]=s,u.components=l}}if(null!=H&&H>-1){const e=t.cloneDeep(j);e.components[1].cards[H].components=u.components,null==f||f(Object.assign({},e))}else null==f||f(u)}n.useEffect((()=>{var e,t;if(null===(e=j.mapping.buttons)||void 0===e?void 0:e.find((e=>"checkout.checkoutUrl"===e.slice(2,-2))))J(!0);else{J(!1);const e=null===(t=null==Q?void 0:Q.discountCodeExtra)||void 0===t?void 0:t[1];null==e||e("")}}),[j]),n.useEffect((()=>{var e,t,n,o;if(null!=H&&H>-1){const i={components:null===(t=null===(e=j.components[1])||void 0===e?void 0:e.cards)||void 0===t?void 0:t[H].components,mapping:null===(o=null===(n=null==j?void 0:j.mapping)||void 0===n?void 0:n.cards)||void 0===o?void 0:o[H]},{descriptionComponents:s,urlBtns:a,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:c}=l.getAllDataFromTemplateComponent(i);ee({descriptionComponents:s,urlBtns:a,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:c})}else if(null!=H&&-1===H){const{descriptionComponents:e,urlBtns:t,qrbBtns:n,imageComponent:o,bodyVariables:i,headerVariables:s}=l.getAllDataFromTemplateComponent(j);ee({descriptionComponents:e,urlBtns:t,qrbBtns:n,imageComponent:o,bodyVariables:i,headerVariables:s})}}),[H]),n.useEffect((()=>{var e,t,n,o;if(null!=H&&H>-1&&te){const i={components:null===(t=null===(e=j.components[1])||void 0===e?void 0:e.cards)||void 0===t?void 0:t[H].components,mapping:null===(o=null===(n=null==j?void 0:j.mapping)||void 0===n?void 0:n.cards)||void 0===o?void 0:o[H]},{descriptionComponents:s,urlBtns:a,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:c}=l.getAllDataFromTemplateComponent(i);ee({descriptionComponents:s,urlBtns:a,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:c}),ne(!1)}}),[te]);const se=s.useAdditionalVariables({variableList:h,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom Text",variableValue:"{{custom.text}}"});return e.jsxs(p.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:[!!Z.imageComponent&&!Y&&e.jsx(r.EditTemplateMediaContainer,{children:e.jsx(u.default,{whatsappSpecificPickerMeta:C,mediaComponent:N?Z.imageComponent:$,updateTemplateImageUrl:function(e,n){var o,i,s,l,a;let d;d=null!=H&&H>-1?{components:null===(i=null===(o=j.components[1])||void 0===o?void 0:o.cards)||void 0===i?void 0:i[H].components,mapping:null===(l=null===(s=null==j?void 0:j.mapping)||void 0===s?void 0:s.cards)||void 0===l?void 0:l[H]}:Object.assign({},j);const r=null===(a=null==d?void 0:d.components)||void 0===a?void 0:a.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==r&&r>-1&&(null==d?void 0:d.components[r])){const t=Object.assign(Object.assign({},d.components[r]),{format:n,example:{header_handle:[e]}}),o=[...d.components];o[r]=t,d=Object.assign(Object.assign({},d),{components:o})}if(d.mapping&&(d.mapping=Object.assign(Object.assign({},d.mapping),{header:void 0})),null!=H&&H>-1){const e=t.cloneDeep(j);e.components[1].cards[H].components=d.components,e.mapping.cards[H]=d.mapping,null==f||f(Object.assign({},e)),ne(!0)}else null==f||f(Object.assign({},d))},template:j,variableListForImage:x})}),(Z.bodyVariables.length>0||Z.headerVariables.length>0)&&e.jsx(v.default,{containerStyle:{paddingTop:Z.mediaComponent?24: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===(V=Z.descriptionComponents)||void 0===V?void 0:V.map(((t,n)=>e.jsx(m.default,{originalVariableList:null!=H&&H>-1?M.cards[H]:M,type:t.type,descriptionComponent:t.component,showVariableModal:O,variableList:h},n))),(null===(E=null===(B=null!=H&&H>-1?M.cards[H].buttons:null==M?void 0:M.buttons)||void 0===B?void 0:B.filter((e=>"URL"===e.type)))||void 0===E?void 0:E.length)>0&&e.jsx(v.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(U=null===(L=null!=H&&H>-1?M.cards[H].buttons:null==M?void 0:M.buttons)||void 0===L?void 0:L.filter((e=>"URL"===e.type)))||void 0===U?void 0:U.map(((t,n)=>{if("URL"===t.type)return e.jsx(b.default,{variableListIndex:n,CTAoptions:null==C?void 0:C.CTAoptions,button:t,currentVariableList:null!=H&&H>-1?Object.assign({},M.cards[H]):Object.assign({},M),updateSelectedURLTemplateBtn:oe,variableList:h},`${n}_${H}`)})),(null===(q=null===(k=null!=H&&H>-1?M.cards[H].buttons:null==M?void 0:M.buttons)||void 0===k?void 0:k.filter((e=>"QUICK_REPLY"===e.type)))||void 0===q?void 0:q.length)>0&&(_!==o.POD.CHATBOT?e.jsx(v.default,{headerText:"Edit buttons",subText:"Edit the chatflows triggered on clicking the buttons",toolTipInfo:"There is an option to trigger chatflows through the buttons which can keep the user engaged"}):e.jsx(a.BackTrackComponent,{backTrackMessage:null===(D=null==Q?void 0:Q.backTrackExtra)||void 0===D?void 0:D[0],setBackTrackMessage:null===(I=null==Q?void 0:Q.backTrackExtra)||void 0===I?void 0:I[1]})),null===(R=null===(w=null!=H&&H>-1?M.cards[H].buttons:null==M?void 0:M.buttons)||void 0===w?void 0:w.filter((e=>"QUICK_REPLY"===e.type)))||void 0===R?void 0:R.map(((t,n)=>{if("QUICK_REPLY"===t.type)return e.jsx(b.default,{variableListIndex:n,QRBoptions:null==C?void 0:C.QRBoptions,button:t,currentVariableList:null!=H&&H>-1?Object.assign({},M.cards[H]):Object.assign({},M),updateSelectedQRBTemplateBtn:ie},`${n}_${H}`)})),_===o.POD.CHATBOT&&G&&e.jsx(d.DiscountCodeComponent,{discountCode:null===(A=null==Q?void 0:Q.discountCodeExtra)||void 0===A?void 0:A[0],setDiscountCode:null===(P=null==Q?void 0:Q.discountCodeExtra)||void 0===P?void 0:P[1],variableList:h}),null===(S=null!=H&&H>-1?M.cards[H].buttons:null==M?void 0:M.buttons)||void 0===S?void 0:S.map(((t,n)=>{var o,i,s;if("COPY_CODE"===t.type)return e.jsx(c.default,{index:n,variable:{variableName:null!==(o=t.text)&&void 0!==o?o:"Copy Code",updatedValue:null!==(i=t.buttonVariable)&&void 0!==i?i:"",type:"string",isEditableVariable:!0,index:null!==(s=t.index)&&void 0!==s?s:0},showVariableModal:!0,variableList:se,componentType:"BUTTONS"},n)}))]}))};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as n,jsx as o}from"react/jsx-runtime";import{cloneDeep as t}from"lodash";import{useState as e,useEffect as i}from"react";import{POD as s}from"../../template-preview/models/WhatsAppTemplate.js";import{useTemplateModalContext as l}from"../context/templateModalContext.js";import{useAdditionalVariables as a}from"../custom-hooks/useAdditionalVariables.js";import{getAllDataFromTemplateComponent as d}from"../utils/getDataFromTemplateComponent.js";import{BackTrackComponent as r}from"./BackTrackComponent.js";import{DiscountCodeComponent as p}from"./DiscountCodeComponent.js";import{EditTemplateMediaContainer as c}from"./EditMediaV2.style.js";import u from"./EditWhatsAppTemplateMediaV2.js";import m from"./VariableConnector.js";import{Container as v}from"./VariableConnectorsPanel.js";import b from"./VariableConnectorWhatsApp.js";import g from"./VariableEditorHeader.js";import f from"./WhatsAppTemplateCardButtonV2.js";const h=h=>{let{template:j,onTemplateChange:O,whatsappSpecificPickerMeta:C,showVariableModal:y,variableList:T,variableListForImage:x,discountCode:V,setDiscountCode:B}=h;var L,E,U,k,I,w,R,N,P,A,S,_,M,Q;const D=j.isCarouselType,{originalVariableList:q,pod:H,extras:Y,selectedCarouselIndex:K,isProductCarouselType:W}=l(),{descriptionComponents:$,urlBtns:F,qrbBtns:X,imageComponent:z,bodyVariables:G,headerVariables:J}=d(j),[Z,nn]=e(!1),[on,tn]=e(-1===K?{descriptionComponents:$,urlBtns:F,qrbBtns:X,imageComponent:z,bodyVariables:G,headerVariables:J}:{}),[en,sn]=e(!1);function ln(n,o,e){var i,s,l,a,d,r,p,c,u,m;const v=null!=K&&K>-1?{components:null===(i=Object.assign({},j).components[1].cards)||void 0===i?void 0:i[K].components,mapping:null===(s=Object.assign({},j).mapping.cards)||void 0===s?void 0:s[K]}:Object.assign({},j),b="custom"===o&&"string"==typeof n,g=b?n:"string"!=typeof n?n.defaultValue:"";if(null!=K&&K>-1&&W){const o=Object.assign({},j).components.map((n=>{var o;return"CAROUSEL"===n.type?Object.assign(Object.assign({},n),{cards:null===(o=n.cards)||void 0===o?void 0:o.map((n=>Object.assign(Object.assign({},n),{components:n.components.map((n=>{var o,t,i;if("BUTTONS"===n.type){const s=null===(o=n.buttons)||void 0===o?void 0:o.filter((n=>"URL"===n.type));let l=null!==(t=null==s?void 0:s[e])&&void 0!==t?t:{};l=Object.assign(Object.assign({},l),{url:"https://d.bik.ai/{{1}}",example:[g]});const a=null===(i=n.buttons)||void 0===i?void 0:i.map((n=>"URL"===n.type&&(null==n?void 0:n.text)===(null==l?void 0:l.text)?l:n));return Object.assign(Object.assign({},n),{buttons:a})}return n}))})))}):n})),i=null===(a=null===(l=Object.assign({},j).mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a.map((o=>{var t;return Object.assign(Object.assign({},o),{buttons:null===(t=null==o?void 0:o.buttons)||void 0===t?void 0:t.map((o=>b?"((customBtnPlaceholder))":"string"!=typeof n?n.placeHolder:""))})})),s=t(j);return s.components=o,s.mapping.cards=i,void(null==O||O(Object.assign({},s)))}const f=null==v?void 0:v.components.findIndex((n=>"BUTTONS"===n.type));if(void 0!==f&&f>-1){const t=null===(d=null==v?void 0:v.components[f].buttons)||void 0===d?void 0:d.filter((n=>"URL"===n.type));if((null==t?void 0:t.length)>0){const i="custom"===o&&"string"==typeof n,s=i?n:"string"!=typeof n?n.defaultValue:"";let l=t[e];l=Object.assign(Object.assign({},l),{url:"https://d.bik.ai/{{1}}",example:[s]});const a=[...null!==(c=null===(p=null===(r=v.components)||void 0===r?void 0:r[f])||void 0===p?void 0:p.buttons)&&void 0!==c?c:[]].map((n=>"URL"===n.type&&(null==n?void 0:n.text)===(null==l?void 0:l.text)?l:n)),d=Object.assign(Object.assign({},v.components[f]),{buttons:a}),m=null===(u=v.mapping)||void 0===u?void 0:u.buttons;m&&m.length>0&&(m[e]=i?"((customBtnPlaceholder))":"string"!=typeof n?n.placeHolder:"");const b=Object.assign(Object.assign({},v.mapping),{buttons:m});v.mapping=b;const g=[...v.components];g[f]=d,v.components=g}}if("string"!=typeof n){"checkout.checkoutUrl"===(null===(m=n.placeHolder)||void 0===m?void 0:m.slice(2,-2))?nn(!0):(nn(!1),null==B||B(""))}if(null!=K&&K>-1){const n=t(j);n.components[1].cards[K].components=v.components,n.mapping.cards[K]=v.mapping,null==O||O(Object.assign({},n))}else null==O||O(v)}function an(n,o,e){var i,s,l,a,d,r;const p=null!=K&&K>-1?{components:null===(i=Object.assign({},j).components[1].cards)||void 0===i?void 0:i[K].components,mapping:null===(s=Object.assign({},j).mapping.cards)||void 0===s?void 0:s[K]}:Object.assign({},j);if(null!=K&&K>-1&&W){const o=Object.assign({},j).components.map((o=>{var t;return"CAROUSEL"===o.type?Object.assign(Object.assign({},o),{cards:null===(t=o.cards)||void 0===t?void 0:t.map((o=>Object.assign(Object.assign({},o),{components:o.components.map((o=>{var t,i,s;if("BUTTONS"===o.type){const l=null===(t=o.buttons)||void 0===t?void 0:t.filter((n=>"QUICK_REPLY"===n.type));let a=null!==(i=null==l?void 0:l[e])&&void 0!==i?i:{};a=Object.assign(Object.assign({},a),{flowId:n.flowId,flowName:n.flowName});const d=null===(s=o.buttons)||void 0===s?void 0:s.map((n=>"QUICK_REPLY"===n.type&&(null==n?void 0:n.text)===(null==a?void 0:a.text)?a:n));return Object.assign(Object.assign({},o),{buttons:d})}return o}))})))}):o})),i=t(j);return i.components=o,void(null==O||O(Object.assign({},i)))}const c=null==p?void 0:p.components.findIndex((n=>"BUTTONS"===n.type));if(void 0!==c&&c>-1){const o=null===(l=null==p?void 0:p.components[c].buttons)||void 0===l?void 0:l.filter((n=>"QUICK_REPLY"===n.type));if(o){let t=o[e];t=Object.assign(Object.assign({},t),{flowId:n.flowId,flowName:n.flowName});const i=[...null!==(r=null===(d=null===(a=p.components)||void 0===a?void 0:a[c])||void 0===d?void 0:d.buttons)&&void 0!==r?r:[]].map((n=>"QUICK_REPLY"===n.type&&(null==n?void 0:n.text)===(null==t?void 0:t.text)?t:n)),s=Object.assign(Object.assign({},p.components[c]),{buttons:i}),l=[...p.components];l[c]=s,p.components=l}}if(null!=K&&K>-1){const n=t(j);n.components[1].cards[K].components=p.components,null==O||O(Object.assign({},n))}else null==O||O(p)}i((()=>{var n,o;if(null===(n=j.mapping.buttons)||void 0===n?void 0:n.find((n=>"checkout.checkoutUrl"===n.slice(2,-2))))nn(!0);else{nn(!1);const n=null===(o=null==Y?void 0:Y.discountCodeExtra)||void 0===o?void 0:o[1];null==n||n("")}}),[j]),i((()=>{var n,o,t,e;if(null!=K&&K>-1){const i={components:null===(o=null===(n=j.components[1])||void 0===n?void 0:n.cards)||void 0===o?void 0:o[K].components,mapping:null===(e=null===(t=null==j?void 0:j.mapping)||void 0===t?void 0:t.cards)||void 0===e?void 0:e[K]},{descriptionComponents:s,urlBtns:l,qrbBtns:a,imageComponent:r,bodyVariables:p,headerVariables:c}=d(i);tn({descriptionComponents:s,urlBtns:l,qrbBtns:a,imageComponent:r,bodyVariables:p,headerVariables:c})}else if(null!=K&&-1===K){const{descriptionComponents:n,urlBtns:o,qrbBtns:t,imageComponent:e,bodyVariables:i,headerVariables:s}=d(j);tn({descriptionComponents:n,urlBtns:o,qrbBtns:t,imageComponent:e,bodyVariables:i,headerVariables:s})}}),[K]),i((()=>{var n,o,t,e;if(null!=K&&K>-1&&en){const i={components:null===(o=null===(n=j.components[1])||void 0===n?void 0:n.cards)||void 0===o?void 0:o[K].components,mapping:null===(e=null===(t=null==j?void 0:j.mapping)||void 0===t?void 0:t.cards)||void 0===e?void 0:e[K]},{descriptionComponents:s,urlBtns:l,qrbBtns:a,imageComponent:r,bodyVariables:p,headerVariables:c}=d(i);tn({descriptionComponents:s,urlBtns:l,qrbBtns:a,imageComponent:r,bodyVariables:p,headerVariables:c}),sn(!1)}}),[en]);const dn=a({variableList:T,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom Text",variableValue:"{{custom.text}}"});return n(v,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:[!!on.imageComponent&&!W&&o(c,{children:o(u,{whatsappSpecificPickerMeta:C,mediaComponent:D?on.imageComponent:z,updateTemplateImageUrl:function(n,o){var e,i,s,l,a;let d;d=null!=K&&K>-1?{components:null===(i=null===(e=j.components[1])||void 0===e?void 0:e.cards)||void 0===i?void 0:i[K].components,mapping:null===(l=null===(s=null==j?void 0:j.mapping)||void 0===s?void 0:s.cards)||void 0===l?void 0:l[K]}:Object.assign({},j);const r=null===(a=null==d?void 0:d.components)||void 0===a?void 0:a.findIndex((n=>{if("HEADER"===n.type&&"NONE"!==n.format&&"TEXT"!==n.format)return!0}));if(void 0!==r&&r>-1&&(null==d?void 0:d.components[r])){const t=Object.assign(Object.assign({},d.components[r]),{format:o,example:{header_handle:[n]}}),e=[...d.components];e[r]=t,d=Object.assign(Object.assign({},d),{components:e})}if(d.mapping&&(d.mapping=Object.assign(Object.assign({},d.mapping),{header:void 0})),null!=K&&K>-1){const n=t(j);n.components[1].cards[K].components=d.components,n.mapping.cards[K]=d.mapping,null==O||O(Object.assign({},n)),sn(!0)}else null==O||O(Object.assign({},d))},template:j,variableListForImage:x})}),(on.bodyVariables.length>0||on.headerVariables.length>0)&&o(g,{containerStyle:{paddingTop:on.mediaComponent?24: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===(L=on.descriptionComponents)||void 0===L?void 0:L.map(((n,t)=>o(b,{originalVariableList:null!=K&&K>-1?q.cards[K]:q,type:n.type,descriptionComponent:n.component,showVariableModal:y,variableList:T},t))),(null===(U=null===(E=null!=K&&K>-1?q.cards[K].buttons:null==q?void 0:q.buttons)||void 0===E?void 0:E.filter((n=>"URL"===n.type)))||void 0===U?void 0:U.length)>0&&o(g,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(I=null===(k=null!=K&&K>-1?q.cards[K].buttons:null==q?void 0:q.buttons)||void 0===k?void 0:k.filter((n=>"URL"===n.type)))||void 0===I?void 0:I.map(((n,t)=>{if("URL"===n.type)return o(f,{variableListIndex:t,CTAoptions:null==C?void 0:C.CTAoptions,button:n,currentVariableList:null!=K&&K>-1?Object.assign({},q.cards[K]):Object.assign({},q),updateSelectedURLTemplateBtn:ln,variableList:T},`${t}_${K}`)})),(null===(R=null===(w=null!=K&&K>-1?q.cards[K].buttons:null==q?void 0:q.buttons)||void 0===w?void 0:w.filter((n=>"QUICK_REPLY"===n.type)))||void 0===R?void 0:R.length)>0&&(H!==s.CHATBOT?o(g,{headerText:"Edit buttons",subText:"Edit the chatflows triggered on clicking the buttons",toolTipInfo:"There is an option to trigger chatflows through the buttons which can keep the user engaged"}):o(r,{backTrackMessage:null===(N=null==Y?void 0:Y.backTrackExtra)||void 0===N?void 0:N[0],setBackTrackMessage:null===(P=null==Y?void 0:Y.backTrackExtra)||void 0===P?void 0:P[1]})),null===(S=null===(A=null!=K&&K>-1?q.cards[K].buttons:null==q?void 0:q.buttons)||void 0===A?void 0:A.filter((n=>"QUICK_REPLY"===n.type)))||void 0===S?void 0:S.map(((n,t)=>{if("QUICK_REPLY"===n.type)return o(f,{variableListIndex:t,QRBoptions:null==C?void 0:C.QRBoptions,button:n,currentVariableList:null!=K&&K>-1?Object.assign({},q.cards[K]):Object.assign({},q),updateSelectedQRBTemplateBtn:an},`${t}_${K}`)})),H===s.CHATBOT&&Z&&o(p,{discountCode:null===(_=null==Y?void 0:Y.discountCodeExtra)||void 0===_?void 0:_[0],setDiscountCode:null===(M=null==Y?void 0:Y.discountCodeExtra)||void 0===M?void 0:M[1],variableList:T}),null===(Q=null!=K&&K>-1?q.cards[K].buttons:null==q?void 0:q.buttons)||void 0===Q?void 0:Q.map(((n,t)=>{var e,i,s;if("COPY_CODE"===n.type)return o(m,{index:t,variable:{variableName:null!==(e=n.text)&&void 0!==e?e:"Copy Code",updatedValue:null!==(i=n.buttonVariable)&&void 0!==i?i:"",type:"string",isEditableVariable:!0,index:null!==(s=n.index)&&void 0!==s?s:0},showVariableModal:!0,variableList:dn,componentType:"BUTTONS"},t)}))]}))};export{h as default};
|
|
1
|
+
import{jsxs as n,jsx as o}from"react/jsx-runtime";import{cloneDeep as t}from"lodash";import{useState as e,useEffect as i}from"react";import{POD as s}from"../../template-preview/models/WhatsAppTemplate.js";import{useTemplateModalContext as l}from"../context/templateModalContext.js";import{useAdditionalVariables as a}from"../custom-hooks/useAdditionalVariables.js";import{getAllDataFromTemplateComponent as d}from"../utils/getDataFromTemplateComponent.js";import{BackTrackComponent as r}from"./BackTrackComponent.js";import{DiscountCodeComponent as p}from"./DiscountCodeComponent.js";import{EditTemplateMediaContainer as c}from"./EditMediaV2.style.js";import u from"./EditWhatsAppTemplateMediaV2.js";import m from"./VariableConnector.js";import{Container as v}from"./VariableConnectorsPanel.js";import b from"./VariableConnectorWhatsApp.js";import g from"./VariableEditorHeader.js";import f from"./WhatsAppTemplateCardButtonV2.js";const h=h=>{let{template:j,onTemplateChange:O,whatsappSpecificPickerMeta:C,showVariableModal:y,variableList:T,variableListForImage:x,discountCode:V,setDiscountCode:B}=h;var L,E,U,k,I,w,R,N,P,A,S,_,M,Q;const D=j.isCarouselType,{originalVariableList:q,pod:H,extras:Y,selectedCarouselIndex:K,isProductCarouselType:W}=l(),{descriptionComponents:$,urlBtns:F,qrbBtns:X,imageComponent:z,bodyVariables:G,headerVariables:J}=d(j),[Z,nn]=e(!1),[on,tn]=e(-1===K?{descriptionComponents:$,urlBtns:F,qrbBtns:X,imageComponent:z,bodyVariables:G,headerVariables:J}:{}),[en,sn]=e(!1);function ln(n,o,e){var i,s,l,a,d,r,p,c,u,m;const v=null!=K&&K>-1?{components:null===(i=Object.assign({},j).components[1].cards)||void 0===i?void 0:i[K].components,mapping:null===(s=Object.assign({},j).mapping.cards)||void 0===s?void 0:s[K]}:Object.assign({},j),b=t(v),g="custom"===o&&"string"==typeof n,f=g?n:"string"!=typeof n?n.defaultValue:"";if(null!=K&&K>-1&&W){const o=Object.assign({},j).components.map((n=>{var o;return"CAROUSEL"===n.type?Object.assign(Object.assign({},n),{cards:null===(o=n.cards)||void 0===o?void 0:o.map((n=>Object.assign(Object.assign({},n),{components:n.components.map((n=>{var o,t,i;if("BUTTONS"===n.type){const s=null===(o=n.buttons)||void 0===o?void 0:o.filter((n=>"URL"===n.type));let l=null!==(t=null==s?void 0:s[e])&&void 0!==t?t:{};l=Object.assign(Object.assign({},l),{url:"https://d.bik.ai/{{1}}",example:[f]});const a=null===(i=n.buttons)||void 0===i?void 0:i.map((n=>"URL"===n.type&&(null==n?void 0:n.text)===(null==l?void 0:l.text)?l:n));return Object.assign(Object.assign({},n),{buttons:a})}return n}))})))}):n})),i=null===(a=null===(l=Object.assign({},j).mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a.map((o=>{var t;return Object.assign(Object.assign({},o),{buttons:null===(t=null==o?void 0:o.buttons)||void 0===t?void 0:t.map((o=>g?"((customBtnPlaceholder))":"string"!=typeof n?n.placeHolder:""))})})),s=t(j);return s.components=o,s.mapping.cards=i,void(null==O||O(Object.assign({},s)))}const h=null==b?void 0:b.components.findIndex((n=>"BUTTONS"===n.type));if(void 0!==h&&h>-1){const t=null===(d=null==b?void 0:b.components[h].buttons)||void 0===d?void 0:d.filter((n=>"URL"===n.type));if((null==t?void 0:t.length)>0){const i="custom"===o&&"string"==typeof n,s=i?n:"string"!=typeof n?n.defaultValue:"";let l=t[e];l=Object.assign(Object.assign({},l),{url:"https://d.bik.ai/{{1}}",example:[s]});const a=[...null!==(c=null===(p=null===(r=b.components)||void 0===r?void 0:r[h])||void 0===p?void 0:p.buttons)&&void 0!==c?c:[]].map((n=>"URL"===n.type&&(null==n?void 0:n.text)===(null==l?void 0:l.text)?l:n)),d=Object.assign(Object.assign({},b.components[h]),{buttons:a}),m=null===(u=b.mapping)||void 0===u?void 0:u.buttons;m&&m.length>0&&(m[e]=i?"((customBtnPlaceholder))":"string"!=typeof n?n.placeHolder:"");const v=Object.assign(Object.assign({},b.mapping),{buttons:m});b.mapping=v;const g=[...b.components];g[h]=d,b.components=g}}if("string"!=typeof n){"checkout.checkoutUrl"===(null===(m=n.placeHolder)||void 0===m?void 0:m.slice(2,-2))?nn(!0):(nn(!1),null==B||B(""))}if(null!=K&&K>-1){const n=t(j);n.components[1].cards[K].components=b.components,n.mapping.cards[K]=b.mapping,null==O||O(Object.assign({},n))}else null==O||O(b)}function an(n,o,e){var i,s,l,a,d,r;const p=null!=K&&K>-1?{components:null===(i=Object.assign({},j).components[1].cards)||void 0===i?void 0:i[K].components,mapping:null===(s=Object.assign({},j).mapping.cards)||void 0===s?void 0:s[K]}:Object.assign({},j);if(null!=K&&K>-1&&W){const o=Object.assign({},j).components.map((o=>{var t;return"CAROUSEL"===o.type?Object.assign(Object.assign({},o),{cards:null===(t=o.cards)||void 0===t?void 0:t.map((o=>Object.assign(Object.assign({},o),{components:o.components.map((o=>{var t,i,s;if("BUTTONS"===o.type){const l=null===(t=o.buttons)||void 0===t?void 0:t.filter((n=>"QUICK_REPLY"===n.type));let a=null!==(i=null==l?void 0:l[e])&&void 0!==i?i:{};a=Object.assign(Object.assign({},a),{flowId:n.flowId,flowName:n.flowName});const d=null===(s=o.buttons)||void 0===s?void 0:s.map((n=>"QUICK_REPLY"===n.type&&(null==n?void 0:n.text)===(null==a?void 0:a.text)?a:n));return Object.assign(Object.assign({},o),{buttons:d})}return o}))})))}):o})),i=t(j);return i.components=o,void(null==O||O(Object.assign({},i)))}const c=null==p?void 0:p.components.findIndex((n=>"BUTTONS"===n.type));if(void 0!==c&&c>-1){const o=null===(l=null==p?void 0:p.components[c].buttons)||void 0===l?void 0:l.filter((n=>"QUICK_REPLY"===n.type));if(o){let t=o[e];t=Object.assign(Object.assign({},t),{flowId:n.flowId,flowName:n.flowName});const i=[...null!==(r=null===(d=null===(a=p.components)||void 0===a?void 0:a[c])||void 0===d?void 0:d.buttons)&&void 0!==r?r:[]].map((n=>"QUICK_REPLY"===n.type&&(null==n?void 0:n.text)===(null==t?void 0:t.text)?t:n)),s=Object.assign(Object.assign({},p.components[c]),{buttons:i}),l=[...p.components];l[c]=s,p.components=l}}if(null!=K&&K>-1){const n=t(j);n.components[1].cards[K].components=p.components,null==O||O(Object.assign({},n))}else null==O||O(p)}i((()=>{var n,o;if(null===(n=j.mapping.buttons)||void 0===n?void 0:n.find((n=>"checkout.checkoutUrl"===n.slice(2,-2))))nn(!0);else{nn(!1);const n=null===(o=null==Y?void 0:Y.discountCodeExtra)||void 0===o?void 0:o[1];null==n||n("")}}),[j]),i((()=>{var n,o,t,e;if(null!=K&&K>-1){const i={components:null===(o=null===(n=j.components[1])||void 0===n?void 0:n.cards)||void 0===o?void 0:o[K].components,mapping:null===(e=null===(t=null==j?void 0:j.mapping)||void 0===t?void 0:t.cards)||void 0===e?void 0:e[K]},{descriptionComponents:s,urlBtns:l,qrbBtns:a,imageComponent:r,bodyVariables:p,headerVariables:c}=d(i);tn({descriptionComponents:s,urlBtns:l,qrbBtns:a,imageComponent:r,bodyVariables:p,headerVariables:c})}else if(null!=K&&-1===K){const{descriptionComponents:n,urlBtns:o,qrbBtns:t,imageComponent:e,bodyVariables:i,headerVariables:s}=d(j);tn({descriptionComponents:n,urlBtns:o,qrbBtns:t,imageComponent:e,bodyVariables:i,headerVariables:s})}}),[K]),i((()=>{var n,o,t,e;if(null!=K&&K>-1&&en){const i={components:null===(o=null===(n=j.components[1])||void 0===n?void 0:n.cards)||void 0===o?void 0:o[K].components,mapping:null===(e=null===(t=null==j?void 0:j.mapping)||void 0===t?void 0:t.cards)||void 0===e?void 0:e[K]},{descriptionComponents:s,urlBtns:l,qrbBtns:a,imageComponent:r,bodyVariables:p,headerVariables:c}=d(i);tn({descriptionComponents:s,urlBtns:l,qrbBtns:a,imageComponent:r,bodyVariables:p,headerVariables:c}),sn(!1)}}),[en]);const dn=a({variableList:T,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom Text",variableValue:"{{custom.text}}"});return n(v,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:[!!on.imageComponent&&!W&&o(c,{children:o(u,{whatsappSpecificPickerMeta:C,mediaComponent:D?on.imageComponent:z,updateTemplateImageUrl:function(n,o){var e,i,s,l,a;let d;d=null!=K&&K>-1?{components:null===(i=null===(e=j.components[1])||void 0===e?void 0:e.cards)||void 0===i?void 0:i[K].components,mapping:null===(l=null===(s=null==j?void 0:j.mapping)||void 0===s?void 0:s.cards)||void 0===l?void 0:l[K]}:Object.assign({},j);const r=null===(a=null==d?void 0:d.components)||void 0===a?void 0:a.findIndex((n=>{if("HEADER"===n.type&&"NONE"!==n.format&&"TEXT"!==n.format)return!0}));if(void 0!==r&&r>-1&&(null==d?void 0:d.components[r])){const t=Object.assign(Object.assign({},d.components[r]),{format:o,example:{header_handle:[n]}}),e=[...d.components];e[r]=t,d=Object.assign(Object.assign({},d),{components:e})}if(d.mapping&&(d.mapping=Object.assign(Object.assign({},d.mapping),{header:void 0})),null!=K&&K>-1){const n=t(j);n.components[1].cards[K].components=d.components,n.mapping.cards[K]=d.mapping,null==O||O(Object.assign({},n)),sn(!0)}else null==O||O(Object.assign({},d))},template:j,variableListForImage:x})}),(on.bodyVariables.length>0||on.headerVariables.length>0)&&o(g,{containerStyle:{paddingTop:on.mediaComponent?24: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===(L=on.descriptionComponents)||void 0===L?void 0:L.map(((n,t)=>o(b,{originalVariableList:null!=K&&K>-1?q.cards[K]:q,type:n.type,descriptionComponent:n.component,showVariableModal:y,variableList:T},t))),(null===(U=null===(E=null!=K&&K>-1?q.cards[K].buttons:null==q?void 0:q.buttons)||void 0===E?void 0:E.filter((n=>"URL"===n.type)))||void 0===U?void 0:U.length)>0&&o(g,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(I=null===(k=null!=K&&K>-1?q.cards[K].buttons:null==q?void 0:q.buttons)||void 0===k?void 0:k.filter((n=>"URL"===n.type)))||void 0===I?void 0:I.map(((n,t)=>{if("URL"===n.type)return o(f,{variableListIndex:t,CTAoptions:null==C?void 0:C.CTAoptions,button:n,currentVariableList:null!=K&&K>-1?Object.assign({},q.cards[K]):Object.assign({},q),updateSelectedURLTemplateBtn:ln,variableList:T},`${t}_${K}`)})),(null===(R=null===(w=null!=K&&K>-1?q.cards[K].buttons:null==q?void 0:q.buttons)||void 0===w?void 0:w.filter((n=>"QUICK_REPLY"===n.type)))||void 0===R?void 0:R.length)>0&&(H!==s.CHATBOT?o(g,{headerText:"Edit buttons",subText:"Edit the chatflows triggered on clicking the buttons",toolTipInfo:"There is an option to trigger chatflows through the buttons which can keep the user engaged"}):o(r,{backTrackMessage:null===(N=null==Y?void 0:Y.backTrackExtra)||void 0===N?void 0:N[0],setBackTrackMessage:null===(P=null==Y?void 0:Y.backTrackExtra)||void 0===P?void 0:P[1]})),null===(S=null===(A=null!=K&&K>-1?q.cards[K].buttons:null==q?void 0:q.buttons)||void 0===A?void 0:A.filter((n=>"QUICK_REPLY"===n.type)))||void 0===S?void 0:S.map(((n,t)=>{if("QUICK_REPLY"===n.type)return o(f,{variableListIndex:t,QRBoptions:null==C?void 0:C.QRBoptions,button:n,currentVariableList:null!=K&&K>-1?Object.assign({},q.cards[K]):Object.assign({},q),updateSelectedQRBTemplateBtn:an},`${t}_${K}`)})),H===s.CHATBOT&&Z&&o(p,{discountCode:null===(_=null==Y?void 0:Y.discountCodeExtra)||void 0===_?void 0:_[0],setDiscountCode:null===(M=null==Y?void 0:Y.discountCodeExtra)||void 0===M?void 0:M[1],variableList:T}),null===(Q=null!=K&&K>-1?q.cards[K].buttons:null==q?void 0:q.buttons)||void 0===Q?void 0:Q.map(((n,t)=>{var e,i,s;if("COPY_CODE"===n.type)return o(m,{index:t,variable:{variableName:null!==(e=n.text)&&void 0!==e?e:"Copy Code",updatedValue:null!==(i=n.buttonVariable)&&void 0!==i?i:"",type:"string",isEditableVariable:!0,index:null!==(s=n.index)&&void 0!==s?s:0},showVariableModal:!0,variableList:dn,componentType:"BUTTONS"},t)}))]}))};export{h as default};
|