@bikdotai/bik-component-library 0.0.569-beta.2 → 0.0.569
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/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts +2 -2
- package/dist/cjs/components/bik-layout/MockMenus.d.ts +0 -1
- package/dist/cjs/components/template-context-mapper/TemplateContextMapper.js +1 -1
- package/dist/cjs/components/template-context-mapper/modalElements/DesktopPreview.js +1 -1
- package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js +1 -1
- package/dist/cjs/components/template-context-mapper/modalElements/MobilePreview.js +3 -3
- package/dist/cjs/components/template-preview/EmailTemplateThumbnailPreview.d.ts +0 -1
- package/dist/cjs/components/template-preview/EmailTemplateThumbnailPreview.js +1 -1
- package/dist/cjs/components/template-preview/TemplatePreview.d.ts +1 -2
- package/dist/cjs/components/template-preview/TemplatePreview.js +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts +2 -2
- package/dist/esm/components/bik-layout/MockMenus.d.ts +0 -1
- package/dist/esm/components/template-context-mapper/TemplateContextMapper.js +1 -1
- package/dist/esm/components/template-context-mapper/modalElements/DesktopPreview.js +2 -2
- package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js +1 -1
- package/dist/esm/components/template-context-mapper/modalElements/MobilePreview.js +3 -3
- package/dist/esm/components/template-preview/EmailTemplateThumbnailPreview.d.ts +0 -1
- package/dist/esm/components/template-preview/EmailTemplateThumbnailPreview.js +1 -1
- package/dist/esm/components/template-preview/TemplatePreview.d.ts +1 -2
- package/dist/esm/components/template-preview/TemplatePreview.js +1 -1
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const EventsTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default EventsTrigger;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const IGTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default IGTrigger;
|
package/dist/cjs/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
package/dist/cjs/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { DropdownOption } from "../../../dropdown/type";
|
|
3
|
-
import { QueryBuilderProperty } from "../../
|
|
4
|
-
import { QueryBuilderNodeProps } from "../../
|
|
3
|
+
import { QueryBuilderProperty } from "../../types/QueryBuilder.type";
|
|
4
|
+
import { QueryBuilderNodeProps } from "../../types/QueryBuilderNodeProps.type";
|
|
5
5
|
declare const BaseTriggerQueryBuilderNode: React.FC<QueryBuilderNodeProps & {
|
|
6
6
|
cacheKey: string;
|
|
7
7
|
propertyAddBtnText: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("lodash"),l=require("react"),o=require("../../utils/StringUtils.js"),a=require("../../constants/Theme.js"),r=require("../modals/styledModal.js"),s=require("../template-preview/models/Channels.js"),i=require("../template-preview/models/WhatsAppTemplate.js"),n=require("./context/templateModalContext.js"),d=require("./modalElements/Footer.js"),u=require("./modalElements/TemplateSelectModalContent.js"),c=require("./utils/convertPlaceholdersToBikDropdown.js");exports.TemplateContextMapper=p=>{let{selectedTemplate:v,closeDialog:m,showVariableMapping:h,channel:C,htmlContent:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("lodash"),l=require("react"),o=require("../../utils/StringUtils.js"),a=require("../../constants/Theme.js"),r=require("../modals/styledModal.js"),s=require("../template-preview/models/Channels.js"),i=require("../template-preview/models/WhatsAppTemplate.js"),n=require("./context/templateModalContext.js"),d=require("./modalElements/Footer.js"),u=require("./modalElements/TemplateSelectModalContent.js"),c=require("./utils/convertPlaceholdersToBikDropdown.js");exports.TemplateContextMapper=p=>{let{selectedTemplate:v,closeDialog:m,showVariableMapping:h,channel:C,htmlContent:S,templateVariables:b,onTemplateSelect:E,globalPlaceholders:x,showOnlyContent:P,whatsappSpecificPickerMeta:f,zIndex:g,showVariableModal:T,variableList:L,discountCode:I,setDiscountCode:j,onBackPress:y,enabledCustomText:w,variableListForImage:M,showSampleValues:V,disableEditVariable:A,pod:D,extras:k,pickerConf:H,selectedCarouselProducts:N,disableEditExpiry:O,cardWidth:q,onDeleteSelectedProducts:B,fileName:F,setFileName:_,hideDeviceContainerInPreview:W,maxCharLimit:R,onDefaultVariableSelect:Y}=p;var z,$,U,G,J,K,Q,X;l.useEffect((()=>{se(S)}),[S]);const Z=C===s.CHANNEL_TYPE.WHATSAPP&&"CAROUSEL"===(null===($=null===(z=null==v?void 0:v.components)||void 0===z?void 0:z[1])||void 0===$?void 0:$.type),ee=null==v?void 0:v.isProductCarouselType,[te,le]=l.useState(C===s.CHANNEL_TYPE.EMAIL||Z?"desktop":"mobile"),[oe,ae]=l.useState(!1),[re,se]=l.useState(S),[ie,ne]=l.useState(!1),[de,ue]=l.useState([]),[ce,pe]=l.useState({}),[ve,me]=l.useState(v),[he,Ce]=l.useState([]),[Se,be]=l.useState(null),[Ee,xe]=l.useState(!1),[Pe,fe]=l.useState(null!=b?b:[]),[ge,Te]=l.useState(!1),[Le,Ie]=l.useState(Z?(null===(G=null===(U=null==ve?void 0:ve.mapping)||void 0===U?void 0:U.body)||void 0===G?void 0:G.length)?-1:0:-1),[je,ye]=l.useState([]),[we,Me]=l.useState(void 0),Ve=l.useRef(null),[Ae,De]=l.useState(!1),[ke,He]=l.useState(!1),[Ne,Oe]=l.useState(!1),[qe,Be]=l.useState({});l.useEffect((()=>{N?ye(N):ee&&ye([])}),[N]),l.useEffect((()=>{var e;if(!Ee&&ee&&(!N||0===ye.length)){const t=null===(e=null==ve?void 0:ve.components)||void 0===e?void 0:e[1].cards,l=[];null==t||t.forEach((e=>{var t;null===(t=null==e?void 0:e.components)||void 0===t||t.forEach((e=>{var t,o,a;"HEADER"===e.type&&l.push(null!==(a=null===(o=null===(t=e.example)||void 0===t?void 0:t.header_handle)||void 0===o?void 0:o[0])&&void 0!==a?a:"")}))})),Ce(l),xe(!0)}}),[Ee]);const Fe=l.useMemo((()=>c.convertPlaceholdersToBikDropdown(x)),[x]);return l.useEffect((()=>{Me(t.cloneDeep(L))}),[L]),e.jsx(n.TemplateModalContext.Provider,Object.assign({value:{hideFooterButton:Ne,setHideFooterButton:Oe,hideCrossButton:ke,setHideCrossButton:He,variableList:we,setVariableList:Me,variableCallback:Se,setVariableCallback:be,showVariablePicker:oe,setShowVariablePicker:ae,template:ve,setTemplate:me,device:te,setDevice:le,display_content:re,setDisplayContent:se,originalVariableList:Pe,setOriginalVariableList:fe,isError:ie,setIsError:ne,channel:C,globalNormalizedPlaceholders:Fe,templateSelectionTriggered:ge,setTemplateSelectionTriggered:Te,enabledCustomText:w,disableEditVariable:A,pod:D,extras:k,isWhatsappCarousel:Z,selectedCarouselIndex:Le,setSelectedCarouselIndex:Ie,isProductCarouselType:ee,templateErrorIndexes:ce,cardCount:Z?null===(K=null===(J=v.components)||void 0===J?void 0:J[1].cards)||void 0===K?void 0:K.length:void 0,errorIndexes:de,setErrorIndexes:ue,pickerConf:H,carouselProducts:je,setCarouselProducts:ye,disableEditExpiry:O,cardWidth:q,cardImages:he,onDeleteSelectedProducts:B,hideDeviceContainerInPreview:W,sliderRef:Ve,isCarouselHovered:Ae,setIsCarouselHovered:De,maxCharLimit:R,ctaOptionsErrors:qe,setCtaOptionsErrors:Be,onDefaultVariableSelect:Y}},{children:P?e.jsx(u.default,{variableListFromProps:L,channel:s.CHANNEL_TYPE.EMAIL,hideHeader:!0}):e.jsxs(r.StyledModal,Object.assign({hideCrossButton:ke,zIndex:g,centralContainerStyles:{width:Z?900:C===s.CHANNEL_TYPE.EMAIL&&h?1e3:800},open:!0,onClose:()=>{null==m||m()},headingTitle:null==ve?void 0:ve.label,headingSubtitle:C===s.CHANNEL_TYPE.WHATSAPP?`${o.default.capitaliseFirstLetterOfString(null!==(Q=null==ve?void 0:ve.category)&&void 0!==Q?Q:"")} • ${null!==(X=null==ve?void 0:ve.templateCategory)&&void 0!==X?X:""}`:"",onBackPress:()=>{null==y||y()},modalHeaderStyles:{borderBottom:`1px solid ${a.COLORS.stroke.primary}`}},{children:[e.jsx(u.default,{variableListFromProps:L,showSampleValues:V,showVariableMapping:h,channel:C,whatsappSpecificPickerMeta:f,showVariableModal:T,discountCode:I,setDiscountCode:j,variableListForImage:M&&(null==M?void 0:M.length)>0?M:we,fileName:F,setFileName:e=>{null==_||_(e)}}),E?e.jsx(d.default,{isWhatsappCarousel:null!=Z&&Z,onSelect:function(){var e;if((null==je?void 0:je.length)<1&&ee)return void ne(!0);if(Object.keys(qe).length>0&&D!==i.POD.CHATBOT)return void ne(!0);const t=null==E?void 0:E(ve,Pe,null!=re?re:"",je);pe(null!==(e=null==t?void 0:t.templateErrorIndexes)&&void 0!==e?e:{body:[],buttons:[]}),(null==t?void 0:t.errorIndexes)||(null==t?void 0:t.error)?((null==t?void 0:t.errorIndexes)&&ue(t.errorIndexes),(null==t?void 0:t.error)&&ne(!!(null==t?void 0:t.error))):Te(!0)}}):e.jsx(e.Fragment,{})]}))}))};
|
|
@@ -17,4 +17,4 @@
|
|
|
17
17
|
height: 6px;
|
|
18
18
|
background: #d9d9d9;
|
|
19
19
|
border-radius: 3px;
|
|
20
|
-
`,h=d.default.forwardRef(((r,t)=>{let{display_content:s,showSampleValues:l}=r;return e.jsxs(n,Object.assign({ref:t},{children:[e.jsxs(u,{children:[e.jsx(m,{}),e.jsx(m,{}),e.jsx(m,{})]}),e.jsx("div",{children:s?e.jsx(a.TemplatePreview,{showSampleValues:l,channel:p.CHANNEL_TYPE.EMAIL,hideHeader:!0,emailSpecificMeta:{emailDisplayContent:s,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_desktop",containerStyle:{height:441},templateContainerStyles:{height:"100%"}}
|
|
20
|
+
`,h=d.default.forwardRef(((r,t)=>{let{display_content:s,showSampleValues:l}=r;return e.jsxs(n,Object.assign({ref:t},{children:[e.jsxs(u,{children:[e.jsx(m,{}),e.jsx(m,{}),e.jsx(m,{})]}),e.jsx("div",{children:s?e.jsx(a.TemplatePreview,{showSampleValues:l,channel:p.CHANNEL_TYPE.EMAIL,hideHeader:!0,emailSpecificMeta:{emailDisplayContent:s,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_desktop",containerStyle:{height:441},templateContainerStyles:{height:"100%"}}}):e.jsx("div",Object.assign({style:{padding:20}},{children:e.jsx(i.Spinner,{size:"small"})}))})]}))}));h.displayName="DesktopPreview",exports.default=h;
|
|
@@ -4,4 +4,4 @@
|
|
|
4
4
|
padding-right: 10px;
|
|
5
5
|
margin-bottom: 8px;
|
|
6
6
|
line-height: normal;
|
|
7
|
-
`;exports.default=t=>{let{template:T,onTemplateChange:y,whatsappSpecificPickerMeta:E,showVariableModal:B,variableListForImage:V,setDiscountCode:M,fileName:k,setFileName:q}=t;var I,D,R,L,U,P,w,A,N,S,_,F,H,Q,Y,K,W,$,G,X,z,J,Z,ee,ne,oe,te,ie,le,ae,se,de,ue,re,pe,ce,ve,me,be;const ge=T.isCarouselType,{originalVariableList:fe,pod:he,extras:je,selectedCarouselIndex:Oe,isProductCarouselType:Ce}=s.useTemplateModalContext(),{descriptionComponents:Te,urlBtns:xe,qrbBtns:ye,imageComponent:Ee,bodyVariables:Be,headerVariables:Ve}=d.getAllDataFromTemplateComponent(T),Me=o.useRef(null),[ke,qe]=o.useState(!1),[Ie,De]=o.useState(-1===Oe?{descriptionComponents:Te,urlBtns:xe,qrbBtns:ye,imageComponent:Ee,bodyVariables:Be,headerVariables:Ve}:{}),{uploadMediaLink:Re,uploadMediaFiles:Le,validateMimeType:Ue}=E,Pe=g.useEditWhatsappTemplateMedia({uploadMediaLink:Re,uploadMediaFiles:Le,updateTemplateImageUrl:function(e,o){var t,i,l,a,s,d,u,r;let p;p=null!=Oe&&Oe>-1?{components:null===(i=null===(t=T.components[1])||void 0===t?void 0:t.cards)||void 0===i?void 0:i[Oe].components,mapping:null===(a=null===(l=null==T?void 0:T.mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a[Oe]}:Object.assign({},T);const c=null===(s=null==p?void 0:p.components)||void 0===s?void 0:s.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==c&&c>-1&&(null==p?void 0:p.components[c])){const n=Object.assign(Object.assign({},p.components[c]),{format:o,example:{header_handle:[e]}}),t=[...p.components];t[c]=n,p=Object.assign(Object.assign({},p),{components:t})}p.mapping&&(p.mapping=Object.assign(Object.assign({},p.mapping),{header:void 0}));if(null!=Oe&&Oe>-1){const e=n.cloneDeep(T);e.components[1].cards[Oe].components=p.components,(null===(d=null==e?void 0:e.mapping)||void 0===d?void 0:d.cards)&&(null===(u=null==e?void 0:e.mapping)||void 0===u?void 0:u.cards.length)>0&&(e.mapping.cards[Oe]=null!==(r=p.mapping)&&void 0!==r?r:{}),null==y||y(Object.assign({},e)),Ae(!0)}else null==y||y(Object.assign({},p))},validateMimeType:Ue,mediaComponent:ge?Ie.imageComponent:Ee,fileRef:Me}),[we,Ae]=o.useState(!1),[Ne,Se]=o.useState(k),[_e,Fe]=o.useState();function He(e,o,t){var i,l,a,s,d,u,r,p,c,v;console.log("val",e);const m=null!=Oe&&Oe>-1?{components:null===(i=Object.assign({},T).components[1].cards)||void 0===i?void 0:i[Oe].components,mapping:null===(l=Object.assign({},T).mapping.cards)||void 0===l?void 0:l[Oe]}:Object.assign({},T),b=n.cloneDeep(m),g="custom"===o&&"string"==typeof e,f=g?e:"string"!=typeof e?e.defaultValue?e.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(console.log("customValue",f),null!=Oe&&Oe>-1&&Ce){const o=Object.assign({},T).components.map((e=>{var n;return"CAROUSEL"===e.type?Object.assign(Object.assign({},e),{cards:null===(n=e.cards)||void 0===n?void 0:n.map((e=>Object.assign(Object.assign({},e),{components:e.components.map((e=>{var n,o,i;if("BUTTONS"===e.type){const l=null===(n=e.buttons)||void 0===n?void 0:n.filter((e=>"URL"===e.type));let a=null!==(o=null==l?void 0:l[t])&&void 0!==o?o:{};a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[f]}),console.log("350 currentButton",a);const s=null===(i=e.buttons)||void 0===i?void 0:i.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e));return Object.assign(Object.assign({},e),{buttons:s})}return e}))})))}):e})),i=null===(s=null===(a=Object.assign({},T).mapping)||void 0===a?void 0:a.cards)||void 0===s?void 0:s.map((n=>{var o;return Object.assign(Object.assign({},n),{buttons:null===(o=null==n?void 0:n.buttons)||void 0===o?void 0:o.map((n=>g?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:""))})})),l=n.cloneDeep(T);return l.components=o,l.mapping.cards=i,void(null==y||y(Object.assign({},l)))}const h=null==b?void 0:b.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==h&&h>-1){const n=null===(d=null==b?void 0:b.components[h].buttons)||void 0===d?void 0:d.filter((e=>"URL"===e.type));if((null==n?void 0:n.length)>0){const i="custom"===o&&"string"==typeof e,l=i?e:"string"!=typeof e&&e.defaultValue?e.defaultValue:"https://d.bik.ai/";let a=n[t];console.log("currentButton",a),a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[l]}),console.log("currentButton",a);const s=[...null!==(p=null===(r=null===(u=b.components)||void 0===u?void 0:u[h])||void 0===r?void 0:r.buttons)&&void 0!==p?p:[]].map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e)),d=Object.assign(Object.assign({},b.components[h]),{buttons:s}),v=null===(c=b.mapping)||void 0===c?void 0:c.buttons;v&&v.length>0&&(v[t]=i?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"");const m=Object.assign(Object.assign({},b.mapping),{buttons:v});b.mapping=m;const g=[...b.components];g[h]=d,b.components=g}}if("string"!=typeof e){"checkout.checkoutUrl"===(null===(v=e.placeHolder)||void 0===v?void 0:v.slice(2,-2))?qe(!0):(qe(!1),null==M||M(""))}if(null!=Oe&&Oe>-1){const e=n.cloneDeep(T);e.components[1].cards[Oe].components=b.components,e.mapping.cards[Oe]=b.mapping,null==y||y(Object.assign({},e))}else null==y||y(b)}function Qe(e,o,t){var i,l,a,s,d,u,r;const p=null!=Oe&&Oe>-1?{components:null===(i=Object.assign({},T).components[1].cards)||void 0===i?void 0:i[Oe].components,mapping:null===(l=Object.assign({},T).mapping.cards)||void 0===l?void 0:l[Oe]}:Object.assign({},T);if(null!=Oe&&Oe>-1&&Ce){const o=Object.assign({},T).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,i,l;if("BUTTONS"===n.type){const a=null===(o=null==n?void 0:n.buttons)||void 0===o?void 0:o.filter((e=>"QUICK_REPLY"===e.type));let s=null!==(i=null==a?void 0:a[t])&&void 0!==i?i:{};s=Object.assign(Object.assign({},s),{flowId:e.flowId,flowName:e.flowName});const d=null===(l=null==n?void 0:n.buttons)||void 0===l?void 0:l.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==s?void 0:s.text)?s:e));return Object.assign(Object.assign({},n),{buttons:d})}return n}))})))}):n})),i=n.cloneDeep(T);return i.components=o,void(null==y||y(Object.assign({},i)))}const c=null==p?void 0:p.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==c&&c>-1){const n=null===(s=null===(a=null==p?void 0:p.components[c])||void 0===a?void 0:a.buttons)||void 0===s?void 0:s.filter((e=>"QUICK_REPLY"===e.type));if(n){let o=n[t];o=Object.assign(Object.assign({},o),{flowId:e.flowId,flowName:e.flowName});const i=[...null!==(r=null===(u=null===(d=p.components)||void 0===d?void 0:d[c])||void 0===u?void 0:u.buttons)&&void 0!==r?r:[]].map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==o?void 0:o.text)?o:e)),l=Object.assign(Object.assign({},p.components[c]),{buttons:i}),a=[...p.components];a[c]=l,p.components=a}}if(null!=Oe&&Oe>-1){const e=n.cloneDeep(T);e.components[1].cards[Oe].components=p.components,null==y||y(Object.assign({},e))}else null==y||y(p)}o.useEffect((()=>{var e,n;if(null===(e=T.mapping.buttons)||void 0===e?void 0:e.find((e=>"checkout.checkoutUrl"===e.slice(2,-2))))qe(!0);else{qe(!1);const e=null===(n=null==je?void 0:je.discountCodeExtra)||void 0===n?void 0:n[1];null==e||e("")}}),[T]),o.useEffect((()=>{var e,n,o,t;if(null!=Oe&&Oe>-1){const i={components:null===(n=null===(e=T.components[1])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Oe].components,mapping:null===(t=null===(o=null==T?void 0:T.mapping)||void 0===o?void 0:o.cards)||void 0===t?void 0:t[Oe]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p}=d.getAllDataFromTemplateComponent(i);De({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p})}else if(null!=Oe&&-1===Oe){const{descriptionComponents:e,urlBtns:n,qrbBtns:o,imageComponent:t,bodyVariables:i,headerVariables:l}=d.getAllDataFromTemplateComponent(T);De({descriptionComponents:e,urlBtns:n,qrbBtns:o,imageComponent:t,bodyVariables:i,headerVariables:l})}}),[Oe]),o.useEffect((()=>{var e,n,o,t;if(null!=Oe&&Oe>-1&&we){const i={components:null===(n=null===(e=T.components[1])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Oe].components,mapping:null===(t=null===(o=null==T?void 0:T.mapping)||void 0===o?void 0:o.cards)||void 0===t?void 0:t[Oe]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p}=d.getAllDataFromTemplateComponent(i);De({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p}),Ae(!1)}}),[we]);const Ye=ge?Ie.imageComponent:Ee;return Pe.openEditMedia?e.jsx(h.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsx(v.default,{mediaComponentFormat:null!==(I=Ye.format)&&void 0!==I?I:l.HEADER_TYPES.IMAGE,uploadMedia:Pe.uploadMedia,variableListForImage:V||[],useEditWhatsappTemplateMediaResponse:Pe,setOpenEditMedia:Pe.setOpenEditMedia,openEditMedia:Pe.openEditMedia,editIconRef:Pe.editIconRef,fileRef:Me})})):e.jsxs(h.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:Ce?"420px":"auto"}},{children:[!!Ie.imageComponent&&!Ce&&e.jsxs(b.EditTemplateMediaContainer,{children:[e.jsx(m.default,{imageName:null!==(R=null===(D=null==Ye?void 0:Ye.example)||void 0===D?void 0:D.header_handle)&&void 0!==R?R:[],handleImageChange:Pe.handleImageChange,mediaType:null==Ye?void 0:Ye.format,error:Pe.error,isLoading:Pe.loading,setOpenEditMedia:Pe.setOpenEditMedia,selectedVariable:u.isVariable(null!==(P=null===(U=null===(L=null==Ye?void 0:Ye.example)||void 0===L?void 0:L.header_handle)||void 0===U?void 0:U[0])&&void 0!==P?P:"")?null===(A=null===(w=null==Ye?void 0:Ye.example)||void 0===w?void 0:w.header_handle)||void 0===A?void 0:A[0]:(null===(S=null===(N=null==T?void 0:T.mapping)||void 0===N?void 0:N.header)||void 0===S?void 0:S[0])?null===(F=null===(_=null==T?void 0:T.mapping)||void 0===_?void 0:_.header)||void 0===F?void 0:F[0]:Pe.selectedVariable}),(null==Ee?void 0:Ee.format)==l.HEADER_TYPES.DOCUMENT?e.jsx(x,{children:e.jsx(i.Input,{labelText:"PDF Name",placeholder:"Enter the name",value:Ne,errorMessage:_e||void 0,onBlur:()=>{if(!Ne)return null==q||q(""),void Fe("PDF name is Required");const e=r.validateInputName(Ne);null==q||q(Ne),Fe(e?"Please enter a valid PDF name":void 0)},onChangeText:e=>{Fe(""),Se(e)}})}):e.jsx(e.Fragment,{})]}),(null===(H=Ie.bodyVariables)||void 0===H?void 0:H.length)>0&&e.jsx(O.default,{containerStyle:{paddingTop:Ie.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===(Q=Ie.descriptionComponents)||void 0===Q?void 0:Q.map(((n,o)=>e.jsx(j.default,{originalVariableList:null!=Oe&&Oe>-1?fe.cards[Oe]:fe,type:n.type,descriptionComponent:n.component,showVariableModal:B},o))),(null===(W=null===(K=null!=Oe&&Oe>-1?null===(Y=fe.cards[Oe])||void 0===Y?void 0:Y.buttons:null==fe?void 0:fe.buttons)||void 0===K?void 0:K.filter((e=>"URL"===e.type)))||void 0===W?void 0:W.length)>0&&e.jsx(O.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(X=null===(G=null!=Oe&&Oe>-1?null===($=fe.cards[Oe])||void 0===$?void 0:$.buttons:null==fe?void 0:fe.buttons)||void 0===G?void 0:G.filter((e=>he===a.POD.CHATBOT||"URL"===e.type)))||void 0===X?void 0:X.map(((n,o)=>{if("URL"===n.type)return e.jsx(C.default,{variableListIndex:o,CTAoptions:null==E?void 0:E.CTAoptions,button:n,currentVariableList:null!=Oe&&Oe>-1?Object.assign({},fe.cards[Oe]):Object.assign({},fe),updateSelectedURLTemplateBtn:He},`${o}_${Oe}`)})),he===a.POD.CHATBOT&&(null===(J=null===(z=ye[0])||void 0===z?void 0:z.component)||void 0===J?void 0:J.buttons)&&(null===(ne=null===(ee=null===(Z=ye[0])||void 0===Z?void 0:Z.component)||void 0===ee?void 0:ee.buttons)||void 0===ne?void 0:ne.length)>0&&e.jsx(p.BackTrackComponent,{backTrackMessage:null===(oe=null==je?void 0:je.backTrackExtra)||void 0===oe?void 0:oe[0],setBackTrackMessage:null===(te=null==je?void 0:je.backTrackExtra)||void 0===te?void 0:te[1]}),(null===(ae=null===(le=null!=Oe&&Oe>-1?null===(ie=fe.cards[Oe])||void 0===ie?void 0:ie.buttons:null==fe?void 0:fe.buttons)||void 0===le?void 0:le.filter((e=>"QUICK_REPLY"===e.type)))||void 0===ae?void 0:ae.length)>0&&(he!==a.POD.CHATBOT?e.jsx(O.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(p.BackTrackComponent,{backTrackMessage:null===(se=null==je?void 0:je.backTrackExtra)||void 0===se?void 0:se[0],setBackTrackMessage:null===(de=null==je?void 0:je.backTrackExtra)||void 0===de?void 0:de[1]})),null===(pe=null===(re=null!=Oe&&Oe>-1?null===(ue=fe.cards[Oe])||void 0===ue?void 0:ue.buttons:null==fe?void 0:fe.buttons)||void 0===re?void 0:re.filter((e=>"QUICK_REPLY"===e.type)))||void 0===pe?void 0:pe.map(((n,o)=>{if("QUICK_REPLY"===n.type&&he!==a.POD.CHATBOT)return e.jsx(C.default,{variableListIndex:o,QRBoptions:null==E?void 0:E.QRBoptions,button:n,currentVariableList:null!=Oe&&Oe>-1?Object.assign({},fe.cards[Oe]):Object.assign({},fe),updateSelectedQRBTemplateBtn:Qe},`${o}_${Oe}`)})),he===a.POD.CHATBOT&&ke&&e.jsx(c.DiscountCodeComponent,{discountCode:null===(ce=null==je?void 0:je.discountCodeExtra)||void 0===ce?void 0:ce[0],setDiscountCode:null===(ve=null==je?void 0:je.discountCodeExtra)||void 0===ve?void 0:ve[1]}),null===(be=null!=Oe&&Oe>-1?null===(me=fe.cards[Oe])||void 0===me?void 0:me.buttons:null==fe?void 0:fe.buttons)||void 0===be?void 0:be.map(((n,o)=>{var t,i,l;if("COPY_CODE"===n.type)return e.jsx(f.default,{index:o,variable:{variableName:null!==(t=n.text)&&void 0!==t?t:"Copy Code",updatedValue:null!==(i=n.buttonVariable)&&void 0!==i?i:"",type:"string",isEditableVariable:!0,index:null!==(l=n.index)&&void 0!==l?l:0},showVariableModal:!0,componentType:"BUTTONS",buttonType:n.type},o)}))]}))};
|
|
7
|
+
`;exports.default=t=>{let{template:T,onTemplateChange:y,whatsappSpecificPickerMeta:E,showVariableModal:V,variableListForImage:B,setDiscountCode:M,fileName:k,setFileName:q}=t;var I,D,R,L,U,P,w,A,N,S,_,F,H,Q,Y,K,W,$,G,X,z,J,Z,ee,ne,oe,te,ie,le,ae,se,de,ue,re,pe,ce,ve,me,be;const ge=T.isCarouselType,{originalVariableList:fe,pod:he,extras:je,selectedCarouselIndex:Oe,isProductCarouselType:Ce}=s.useTemplateModalContext(),{descriptionComponents:Te,urlBtns:xe,qrbBtns:ye,imageComponent:Ee,bodyVariables:Ve,headerVariables:Be}=d.getAllDataFromTemplateComponent(T),Me=o.useRef(null),[ke,qe]=o.useState(!1),[Ie,De]=o.useState(-1===Oe?{descriptionComponents:Te,urlBtns:xe,qrbBtns:ye,imageComponent:Ee,bodyVariables:Ve,headerVariables:Be}:{}),{uploadMediaLink:Re,uploadMediaFiles:Le,validateMimeType:Ue}=E,Pe=g.useEditWhatsappTemplateMedia({uploadMediaLink:Re,uploadMediaFiles:Le,updateTemplateImageUrl:function(e,o){var t,i,l,a,s,d,u,r;let p;p=null!=Oe&&Oe>-1?{components:null===(i=null===(t=T.components[1])||void 0===t?void 0:t.cards)||void 0===i?void 0:i[Oe].components,mapping:null===(a=null===(l=null==T?void 0:T.mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a[Oe]}:Object.assign({},T);const c=null===(s=null==p?void 0:p.components)||void 0===s?void 0:s.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==c&&c>-1&&(null==p?void 0:p.components[c])){const n=Object.assign(Object.assign({},p.components[c]),{format:o,example:{header_handle:[e]}}),t=[...p.components];t[c]=n,p=Object.assign(Object.assign({},p),{components:t})}p.mapping&&(p.mapping=Object.assign(Object.assign({},p.mapping),{header:void 0}));if(null!=Oe&&Oe>-1){const e=n.cloneDeep(T);e.components[1].cards[Oe].components=p.components,(null===(d=null==e?void 0:e.mapping)||void 0===d?void 0:d.cards)&&(null===(u=null==e?void 0:e.mapping)||void 0===u?void 0:u.cards.length)>0&&(e.mapping.cards[Oe]=null!==(r=p.mapping)&&void 0!==r?r:{}),null==y||y(Object.assign({},e)),Ae(!0)}else null==y||y(Object.assign({},p))},validateMimeType:Ue,mediaComponent:ge?Ie.imageComponent:Ee,fileRef:Me}),[we,Ae]=o.useState(!1),[Ne,Se]=o.useState(k),[_e,Fe]=o.useState();function He(e,o,t){var i,l,a,s,d,u,r,p,c,v;const m=null!=Oe&&Oe>-1?{components:null===(i=Object.assign({},T).components[1].cards)||void 0===i?void 0:i[Oe].components,mapping:null===(l=Object.assign({},T).mapping.cards)||void 0===l?void 0:l[Oe]}:Object.assign({},T),b=n.cloneDeep(m),g="custom"===o&&"string"==typeof e,f=g?e:"string"!=typeof e?e.defaultValue?e.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=Oe&&Oe>-1&&Ce){const o=Object.assign({},T).components.map((e=>{var n;return"CAROUSEL"===e.type?Object.assign(Object.assign({},e),{cards:null===(n=e.cards)||void 0===n?void 0:n.map((e=>Object.assign(Object.assign({},e),{components:e.components.map((e=>{var n,o,i;if("BUTTONS"===e.type){const l=null===(n=e.buttons)||void 0===n?void 0:n.filter((e=>"URL"===e.type));let a=null!==(o=null==l?void 0:l[t])&&void 0!==o?o:{};a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[f]});const s=null===(i=e.buttons)||void 0===i?void 0:i.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e));return Object.assign(Object.assign({},e),{buttons:s})}return e}))})))}):e})),i=null===(s=null===(a=Object.assign({},T).mapping)||void 0===a?void 0:a.cards)||void 0===s?void 0:s.map((n=>{var o;return Object.assign(Object.assign({},n),{buttons:null===(o=null==n?void 0:n.buttons)||void 0===o?void 0:o.map((n=>g?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:""))})})),l=n.cloneDeep(T);return l.components=o,l.mapping.cards=i,void(null==y||y(Object.assign({},l)))}const h=null==b?void 0:b.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==h&&h>-1){const n=null===(d=null==b?void 0:b.components[h].buttons)||void 0===d?void 0:d.filter((e=>"URL"===e.type));if((null==n?void 0:n.length)>0){const i="custom"===o&&"string"==typeof e,l=i?e:"string"!=typeof e&&e.defaultValue?e.defaultValue:"https://d.bik.ai/";let a=n[t];a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[l]});const s=[...null!==(p=null===(r=null===(u=b.components)||void 0===u?void 0:u[h])||void 0===r?void 0:r.buttons)&&void 0!==p?p:[]].map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e)),d=Object.assign(Object.assign({},b.components[h]),{buttons:s}),v=null===(c=b.mapping)||void 0===c?void 0:c.buttons;v&&v.length>0&&(v[t]=i?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"");const m=Object.assign(Object.assign({},b.mapping),{buttons:v});b.mapping=m;const g=[...b.components];g[h]=d,b.components=g}}if("string"!=typeof e){"checkout.checkoutUrl"===(null===(v=e.placeHolder)||void 0===v?void 0:v.slice(2,-2))?qe(!0):(qe(!1),null==M||M(""))}if(null!=Oe&&Oe>-1){const e=n.cloneDeep(T);e.components[1].cards[Oe].components=b.components,e.mapping.cards[Oe]=b.mapping,null==y||y(Object.assign({},e))}else null==y||y(b)}function Qe(e,o,t){var i,l,a,s,d,u,r;const p=null!=Oe&&Oe>-1?{components:null===(i=Object.assign({},T).components[1].cards)||void 0===i?void 0:i[Oe].components,mapping:null===(l=Object.assign({},T).mapping.cards)||void 0===l?void 0:l[Oe]}:Object.assign({},T);if(null!=Oe&&Oe>-1&&Ce){const o=Object.assign({},T).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,i,l;if("BUTTONS"===n.type){const a=null===(o=null==n?void 0:n.buttons)||void 0===o?void 0:o.filter((e=>"QUICK_REPLY"===e.type));let s=null!==(i=null==a?void 0:a[t])&&void 0!==i?i:{};s=Object.assign(Object.assign({},s),{flowId:e.flowId,flowName:e.flowName});const d=null===(l=null==n?void 0:n.buttons)||void 0===l?void 0:l.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==s?void 0:s.text)?s:e));return Object.assign(Object.assign({},n),{buttons:d})}return n}))})))}):n})),i=n.cloneDeep(T);return i.components=o,void(null==y||y(Object.assign({},i)))}const c=null==p?void 0:p.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==c&&c>-1){const n=null===(s=null===(a=null==p?void 0:p.components[c])||void 0===a?void 0:a.buttons)||void 0===s?void 0:s.filter((e=>"QUICK_REPLY"===e.type));if(n){let o=n[t];o=Object.assign(Object.assign({},o),{flowId:e.flowId,flowName:e.flowName});const i=[...null!==(r=null===(u=null===(d=p.components)||void 0===d?void 0:d[c])||void 0===u?void 0:u.buttons)&&void 0!==r?r:[]].map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==o?void 0:o.text)?o:e)),l=Object.assign(Object.assign({},p.components[c]),{buttons:i}),a=[...p.components];a[c]=l,p.components=a}}if(null!=Oe&&Oe>-1){const e=n.cloneDeep(T);e.components[1].cards[Oe].components=p.components,null==y||y(Object.assign({},e))}else null==y||y(p)}o.useEffect((()=>{var e,n;if(null===(e=T.mapping.buttons)||void 0===e?void 0:e.find((e=>"checkout.checkoutUrl"===e.slice(2,-2))))qe(!0);else{qe(!1);const e=null===(n=null==je?void 0:je.discountCodeExtra)||void 0===n?void 0:n[1];null==e||e("")}}),[T]),o.useEffect((()=>{var e,n,o,t;if(null!=Oe&&Oe>-1){const i={components:null===(n=null===(e=T.components[1])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Oe].components,mapping:null===(t=null===(o=null==T?void 0:T.mapping)||void 0===o?void 0:o.cards)||void 0===t?void 0:t[Oe]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p}=d.getAllDataFromTemplateComponent(i);De({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p})}else if(null!=Oe&&-1===Oe){const{descriptionComponents:e,urlBtns:n,qrbBtns:o,imageComponent:t,bodyVariables:i,headerVariables:l}=d.getAllDataFromTemplateComponent(T);De({descriptionComponents:e,urlBtns:n,qrbBtns:o,imageComponent:t,bodyVariables:i,headerVariables:l})}}),[Oe]),o.useEffect((()=>{var e,n,o,t;if(null!=Oe&&Oe>-1&&we){const i={components:null===(n=null===(e=T.components[1])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Oe].components,mapping:null===(t=null===(o=null==T?void 0:T.mapping)||void 0===o?void 0:o.cards)||void 0===t?void 0:t[Oe]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p}=d.getAllDataFromTemplateComponent(i);De({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p}),Ae(!1)}}),[we]);const Ye=ge?Ie.imageComponent:Ee;return Pe.openEditMedia?e.jsx(h.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsx(v.default,{mediaComponentFormat:null!==(I=Ye.format)&&void 0!==I?I:l.HEADER_TYPES.IMAGE,uploadMedia:Pe.uploadMedia,variableListForImage:B||[],useEditWhatsappTemplateMediaResponse:Pe,setOpenEditMedia:Pe.setOpenEditMedia,openEditMedia:Pe.openEditMedia,editIconRef:Pe.editIconRef,fileRef:Me})})):e.jsxs(h.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:Ce?"420px":"auto"}},{children:[!!Ie.imageComponent&&!Ce&&e.jsxs(b.EditTemplateMediaContainer,{children:[e.jsx(m.default,{imageName:null!==(R=null===(D=null==Ye?void 0:Ye.example)||void 0===D?void 0:D.header_handle)&&void 0!==R?R:[],handleImageChange:Pe.handleImageChange,mediaType:null==Ye?void 0:Ye.format,error:Pe.error,isLoading:Pe.loading,setOpenEditMedia:Pe.setOpenEditMedia,selectedVariable:u.isVariable(null!==(P=null===(U=null===(L=null==Ye?void 0:Ye.example)||void 0===L?void 0:L.header_handle)||void 0===U?void 0:U[0])&&void 0!==P?P:"")?null===(A=null===(w=null==Ye?void 0:Ye.example)||void 0===w?void 0:w.header_handle)||void 0===A?void 0:A[0]:(null===(S=null===(N=null==T?void 0:T.mapping)||void 0===N?void 0:N.header)||void 0===S?void 0:S[0])?null===(F=null===(_=null==T?void 0:T.mapping)||void 0===_?void 0:_.header)||void 0===F?void 0:F[0]:Pe.selectedVariable}),(null==Ee?void 0:Ee.format)==l.HEADER_TYPES.DOCUMENT?e.jsx(x,{children:e.jsx(i.Input,{labelText:"PDF Name",placeholder:"Enter the name",value:Ne,errorMessage:_e||void 0,onBlur:()=>{if(!Ne)return null==q||q(""),void Fe("PDF name is Required");const e=r.validateInputName(Ne);null==q||q(Ne),Fe(e?"Please enter a valid PDF name":void 0)},onChangeText:e=>{Fe(""),Se(e)}})}):e.jsx(e.Fragment,{})]}),(null===(H=Ie.bodyVariables)||void 0===H?void 0:H.length)>0&&e.jsx(O.default,{containerStyle:{paddingTop:Ie.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===(Q=Ie.descriptionComponents)||void 0===Q?void 0:Q.map(((n,o)=>e.jsx(j.default,{originalVariableList:null!=Oe&&Oe>-1?fe.cards[Oe]:fe,type:n.type,descriptionComponent:n.component,showVariableModal:V},o))),(null===(W=null===(K=null!=Oe&&Oe>-1?null===(Y=fe.cards[Oe])||void 0===Y?void 0:Y.buttons:null==fe?void 0:fe.buttons)||void 0===K?void 0:K.filter((e=>"URL"===e.type)))||void 0===W?void 0:W.length)>0&&e.jsx(O.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(X=null===(G=null!=Oe&&Oe>-1?null===($=fe.cards[Oe])||void 0===$?void 0:$.buttons:null==fe?void 0:fe.buttons)||void 0===G?void 0:G.filter((e=>he===a.POD.CHATBOT||"URL"===e.type)))||void 0===X?void 0:X.map(((n,o)=>{if("URL"===n.type)return e.jsx(C.default,{variableListIndex:o,CTAoptions:null==E?void 0:E.CTAoptions,button:n,currentVariableList:null!=Oe&&Oe>-1?Object.assign({},fe.cards[Oe]):Object.assign({},fe),updateSelectedURLTemplateBtn:He},`${o}_${Oe}`)})),he===a.POD.CHATBOT&&(null===(J=null===(z=ye[0])||void 0===z?void 0:z.component)||void 0===J?void 0:J.buttons)&&(null===(ne=null===(ee=null===(Z=ye[0])||void 0===Z?void 0:Z.component)||void 0===ee?void 0:ee.buttons)||void 0===ne?void 0:ne.length)>0&&e.jsx(p.BackTrackComponent,{backTrackMessage:null===(oe=null==je?void 0:je.backTrackExtra)||void 0===oe?void 0:oe[0],setBackTrackMessage:null===(te=null==je?void 0:je.backTrackExtra)||void 0===te?void 0:te[1]}),(null===(ae=null===(le=null!=Oe&&Oe>-1?null===(ie=fe.cards[Oe])||void 0===ie?void 0:ie.buttons:null==fe?void 0:fe.buttons)||void 0===le?void 0:le.filter((e=>"QUICK_REPLY"===e.type)))||void 0===ae?void 0:ae.length)>0&&(he!==a.POD.CHATBOT?e.jsx(O.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(p.BackTrackComponent,{backTrackMessage:null===(se=null==je?void 0:je.backTrackExtra)||void 0===se?void 0:se[0],setBackTrackMessage:null===(de=null==je?void 0:je.backTrackExtra)||void 0===de?void 0:de[1]})),null===(pe=null===(re=null!=Oe&&Oe>-1?null===(ue=fe.cards[Oe])||void 0===ue?void 0:ue.buttons:null==fe?void 0:fe.buttons)||void 0===re?void 0:re.filter((e=>"QUICK_REPLY"===e.type)))||void 0===pe?void 0:pe.map(((n,o)=>{if("QUICK_REPLY"===n.type&&he!==a.POD.CHATBOT)return e.jsx(C.default,{variableListIndex:o,QRBoptions:null==E?void 0:E.QRBoptions,button:n,currentVariableList:null!=Oe&&Oe>-1?Object.assign({},fe.cards[Oe]):Object.assign({},fe),updateSelectedQRBTemplateBtn:Qe},`${o}_${Oe}`)})),he===a.POD.CHATBOT&&ke&&e.jsx(c.DiscountCodeComponent,{discountCode:null===(ce=null==je?void 0:je.discountCodeExtra)||void 0===ce?void 0:ce[0],setDiscountCode:null===(ve=null==je?void 0:je.discountCodeExtra)||void 0===ve?void 0:ve[1]}),null===(be=null!=Oe&&Oe>-1?null===(me=fe.cards[Oe])||void 0===me?void 0:me.buttons:null==fe?void 0:fe.buttons)||void 0===be?void 0:be.map(((n,o)=>{var t,i,l;if("COPY_CODE"===n.type)return e.jsx(f.default,{index:o,variable:{variableName:null!==(t=n.text)&&void 0!==t?t:"Copy Code",updatedValue:null!==(i=n.buttonVariable)&&void 0!==i?i:"",type:"string",isEditableVariable:!0,index:null!==(l=n.index)&&void 0!==l?l:0},showVariableModal:!0,componentType:"BUTTONS",buttonType:n.type},o)}))]}))};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),i=require("styled-components"),a=require("../../template-preview/TemplatePreview.js");require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js"),require("../../../constants/Theme.js"),require("../../curtain/CurtainHelper.js"),require("../../variable-picker-v3/model.js"),require("../../template-preview/models/TemplateMeta.js");var r=require("../../template-preview/models/WhatsAppTemplate.js"),s=require("../context/templateModalContext.js"),l=require("../utils/getPreviewDimension.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),i=require("styled-components"),a=require("../../template-preview/TemplatePreview.js");require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js"),require("../../../constants/Theme.js"),require("../../curtain/CurtainHelper.js"),require("../../variable-picker-v3/model.js"),require("../../template-preview/models/TemplateMeta.js");var r=require("../../template-preview/models/WhatsAppTemplate.js"),s=require("../context/templateModalContext.js"),l=require("../utils/getPreviewDimension.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=o(t),n=o(i);const c=n.default.div`
|
|
2
2
|
position: relative;
|
|
3
3
|
height: 100%;
|
|
4
4
|
border-radius: 31px;
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
background-color: white;
|
|
7
7
|
margin: auto;
|
|
8
8
|
overflow-y: auto;
|
|
9
|
-
`,
|
|
9
|
+
`,d=n.default.div`
|
|
10
10
|
position: absolute;
|
|
11
11
|
flex: 1;
|
|
12
12
|
background-color: white;
|
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
height: calc(100% - 17px);
|
|
18
18
|
border-radius: 16px;
|
|
19
19
|
overflow-y: auto;
|
|
20
|
-
`,h=
|
|
20
|
+
`,h=p.default.forwardRef(((t,i)=>{let{display_content:o,channel:p,template:n,showSampleValues:h}=t;const{pod:u,hideDeviceContainerInPreview:v}=s.useTemplateModalContext(),w={showSampleValues:h,template:n,channel:p,smsSpecificMeta:{smsDisplayContent:o},whatsAppSpecificMeta:{showWhatsAppHeader:!0,whatsAppExtras:u!==r.POD.CHATBOT,containerStyle:{border:"none",borderBottomRightRadius:0,borderBottomLeftRadius:0,minHeight:426,width:240}},size:"small",hideHeader:!0,emailSpecificMeta:{emailDisplayContent:o,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_mobile",containerStyle:{height:"100%",width:"100%"},templateContainerStyles:{height:"100%"}},isPreview:!0};return v?e.jsx(m,{children:e.jsx(a.TemplatePreview,Object.assign({},w))}):e.jsx(e.Fragment,{children:e.jsxs(c,Object.assign({channel:p},{children:[e.jsx("img",{alt:"",src:"https://firebasestorage.googleapis.com/v0/b/staging-bikayi.appspot.com/o/bik%2FkNwEVoGlLpVjOsXoO1M8WgvWicP2%2F6f07b850-8b4b-4d58-96cc-8ba6df7b4e4a-Device___Frame.jpg?alt=media&token=253f1bfe-8481-4f54-bdef-3c0a73697d6a",style:{width:l.getPreviewWidth(p),height:443}}),e.jsx(d,Object.assign({ref:i},{children:e.jsx(a.TemplatePreview,Object.assign({},w))}))]}))})}));h.displayName="MobilePreview";const m=n.default.div`
|
|
21
21
|
display: flex;
|
|
22
22
|
align-items: center;
|
|
23
23
|
justify-content: center;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../button/Button.js"),a=require("../TypographyStyle.js"),n=require("./EmailTemplatePreview.styled.js");const s="https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c";exports.DEFAULT_IMAGE=s,exports.default=r=>{let{template:o,handleViewTemplate:i,hideHeader:l,hideViewButton:p,containerStyle:d,emailHtmlContainerId:c,emailDisplayContent:u,applyBorderBottom:m
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../button/Button.js"),a=require("../TypographyStyle.js"),n=require("./EmailTemplatePreview.styled.js");const s="https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c";exports.DEFAULT_IMAGE=s,exports.default=r=>{let{template:o,handleViewTemplate:i,hideHeader:l,hideViewButton:p,containerStyle:d,emailHtmlContainerId:c,emailDisplayContent:u,applyBorderBottom:m}=r;return e.jsxs(n.EmailContainer,Object.assign({hideHeader:l,style:Object.assign({},null!=d?d:{})},{children:[!l&&e.jsx(n.Header,{children:e.jsx(a.TitleRegular,Object.assign({style:{maxWidth:"100%"}},{children:o.name}))}),e.jsx(n.IframeContainer,Object.assign({applyBorderBottom:m},{children:u?e.jsx("iframe",{title:"Email template preview",id:null!=c?c:"",width:"100%",srcDoc:(x=u,x.replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{##orderProducts}}<\/span><span>\s*<\/span>/g,"").replace(/src="<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{product.photoUrl}}<\/span><span> <\/span>"/g,`src=${s}`).replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{\/\/orderProducts}}<\/span><span>\s*<\/span>/g,"").replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{##abandonedCartProducts}}<\/span><span>\s*<\/span>/g,"").replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{\/\/abandonedCartProducts}}<\/span><span>\s*<\/span>/g,"")),height:"100%",style:{pointerEvents:"none"}}):e.jsx(n.ImageContainer,Object.assign({hideHeader:l},{children:e.jsx(n.CardLoadingContainer,{})}))})),!p&&e.jsx(n.ViewButton,{children:e.jsx(t.Button,{buttonType:"tertiary",buttonText:"View",onClick:()=>{i&&i()}})})]}));var x};
|
|
@@ -21,6 +21,5 @@ export interface TemplatePreviewProps {
|
|
|
21
21
|
isWhatsappCarousel?: boolean;
|
|
22
22
|
isPreview?: boolean;
|
|
23
23
|
applyBorderBottom?: boolean;
|
|
24
|
-
hidePointerEvents?: boolean;
|
|
25
24
|
}
|
|
26
|
-
export declare const TemplatePreview: ({ template, channel, whatsAppSpecificMeta, templateCreationsInfo, hideHeader, size, onlyTemplateContent, emailSpecificMeta, smsSpecificMeta, showSampleValues, carouselCardIndex, isWhatsappCarousel, isPreview, applyBorderBottom,
|
|
25
|
+
export declare const TemplatePreview: ({ template, channel, whatsAppSpecificMeta, templateCreationsInfo, hideHeader, size, onlyTemplateContent, emailSpecificMeta, smsSpecificMeta, showSampleValues, carouselCardIndex, isWhatsappCarousel, isPreview, applyBorderBottom, }: TemplatePreviewProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("../template-context-mapper/context/templateModalContext.js"),t=require("../../utils/StringUtils.js"),a=require("../../constants/Theme.js"),i=require("../TypographyStyle.js"),n=require("./EmailTemplateThumbnailPreview.js"),r=require("./models/Channels.js"),s=require("./SmsTemplatePreview.js"),o=require("./WhatsAppTemplatePreview.js");const d={WhatsAppWrapper:{backgroundColor:a.COLORS.surface.standard,borderRadius:4,border:`1px solid ${a.COLORS.background.inactive}`,marginTop:16}};exports.TemplatePreview=p=>{let{template:u,channel:m,whatsAppSpecificMeta:c,templateCreationsInfo:v,hideHeader:h,size:j,onlyTemplateContent:C,emailSpecificMeta:g,smsSpecificMeta:S,showSampleValues:y,carouselCardIndex:b,isWhatsappCarousel:x,isPreview:T,applyBorderBottom:O
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("../template-context-mapper/context/templateModalContext.js"),t=require("../../utils/StringUtils.js"),a=require("../../constants/Theme.js"),i=require("../TypographyStyle.js"),n=require("./EmailTemplateThumbnailPreview.js"),r=require("./models/Channels.js"),s=require("./SmsTemplatePreview.js"),o=require("./WhatsAppTemplatePreview.js");const d={WhatsAppWrapper:{backgroundColor:a.COLORS.surface.standard,borderRadius:4,border:`1px solid ${a.COLORS.background.inactive}`,marginTop:16}};exports.TemplatePreview=p=>{let{template:u,channel:m,whatsAppSpecificMeta:c,templateCreationsInfo:v,hideHeader:h,size:j,onlyTemplateContent:C,emailSpecificMeta:g,smsSpecificMeta:S,showSampleValues:y,carouselCardIndex:b,isWhatsappCarousel:x,isPreview:T,applyBorderBottom:O}=p;var w,P;const{setSelectedCarouselIndex:H}=l.useTemplateModalContext();return m===r.CHANNEL_TYPE.SMS?e.jsx("div",Object.assign({style:Object.assign({marginTop:v?16:0,border:v?`1px solid ${a.COLORS.stroke.primary}`:"none",borderRadius:4},null==S?void 0:S.templateContainerStyles)},{children:e.jsx(s.default,{template:u,hideHeader:h,onlyTemplateContent:C,size:null!=j?j:"large",variableStore:null==S?void 0:S.smsVariableStore,display_content:null==S?void 0:S.smsDisplayContent,uniqueId:null==S?void 0:S.uniqueId})})):m===r.CHANNEL_TYPE.EMAIL?e.jsx("div",Object.assign({style:Object.assign({marginTop:v?16:0},null==g?void 0:g.templateContainerStyles)},{children:e.jsx(n.default,{template:u,handleViewTemplate:()=>{var e;null===(e=null==g?void 0:g.handleViewTemplate)||void 0===e||e.call(g)},hideHeader:h,hideViewButton:null==g?void 0:g.hideViewButtonForEmail,containerStyle:null==g?void 0:g.containerStyle,emailDisplayContent:null==g?void 0:g.emailDisplayContent,emailHtmlContainerId:null==g?void 0:g.emailHtmlContainerId,applyBorderBottom:O})})):m===r.CHANNEL_TYPE.WHATSAPP?e.jsxs("div",Object.assign({style:Object.assign(Object.assign({},null==c?void 0:c.templateContainerStyles),v?d.WhatsAppWrapper:{}),onClick:()=>{var e,l;if(H&&x){if(-1===b&&!(null===(l=null===(e=null==u?void 0:u.mapping)||void 0===e?void 0:e.body)||void 0===l?void 0:l.length))return;H(null!=b?b:-1)}}},{children:[v?e.jsx("div",Object.assign({style:{padding:16}},{children:e.jsx(i.TitleRegular,{children:t.default.convertToTitleCase(null!==(w=null==u?void 0:u.label)&&void 0!==w?w:"")})})):e.jsx(e.Fragment,{}),e.jsx(o.default,{showSampleValues:y,showHeader:null==c?void 0:c.showWhatsAppHeader,extras:null==c?void 0:c.whatsAppExtras,template:u,size:v?"small":null!=j?j:"large",containerStyle:Object.assign(Object.assign({borderWidth:v?0:1,borderTopWidth:1},null!==(P=null==c?void 0:c.containerStyle)&&void 0!==P?P:{}),{height:"100%"}),zeroStateComponent:null==c?void 0:c.zeroStateComponent,usePlaceHolderName:null==c?void 0:c.usePlaceHolderName,carouselCardIndex:b,isWhatsappCarousel:x,isPreview:T})]})):e.jsx(e.Fragment,{})};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const EventsTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default EventsTrigger;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const IGTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default IGTrigger;
|
package/dist/esm/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
package/dist/esm/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { DropdownOption } from "../../../dropdown/type";
|
|
3
|
-
import { QueryBuilderProperty } from "../../
|
|
4
|
-
import { QueryBuilderNodeProps } from "../../
|
|
3
|
+
import { QueryBuilderProperty } from "../../types/QueryBuilder.type";
|
|
4
|
+
import { QueryBuilderNodeProps } from "../../types/QueryBuilderNodeProps.type";
|
|
5
5
|
declare const BaseTriggerQueryBuilderNode: React.FC<QueryBuilderNodeProps & {
|
|
6
6
|
cacheKey: string;
|
|
7
7
|
propertyAddBtnText: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as l,Fragment as o}from"react/jsx-runtime";import{cloneDeep as t}from"lodash";import{useEffect as r,useState as i,useRef as a,useMemo as s}from"react";import n from"../../utils/StringUtils.js";import{COLORS as d}from"../../constants/Theme.js";import{StyledModal as
|
|
1
|
+
import{jsx as e,jsxs as l,Fragment as o}from"react/jsx-runtime";import{cloneDeep as t}from"lodash";import{useEffect as r,useState as i,useRef as a,useMemo as s}from"react";import n from"../../utils/StringUtils.js";import{COLORS as d}from"../../constants/Theme.js";import{StyledModal as u}from"../modals/styledModal.js";import{CHANNEL_TYPE as c}from"../template-preview/models/Channels.js";import{POD as p}from"../template-preview/models/WhatsAppTemplate.js";import{TemplateModalContext as m}from"./context/templateModalContext.js";import v from"./modalElements/Footer.js";import h from"./modalElements/TemplateSelectModalContent.js";import{convertPlaceholdersToBikDropdown as b}from"./utils/convertPlaceholdersToBikDropdown.js";const C=C=>{let{selectedTemplate:g,closeDialog:f,showVariableMapping:x,channel:P,htmlContent:E,templateVariables:S,onTemplateSelect:I,globalPlaceholders:T,showOnlyContent:y,whatsappSpecificPickerMeta:w,zIndex:V,showVariableModal:L,variableList:k,discountCode:j,setDiscountCode:D,onBackPress:M,enabledCustomText:A,variableListForImage:B,showSampleValues:F,disableEditVariable:H,pod:O,extras:W,pickerConf:N,selectedCarouselProducts:z,disableEditExpiry:R,cardWidth:$,onDeleteSelectedProducts:U,fileName:_,setFileName:q,hideDeviceContainerInPreview:G,maxCharLimit:J,onDefaultVariableSelect:K}=C;var Q,X,Y,Z,ee,le,oe,te;r((()=>{ce(E)}),[E]);const re=P===c.WHATSAPP&&"CAROUSEL"===(null===(X=null===(Q=null==g?void 0:g.components)||void 0===Q?void 0:Q[1])||void 0===X?void 0:X.type),ie=null==g?void 0:g.isProductCarouselType,[ae,se]=i(P===c.EMAIL||re?"desktop":"mobile"),[ne,de]=i(!1),[ue,ce]=i(E),[pe,me]=i(!1),[ve,he]=i([]),[be,Ce]=i({}),[ge,fe]=i(g),[xe,Pe]=i([]),[Ee,Se]=i(null),[Ie,Te]=i(!1),[ye,we]=i(null!=S?S:[]),[Ve,Le]=i(!1),[ke,je]=i(re?(null===(Z=null===(Y=null==ge?void 0:ge.mapping)||void 0===Y?void 0:Y.body)||void 0===Z?void 0:Z.length)?-1:0:-1),[De,Me]=i([]),[Ae,Be]=i(void 0),Fe=a(null),[He,Oe]=i(!1),[We,Ne]=i(!1),[ze,Re]=i(!1),[$e,Ue]=i({});r((()=>{z?Me(z):ie&&Me([])}),[z]),r((()=>{var e;if(!Ie&&ie&&(!z||0===Me.length)){const l=null===(e=null==ge?void 0:ge.components)||void 0===e?void 0:e[1].cards,o=[];null==l||l.forEach((e=>{var l;null===(l=null==e?void 0:e.components)||void 0===l||l.forEach((e=>{var l,t,r;"HEADER"===e.type&&o.push(null!==(r=null===(t=null===(l=e.example)||void 0===l?void 0:l.header_handle)||void 0===t?void 0:t[0])&&void 0!==r?r:"")}))})),Pe(o),Te(!0)}}),[Ie]);const _e=s((()=>b(T)),[T]);return r((()=>{Be(t(k))}),[k]),e(m.Provider,Object.assign({value:{hideFooterButton:ze,setHideFooterButton:Re,hideCrossButton:We,setHideCrossButton:Ne,variableList:Ae,setVariableList:Be,variableCallback:Ee,setVariableCallback:Se,showVariablePicker:ne,setShowVariablePicker:de,template:ge,setTemplate:fe,device:ae,setDevice:se,display_content:ue,setDisplayContent:ce,originalVariableList:ye,setOriginalVariableList:we,isError:pe,setIsError:me,channel:P,globalNormalizedPlaceholders:_e,templateSelectionTriggered:Ve,setTemplateSelectionTriggered:Le,enabledCustomText:A,disableEditVariable:H,pod:O,extras:W,isWhatsappCarousel:re,selectedCarouselIndex:ke,setSelectedCarouselIndex:je,isProductCarouselType:ie,templateErrorIndexes:be,cardCount:re?null===(le=null===(ee=g.components)||void 0===ee?void 0:ee[1].cards)||void 0===le?void 0:le.length:void 0,errorIndexes:ve,setErrorIndexes:he,pickerConf:N,carouselProducts:De,setCarouselProducts:Me,disableEditExpiry:R,cardWidth:$,cardImages:xe,onDeleteSelectedProducts:U,hideDeviceContainerInPreview:G,sliderRef:Fe,isCarouselHovered:He,setIsCarouselHovered:Oe,maxCharLimit:J,ctaOptionsErrors:$e,setCtaOptionsErrors:Ue,onDefaultVariableSelect:K}},{children:y?e(h,{variableListFromProps:k,channel:c.EMAIL,hideHeader:!0}):l(u,Object.assign({hideCrossButton:We,zIndex:V,centralContainerStyles:{width:re?900:P===c.EMAIL&&x?1e3:800},open:!0,onClose:()=>{null==f||f()},headingTitle:null==ge?void 0:ge.label,headingSubtitle:P===c.WHATSAPP?`${n.capitaliseFirstLetterOfString(null!==(oe=null==ge?void 0:ge.category)&&void 0!==oe?oe:"")} • ${null!==(te=null==ge?void 0:ge.templateCategory)&&void 0!==te?te:""}`:"",onBackPress:()=>{null==M||M()},modalHeaderStyles:{borderBottom:`1px solid ${d.stroke.primary}`}},{children:[e(h,{variableListFromProps:k,showSampleValues:F,showVariableMapping:x,channel:P,whatsappSpecificPickerMeta:w,showVariableModal:L,discountCode:j,setDiscountCode:D,variableListForImage:B&&(null==B?void 0:B.length)>0?B:Ae,fileName:_,setFileName:e=>{null==q||q(e)}}),I?e(v,{isWhatsappCarousel:null!=re&&re,onSelect:function(){var e;if((null==De?void 0:De.length)<1&&ie)return void me(!0);if(Object.keys($e).length>0&&O!==p.CHATBOT)return void me(!0);const l=null==I?void 0:I(ge,ye,null!=ue?ue:"",De);Ce(null!==(e=null==l?void 0:l.templateErrorIndexes)&&void 0!==e?e:{body:[],buttons:[]}),(null==l?void 0:l.errorIndexes)||(null==l?void 0:l.error)?((null==l?void 0:l.errorIndexes)&&he(l.errorIndexes),(null==l?void 0:l.error)&&me(!!(null==l?void 0:l.error))):Le(!0)}}):e(o,{})]}))}))};export{C as TemplateContextMapper};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{jsxs as e,jsx as t}from"react/jsx-runtime";import r from"react";import i from"styled-components";import{Spinner as p}from"../../spinner/Spinner.js";import{TemplatePreview as a}from"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import{COLORS as o}from"../../../constants/Theme.js";import"../../curtain/CurtainHelper.js";import"../../variable-picker-v3/model.js";import"../../template-preview/models/TemplateMeta.js";import"../../template-preview/models/WhatsAppTemplate.js";import{CHANNEL_TYPE as
|
|
1
|
+
import{jsxs as e,jsx as t}from"react/jsx-runtime";import r from"react";import i from"styled-components";import{Spinner as p}from"../../spinner/Spinner.js";import{TemplatePreview as a}from"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import{COLORS as o}from"../../../constants/Theme.js";import"../../curtain/CurtainHelper.js";import"../../variable-picker-v3/model.js";import"../../template-preview/models/TemplateMeta.js";import"../../template-preview/models/WhatsAppTemplate.js";import{CHANNEL_TYPE as m}from"../../template-preview/models/Channels.js";const s=i.div`
|
|
2
2
|
background: ${o.surface.standard};
|
|
3
3
|
border: 1px solid ${o.stroke.primary};
|
|
4
4
|
border-radius: 8px;
|
|
@@ -17,4 +17,4 @@ import{jsxs as e,jsx as t}from"react/jsx-runtime";import r from"react";import i
|
|
|
17
17
|
height: 6px;
|
|
18
18
|
background: #d9d9d9;
|
|
19
19
|
border-radius: 3px;
|
|
20
|
-
`,n=r.forwardRef(((r,i)=>{let{display_content:o,showSampleValues:n}=r;return e(
|
|
20
|
+
`,n=r.forwardRef(((r,i)=>{let{display_content:o,showSampleValues:n}=r;return e(s,Object.assign({ref:i},{children:[e(l,{children:[t(d,{}),t(d,{}),t(d,{})]}),t("div",{children:o?t(a,{showSampleValues:n,channel:m.EMAIL,hideHeader:!0,emailSpecificMeta:{emailDisplayContent:o,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_desktop",containerStyle:{height:441},templateContainerStyles:{height:"100%"}}}):t("div",Object.assign({style:{padding:20}},{children:t(p,{size:"small"})}))})]}))}));n.displayName="DesktopPreview";export{n as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{jsx as o,jsxs as n,Fragment as e}from"react/jsx-runtime";import{cloneDeep as t}from"lodash";import{useRef as i,useState as l,useEffect as a}from"react";import s from"styled-components";import{Input as d}from"../../input/Input.js";import{HEADER_TYPES as r}from"../../template-preview/models/TemplateMeta.js";import{POD as p}from"../../template-preview/models/WhatsAppTemplate.js";import{useTemplateModalContext as u}from"../context/templateModalContext.js";import{getAllDataFromTemplateComponent as c}from"../utils/getDataFromTemplateComponent.js";import{isVariable as m}from"../utils/validateIsUrl.js";import{validateInputName as v}from"../utils/validateName.js";import{BackTrackComponent as b}from"./BackTrackComponent.js";import{DiscountCodeComponent as g}from"./DiscountCodeComponent.js";import f from"./EditMediaModal.js";import h from"./EditMediaV2.js";import{EditTemplateMediaContainer as O}from"./EditMediaV2.style.js";import{useEditWhatsappTemplateMedia as j}from"./useEditWhtasappTemplateMedia.js";import C from"./VariableConnector.js";import{Container as T}from"./VariableConnectorsPanel.js";import x from"./VariableConnectorWhatsApp.js";import y from"./VariableEditorHeader.js";import E from"./WhatsAppTemplateCardButtonV2.js";const V=s=>{let{template:V,onTemplateChange:M,whatsappSpecificPickerMeta:k,showVariableModal:I,variableListForImage:L,setDiscountCode:R,fileName:U,setFileName:w}=s;var N,P,A,_,D,H,S,F,Q,q,Y,K,W,$,G,X,z,J,Z,oo,no,eo,to,io,lo,ao,so,ro,po,uo,co,mo,vo,bo,go,fo,ho,Oo,jo;const Co=V.isCarouselType,{originalVariableList:To,pod:xo,extras:yo,selectedCarouselIndex:Eo,isProductCarouselType:Vo}=u(),{descriptionComponents:Bo,urlBtns:Mo,qrbBtns:ko,imageComponent:Io,bodyVariables:Lo,headerVariables:Ro}=c(V),Uo=i(null),[wo,No]=l(!1),[Po,Ao]=l(-1===Eo?{descriptionComponents:Bo,urlBtns:Mo,qrbBtns:ko,imageComponent:Io,bodyVariables:Lo,headerVariables:Ro}:{}),{uploadMediaLink:_o,uploadMediaFiles:Do,validateMimeType:Ho}=k,So=j({uploadMediaLink:_o,uploadMediaFiles:Do,updateTemplateImageUrl:function(o,n){var e,i,l,a,s,d,r,p;let u;u=null!=Eo&&Eo>-1?{components:null===(i=null===(e=V.components[1])||void 0===e?void 0:e.cards)||void 0===i?void 0:i[Eo].components,mapping:null===(a=null===(l=null==V?void 0:V.mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a[Eo]}:Object.assign({},V);const c=null===(s=null==u?void 0:u.components)||void 0===s?void 0:s.findIndex((o=>{if("HEADER"===o.type&&"NONE"!==o.format&&"TEXT"!==o.format)return!0}));if(void 0!==c&&c>-1&&(null==u?void 0:u.components[c])){const e=Object.assign(Object.assign({},u.components[c]),{format:n,example:{header_handle:[o]}}),t=[...u.components];t[c]=e,u=Object.assign(Object.assign({},u),{components:t})}u.mapping&&(u.mapping=Object.assign(Object.assign({},u.mapping),{header:void 0}));if(null!=Eo&&Eo>-1){const o=t(V);o.components[1].cards[Eo].components=u.components,(null===(d=null==o?void 0:o.mapping)||void 0===d?void 0:d.cards)&&(null===(r=null==o?void 0:o.mapping)||void 0===r?void 0:r.cards.length)>0&&(o.mapping.cards[Eo]=null!==(p=u.mapping)&&void 0!==p?p:{}),null==M||M(Object.assign({},o)),Qo(!0)}else null==M||M(Object.assign({},u))},validateMimeType:Ho,mediaComponent:Co?Po.imageComponent:Io,fileRef:Uo}),[Fo,Qo]=l(!1),[qo,Yo]=l(U),[Ko,Wo]=l();function $o(o,n,e){var i,l,a,s,d,r,p,u,c,m;console.log("val",o);const v=null!=Eo&&Eo>-1?{components:null===(i=Object.assign({},V).components[1].cards)||void 0===i?void 0:i[Eo].components,mapping:null===(l=Object.assign({},V).mapping.cards)||void 0===l?void 0:l[Eo]}:Object.assign({},V),b=t(v),g="custom"===n&&"string"==typeof o,f=g?o:"string"!=typeof o?o.defaultValue?o.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(console.log("customValue",f),null!=Eo&&Eo>-1&&Vo){const n=Object.assign({},V).components.map((o=>{var n;return"CAROUSEL"===o.type?Object.assign(Object.assign({},o),{cards:null===(n=o.cards)||void 0===n?void 0:n.map((o=>Object.assign(Object.assign({},o),{components:o.components.map((o=>{var n,t,i;if("BUTTONS"===o.type){const l=null===(n=o.buttons)||void 0===n?void 0:n.filter((o=>"URL"===o.type));let a=null!==(t=null==l?void 0:l[e])&&void 0!==t?t:{};a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[f]}),console.log("350 currentButton",a);const s=null===(i=o.buttons)||void 0===i?void 0:i.map((o=>"URL"===o.type&&(null==o?void 0:o.text)===(null==a?void 0:a.text)?a:o));return Object.assign(Object.assign({},o),{buttons:s})}return o}))})))}):o})),i=null===(s=null===(a=Object.assign({},V).mapping)||void 0===a?void 0:a.cards)||void 0===s?void 0:s.map((n=>{var e;return Object.assign(Object.assign({},n),{buttons:null===(e=null==n?void 0:n.buttons)||void 0===e?void 0:e.map((n=>g?"((customBtnPlaceholder))":"string"!=typeof o?o.placeHolder:""))})})),l=t(V);return l.components=n,l.mapping.cards=i,void(null==M||M(Object.assign({},l)))}const h=null==b?void 0:b.components.findIndex((o=>"BUTTONS"===o.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((o=>"URL"===o.type));if((null==t?void 0:t.length)>0){const i="custom"===n&&"string"==typeof o,l=i?o:"string"!=typeof o&&o.defaultValue?o.defaultValue:"https://d.bik.ai/";let a=t[e];console.log("currentButton",a),a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[l]}),console.log("currentButton",a);const s=[...null!==(u=null===(p=null===(r=b.components)||void 0===r?void 0:r[h])||void 0===p?void 0:p.buttons)&&void 0!==u?u:[]].map((o=>"URL"===o.type&&(null==o?void 0:o.text)===(null==a?void 0:a.text)?a:o)),d=Object.assign(Object.assign({},b.components[h]),{buttons:s}),m=null===(c=b.mapping)||void 0===c?void 0:c.buttons;m&&m.length>0&&(m[e]=i?"((customBtnPlaceholder))":"string"!=typeof o?o.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 o){"checkout.checkoutUrl"===(null===(m=o.placeHolder)||void 0===m?void 0:m.slice(2,-2))?No(!0):(No(!1),null==R||R(""))}if(null!=Eo&&Eo>-1){const o=t(V);o.components[1].cards[Eo].components=b.components,o.mapping.cards[Eo]=b.mapping,null==M||M(Object.assign({},o))}else null==M||M(b)}function Go(o,n,e){var i,l,a,s,d,r,p;const u=null!=Eo&&Eo>-1?{components:null===(i=Object.assign({},V).components[1].cards)||void 0===i?void 0:i[Eo].components,mapping:null===(l=Object.assign({},V).mapping.cards)||void 0===l?void 0:l[Eo]}:Object.assign({},V);if(null!=Eo&&Eo>-1&&Vo){const n=Object.assign({},V).components.map((n=>{var t;return"CAROUSEL"===n.type?Object.assign(Object.assign({},n),{cards:null===(t=n.cards)||void 0===t?void 0:t.map((n=>Object.assign(Object.assign({},n),{components:n.components.map((n=>{var t,i,l;if("BUTTONS"===n.type){const a=null===(t=null==n?void 0:n.buttons)||void 0===t?void 0:t.filter((o=>"QUICK_REPLY"===o.type));let s=null!==(i=null==a?void 0:a[e])&&void 0!==i?i:{};s=Object.assign(Object.assign({},s),{flowId:o.flowId,flowName:o.flowName});const d=null===(l=null==n?void 0:n.buttons)||void 0===l?void 0:l.map((o=>"QUICK_REPLY"===o.type&&(null==o?void 0:o.text)===(null==s?void 0:s.text)?s:o));return Object.assign(Object.assign({},n),{buttons:d})}return n}))})))}):n})),i=t(V);return i.components=n,void(null==M||M(Object.assign({},i)))}const c=null==u?void 0:u.components.findIndex((o=>"BUTTONS"===o.type));if(void 0!==c&&c>-1){const n=null===(s=null===(a=null==u?void 0:u.components[c])||void 0===a?void 0:a.buttons)||void 0===s?void 0:s.filter((o=>"QUICK_REPLY"===o.type));if(n){let t=n[e];t=Object.assign(Object.assign({},t),{flowId:o.flowId,flowName:o.flowName});const i=[...null!==(p=null===(r=null===(d=u.components)||void 0===d?void 0:d[c])||void 0===r?void 0:r.buttons)&&void 0!==p?p:[]].map((o=>"QUICK_REPLY"===o.type&&(null==o?void 0:o.text)===(null==t?void 0:t.text)?t:o)),l=Object.assign(Object.assign({},u.components[c]),{buttons:i}),a=[...u.components];a[c]=l,u.components=a}}if(null!=Eo&&Eo>-1){const o=t(V);o.components[1].cards[Eo].components=u.components,null==M||M(Object.assign({},o))}else null==M||M(u)}a((()=>{var o,n;if(null===(o=V.mapping.buttons)||void 0===o?void 0:o.find((o=>"checkout.checkoutUrl"===o.slice(2,-2))))No(!0);else{No(!1);const o=null===(n=null==yo?void 0:yo.discountCodeExtra)||void 0===n?void 0:n[1];null==o||o("")}}),[V]),a((()=>{var o,n,e,t;if(null!=Eo&&Eo>-1){const i={components:null===(n=null===(o=V.components[1])||void 0===o?void 0:o.cards)||void 0===n?void 0:n[Eo].components,mapping:null===(t=null===(e=null==V?void 0:V.mapping)||void 0===e?void 0:e.cards)||void 0===t?void 0:t[Eo]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p}=c(i);Ao({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p})}else if(null!=Eo&&-1===Eo){const{descriptionComponents:o,urlBtns:n,qrbBtns:e,imageComponent:t,bodyVariables:i,headerVariables:l}=c(V);Ao({descriptionComponents:o,urlBtns:n,qrbBtns:e,imageComponent:t,bodyVariables:i,headerVariables:l})}}),[Eo]),a((()=>{var o,n,e,t;if(null!=Eo&&Eo>-1&&Fo){const i={components:null===(n=null===(o=V.components[1])||void 0===o?void 0:o.cards)||void 0===n?void 0:n[Eo].components,mapping:null===(t=null===(e=null==V?void 0:V.mapping)||void 0===e?void 0:e.cards)||void 0===t?void 0:t[Eo]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p}=c(i);Ao({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p}),Qo(!1)}}),[Fo]);const Xo=Co?Po.imageComponent:Io;return So.openEditMedia?o(T,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:o(f,{mediaComponentFormat:null!==(N=Xo.format)&&void 0!==N?N:r.IMAGE,uploadMedia:So.uploadMedia,variableListForImage:L||[],useEditWhatsappTemplateMediaResponse:So,setOpenEditMedia:So.setOpenEditMedia,openEditMedia:So.openEditMedia,editIconRef:So.editIconRef,fileRef:Uo})})):n(T,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:Vo?"420px":"auto"}},{children:[!!Po.imageComponent&&!Vo&&n(O,{children:[o(h,{imageName:null!==(A=null===(P=null==Xo?void 0:Xo.example)||void 0===P?void 0:P.header_handle)&&void 0!==A?A:[],handleImageChange:So.handleImageChange,mediaType:null==Xo?void 0:Xo.format,error:So.error,isLoading:So.loading,setOpenEditMedia:So.setOpenEditMedia,selectedVariable:m(null!==(H=null===(D=null===(_=null==Xo?void 0:Xo.example)||void 0===_?void 0:_.header_handle)||void 0===D?void 0:D[0])&&void 0!==H?H:"")?null===(F=null===(S=null==Xo?void 0:Xo.example)||void 0===S?void 0:S.header_handle)||void 0===F?void 0:F[0]:(null===(q=null===(Q=null==V?void 0:V.mapping)||void 0===Q?void 0:Q.header)||void 0===q?void 0:q[0])?null===(K=null===(Y=null==V?void 0:V.mapping)||void 0===Y?void 0:Y.header)||void 0===K?void 0:K[0]:So.selectedVariable}),(null==Io?void 0:Io.format)==r.DOCUMENT?o(B,{children:o(d,{labelText:"PDF Name",placeholder:"Enter the name",value:qo,errorMessage:Ko||void 0,onBlur:()=>{if(!qo)return null==w||w(""),void Wo("PDF name is Required");const o=v(qo);null==w||w(qo),Wo(o?"Please enter a valid PDF name":void 0)},onChangeText:o=>{Wo(""),Yo(o)}})}):o(e,{})]}),(null===(W=Po.bodyVariables)||void 0===W?void 0:W.length)>0&&o(y,{containerStyle:{paddingTop:Po.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===($=Po.descriptionComponents)||void 0===$?void 0:$.map(((n,e)=>o(x,{originalVariableList:null!=Eo&&Eo>-1?To.cards[Eo]:To,type:n.type,descriptionComponent:n.component,showVariableModal:I},e))),(null===(z=null===(X=null!=Eo&&Eo>-1?null===(G=To.cards[Eo])||void 0===G?void 0:G.buttons:null==To?void 0:To.buttons)||void 0===X?void 0:X.filter((o=>"URL"===o.type)))||void 0===z?void 0:z.length)>0&&o(y,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(oo=null===(Z=null!=Eo&&Eo>-1?null===(J=To.cards[Eo])||void 0===J?void 0:J.buttons:null==To?void 0:To.buttons)||void 0===Z?void 0:Z.filter((o=>xo===p.CHATBOT||"URL"===o.type)))||void 0===oo?void 0:oo.map(((n,e)=>{if("URL"===n.type)return o(E,{variableListIndex:e,CTAoptions:null==k?void 0:k.CTAoptions,button:n,currentVariableList:null!=Eo&&Eo>-1?Object.assign({},To.cards[Eo]):Object.assign({},To),updateSelectedURLTemplateBtn:$o},`${e}_${Eo}`)})),xo===p.CHATBOT&&(null===(eo=null===(no=ko[0])||void 0===no?void 0:no.component)||void 0===eo?void 0:eo.buttons)&&(null===(lo=null===(io=null===(to=ko[0])||void 0===to?void 0:to.component)||void 0===io?void 0:io.buttons)||void 0===lo?void 0:lo.length)>0&&o(b,{backTrackMessage:null===(ao=null==yo?void 0:yo.backTrackExtra)||void 0===ao?void 0:ao[0],setBackTrackMessage:null===(so=null==yo?void 0:yo.backTrackExtra)||void 0===so?void 0:so[1]}),(null===(uo=null===(po=null!=Eo&&Eo>-1?null===(ro=To.cards[Eo])||void 0===ro?void 0:ro.buttons:null==To?void 0:To.buttons)||void 0===po?void 0:po.filter((o=>"QUICK_REPLY"===o.type)))||void 0===uo?void 0:uo.length)>0&&(xo!==p.CHATBOT?o(y,{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(b,{backTrackMessage:null===(co=null==yo?void 0:yo.backTrackExtra)||void 0===co?void 0:co[0],setBackTrackMessage:null===(mo=null==yo?void 0:yo.backTrackExtra)||void 0===mo?void 0:mo[1]})),null===(go=null===(bo=null!=Eo&&Eo>-1?null===(vo=To.cards[Eo])||void 0===vo?void 0:vo.buttons:null==To?void 0:To.buttons)||void 0===bo?void 0:bo.filter((o=>"QUICK_REPLY"===o.type)))||void 0===go?void 0:go.map(((n,e)=>{if("QUICK_REPLY"===n.type&&xo!==p.CHATBOT)return o(E,{variableListIndex:e,QRBoptions:null==k?void 0:k.QRBoptions,button:n,currentVariableList:null!=Eo&&Eo>-1?Object.assign({},To.cards[Eo]):Object.assign({},To),updateSelectedQRBTemplateBtn:Go},`${e}_${Eo}`)})),xo===p.CHATBOT&&wo&&o(g,{discountCode:null===(fo=null==yo?void 0:yo.discountCodeExtra)||void 0===fo?void 0:fo[0],setDiscountCode:null===(ho=null==yo?void 0:yo.discountCodeExtra)||void 0===ho?void 0:ho[1]}),null===(jo=null!=Eo&&Eo>-1?null===(Oo=To.cards[Eo])||void 0===Oo?void 0:Oo.buttons:null==To?void 0:To.buttons)||void 0===jo?void 0:jo.map(((n,e)=>{var t,i,l;if("COPY_CODE"===n.type)return o(C,{index:e,variable:{variableName:null!==(t=n.text)&&void 0!==t?t:"Copy Code",updatedValue:null!==(i=n.buttonVariable)&&void 0!==i?i:"",type:"string",isEditableVariable:!0,index:null!==(l=n.index)&&void 0!==l?l:0},showVariableModal:!0,componentType:"BUTTONS",buttonType:n.type},e)}))]}))},B=s.div`
|
|
1
|
+
import{jsx as o,jsxs as n,Fragment as e}from"react/jsx-runtime";import{cloneDeep as t}from"lodash";import{useRef as i,useState as l,useEffect as a}from"react";import s from"styled-components";import{Input as d}from"../../input/Input.js";import{HEADER_TYPES as r}from"../../template-preview/models/TemplateMeta.js";import{POD as p}from"../../template-preview/models/WhatsAppTemplate.js";import{useTemplateModalContext as u}from"../context/templateModalContext.js";import{getAllDataFromTemplateComponent as c}from"../utils/getDataFromTemplateComponent.js";import{isVariable as m}from"../utils/validateIsUrl.js";import{validateInputName as v}from"../utils/validateName.js";import{BackTrackComponent as b}from"./BackTrackComponent.js";import{DiscountCodeComponent as g}from"./DiscountCodeComponent.js";import f from"./EditMediaModal.js";import h from"./EditMediaV2.js";import{EditTemplateMediaContainer as O}from"./EditMediaV2.style.js";import{useEditWhatsappTemplateMedia as j}from"./useEditWhtasappTemplateMedia.js";import C from"./VariableConnector.js";import{Container as T}from"./VariableConnectorsPanel.js";import x from"./VariableConnectorWhatsApp.js";import y from"./VariableEditorHeader.js";import E from"./WhatsAppTemplateCardButtonV2.js";const V=s=>{let{template:V,onTemplateChange:M,whatsappSpecificPickerMeta:k,showVariableModal:I,variableListForImage:L,setDiscountCode:R,fileName:U,setFileName:w}=s;var N,P,A,_,D,H,S,F,Q,q,Y,K,W,$,G,X,z,J,Z,oo,no,eo,to,io,lo,ao,so,ro,po,uo,co,mo,vo,bo,go,fo,ho,Oo,jo;const Co=V.isCarouselType,{originalVariableList:To,pod:xo,extras:yo,selectedCarouselIndex:Eo,isProductCarouselType:Vo}=u(),{descriptionComponents:Bo,urlBtns:Mo,qrbBtns:ko,imageComponent:Io,bodyVariables:Lo,headerVariables:Ro}=c(V),Uo=i(null),[wo,No]=l(!1),[Po,Ao]=l(-1===Eo?{descriptionComponents:Bo,urlBtns:Mo,qrbBtns:ko,imageComponent:Io,bodyVariables:Lo,headerVariables:Ro}:{}),{uploadMediaLink:_o,uploadMediaFiles:Do,validateMimeType:Ho}=k,So=j({uploadMediaLink:_o,uploadMediaFiles:Do,updateTemplateImageUrl:function(o,n){var e,i,l,a,s,d,r,p;let u;u=null!=Eo&&Eo>-1?{components:null===(i=null===(e=V.components[1])||void 0===e?void 0:e.cards)||void 0===i?void 0:i[Eo].components,mapping:null===(a=null===(l=null==V?void 0:V.mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a[Eo]}:Object.assign({},V);const c=null===(s=null==u?void 0:u.components)||void 0===s?void 0:s.findIndex((o=>{if("HEADER"===o.type&&"NONE"!==o.format&&"TEXT"!==o.format)return!0}));if(void 0!==c&&c>-1&&(null==u?void 0:u.components[c])){const e=Object.assign(Object.assign({},u.components[c]),{format:n,example:{header_handle:[o]}}),t=[...u.components];t[c]=e,u=Object.assign(Object.assign({},u),{components:t})}u.mapping&&(u.mapping=Object.assign(Object.assign({},u.mapping),{header:void 0}));if(null!=Eo&&Eo>-1){const o=t(V);o.components[1].cards[Eo].components=u.components,(null===(d=null==o?void 0:o.mapping)||void 0===d?void 0:d.cards)&&(null===(r=null==o?void 0:o.mapping)||void 0===r?void 0:r.cards.length)>0&&(o.mapping.cards[Eo]=null!==(p=u.mapping)&&void 0!==p?p:{}),null==M||M(Object.assign({},o)),Qo(!0)}else null==M||M(Object.assign({},u))},validateMimeType:Ho,mediaComponent:Co?Po.imageComponent:Io,fileRef:Uo}),[Fo,Qo]=l(!1),[qo,Yo]=l(U),[Ko,Wo]=l();function $o(o,n,e){var i,l,a,s,d,r,p,u,c,m;const v=null!=Eo&&Eo>-1?{components:null===(i=Object.assign({},V).components[1].cards)||void 0===i?void 0:i[Eo].components,mapping:null===(l=Object.assign({},V).mapping.cards)||void 0===l?void 0:l[Eo]}:Object.assign({},V),b=t(v),g="custom"===n&&"string"==typeof o,f=g?o:"string"!=typeof o?o.defaultValue?o.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=Eo&&Eo>-1&&Vo){const n=Object.assign({},V).components.map((o=>{var n;return"CAROUSEL"===o.type?Object.assign(Object.assign({},o),{cards:null===(n=o.cards)||void 0===n?void 0:n.map((o=>Object.assign(Object.assign({},o),{components:o.components.map((o=>{var n,t,i;if("BUTTONS"===o.type){const l=null===(n=o.buttons)||void 0===n?void 0:n.filter((o=>"URL"===o.type));let a=null!==(t=null==l?void 0:l[e])&&void 0!==t?t:{};a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[f]});const s=null===(i=o.buttons)||void 0===i?void 0:i.map((o=>"URL"===o.type&&(null==o?void 0:o.text)===(null==a?void 0:a.text)?a:o));return Object.assign(Object.assign({},o),{buttons:s})}return o}))})))}):o})),i=null===(s=null===(a=Object.assign({},V).mapping)||void 0===a?void 0:a.cards)||void 0===s?void 0:s.map((n=>{var e;return Object.assign(Object.assign({},n),{buttons:null===(e=null==n?void 0:n.buttons)||void 0===e?void 0:e.map((n=>g?"((customBtnPlaceholder))":"string"!=typeof o?o.placeHolder:""))})})),l=t(V);return l.components=n,l.mapping.cards=i,void(null==M||M(Object.assign({},l)))}const h=null==b?void 0:b.components.findIndex((o=>"BUTTONS"===o.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((o=>"URL"===o.type));if((null==t?void 0:t.length)>0){const i="custom"===n&&"string"==typeof o,l=i?o:"string"!=typeof o&&o.defaultValue?o.defaultValue:"https://d.bik.ai/";let a=t[e];a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[l]});const s=[...null!==(u=null===(p=null===(r=b.components)||void 0===r?void 0:r[h])||void 0===p?void 0:p.buttons)&&void 0!==u?u:[]].map((o=>"URL"===o.type&&(null==o?void 0:o.text)===(null==a?void 0:a.text)?a:o)),d=Object.assign(Object.assign({},b.components[h]),{buttons:s}),m=null===(c=b.mapping)||void 0===c?void 0:c.buttons;m&&m.length>0&&(m[e]=i?"((customBtnPlaceholder))":"string"!=typeof o?o.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 o){"checkout.checkoutUrl"===(null===(m=o.placeHolder)||void 0===m?void 0:m.slice(2,-2))?No(!0):(No(!1),null==R||R(""))}if(null!=Eo&&Eo>-1){const o=t(V);o.components[1].cards[Eo].components=b.components,o.mapping.cards[Eo]=b.mapping,null==M||M(Object.assign({},o))}else null==M||M(b)}function Go(o,n,e){var i,l,a,s,d,r,p;const u=null!=Eo&&Eo>-1?{components:null===(i=Object.assign({},V).components[1].cards)||void 0===i?void 0:i[Eo].components,mapping:null===(l=Object.assign({},V).mapping.cards)||void 0===l?void 0:l[Eo]}:Object.assign({},V);if(null!=Eo&&Eo>-1&&Vo){const n=Object.assign({},V).components.map((n=>{var t;return"CAROUSEL"===n.type?Object.assign(Object.assign({},n),{cards:null===(t=n.cards)||void 0===t?void 0:t.map((n=>Object.assign(Object.assign({},n),{components:n.components.map((n=>{var t,i,l;if("BUTTONS"===n.type){const a=null===(t=null==n?void 0:n.buttons)||void 0===t?void 0:t.filter((o=>"QUICK_REPLY"===o.type));let s=null!==(i=null==a?void 0:a[e])&&void 0!==i?i:{};s=Object.assign(Object.assign({},s),{flowId:o.flowId,flowName:o.flowName});const d=null===(l=null==n?void 0:n.buttons)||void 0===l?void 0:l.map((o=>"QUICK_REPLY"===o.type&&(null==o?void 0:o.text)===(null==s?void 0:s.text)?s:o));return Object.assign(Object.assign({},n),{buttons:d})}return n}))})))}):n})),i=t(V);return i.components=n,void(null==M||M(Object.assign({},i)))}const c=null==u?void 0:u.components.findIndex((o=>"BUTTONS"===o.type));if(void 0!==c&&c>-1){const n=null===(s=null===(a=null==u?void 0:u.components[c])||void 0===a?void 0:a.buttons)||void 0===s?void 0:s.filter((o=>"QUICK_REPLY"===o.type));if(n){let t=n[e];t=Object.assign(Object.assign({},t),{flowId:o.flowId,flowName:o.flowName});const i=[...null!==(p=null===(r=null===(d=u.components)||void 0===d?void 0:d[c])||void 0===r?void 0:r.buttons)&&void 0!==p?p:[]].map((o=>"QUICK_REPLY"===o.type&&(null==o?void 0:o.text)===(null==t?void 0:t.text)?t:o)),l=Object.assign(Object.assign({},u.components[c]),{buttons:i}),a=[...u.components];a[c]=l,u.components=a}}if(null!=Eo&&Eo>-1){const o=t(V);o.components[1].cards[Eo].components=u.components,null==M||M(Object.assign({},o))}else null==M||M(u)}a((()=>{var o,n;if(null===(o=V.mapping.buttons)||void 0===o?void 0:o.find((o=>"checkout.checkoutUrl"===o.slice(2,-2))))No(!0);else{No(!1);const o=null===(n=null==yo?void 0:yo.discountCodeExtra)||void 0===n?void 0:n[1];null==o||o("")}}),[V]),a((()=>{var o,n,e,t;if(null!=Eo&&Eo>-1){const i={components:null===(n=null===(o=V.components[1])||void 0===o?void 0:o.cards)||void 0===n?void 0:n[Eo].components,mapping:null===(t=null===(e=null==V?void 0:V.mapping)||void 0===e?void 0:e.cards)||void 0===t?void 0:t[Eo]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p}=c(i);Ao({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p})}else if(null!=Eo&&-1===Eo){const{descriptionComponents:o,urlBtns:n,qrbBtns:e,imageComponent:t,bodyVariables:i,headerVariables:l}=c(V);Ao({descriptionComponents:o,urlBtns:n,qrbBtns:e,imageComponent:t,bodyVariables:i,headerVariables:l})}}),[Eo]),a((()=>{var o,n,e,t;if(null!=Eo&&Eo>-1&&Fo){const i={components:null===(n=null===(o=V.components[1])||void 0===o?void 0:o.cards)||void 0===n?void 0:n[Eo].components,mapping:null===(t=null===(e=null==V?void 0:V.mapping)||void 0===e?void 0:e.cards)||void 0===t?void 0:t[Eo]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p}=c(i);Ao({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p}),Qo(!1)}}),[Fo]);const Xo=Co?Po.imageComponent:Io;return So.openEditMedia?o(T,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:o(f,{mediaComponentFormat:null!==(N=Xo.format)&&void 0!==N?N:r.IMAGE,uploadMedia:So.uploadMedia,variableListForImage:L||[],useEditWhatsappTemplateMediaResponse:So,setOpenEditMedia:So.setOpenEditMedia,openEditMedia:So.openEditMedia,editIconRef:So.editIconRef,fileRef:Uo})})):n(T,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:Vo?"420px":"auto"}},{children:[!!Po.imageComponent&&!Vo&&n(O,{children:[o(h,{imageName:null!==(A=null===(P=null==Xo?void 0:Xo.example)||void 0===P?void 0:P.header_handle)&&void 0!==A?A:[],handleImageChange:So.handleImageChange,mediaType:null==Xo?void 0:Xo.format,error:So.error,isLoading:So.loading,setOpenEditMedia:So.setOpenEditMedia,selectedVariable:m(null!==(H=null===(D=null===(_=null==Xo?void 0:Xo.example)||void 0===_?void 0:_.header_handle)||void 0===D?void 0:D[0])&&void 0!==H?H:"")?null===(F=null===(S=null==Xo?void 0:Xo.example)||void 0===S?void 0:S.header_handle)||void 0===F?void 0:F[0]:(null===(q=null===(Q=null==V?void 0:V.mapping)||void 0===Q?void 0:Q.header)||void 0===q?void 0:q[0])?null===(K=null===(Y=null==V?void 0:V.mapping)||void 0===Y?void 0:Y.header)||void 0===K?void 0:K[0]:So.selectedVariable}),(null==Io?void 0:Io.format)==r.DOCUMENT?o(B,{children:o(d,{labelText:"PDF Name",placeholder:"Enter the name",value:qo,errorMessage:Ko||void 0,onBlur:()=>{if(!qo)return null==w||w(""),void Wo("PDF name is Required");const o=v(qo);null==w||w(qo),Wo(o?"Please enter a valid PDF name":void 0)},onChangeText:o=>{Wo(""),Yo(o)}})}):o(e,{})]}),(null===(W=Po.bodyVariables)||void 0===W?void 0:W.length)>0&&o(y,{containerStyle:{paddingTop:Po.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===($=Po.descriptionComponents)||void 0===$?void 0:$.map(((n,e)=>o(x,{originalVariableList:null!=Eo&&Eo>-1?To.cards[Eo]:To,type:n.type,descriptionComponent:n.component,showVariableModal:I},e))),(null===(z=null===(X=null!=Eo&&Eo>-1?null===(G=To.cards[Eo])||void 0===G?void 0:G.buttons:null==To?void 0:To.buttons)||void 0===X?void 0:X.filter((o=>"URL"===o.type)))||void 0===z?void 0:z.length)>0&&o(y,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(oo=null===(Z=null!=Eo&&Eo>-1?null===(J=To.cards[Eo])||void 0===J?void 0:J.buttons:null==To?void 0:To.buttons)||void 0===Z?void 0:Z.filter((o=>xo===p.CHATBOT||"URL"===o.type)))||void 0===oo?void 0:oo.map(((n,e)=>{if("URL"===n.type)return o(E,{variableListIndex:e,CTAoptions:null==k?void 0:k.CTAoptions,button:n,currentVariableList:null!=Eo&&Eo>-1?Object.assign({},To.cards[Eo]):Object.assign({},To),updateSelectedURLTemplateBtn:$o},`${e}_${Eo}`)})),xo===p.CHATBOT&&(null===(eo=null===(no=ko[0])||void 0===no?void 0:no.component)||void 0===eo?void 0:eo.buttons)&&(null===(lo=null===(io=null===(to=ko[0])||void 0===to?void 0:to.component)||void 0===io?void 0:io.buttons)||void 0===lo?void 0:lo.length)>0&&o(b,{backTrackMessage:null===(ao=null==yo?void 0:yo.backTrackExtra)||void 0===ao?void 0:ao[0],setBackTrackMessage:null===(so=null==yo?void 0:yo.backTrackExtra)||void 0===so?void 0:so[1]}),(null===(uo=null===(po=null!=Eo&&Eo>-1?null===(ro=To.cards[Eo])||void 0===ro?void 0:ro.buttons:null==To?void 0:To.buttons)||void 0===po?void 0:po.filter((o=>"QUICK_REPLY"===o.type)))||void 0===uo?void 0:uo.length)>0&&(xo!==p.CHATBOT?o(y,{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(b,{backTrackMessage:null===(co=null==yo?void 0:yo.backTrackExtra)||void 0===co?void 0:co[0],setBackTrackMessage:null===(mo=null==yo?void 0:yo.backTrackExtra)||void 0===mo?void 0:mo[1]})),null===(go=null===(bo=null!=Eo&&Eo>-1?null===(vo=To.cards[Eo])||void 0===vo?void 0:vo.buttons:null==To?void 0:To.buttons)||void 0===bo?void 0:bo.filter((o=>"QUICK_REPLY"===o.type)))||void 0===go?void 0:go.map(((n,e)=>{if("QUICK_REPLY"===n.type&&xo!==p.CHATBOT)return o(E,{variableListIndex:e,QRBoptions:null==k?void 0:k.QRBoptions,button:n,currentVariableList:null!=Eo&&Eo>-1?Object.assign({},To.cards[Eo]):Object.assign({},To),updateSelectedQRBTemplateBtn:Go},`${e}_${Eo}`)})),xo===p.CHATBOT&&wo&&o(g,{discountCode:null===(fo=null==yo?void 0:yo.discountCodeExtra)||void 0===fo?void 0:fo[0],setDiscountCode:null===(ho=null==yo?void 0:yo.discountCodeExtra)||void 0===ho?void 0:ho[1]}),null===(jo=null!=Eo&&Eo>-1?null===(Oo=To.cards[Eo])||void 0===Oo?void 0:Oo.buttons:null==To?void 0:To.buttons)||void 0===jo?void 0:jo.map(((n,e)=>{var t,i,l;if("COPY_CODE"===n.type)return o(C,{index:e,variable:{variableName:null!==(t=n.text)&&void 0!==t?t:"Copy Code",updatedValue:null!==(i=n.buttonVariable)&&void 0!==i?i:"",type:"string",isEditableVariable:!0,index:null!==(l=n.index)&&void 0!==l?l:0},showVariableModal:!0,componentType:"BUTTONS",buttonType:n.type},e)}))]}))},B=s.div`
|
|
2
2
|
padding-top: 24px;
|
|
3
3
|
padding-left: 10px;
|
|
4
4
|
padding-right: 10px;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{jsx as e,Fragment as t,jsxs as i}from"react/jsx-runtime";import a from"react";import o from"styled-components";import{TemplatePreview as r}from"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import"../../../constants/Theme.js";import"../../curtain/CurtainHelper.js";import"../../variable-picker-v3/model.js";import"../../template-preview/models/TemplateMeta.js";import{POD as p}from"../../template-preview/models/WhatsAppTemplate.js";import{useTemplateModalContext as s}from"../context/templateModalContext.js";import{getPreviewWidth as l}from"../utils/getPreviewDimension.js";const
|
|
1
|
+
import{jsx as e,Fragment as t,jsxs as i}from"react/jsx-runtime";import a from"react";import o from"styled-components";import{TemplatePreview as r}from"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import"../../../constants/Theme.js";import"../../curtain/CurtainHelper.js";import"../../variable-picker-v3/model.js";import"../../template-preview/models/TemplateMeta.js";import{POD as p}from"../../template-preview/models/WhatsAppTemplate.js";import{useTemplateModalContext as s}from"../context/templateModalContext.js";import{getPreviewWidth as l}from"../utils/getPreviewDimension.js";const m=o.div`
|
|
2
2
|
position: relative;
|
|
3
3
|
height: 100%;
|
|
4
4
|
border-radius: 31px;
|
|
@@ -6,7 +6,7 @@ import{jsx as e,Fragment as t,jsxs as i}from"react/jsx-runtime";import a from"re
|
|
|
6
6
|
background-color: white;
|
|
7
7
|
margin: auto;
|
|
8
8
|
overflow-y: auto;
|
|
9
|
-
`,
|
|
9
|
+
`,n=o.div`
|
|
10
10
|
position: absolute;
|
|
11
11
|
flex: 1;
|
|
12
12
|
background-color: white;
|
|
@@ -17,7 +17,7 @@ import{jsx as e,Fragment as t,jsxs as i}from"react/jsx-runtime";import a from"re
|
|
|
17
17
|
height: calc(100% - 17px);
|
|
18
18
|
border-radius: 16px;
|
|
19
19
|
overflow-y: auto;
|
|
20
|
-
`,c=a.forwardRef(((a,o)=>{let{display_content:c,channel:d,template:f,showSampleValues:w}=a;const{pod:b,hideDeviceContainerInPreview:v}=s(),g={showSampleValues:w,template:f,channel:d,smsSpecificMeta:{smsDisplayContent:c},whatsAppSpecificMeta:{showWhatsAppHeader:!0,whatsAppExtras:b!==p.CHATBOT,containerStyle:{border:"none",borderBottomRightRadius:0,borderBottomLeftRadius:0,minHeight:426,width:240}},size:"small",hideHeader:!0,emailSpecificMeta:{emailDisplayContent:c,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_mobile",containerStyle:{height:"100%",width:"100%"},templateContainerStyles:{height:"100%"}},isPreview:!0
|
|
20
|
+
`,c=a.forwardRef(((a,o)=>{let{display_content:c,channel:d,template:f,showSampleValues:w}=a;const{pod:b,hideDeviceContainerInPreview:v}=s(),g={showSampleValues:w,template:f,channel:d,smsSpecificMeta:{smsDisplayContent:c},whatsAppSpecificMeta:{showWhatsAppHeader:!0,whatsAppExtras:b!==p.CHATBOT,containerStyle:{border:"none",borderBottomRightRadius:0,borderBottomLeftRadius:0,minHeight:426,width:240}},size:"small",hideHeader:!0,emailSpecificMeta:{emailDisplayContent:c,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_mobile",containerStyle:{height:"100%",width:"100%"},templateContainerStyles:{height:"100%"}},isPreview:!0};return v?e(h,{children:e(r,Object.assign({},g))}):e(t,{children:i(m,Object.assign({channel:d},{children:[e("img",{alt:"",src:"https://firebasestorage.googleapis.com/v0/b/staging-bikayi.appspot.com/o/bik%2FkNwEVoGlLpVjOsXoO1M8WgvWicP2%2F6f07b850-8b4b-4d58-96cc-8ba6df7b4e4a-Device___Frame.jpg?alt=media&token=253f1bfe-8481-4f54-bdef-3c0a73697d6a",style:{width:l(d),height:443}}),e(n,Object.assign({ref:o},{children:e(r,Object.assign({},g))}))]}))})}));c.displayName="MobilePreview";const h=o.div`
|
|
21
21
|
display: flex;
|
|
22
22
|
align-items: center;
|
|
23
23
|
justify-content: center;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{Button as a}from"../button/Button.js";import{TitleRegular as n}from"../TypographyStyle.js";import{EmailContainer as s,Header as r,IframeContainer as o,ImageContainer as
|
|
1
|
+
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{Button as a}from"../button/Button.js";import{TitleRegular as n}from"../TypographyStyle.js";import{EmailContainer as s,Header as r,IframeContainer as o,ImageContainer as p,CardLoadingContainer as i,ViewButton as l}from"./EmailTemplatePreview.styled.js";const d="https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c",c=c=>{let{template:m,handleViewTemplate:u,hideHeader:h,hideViewButton:y,containerStyle:b,emailHtmlContainerId:g,emailDisplayContent:f,applyBorderBottom:C}=c;return e(s,Object.assign({hideHeader:h,style:Object.assign({},null!=b?b:{})},{children:[!h&&t(r,{children:t(n,Object.assign({style:{maxWidth:"100%"}},{children:m.name}))}),t(o,Object.assign({applyBorderBottom:C},{children:f?t("iframe",{title:"Email template preview",id:null!=g?g:"",width:"100%",srcDoc:(j=f,j.replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{##orderProducts}}<\/span><span>\s*<\/span>/g,"").replace(/src="<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{product.photoUrl}}<\/span><span> <\/span>"/g,`src=${d}`).replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{\/\/orderProducts}}<\/span><span>\s*<\/span>/g,"").replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{##abandonedCartProducts}}<\/span><span>\s*<\/span>/g,"").replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{\/\/abandonedCartProducts}}<\/span><span>\s*<\/span>/g,"")),height:"100%",style:{pointerEvents:"none"}}):t(p,Object.assign({hideHeader:h},{children:t(i,{})}))})),!y&&t(l,{children:t(a,{buttonType:"tertiary",buttonText:"View",onClick:()=>{u&&u()}})})]}));var j};export{d as DEFAULT_IMAGE,c as default};
|
|
@@ -21,6 +21,5 @@ export interface TemplatePreviewProps {
|
|
|
21
21
|
isWhatsappCarousel?: boolean;
|
|
22
22
|
isPreview?: boolean;
|
|
23
23
|
applyBorderBottom?: boolean;
|
|
24
|
-
hidePointerEvents?: boolean;
|
|
25
24
|
}
|
|
26
|
-
export declare const TemplatePreview: ({ template, channel, whatsAppSpecificMeta, templateCreationsInfo, hideHeader, size, onlyTemplateContent, emailSpecificMeta, smsSpecificMeta, showSampleValues, carouselCardIndex, isWhatsappCarousel, isPreview, applyBorderBottom,
|
|
25
|
+
export declare const TemplatePreview: ({ template, channel, whatsAppSpecificMeta, templateCreationsInfo, hideHeader, size, onlyTemplateContent, emailSpecificMeta, smsSpecificMeta, showSampleValues, carouselCardIndex, isWhatsappCarousel, isPreview, applyBorderBottom, }: TemplatePreviewProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as
|
|
1
|
+
import{jsx as e,jsxs as l,Fragment as t}from"react/jsx-runtime";import{useTemplateModalContext as i}from"../template-context-mapper/context/templateModalContext.js";import a from"../../utils/StringUtils.js";import{COLORS as o}from"../../constants/Theme.js";import{TitleRegular as n}from"../TypographyStyle.js";import r from"./EmailTemplateThumbnailPreview.js";import{CHANNEL_TYPE as s}from"./models/Channels.js";import d from"./SmsTemplatePreview.js";import p from"./WhatsAppTemplatePreview.js";const m=m=>{let{template:c,channel:v,whatsAppSpecificMeta:h,templateCreationsInfo:y,hideHeader:b,size:g,onlyTemplateContent:C,emailSpecificMeta:S,smsSpecificMeta:j,showSampleValues:T,carouselCardIndex:f,isWhatsappCarousel:w,isPreview:x,applyBorderBottom:W}=m;var H,O;const{setSelectedCarouselIndex:A}=i();return v===s.SMS?e("div",Object.assign({style:Object.assign({marginTop:y?16:0,border:y?`1px solid ${o.stroke.primary}`:"none",borderRadius:4},null==j?void 0:j.templateContainerStyles)},{children:e(d,{template:c,hideHeader:b,onlyTemplateContent:C,size:null!=g?g:"large",variableStore:null==j?void 0:j.smsVariableStore,display_content:null==j?void 0:j.smsDisplayContent,uniqueId:null==j?void 0:j.uniqueId})})):v===s.EMAIL?e("div",Object.assign({style:Object.assign({marginTop:y?16:0},null==S?void 0:S.templateContainerStyles)},{children:e(r,{template:c,handleViewTemplate:()=>{var e;null===(e=null==S?void 0:S.handleViewTemplate)||void 0===e||e.call(S)},hideHeader:b,hideViewButton:null==S?void 0:S.hideViewButtonForEmail,containerStyle:null==S?void 0:S.containerStyle,emailDisplayContent:null==S?void 0:S.emailDisplayContent,emailHtmlContainerId:null==S?void 0:S.emailHtmlContainerId,applyBorderBottom:W})})):v===s.WHATSAPP?l("div",Object.assign({style:Object.assign(Object.assign({},null==h?void 0:h.templateContainerStyles),y?u.WhatsAppWrapper:{}),onClick:()=>{var e,l;if(A&&w){if(-1===f&&!(null===(l=null===(e=null==c?void 0:c.mapping)||void 0===e?void 0:e.body)||void 0===l?void 0:l.length))return;A(null!=f?f:-1)}}},{children:[y?e("div",Object.assign({style:{padding:16}},{children:e(n,{children:a.convertToTitleCase(null!==(H=null==c?void 0:c.label)&&void 0!==H?H:"")})})):e(t,{}),e(p,{showSampleValues:T,showHeader:null==h?void 0:h.showWhatsAppHeader,extras:null==h?void 0:h.whatsAppExtras,template:c,size:y?"small":null!=g?g:"large",containerStyle:Object.assign(Object.assign({borderWidth:y?0:1,borderTopWidth:1},null!==(O=null==h?void 0:h.containerStyle)&&void 0!==O?O:{}),{height:"100%"}),zeroStateComponent:null==h?void 0:h.zeroStateComponent,usePlaceHolderName:null==h?void 0:h.usePlaceHolderName,carouselCardIndex:f,isWhatsappCarousel:w,isPreview:x})]})):e(t,{})},u={WhatsAppWrapper:{backgroundColor:o.surface.standard,borderRadius:4,border:`1px solid ${o.background.inactive}`,marginTop:16}};export{m as TemplatePreview};
|