@bikdotai/bik-component-library 0.0.730-beta.2 → 0.0.730-beta.4

package/dist/cjs/components/template-context-mapper/modalElements/BackTrackComponent.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),r=require("react");require("../../checkBox/index.js");var t=require("../../input/Input.js"),s=require("../../TypographyStyle.js"),i=require("../../checkBox/CheckBox.js");exports.BackTrackComponent=n=>{const{backTrackMessage:a,setBackTrackMessage:x}=n,[c,o]=r.useState(!!a);return e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",marginLeft:10,marginTop:8,width:"300px",padding:"20px 0px"}},{children:[e.jsxRuntimeExports.jsx(i.CheckBox,{isChecked:c,onValueChange:()=>{c&&x&&x(""),o(!c)}}),e.jsxRuntimeExports.jsx(s.TitleSmall,Object.assign({style:{marginLeft:8}},{children:"Prevent BackTracking"}))]})),c&&e.jsxRuntimeExports.jsx("div",Object.assign({style:{margin:10}},{children:e.jsxRuntimeExports.jsx(t.Input,{type:"multiline",placeholder:"Enter your text here",labelText:"Message if user tries backtracking",onChangeText:e=>{x&&x(e)},height:"120px",maxCharLimit:1024,value:a,noErrorHint:!0,validate:e=>[!0,""]})}))]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("react"),r=require("../../checkBox/CheckBox.js"),s=require("../../input/Input.js"),i=require("../../TypographyStyle.js");exports.BackTrackComponent=n=>{const{backTrackMessage:a,setBackTrackMessage:x}=n,[c,o]=t.useState(!!a);return e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",marginLeft:10,marginTop:8,width:"300px",padding:"20px 0px"}},{children:[e.jsxRuntimeExports.jsx(r.CheckBox,{isChecked:c,onValueChange:()=>{c&&x&&x(""),o(!c)}}),e.jsxRuntimeExports.jsx(i.TitleSmall,Object.assign({style:{marginLeft:8}},{children:"Prevent BackTracking"}))]})),c&&e.jsxRuntimeExports.jsx("div",Object.assign({style:{margin:10}},{children:e.jsxRuntimeExports.jsx(s.Input,{type:"multiline",placeholder:"Enter your text here",labelText:"Message if user tries backtracking",onChangeText:e=>{x&&x(e)},height:"120px",maxCharLimit:1024,value:a,noErrorHint:!0,validate:e=>[!0,""]})}))]})};

package/dist/cjs/components/template-context-mapper/modalElements/Body.js

@@ -1,22 +1,22 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js");require("../../../helpers/index.js");var t=require("lodash"),i=require("react"),a=require("styled-components");require("../../carousel-preview/index.js");var s=require("./EditWhatsAppCarouselTemplateV2.js");require("../../template-preview/index.js");var l=require("../../template-preview/models/Channels.js"),r=require("../../TypographyStyle.js");require("../../variable-picker-v3/index.js");var o=require("../../../constants/Theme.js"),n=require("../context/templateModalContext.js"),p=require("../utils/constants.js"),u=require("../utils/getVariableNameEmail.js"),d=require("../utils/highlightFor.js"),c=require("./DesktopPreview.js"),h=require("./EditWebpushTemplate.js"),x=require("./EditWhatsAppTemplateV2.js"),m=require("./MobilePreview.js"),E=require("./VariableConnectorsPanel.js"),C=require("../../carousel-preview/CarouselPreview.js"),j=require("../../template-preview/TemplatePreview.js"),v=require("../../variable-picker-v3/VariablePicker.js"),P=require("../../variable-picker-v3/model.js");function w(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var b=w(a);const f=b.default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js");require("../../curtain/CurtainHelper.js");var t=require("../../variable-picker-v3/model.js"),a=require("../../../node_modules/lodash/cloneDeep.js"),i=require("react"),s=require("styled-components"),l=require("../../carousel-preview/CarouselPreview.js"),r=require("./EditWhatsAppCarouselTemplateV2.js"),o=require("../../template-preview/TemplatePreview.js");require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js");var n=require("../../../constants/Theme.js");require("../../template-preview/models/TemplateMeta.js"),require("../../template-preview/models/WhatsAppTemplate.js");var p=require("../../template-preview/models/Channels.js"),u=require("../../TypographyStyle.js"),d=require("../../variable-picker-v3/VariablePicker.js"),c=require("../context/templateModalContext.js"),h=require("../utils/constants.js"),m=require("../utils/getVariableNameEmail.js"),x=require("../utils/highlightFor.js"),E=require("./DesktopPreview.js"),C=require("./EditWebpushTemplate.js"),j=require("./EditWhatsAppTemplateV2.js"),v=require("./MobilePreview.js"),P=require("./VariableConnectorsPanel.js");function w(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var b=w(s);const f=b.default.div`
 	display: flex;
 	//	height: 100%;
-`,N=b.default.div`
+`,A=b.default.div`
 	max-width: 450px;
-	max-width: ${e=>e.channel===l.CHANNEL_TYPE.EMAIL?"400px":"450px"};
+	max-width: ${e=>e.channel===p.CHANNEL_TYPE.EMAIL?"400px":"450px"};
 
-	height: ${e=>e.channel===l.CHANNEL_TYPE.WHATSAPP?"500px":"475px"};
+	height: ${e=>e.channel===p.CHANNEL_TYPE.WHATSAPP?"500px":"475px"};
 	overflow-y: auto;
 	padding-bottom: 24px;
-	border-left: ${o.COLORS.stroke.primary} 1px solid;
-	border-top: ${e=>e.isWhatsappCarousel?`${o.COLORS.stroke.primary} 1px solid`:void 0};
+	border-left: ${n.COLORS.stroke.primary} 1px solid;
+	border-top: ${e=>e.isWhatsappCarousel?`${n.COLORS.stroke.primary} 1px solid`:void 0};
 	${e=>!e.showVariableMapping&&"width: 340px; height: 500px"};
-`,g=b.default.div`
+`,N=b.default.div`
 	padding: ${e=>e.isWhatsappCarousel?void 0:e.showOnlyContent?"16px 14px":"16px 32px"};
 	flex: 1;
 	height: ${e=>e.isWhatsappCarousel||e.hideDeviceContainerInPreview?"500px":"475px"};
 	overflow-y: auto;
-	background-image: ${e=>e.hideDeviceContainerInPreview&&e.channel===l.CHANNEL_TYPE.WHATSAPP?`url(${p.BACKGROUND_PREVIEW_IMAGE});`:"none"};
-	display: ${e=>!e.hideDeviceContainerInPreview||e.channel!==l.CHANNEL_TYPE.WHATSAPP&&e.channel!==l.CHANNEL_TYPE.RCS?"initial":"flex"};
+	background-image: ${e=>e.hideDeviceContainerInPreview&&e.channel===p.CHANNEL_TYPE.WHATSAPP?`url(${h.BACKGROUND_PREVIEW_IMAGE});`:"none"};
+	display: ${e=>!e.hideDeviceContainerInPreview||e.channel!==p.CHANNEL_TYPE.WHATSAPP&&e.channel!==p.CHANNEL_TYPE.RCS?"initial":"flex"};
 	align-items: flex-start;
-`;exports.default=a=>{const{showVariableMapping:p,showOnlyContent:w,whatsappSpecificPickerMeta:b,showVariableModal:A,discountCode:T,setDiscountCode:S,variableListForImage:L,showSampleValues:y,variableListFromProps:H,fileName:_,setFileName:R,skipDefaultVariableContent:k}=a,V=i.useRef(),q=i.useRef(),{variableList:M,setVariableList:W,variableCallback:D,showVariablePicker:O,setShowVariablePicker:Y,device:I,display_content:B,channel:F,template:$,setTemplate:G,isWhatsappCarousel:U,isProductCarouselType:K,hideDeviceContainerInPreview:z,onDefaultVariableSelect:J}=n.useTemplateModalContext();const Q=e=>{let t=0;for(;e;)t+=e.offsetTop,e=e.offsetParent;return t};return e.jsxRuntimeExports.jsxs(f,{children:[e.jsxRuntimeExports.jsx(g,Object.assign({showOnlyContent:w,showVariableMapping:p,isWhatsappCarousel:U,hideDeviceContainerInPreview:z,channel:F,skipDefaultVariableContent:k},{children:"mobile"===I?e.jsxRuntimeExports.jsx(m.default,{ref:q,display_content:null!=B?B:"",channel:F,template:$,showSampleValues:y}):F!==l.CHANNEL_TYPE.WHATSAPP&&F!==l.CHANNEL_TYPE.RCS||!U?F===l.CHANNEL_TYPE.WEBPUSH?e.jsxRuntimeExports.jsx(j.TemplatePreview,{showSampleValues:y,channel:F,hideHeader:!0,template:$}):F!==l.CHANNEL_TYPE.MESSAGE?e.jsxRuntimeExports.jsx(c.default,{ref:V,channel:F,display_content:null!=B?B:"",showSampleValues:y}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}):e.jsxRuntimeExports.jsx(C.CarouselPreview,{ref:V,channel:F,template:$,showSampleValues:y,isPreview:!1,showArrows:!0})})),(K||p)&&e.jsxRuntimeExports.jsxs(N,Object.assign({channel:F,isWhatsappCarousel:U,showVariableMapping:!0},{children:[e.jsxRuntimeExports.jsx("div",Object.assign({style:{height:"100%",width:"whatsapp"===F?428:400,display:O?"block":"none"}},{children:e.jsxRuntimeExports.jsx(v.VariablePicker,{hideHeaderCross:!0,showHeader:!0,showBackButton:!0,onBackButtonClick:()=>{W(t.cloneDeep(H)),Y(!1)},onSelect:e=>{D(e),W(t.cloneDeep(H)),Y(!1)},type:P.PickerType.EMBEDDED,data:null!=M?M:[],onDefaultVariableSelect:J,skipDefaultVariableContent:k},Math.random())})),e.jsxRuntimeExports.jsx("div",Object.assign({style:{padding:"16px 14px",width:"whatsapp"===F||"webpush"==F||"rcs"==F?428:400,display:O?"none":"block"}},{children:F!==l.CHANNEL_TYPE.WHATSAPP&&F!==(null===l.CHANNEL_TYPE||void 0===l.CHANNEL_TYPE?void 0:l.CHANNEL_TYPE.RCS)?F==l.CHANNEL_TYPE.WEBPUSH?e.jsxRuntimeExports.jsx(h.default,{whatsappSpecificPickerMeta:b,template:$,onTemplateChange:e=>{null==G||G(e)},showVariableModal:A}):e.jsxRuntimeExports.jsx(E.default,{onFocus:F===l.CHANNEL_TYPE.EMAIL?function(e){var t,i,a;const s=null===document||void 0===document?void 0:document.getElementById("mobile"===I?"template_html_mobile":"template_html_desktop"),r=u.getVariableNameForEmailByIndex(e+1),n=F===l.CHANNEL_TYPE.EMAIL?null===(t=null==s?void 0:s.contentWindow)||void 0===t?void 0:t.document.getElementById(r):document.getElementById(r),p=Q(n),c=null==n?void 0:n.offsetLeft;"desktop"===I?p&&V.current&&(null===(i=null==s?void 0:s.contentWindow)||void 0===i||i.scrollTo(null!=c?c:0,p),d.highlightFor(r,o.COLORS.background.warning.light,2,F,I)):p&&q.current&&(null===(a=null==s?void 0:s.contentWindow)||void 0===a||a.scrollTo(null!=c?c:0,p),d.highlightFor(r,o.COLORS.background.warning.light,2,F,I))}:void 0,showVariableModal:A,discountCode:T,setDiscountCode:S}):F!==l.CHANNEL_TYPE.WHATSAPP&&F!==l.CHANNEL_TYPE.RCS||!U?e.jsxRuntimeExports.jsx(x.default,{whatsappSpecificPickerMeta:b,template:$,onTemplateChange:e=>{null==G||G(e)},showVariableModal:A,variableListForImage:L,discountCode:T,setDiscountCode:S,fileName:_,setFileName:R}):e.jsxRuntimeExports.jsx(s.default,{whatsappSpecificPickerMeta:b,template:$,showVariableModal:A,variableListForImage:L,discountCode:T,setDiscountCode:S})}))]})),[l.CHANNEL_TYPE.WHATSAPP,l.CHANNEL_TYPE.SMS].includes(F)&&!p&&!K&&e.jsxRuntimeExports.jsx(N,{children:e.jsxRuntimeExports.jsx(r.BodySecondary,Object.assign({color:o.COLORS.content.secondary,style:{fontStyle:"italic"}},{children:"Click on ‘Select template’ below to use it"}))})]})};
+`;exports.default=s=>{const{showVariableMapping:h,showOnlyContent:w,whatsappSpecificPickerMeta:b,showVariableModal:T,discountCode:g,setDiscountCode:S,variableListForImage:L,showSampleValues:y,variableListFromProps:H,fileName:_,setFileName:k,skipDefaultVariableContent:R}=s,V=i.useRef(),W=i.useRef(),{variableList:q,setVariableList:M,variableCallback:D,showVariablePicker:O,setShowVariablePicker:Y,device:I,display_content:B,channel:F,template:$,setTemplate:G,isWhatsappCarousel:U,isProductCarouselType:K,hideDeviceContainerInPreview:z,onDefaultVariableSelect:J}=c.useTemplateModalContext();const Q=e=>{let t=0;for(;e;)t+=e.offsetTop,e=e.offsetParent;return t};return e.jsxRuntimeExports.jsxs(f,{children:[e.jsxRuntimeExports.jsx(N,Object.assign({showOnlyContent:w,showVariableMapping:h,isWhatsappCarousel:U,hideDeviceContainerInPreview:z,channel:F,skipDefaultVariableContent:R},{children:"mobile"===I?e.jsxRuntimeExports.jsx(v.default,{ref:W,display_content:null!=B?B:"",channel:F,template:$,showSampleValues:y}):F!==p.CHANNEL_TYPE.WHATSAPP&&F!==p.CHANNEL_TYPE.RCS||!U?F===p.CHANNEL_TYPE.WEBPUSH?e.jsxRuntimeExports.jsx(o.TemplatePreview,{showSampleValues:y,channel:F,hideHeader:!0,template:$}):F!==p.CHANNEL_TYPE.MESSAGE?e.jsxRuntimeExports.jsx(E.default,{ref:V,channel:F,display_content:null!=B?B:"",showSampleValues:y}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}):e.jsxRuntimeExports.jsx(l.CarouselPreview,{ref:V,channel:F,template:$,showSampleValues:y,isPreview:!1,showArrows:!0})})),(K||h)&&e.jsxRuntimeExports.jsxs(A,Object.assign({channel:F,isWhatsappCarousel:U,showVariableMapping:!0},{children:[e.jsxRuntimeExports.jsx("div",Object.assign({style:{height:"100%",width:"whatsapp"===F?428:400,display:O?"block":"none"}},{children:e.jsxRuntimeExports.jsx(d.VariablePicker,{hideHeaderCross:!0,showHeader:!0,showBackButton:!0,onBackButtonClick:()=>{M(a.default(H)),Y(!1)},onSelect:e=>{D(e),M(a.default(H)),Y(!1)},type:t.PickerType.EMBEDDED,data:null!=q?q:[],onDefaultVariableSelect:J,skipDefaultVariableContent:R},Math.random())})),e.jsxRuntimeExports.jsx("div",Object.assign({style:{padding:"16px 14px",width:"whatsapp"===F||"webpush"==F||"rcs"==F?428:400,display:O?"none":"block"}},{children:F!==p.CHANNEL_TYPE.WHATSAPP&&F!==(null===p.CHANNEL_TYPE||void 0===p.CHANNEL_TYPE?void 0:p.CHANNEL_TYPE.RCS)?F==p.CHANNEL_TYPE.WEBPUSH?e.jsxRuntimeExports.jsx(C.default,{whatsappSpecificPickerMeta:b,template:$,onTemplateChange:e=>{null==G||G(e)},showVariableModal:T}):e.jsxRuntimeExports.jsx(P.default,{onFocus:F===p.CHANNEL_TYPE.EMAIL?function(e){var t,a,i;const s=null===document||void 0===document?void 0:document.getElementById("mobile"===I?"template_html_mobile":"template_html_desktop"),l=m.getVariableNameForEmailByIndex(e+1),r=F===p.CHANNEL_TYPE.EMAIL?null===(t=null==s?void 0:s.contentWindow)||void 0===t?void 0:t.document.getElementById(l):document.getElementById(l),o=Q(r),u=null==r?void 0:r.offsetLeft;"desktop"===I?o&&V.current&&(null===(a=null==s?void 0:s.contentWindow)||void 0===a||a.scrollTo(null!=u?u:0,o),x.highlightFor(l,n.COLORS.background.warning.light,2,F,I)):o&&W.current&&(null===(i=null==s?void 0:s.contentWindow)||void 0===i||i.scrollTo(null!=u?u:0,o),x.highlightFor(l,n.COLORS.background.warning.light,2,F,I))}:void 0,showVariableModal:T,discountCode:g,setDiscountCode:S}):F!==p.CHANNEL_TYPE.WHATSAPP&&F!==p.CHANNEL_TYPE.RCS||!U?e.jsxRuntimeExports.jsx(j.default,{whatsappSpecificPickerMeta:b,template:$,onTemplateChange:e=>{null==G||G(e)},showVariableModal:T,variableListForImage:L,discountCode:g,setDiscountCode:S,fileName:_,setFileName:k}):e.jsxRuntimeExports.jsx(r.default,{whatsappSpecificPickerMeta:b,template:$,showVariableModal:T,variableListForImage:L,discountCode:g,setDiscountCode:S})}))]})),[p.CHANNEL_TYPE.WHATSAPP,p.CHANNEL_TYPE.SMS].includes(F)&&!h&&!K&&e.jsxRuntimeExports.jsx(A,{children:e.jsxRuntimeExports.jsx(u.BodySecondary,Object.assign({color:n.COLORS.content.secondary,style:{fontStyle:"italic"}},{children:"Click on ‘Select template’ below to use it"}))})]})};

package/dist/cjs/components/template-context-mapper/modalElements/DesktopPreview.js

@@ -1,20 +1,20 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("react"),r=require("styled-components");require("../../spinner/index.js"),require("../../template-preview/index.js");var i=require("../../template-preview/models/Channels.js"),s=require("../../../constants/Theme.js"),a=require("../../template-preview/TemplatePreview.js"),n=require("../../spinner/Spinner.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=o(t),p=o(r);const l=p.default.div`
-	background: ${s.COLORS.surface.standard};
-	border: 1px solid ${s.COLORS.stroke.primary};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("react"),r=require("styled-components"),i=require("../../spinner/Spinner.js"),s=require("../../template-preview/TemplatePreview.js");require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js");var a=require("../../../constants/Theme.js");require("../../curtain/CurtainHelper.js"),require("../../variable-picker-v3/model.js"),require("../../template-preview/models/TemplateMeta.js"),require("../../template-preview/models/WhatsAppTemplate.js");var p=require("../../template-preview/models/Channels.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=o(t),n=o(r);const d=n.default.div`
+	background: ${a.COLORS.surface.standard};
+	border: 1px solid ${a.COLORS.stroke.primary};
 	border-radius: 8px;
 	overflow-y: auto;
 	/* max-height: 420px; */
 	scroll-behavior: smooth;
 	height: 100%;
-`,x=p.default.div`
+`,u=n.default.div`
 	padding: 18px 24px 12px;
 	display: flex;
 	gap: 4px;
 	border-bottom-width: 1px;
-	border-bottom-color: ${s.COLORS.stroke.primary};
-`,u=p.default.div`
+	border-bottom-color: ${a.COLORS.stroke.primary};
+`,m=n.default.div`
 	width: 6px;
 	height: 6px;
 	background: #d9d9d9;
 	border-radius: 3px;
-`,m=d.default.forwardRef(((t,r)=>{let{display_content:s,showSampleValues:o}=t;return e.jsxRuntimeExports.jsxs(l,Object.assign({ref:r},{children:[e.jsxRuntimeExports.jsxs(x,{children:[e.jsxRuntimeExports.jsx(u,{}),e.jsxRuntimeExports.jsx(u,{}),e.jsxRuntimeExports.jsx(u,{})]}),e.jsxRuntimeExports.jsx("div",{children:s?e.jsxRuntimeExports.jsx(a.TemplatePreview,{showSampleValues:o,channel:i.CHANNEL_TYPE.EMAIL,hideHeader:!0,emailSpecificMeta:{emailDisplayContent:s,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_desktop",containerStyle:{height:441},templateContainerStyles:{height:"100%"}},hidePointerEvents:!0}):e.jsxRuntimeExports.jsx("div",Object.assign({style:{padding:20}},{children:e.jsxRuntimeExports.jsx(n.Spinner,{size:"small"})}))})]}))}));m.displayName="DesktopPreview",exports.default=m;
+`,x=l.default.forwardRef(((t,r)=>{let{display_content:a,showSampleValues:o}=t;return e.jsxRuntimeExports.jsxs(d,Object.assign({ref:r},{children:[e.jsxRuntimeExports.jsxs(u,{children:[e.jsxRuntimeExports.jsx(m,{}),e.jsxRuntimeExports.jsx(m,{}),e.jsxRuntimeExports.jsx(m,{})]}),e.jsxRuntimeExports.jsx("div",{children:a?e.jsxRuntimeExports.jsx(s.TemplatePreview,{showSampleValues:o,channel:p.CHANNEL_TYPE.EMAIL,hideHeader:!0,emailSpecificMeta:{emailDisplayContent:a,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_desktop",containerStyle:{height:441},templateContainerStyles:{height:"100%"}},hidePointerEvents:!0}):e.jsxRuntimeExports.jsx("div",Object.assign({style:{padding:20}},{children:e.jsxRuntimeExports.jsx(i.Spinner,{size:"small"})}))})]}))}));x.displayName="DesktopPreview",exports.default=x;

package/dist/cjs/components/template-context-mapper/modalElements/DiscountCodeComponent.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),s=require("../../../assets/icons/PlusIcon.js"),t=require("react");require("../../checkBox/index.js");var r=require("../../input/Input.js"),i=require("../../TypographyStyle.js"),n=require("../context/templateModalContext.js"),a=require("./VariableConnectorsPanel.js"),o=require("../../checkBox/CheckBox.js");exports.DiscountCodeComponent=u=>{const{discountCode:c,setDiscountCode:l}=u,[d,x]=t.useState(""),[j,p]=t.useState(!!c),[m,h]=t.useState(!1),{setVariableCallback:g,setShowVariablePicker:b}=n.useTemplateModalContext(),v=t.useRef(),C=t.useRef();t.useEffect((()=>{l&&d&&l(c+d)}),[d]);const E=e=>{x(e.actualValue)};return e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",marginLeft:10,marginTop:8}},{children:[e.jsxRuntimeExports.jsx(o.CheckBox,{isChecked:j,onValueChange:()=>{j&&l&&(l(""),x("")),p(!j)}}),e.jsxRuntimeExports.jsx(i.TitleSmall,Object.assign({style:{marginLeft:8}},{children:"Add discount code"}))]})),j&&e.jsxRuntimeExports.jsxs("div",Object.assign({ref:v,style:{margin:10}},{children:[e.jsxRuntimeExports.jsx(r.Input,{placeholder:"Enter your discount code",onChangeText:e=>{l&&l(e)},value:c,onFocus:()=>{h(!0)},onBlur:e=>{var s;"addVar"===(null===(s=e.relatedTarget)||void 0===s?void 0:s.id)?(v.current&&v.current.focus(),h(!0)):h(!1)},noErrorHint:!0,validate:e=>[!0,""]}),m&&e.jsxRuntimeExports.jsx(a.AddVariableStyled,Object.assign({ref:C,id:"addVar",onClick:e=>{e.stopPropagation(),g((()=>E)),b(!0)}},{children:e.jsxRuntimeExports.jsxs("div",Object.assign({className:"add"},{children:[e.jsxRuntimeExports.jsx(s.default,{width:14,height:14,color:"white"}),e.jsxRuntimeExports.jsx("div",Object.assign({className:"variable"},{children:"Add variable"}))]}))}))]}))]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),s=require("../../../assets/icons/PlusIcon.js"),t=require("react"),r=require("../../checkBox/CheckBox.js"),i=require("../../input/Input.js"),n=require("../../TypographyStyle.js"),a=require("../context/templateModalContext.js"),o=require("./VariableConnectorsPanel.js");exports.DiscountCodeComponent=u=>{const{discountCode:l,setDiscountCode:c}=u,[d,x]=t.useState(""),[j,p]=t.useState(!!l),[m,h]=t.useState(!1),{setVariableCallback:g,setShowVariablePicker:b}=a.useTemplateModalContext(),C=t.useRef(),E=t.useRef();t.useEffect((()=>{c&&d&&c(l+d)}),[d]);const f=e=>{x(e.actualValue)};return e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",marginLeft:10,marginTop:8}},{children:[e.jsxRuntimeExports.jsx(r.CheckBox,{isChecked:j,onValueChange:()=>{j&&c&&(c(""),x("")),p(!j)}}),e.jsxRuntimeExports.jsx(n.TitleSmall,Object.assign({style:{marginLeft:8}},{children:"Add discount code"}))]})),j&&e.jsxRuntimeExports.jsxs("div",Object.assign({ref:C,style:{margin:10}},{children:[e.jsxRuntimeExports.jsx(i.Input,{placeholder:"Enter your discount code",onChangeText:e=>{c&&c(e)},value:l,onFocus:()=>{h(!0)},onBlur:e=>{var s;"addVar"===(null===(s=e.relatedTarget)||void 0===s?void 0:s.id)?(C.current&&C.current.focus(),h(!0)):h(!1)},noErrorHint:!0,validate:e=>[!0,""]}),m&&e.jsxRuntimeExports.jsx(o.AddVariableStyled,Object.assign({ref:E,id:"addVar",onClick:e=>{e.stopPropagation(),g((()=>f)),b(!0)}},{children:e.jsxRuntimeExports.jsxs("div",Object.assign({className:"add"},{children:[e.jsxRuntimeExports.jsx(s.default,{width:14,height:14,color:"white"}),e.jsxRuntimeExports.jsx("div",Object.assign({className:"variable"},{children:"Add variable"}))]}))}))]}))]})};

package/dist/cjs/components/template-context-mapper/modalElements/EditMediaModal.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("../../../assets/icons/arrow_back.svg.js"),s=require("../../../assets/icons/info.svg.js");require("../../../helpers/index.js");var i=require("react");require("../../button/index.js"),require("../../image-cropper/index.js"),require("../../input-with-vars/index.js"),require("../../spinner/index.js"),require("../../template-preview/index.js");var r=require("../../TypographyStyle.js"),a=require("../../../utils/validator.js"),o=require("../../../constants/Theme.js"),n=require("../../../assets/icons/file.svg.js"),l=require("../../../assets/icons/filePdf.svg.js"),d=require("../../../assets/icons/image.svg.js"),p=require("../../../assets/icons/upload.svg.js"),x=require("../context/templateModalContext.js"),u=require("../utils/validateIsUrl.js"),c=require("../../template-preview/models/TemplateMeta.js"),j=require("../../spinner/Spinner.js"),m=require("../../input-with-vars/InputWithVariables.js"),E=require("../../variable-picker-v3/model.js"),g=require("../../template-preview/models/WhatsAppTemplate.js"),h=require("../../button/Button.js"),R=require("../../image-cropper/BikImageCropper.js");exports.default=b=>{let{setOpenEditMedia:v,mediaComponentFormat:f,variableListForImage:y,openEditMedia:T,uploadMedia:C,fileRef:M,useEditWhatsappTemplateMediaResponse:I,skipAddVariable:A}=b;const{pod:D,setHideCrossButton:O,setHideFooterButton:q}=x.useTemplateModalContext(),[S,P]=i.useState(""),[k,w]=i.useState(void 0),[H,B]=i.useState(!1),[_,L]=i.useState("");let V;if(i.useEffect((()=>(q(!0),()=>{q(!1)})),[]),i.useEffect((()=>{const e=document.querySelector('[class*="ModalWrapper"]');e&&w(e)}),[I.loading]),V=f===c.HEADER_TYPES.IMAGE?"image/png, image/jpeg":f===c.HEADER_TYPES.VIDEO?"video/mp4":"application/pdf",!T)return e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{});const U=()=>f===c.HEADER_TYPES.IMAGE?"Image":f===c.HEADER_TYPES.VIDEO?"Video":"Document";return e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",gap:"10px",alignItems:"center",marginBottom:"16px"}},{children:[e.jsxRuntimeExports.jsx(t.default,{onClick:e=>{e.stopPropagation(),v(!1),P("")},style:{cursor:"pointer"},width:16,height:16}),e.jsxRuntimeExports.jsx(r.TitleRegular,{children:"Update Media"})]})),e.jsxRuntimeExports.jsxs("div",Object.assign({style:{position:"relative",padding:16,borderRadius:4,border:H?`1px dashed ${o.DEFAULT_THEME.colorsV2.stroke.negative.vibrant}`:`1px dashed ${o.DEFAULT_THEME.colorsV2.stroke.primary}`,backgroundColor:o.DEFAULT_THEME.colorsV2.surface.subdued,width:"100%",height:"100%",alignItems:"center",display:I.loading?"flex":"initial"}},{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({style:{marginBottom:24,display:"flex",justifyContent:"center",flexDirection:"column",alignItems:"center",gap:16}},{children:[I.loading?e.jsxRuntimeExports.jsx(j.PureSpinner,{width:"40px",height:"40px",color:o.COLORS.content.brand}):e.jsxRuntimeExports.jsx("div",Object.assign({style:{height:64,width:64,borderRadius:"100%",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:o.DEFAULT_THEME.colorsV2.background.base}},{children:f===c.HEADER_TYPES.IMAGE?e.jsxRuntimeExports.jsx(d.default,{width:40,height:40}):f===c.HEADER_TYPES.VIDEO?e.jsxRuntimeExports.jsx(n.default,{width:40,height:40}):e.jsxRuntimeExports.jsx(l.default,{width:40,height:40})})),e.jsxRuntimeExports.jsx(r.TitleMedium,{children:I.loading?"Upload in progress...":f===c.HEADER_TYPES.IMAGE?"Upload an image":f===c.HEADER_TYPES.VIDEO?"Upload a video":"Upload a document"}),e.jsxRuntimeExports.jsx(r.BodySecondary,Object.assign({color:o.COLORS.content.secondary},{children:I.loading?`Your ${f.toLowerCase()} is getting loaded. This may take a couple of minutes.`:f===c.HEADER_TYPES.IMAGE?"JPEG/ PNG format • Max 5MB":f===c.HEADER_TYPES.VIDEO?"MP4 format video • Max 16MB":"PDF format document • Max 100MB"}))]})),!I.loading&&e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"6px"}},{children:e.jsxRuntimeExports.jsx(m.InputWithVariables,{labelText:`${U()} URL`,onPickerToggle:e=>{O(!!e)},pickerType:E.PickerType.EMBEDDED,portalElement:null!=k?k:document.body,noMaxCharCheck:!0,allowMix:!1,onChange:e=>{L(e.actualValue),B(!1)},showVarHeader:!0,varHeaderText:"Select variable",errorMessage:S,prevVariable:{actualValue:"",variableType:"string"},variablesList:y,placeHolder:A?"Enter URL":"Enter URL/Add variable",showAddButton:D!==g.POD.CAMPAIGN||!A&&f===c.HEADER_TYPES.IMAGE})})),e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",justifyContent:"space-between",gap:"4px",marginBottom:"12px"}},{children:[e.jsxRuntimeExports.jsx("hr",{style:{height:"2px",flex:.5,backgroundColor:"black"}}),e.jsxRuntimeExports.jsx(r.BodyCaption,{children:"Or upload media from device"}),e.jsxRuntimeExports.jsx("hr",{style:{height:"2px",flex:.5,backgroundColor:"black"}})]})),e.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",width:"100%"}},{children:e.jsxRuntimeExports.jsx(h.Button,{matchParentWidth:!0,buttonText:"Upload",buttonType:"dashBold",LeadingIcon:p.default,onClick:()=>{C(),B(!1)},size:"medium"})}))]}),H&&e.jsxRuntimeExports.jsxs("div",Object.assign({style:{position:"absolute",display:"flex",alignItems:"center",bottom:-24,left:0,gap:4}},{children:[e.jsxRuntimeExports.jsx(s.default,{width:16,height:16,color:o.COLORS.content.negative}),e.jsxRuntimeExports.jsx(r.BodyCaption,Object.assign({style:{color:o.COLORS.content.negative}},{children:`Select ${U()}`}))]}))]})),!I.loading&&e.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",justifyContent:"flex-end",marginTop:8}},{children:e.jsxRuntimeExports.jsx(h.Button,{buttonText:`Add ${U()}`,onClick:()=>{_?a.validateURL(_)||u.isVariable(_)?(C(_),v(!1),P(""),B(!1)):P("Enter valid URL"):B(!0)}})})),e.jsxRuntimeExports.jsx("input",{ref:M,style:{display:"none"},type:"file",onChange:I.handleImageUpload,accept:V}),!!I.selectedImage&&e.jsxRuntimeExports.jsx(R.BikImageCropper,{aspectRatio:15/8,src:I.selectedImage,onCropComplete:I.onCropComplete,onCancel:()=>{I.setLoading(!1),I.setSelectedImage(""),M.current&&(M.current.value="")}})]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("../../../assets/icons/arrow_back.svg.js"),s=require("../../../assets/icons/info.svg.js");require("../../curtain/CurtainHelper.js");var i=require("../../variable-picker-v3/model.js"),r=require("react"),a=require("../../button/Button.js"),o=require("../../image-cropper/BikImageCropper.js");require("../../image-compress/ImageCompress.js"),require("../../states/StateComponent.js"),require("../../../_virtual/_tslib.js"),require("../../../constants/zindex.js"),require("../../modals/styledModal.js");var n=require("../../spinner/Spinner.js"),l=require("../../input-with-vars/InputWithVariables.js");require("../../template-preview/TemplatePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js");var p=require("../../../constants/Theme.js"),d=require("../../template-preview/models/TemplateMeta.js"),u=require("../../template-preview/models/WhatsAppTemplate.js");require("../../template-preview/models/Channels.js");var x=require("../../TypographyStyle.js"),c=require("../../../utils/validator.js"),m=require("../../../assets/icons/file.svg.js"),j=require("../../../assets/icons/filePdf.svg.js"),E=require("../../../assets/icons/image.svg.js"),g=require("../../../assets/icons/upload.svg.js"),h=require("../context/templateModalContext.js"),R=require("../utils/validateIsUrl.js");exports.default=v=>{let{setOpenEditMedia:b,mediaComponentFormat:f,variableListForImage:y,openEditMedia:T,uploadMedia:C,fileRef:M,useEditWhatsappTemplateMediaResponse:A,skipAddVariable:q}=v;const{pod:I,setHideCrossButton:D,setHideFooterButton:O}=h.useTemplateModalContext(),[S,P]=r.useState(""),[w,k]=r.useState(void 0),[H,_]=r.useState(!1),[L,B]=r.useState("");let V;if(r.useEffect((()=>(O(!0),()=>{O(!1)})),[]),r.useEffect((()=>{const e=document.querySelector('[class*="ModalWrapper"]');e&&k(e)}),[A.loading]),V=f===d.HEADER_TYPES.IMAGE?"image/png, image/jpeg":f===d.HEADER_TYPES.VIDEO?"video/mp4":"application/pdf",!T)return e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{});const U=()=>f===d.HEADER_TYPES.IMAGE?"Image":f===d.HEADER_TYPES.VIDEO?"Video":"Document";return e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",gap:"10px",alignItems:"center",marginBottom:"16px"}},{children:[e.jsxRuntimeExports.jsx(t.default,{onClick:e=>{e.stopPropagation(),b(!1),P("")},style:{cursor:"pointer"},width:16,height:16}),e.jsxRuntimeExports.jsx(x.TitleRegular,{children:"Update Media"})]})),e.jsxRuntimeExports.jsxs("div",Object.assign({style:{position:"relative",padding:16,borderRadius:4,border:H?`1px dashed ${p.DEFAULT_THEME.colorsV2.stroke.negative.vibrant}`:`1px dashed ${p.DEFAULT_THEME.colorsV2.stroke.primary}`,backgroundColor:p.DEFAULT_THEME.colorsV2.surface.subdued,width:"100%",height:"100%",alignItems:"center",display:A.loading?"flex":"initial"}},{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({style:{marginBottom:24,display:"flex",justifyContent:"center",flexDirection:"column",alignItems:"center",gap:16}},{children:[A.loading?e.jsxRuntimeExports.jsx(n.PureSpinner,{width:"40px",height:"40px",color:p.COLORS.content.brand}):e.jsxRuntimeExports.jsx("div",Object.assign({style:{height:64,width:64,borderRadius:"100%",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:p.DEFAULT_THEME.colorsV2.background.base}},{children:f===d.HEADER_TYPES.IMAGE?e.jsxRuntimeExports.jsx(E.default,{width:40,height:40}):f===d.HEADER_TYPES.VIDEO?e.jsxRuntimeExports.jsx(m.default,{width:40,height:40}):e.jsxRuntimeExports.jsx(j.default,{width:40,height:40})})),e.jsxRuntimeExports.jsx(x.TitleMedium,{children:A.loading?"Upload in progress...":f===d.HEADER_TYPES.IMAGE?"Upload an image":f===d.HEADER_TYPES.VIDEO?"Upload a video":"Upload a document"}),e.jsxRuntimeExports.jsx(x.BodySecondary,Object.assign({color:p.COLORS.content.secondary},{children:A.loading?`Your ${f.toLowerCase()} is getting loaded. This may take a couple of minutes.`:f===d.HEADER_TYPES.IMAGE?"JPEG/ PNG format • Max 5MB":f===d.HEADER_TYPES.VIDEO?"MP4 format video • Max 16MB":"PDF format document • Max 100MB"}))]})),!A.loading&&e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"6px"}},{children:e.jsxRuntimeExports.jsx(l.InputWithVariables,{labelText:`${U()} URL`,onPickerToggle:e=>{D(!!e)},pickerType:i.PickerType.EMBEDDED,portalElement:null!=w?w:document.body,noMaxCharCheck:!0,allowMix:!1,onChange:e=>{B(e.actualValue),_(!1)},showVarHeader:!0,varHeaderText:"Select variable",errorMessage:S,prevVariable:{actualValue:"",variableType:"string"},variablesList:y,placeHolder:q?"Enter URL":"Enter URL/Add variable",showAddButton:I!==u.POD.CAMPAIGN||!q&&f===d.HEADER_TYPES.IMAGE})})),e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",justifyContent:"space-between",gap:"4px",marginBottom:"12px"}},{children:[e.jsxRuntimeExports.jsx("hr",{style:{height:"2px",flex:.5,backgroundColor:"black"}}),e.jsxRuntimeExports.jsx(x.BodyCaption,{children:"Or upload media from device"}),e.jsxRuntimeExports.jsx("hr",{style:{height:"2px",flex:.5,backgroundColor:"black"}})]})),e.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",width:"100%"}},{children:e.jsxRuntimeExports.jsx(a.Button,{matchParentWidth:!0,buttonText:"Upload",buttonType:"dashBold",LeadingIcon:g.default,onClick:()=>{C(),_(!1)},size:"medium"})}))]}),H&&e.jsxRuntimeExports.jsxs("div",Object.assign({style:{position:"absolute",display:"flex",alignItems:"center",bottom:-24,left:0,gap:4}},{children:[e.jsxRuntimeExports.jsx(s.default,{width:16,height:16,color:p.COLORS.content.negative}),e.jsxRuntimeExports.jsx(x.BodyCaption,Object.assign({style:{color:p.COLORS.content.negative}},{children:`Select ${U()}`}))]}))]})),!A.loading&&e.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",justifyContent:"flex-end",marginTop:8}},{children:e.jsxRuntimeExports.jsx(a.Button,{buttonText:`Add ${U()}`,onClick:()=>{L?c.validateURL(L)||R.isVariable(L)?(C(L),b(!1),P(""),_(!1)):P("Enter valid URL"):_(!0)}})})),e.jsxRuntimeExports.jsx("input",{ref:M,style:{display:"none"},type:"file",onChange:A.handleImageUpload,accept:V}),!!A.selectedImage&&e.jsxRuntimeExports.jsx(o.BikImageCropper,{aspectRatio:15/8,src:A.selectedImage,onCropComplete:A.onCropComplete,onCancel:()=>{A.setLoading(!1),A.setSelectedImage(""),M.current&&(M.current.value="")}})]})};

package/dist/cjs/components/template-context-mapper/modalElements/EditMediaV2.js

@@ -1,9 +1,9 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("../../../assets/icons/broken_media_image.svg.js"),s=require("../../../assets/icons/document_pdf.svg.js"),i=require("../../../assets/icons/edit.svg.js"),r=require("../../../assets/icons/refresh.svg.js"),n=require("styled-components");require("../../shimmer-image/index.js"),require("../../spinner/index.js");var o=require("../../template-preview/models/TemplateMeta.js"),a=require("../../TypographyStyle.js"),l=require("../../../utils/StringUtils.js"),d=require("../../../constants/Theme.js"),x=require("../context/templateModalContext.js"),u=require("./EditMediaV2.style.js"),m=require("../../spinner/Spinner.js"),c=require("../../shimmer-image/ShimmerImage.js");function j(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const p=j(n).default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("../../../assets/icons/broken_media_image.svg.js"),s=require("../../../assets/icons/document_pdf.svg.js"),i=require("../../../assets/icons/edit.svg.js"),r=require("../../../assets/icons/refresh.svg.js"),n=require("styled-components"),o=require("../../shimmer-image/ShimmerImage.js"),a=require("../../spinner/Spinner.js"),l=require("../../template-preview/models/TemplateMeta.js"),d=require("../../TypographyStyle.js"),x=require("../../../utils/StringUtils.js"),u=require("../../../constants/Theme.js"),c=require("../context/templateModalContext.js"),j=require("./EditMediaV2.style.js");function m(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const p=m(n).default.div`
 	padding-left: 14px;
 	padding-right: 6px;
 	height: 100%;
-	border-left: 1px solid ${d.COLORS.stroke.primary};
+	border-left: 1px solid ${u.COLORS.stroke.primary};
 	cursor: pointer;
 	display: flex;
 	align-items: center;
-`;exports.default=n=>{const{imageName:j,error:g,isLoading:h,mediaType:E,selectedVariable:R,setOpenEditMedia:f}=n,y=null==j?void 0:j[0].split("/"),O=null==y?void 0:y[y.length-1],{disableEditVariable:b}=x.useTemplateModalContext();return e.jsxRuntimeExports.jsxs(u.Container,{children:[e.jsxRuntimeExports.jsx(u.ImageContainer,Object.assign({error:!!g,onClick:()=>null==f?void 0:f(!0)},{children:g?e.jsxRuntimeExports.jsx(t.default,{width:56,height:56}):h?e.jsxRuntimeExports.jsx(m.Spinner,{size:"small"}):R?e.jsxRuntimeExports.jsx(c.ShimmerImage,{imageUrl:"https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F629bff40-6405-4514-9203-029bca59a7b0?alt=media&token=228e2231-176e-46d8-b29f-532d72592f51",width:56,height:56}):E===o.HEADER_TYPES.IMAGE?e.jsxRuntimeExports.jsx(c.ShimmerImage,{imageUrl:null==j?void 0:j[0],width:56,height:56}):E===o.HEADER_TYPES.VIDEO?e.jsxRuntimeExports.jsx("video",Object.assign({src:j[0],style:{width:56,height:56}},{children:e.jsxRuntimeExports.jsx("track",{default:!0,kind:"captions",srcLang:"en",src:j[0]})})):e.jsxRuntimeExports.jsx(s.default,{width:18,height:22,color:d.COLORS.content.placeholder})})),e.jsxRuntimeExports.jsxs(u.RightComponent,{children:[e.jsxRuntimeExports.jsx("div",Object.assign({style:{flex:g?"unset":1}},{children:j&&g?e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}):h?e.jsxRuntimeExports.jsx(a.BodyCaption,Object.assign({style:{marginLeft:8}},{children:"Your media is getting loaded..."})):e.jsxRuntimeExports.jsx(a.BodySecondary,Object.assign({style:{color:d.COLORS.content.primary,marginLeft:8}},{children:R||l.default.toCapitilize(null==E?void 0:E.toLowerCase())||O}))})),!!g&&e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",marginLeft:8,gap:"2px"}},{children:[e.jsxRuntimeExports.jsxs(a.BodySecondary,Object.assign({style:{color:d.COLORS.content.negative}},{children:["Error loading this ",null==E?void 0:E.toLowerCase(),". Retry"]})),e.jsxRuntimeExports.jsx(a.Caption,Object.assign({style:{color:d.COLORS.content.secondary}},{children:g}))]}))]}),!b&&!h&&e.jsxRuntimeExports.jsx(p,Object.assign({onClick:()=>null==f?void 0:f(!0),onKeyDown:()=>null==f?void 0:f(!0),role:"presentation"},{children:g?e.jsxRuntimeExports.jsx(r.default,{color:d.COLORS.content.brand,width:24,height:24}):e.jsxRuntimeExports.jsx(i.default,{width:24,height:24,color:d.COLORS.content.placeholder})}))]})};
+`;exports.default=n=>{const{imageName:m,error:g,isLoading:h,mediaType:E,selectedVariable:R,setOpenEditMedia:f}=n,y=null==m?void 0:m[0].split("/"),O=null==y?void 0:y[y.length-1],{disableEditVariable:b}=c.useTemplateModalContext();return e.jsxRuntimeExports.jsxs(j.Container,{children:[e.jsxRuntimeExports.jsx(j.ImageContainer,Object.assign({error:!!g,onClick:()=>null==f?void 0:f(!0)},{children:g?e.jsxRuntimeExports.jsx(t.default,{width:56,height:56}):h?e.jsxRuntimeExports.jsx(a.Spinner,{size:"small"}):R?e.jsxRuntimeExports.jsx(o.ShimmerImage,{imageUrl:"https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F629bff40-6405-4514-9203-029bca59a7b0?alt=media&token=228e2231-176e-46d8-b29f-532d72592f51",width:56,height:56}):E===l.HEADER_TYPES.IMAGE?e.jsxRuntimeExports.jsx(o.ShimmerImage,{imageUrl:null==m?void 0:m[0],width:56,height:56}):E===l.HEADER_TYPES.VIDEO?e.jsxRuntimeExports.jsx("video",Object.assign({src:m[0],style:{width:56,height:56}},{children:e.jsxRuntimeExports.jsx("track",{default:!0,kind:"captions",srcLang:"en",src:m[0]})})):e.jsxRuntimeExports.jsx(s.default,{width:18,height:22,color:u.COLORS.content.placeholder})})),e.jsxRuntimeExports.jsxs(j.RightComponent,{children:[e.jsxRuntimeExports.jsx("div",Object.assign({style:{flex:g?"unset":1}},{children:m&&g?e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}):h?e.jsxRuntimeExports.jsx(d.BodyCaption,Object.assign({style:{marginLeft:8}},{children:"Your media is getting loaded..."})):e.jsxRuntimeExports.jsx(d.BodySecondary,Object.assign({style:{color:u.COLORS.content.primary,marginLeft:8}},{children:R||x.default.toCapitilize(null==E?void 0:E.toLowerCase())||O}))})),!!g&&e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",marginLeft:8,gap:"2px"}},{children:[e.jsxRuntimeExports.jsxs(d.BodySecondary,Object.assign({style:{color:u.COLORS.content.negative}},{children:["Error loading this ",null==E?void 0:E.toLowerCase(),". Retry"]})),e.jsxRuntimeExports.jsx(d.Caption,Object.assign({style:{color:u.COLORS.content.secondary}},{children:g}))]}))]}),!b&&!h&&e.jsxRuntimeExports.jsx(p,Object.assign({onClick:()=>null==f?void 0:f(!0),onKeyDown:()=>null==f?void 0:f(!0),role:"presentation"},{children:g?e.jsxRuntimeExports.jsx(r.default,{color:u.COLORS.content.brand,width:24,height:24}):e.jsxRuntimeExports.jsx(i.default,{width:24,height:24,color:u.COLORS.content.placeholder})}))]})};

package/dist/cjs/components/template-context-mapper/modalElements/EditWebpushTemplate.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("lodash"),i=require("react"),a=require("../../input/Input.js"),n=require("../../template-preview/models/Channels.js"),s=require("../../template-preview/models/TemplateMeta.js"),l=require("../context/templateModalContext.js"),o=require("../helpers/WebpushTemplateHelper.js"),r=require("../utils/getDataFromTemplateComponent.js"),d=require("./EditMediaModal.js"),p=require("./EditMediaV2.js"),u=require("./EditMediaV2.style.js"),m=require("./useEditWhtasappTemplateMedia.js"),c=require("./VariableConnectorsPanel.js"),h=require("./VariableConnectorWhatsApp.js"),b=require("./VariableEditorHeader.js"),g=require("./WhatsAppTemplateCardButtonV2.js");exports.default=x=>{let{template:E,onTemplateChange:j,whatsappSpecificPickerMeta:f,showVariableModal:M}=x;var C,T,v;const[R,V]=i.useState(null),[L,y]=i.useState(null),{variableList:I,disableEditVariable:w,originalVariableList:O,setOriginalVariableList:q}=l.useTemplateModalContext(),{processWebpushTemplate:A,isValidUrl:S}=o.default(),[k,B]=i.useState(null),[D,W]=i.useState(null),[H,P]=i.useState(null);i.useEffect((()=>{I&&A(E,I,O,w).then((e=>{let{templateVariableMapping:t,template:i,webpushBroadcastConfig:a}=e;V(t),null==q||q(t),null==j||j(Object.assign({},i)),y(a)}))}),[I,w]);const{descriptionComponents:F,bodyVariables:U,titleVariables:_}=i.useMemo((()=>{if(R&&L){const e=r.getAllDataFromWebpushTemplateComponent(L,R);return k||B(e.iconImage),D||W(e.bannerImage),H||P(e.redirectionLink),{descriptionComponents:e.descriptionComponents,bodyVariables:e.bodyVariables,titleVariables:e.titleVariables}}return{descriptionComponents:[],bodyVariables:[],titleVariables:[],iconImage:null,bannerImage:null}}),[R,L]),{uploadMediaLink:N,uploadMediaFiles:Y,validateMimeType:G}=f,$=i.useRef(null),K=m.useEditWhatsappTemplateMedia({uploadMediaLink:N,uploadMediaFiles:Y,updateTemplateImageUrl:e=>J(e,"icon"),validateMimeType:G,mediaComponent:k,fileRef:$}),z=m.useEditWhatsappTemplateMedia({uploadMediaLink:N,uploadMediaFiles:Y,updateTemplateImageUrl:e=>J(e,"image"),validateMimeType:G,mediaComponent:D,fileRef:$});function J(e,i){const a=Object.assign({},E),n=t.cloneDeep(a);"icon"===i?(n.webpushBroadcastConfig.icon=[e],B([e])):"image"===i&&(n.webpushBroadcastConfig.image=[e],W([e])),null==j||j(Object.assign({},n))}function Q(e,i,a){var n;const s=Object.assign({},E),l=t.cloneDeep(s),o="custom"===i&&"string"==typeof e,r=null===(n=null==l?void 0:l.webpushBroadcastConfig)||void 0===n?void 0:n.buttons;if(r&&r.length>0){r[a]=o?e:"string"!=typeof e?e.placeHolder:"";const t=Object.assign(Object.assign({},l.webpushBroadcastConfig),{buttons:r});l.webpushBroadcastConfig=t}null==j||j(l)}const X=K.openEditMedia?K:z.openEditMedia?z:null;if(X)return e.jsxRuntimeExports.jsx(c.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsxRuntimeExports.jsx(d.default,{mediaComponentFormat:s.HEADER_TYPES.IMAGE,uploadMedia:X.uploadMedia,variableListForImage:[],useEditWhatsappTemplateMediaResponse:X,setOpenEditMedia:X.setOpenEditMedia,openEditMedia:X.openEditMedia,editIconRef:X.editIconRef,fileRef:$,skipAddVariable:!0})}));return e.jsxRuntimeExports.jsxs(c.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:"auto"}},{children:[k&&k.length?e.jsxRuntimeExports.jsx(u.EditTemplateMediaContainer,{children:e.jsxRuntimeExports.jsx(p.default,{imageName:k,handleImageChange:K.handleImageChange,mediaType:s.HEADER_TYPES.IMAGE,error:K.error,isLoading:K.loading,setOpenEditMedia:K.setOpenEditMedia})}):null,D&&D.length?e.jsxRuntimeExports.jsx(u.EditTemplateMediaContainer,{children:e.jsxRuntimeExports.jsx(p.default,{imageName:D,handleImageChange:z.handleImageChange,mediaType:s.HEADER_TYPES.IMAGE,error:z.error,isLoading:z.loading,setOpenEditMedia:z.setOpenEditMedia})}):null,(null==U?void 0:U.length)||(null==_?void 0:_.length)?e.jsxRuntimeExports.jsx(b.default,{containerStyle:{paddingTop:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}):null,null==F?void 0:F.map(((t,i)=>e.jsxRuntimeExports.jsx(h.default,{originalVariableList:R,originalList:O,channel:n.CHANNEL_TYPE.WEBPUSH,type:t.type,descriptionComponent:t.component,showVariableModal:M},i))),H&&H.length?e.jsxRuntimeExports.jsx("div",Object.assign({style:{padding:"16px 14px"}},{children:e.jsxRuntimeExports.jsx(a.Input,{labelText:"Redirection Link",id:"redirection-link",value:H[0].replace("https://",""),errorMessage:S(H[0])?"":"Please enter a valid URL",maxCharLimit:2e3,noKeyDownChange:!0,state:w?"disabled":"none",prefixText:"https://",placeholder:"Enter custom URL here",onChangeText:e=>{!function(e){var i;const a=`https://${e}`;P([a]);const n=t.cloneDeep(E);(null===(i=n.webpushBroadcastConfig)||void 0===i?void 0:i.redirectionLink)&&(n.webpushBroadcastConfig.redirectionLink=[a]),null==j||j(Object.assign({},n))}(e)}})})):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}),(null===(T=null===(C=null==R?void 0:R.buttons)||void 0===C?void 0:C.filter((e=>"URL"===e.type)))||void 0===T?void 0:T.length)>0&&e.jsxRuntimeExports.jsx(b.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(v=null==R?void 0:R.buttons)||void 0===v?void 0:v.map(((t,i)=>e.jsxRuntimeExports.jsx(g.default,{variableListIndex:i,CTAoptions:null==f?void 0:f.CTAoptions,button:t,currentVariableList:R,updateSelectedURLTemplateBtn:Q},`${i}`)))]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("../../../node_modules/lodash/cloneDeep.js"),i=require("react"),a=require("../../input/Input.js"),n=require("../../template-preview/models/Channels.js"),s=require("../../template-preview/models/TemplateMeta.js"),l=require("../context/templateModalContext.js"),o=require("../helpers/WebpushTemplateHelper.js"),r=require("../utils/getDataFromTemplateComponent.js"),d=require("./EditMediaModal.js"),u=require("./EditMediaV2.js"),p=require("./EditMediaV2.style.js"),m=require("./useEditWhtasappTemplateMedia.js"),c=require("./VariableConnectorsPanel.js"),h=require("./VariableConnectorWhatsApp.js"),b=require("./VariableEditorHeader.js"),g=require("./WhatsAppTemplateCardButtonV2.js");exports.default=x=>{let{template:j,onTemplateChange:E,whatsappSpecificPickerMeta:f,showVariableModal:M}=x;var C,T,v;const[R,V]=i.useState(null),[L,y]=i.useState(null),{variableList:I,disableEditVariable:w,originalVariableList:O,setOriginalVariableList:q}=l.useTemplateModalContext(),{processWebpushTemplate:A,isValidUrl:S}=o.default(),[k,B]=i.useState(null),[W,H]=i.useState(null),[D,P]=i.useState(null);i.useEffect((()=>{I&&A(j,I,O,w).then((e=>{let{templateVariableMapping:t,template:i,webpushBroadcastConfig:a}=e;V(t),null==q||q(t),null==E||E(Object.assign({},i)),y(a)}))}),[I,w]);const{descriptionComponents:F,bodyVariables:U,titleVariables:_}=i.useMemo((()=>{if(R&&L){const e=r.getAllDataFromWebpushTemplateComponent(L,R);return k||B(e.iconImage),W||H(e.bannerImage),D||P(e.redirectionLink),{descriptionComponents:e.descriptionComponents,bodyVariables:e.bodyVariables,titleVariables:e.titleVariables}}return{descriptionComponents:[],bodyVariables:[],titleVariables:[],iconImage:null,bannerImage:null}}),[R,L]),{uploadMediaLink:N,uploadMediaFiles:Y,validateMimeType:G}=f,$=i.useRef(null),K=m.useEditWhatsappTemplateMedia({uploadMediaLink:N,uploadMediaFiles:Y,updateTemplateImageUrl:e=>J(e,"icon"),validateMimeType:G,mediaComponent:k,fileRef:$}),z=m.useEditWhatsappTemplateMedia({uploadMediaLink:N,uploadMediaFiles:Y,updateTemplateImageUrl:e=>J(e,"image"),validateMimeType:G,mediaComponent:W,fileRef:$});function J(e,i){const a=Object.assign({},j),n=t.default(a);"icon"===i?(n.webpushBroadcastConfig.icon=[e],B([e])):"image"===i&&(n.webpushBroadcastConfig.image=[e],H([e])),null==E||E(Object.assign({},n))}function Q(e,i,a){var n;const s=Object.assign({},j),l=t.default(s),o="custom"===i&&"string"==typeof e,r=null===(n=null==l?void 0:l.webpushBroadcastConfig)||void 0===n?void 0:n.buttons;if(r&&r.length>0){r[a]=o?e:"string"!=typeof e?e.placeHolder:"";const t=Object.assign(Object.assign({},l.webpushBroadcastConfig),{buttons:r});l.webpushBroadcastConfig=t}null==E||E(l)}const X=K.openEditMedia?K:z.openEditMedia?z:null;if(X)return e.jsxRuntimeExports.jsx(c.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsxRuntimeExports.jsx(d.default,{mediaComponentFormat:s.HEADER_TYPES.IMAGE,uploadMedia:X.uploadMedia,variableListForImage:[],useEditWhatsappTemplateMediaResponse:X,setOpenEditMedia:X.setOpenEditMedia,openEditMedia:X.openEditMedia,editIconRef:X.editIconRef,fileRef:$,skipAddVariable:!0})}));return e.jsxRuntimeExports.jsxs(c.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:"auto"}},{children:[k&&k.length?e.jsxRuntimeExports.jsx(p.EditTemplateMediaContainer,{children:e.jsxRuntimeExports.jsx(u.default,{imageName:k,handleImageChange:K.handleImageChange,mediaType:s.HEADER_TYPES.IMAGE,error:K.error,isLoading:K.loading,setOpenEditMedia:K.setOpenEditMedia})}):null,W&&W.length?e.jsxRuntimeExports.jsx(p.EditTemplateMediaContainer,{children:e.jsxRuntimeExports.jsx(u.default,{imageName:W,handleImageChange:z.handleImageChange,mediaType:s.HEADER_TYPES.IMAGE,error:z.error,isLoading:z.loading,setOpenEditMedia:z.setOpenEditMedia})}):null,(null==U?void 0:U.length)||(null==_?void 0:_.length)?e.jsxRuntimeExports.jsx(b.default,{containerStyle:{paddingTop:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}):null,null==F?void 0:F.map(((t,i)=>e.jsxRuntimeExports.jsx(h.default,{originalVariableList:R,originalList:O,channel:n.CHANNEL_TYPE.WEBPUSH,type:t.type,descriptionComponent:t.component,showVariableModal:M},i))),D&&D.length?e.jsxRuntimeExports.jsx("div",Object.assign({style:{padding:"16px 14px"}},{children:e.jsxRuntimeExports.jsx(a.Input,{labelText:"Redirection Link",id:"redirection-link",value:D[0].replace("https://",""),errorMessage:S(D[0])?"":"Please enter a valid URL",maxCharLimit:2e3,noKeyDownChange:!0,state:w?"disabled":"none",prefixText:"https://",placeholder:"Enter custom URL here",onChangeText:e=>{!function(e){var i;const a=`https://${e}`;P([a]);const n=t.default(j);(null===(i=n.webpushBroadcastConfig)||void 0===i?void 0:i.redirectionLink)&&(n.webpushBroadcastConfig.redirectionLink=[a]),null==E||E(Object.assign({},n))}(e)}})})):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}),(null===(T=null===(C=null==R?void 0:R.buttons)||void 0===C?void 0:C.filter((e=>"URL"===e.type)))||void 0===T?void 0:T.length)>0&&e.jsxRuntimeExports.jsx(b.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(v=null==R?void 0:R.buttons)||void 0===v?void 0:v.map(((t,i)=>e.jsxRuntimeExports.jsx(g.default,{variableListIndex:i,CTAoptions:null==f?void 0:f.CTAoptions,button:t,currentVariableList:R,updateSelectedURLTemplateBtn:Q},`${i}`)))]}))};

package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("@bikdotai/bik-models/growth/models/bik-store"),n=require("../../../assets/icons/arrow_back.svg.js"),l=require("../../../assets/icons/chevronLeft.svg.js"),i=require("../../../assets/icons/chevronRight.svg.js"),o=require("../../../assets/icons/PlusIcon.js"),s=require("lodash"),r=require("react");require("../../button/index.js"),require("../../icon-button/index.js"),require("../../product-picker-v2/index.js");var a=require("../../product-picker-v2/type.js"),d=require("../Badge/index.js"),u=require("../context/templateModalContext.js"),c=require("./EditWhatsAppTemplateV2.js"),p=require("./ProductBox.js");require("../../template-preview/index.js");var x=require("../../template-preview/helpers/templateMiscHelper.js"),m=require("../../TypographyStyle.js"),v=require("../../../constants/Theme.js"),h=require("../../icon-button/IconButton.js"),g=require("../../button/Button.js"),j=require("../../template-preview/models/WhatsAppTemplate.js"),y=require("../../product-picker-v2/modal.js");exports.default=f=>{let{template:b,whatsappSpecificPickerMeta:C,showVariableModal:R,variableListForImage:E,discountCode:O,setDiscountCode:I}=f;var S,k,q,P,w,T,B,L;const{selectedCarouselIndex:M,setTemplate:D,pickerConf:F,isProductCarouselType:V,pod:A,cardCount:N,carouselProducts:$,setCarouselProducts:_,isError:W,cardImages:z,disableEditVariable:G,onDeleteSelectedProducts:H,setSelectedCarouselIndex:K,setVariableCallback:J,setShowVariablePicker:Q,sliderRef:U}=u.useTemplateModalContext(),[X,Y]=r.useState(x.isRCSChannel(null==b?void 0:b.channel)?"Carousel Cards":-1==M?"First Message (Step 1/2)":V?"Product Carousel "+((null===(k=null===(S=null==b?void 0:b.mapping)||void 0===S?void 0:S.body)||void 0===k?void 0:k.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(P=null===(q=null==b?void 0:b.mapping)||void 0===q?void 0:q.body)||void 0===P?void 0:P.length)?"(Step 2/2)":"")),[Z,ee]=r.useState(!1),[te,ne]=r.useState(!1),le=M===(null!=N?N:-1)-1,ie=(null!=M?M:-1)<1;r.useEffect((()=>{var e,t,n,l;Y(x.isRCSChannel(null==b?void 0:b.channel)?"Carousel Cards":-1==M?"First Message (Step 1/2)":V?"Product Carousel "+((null===(t=null===(e=null==b?void 0:b.mapping)||void 0===e?void 0:e.body)||void 0===t?void 0:t.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(l=null===(n=null==b?void 0:b.mapping)||void 0===n?void 0:n.body)||void 0===l?void 0:l.length)?"(Step 2/2)":""))}),[M]);const oe=e=>{null==_||_([{name:"variable",productName:e.actualValue}])};return r.useEffect((()=>{-1===M&&x.isRCSChannel(null==b?void 0:b.channel)&&(null==K||K(0))}),[M,null==b?void 0:b.channel]),e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"16px"}},{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center"}},{children:[!x.isRCSChannel(null==b?void 0:b.channel)&&null!=M&&M>=0&&!!(null===(T=null===(w=null==b?void 0:b.mapping)||void 0===w?void 0:w.body)||void 0===T?void 0:T.length)&&e.jsxRuntimeExports.jsx(h.IconButton,{Icon:n.default,onClick:()=>{null==K||K(-1)}}),e.jsxRuntimeExports.jsx(m.TitleMedium,Object.assign({style:{marginLeft:10}},{children:X}))]})),V&&(null!==(B=null==$?void 0:$.length)&&void 0!==B?B:0)>0&&null!=M&&M>=0&&e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",rowGap:8,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"}},{children:[e.jsxRuntimeExports.jsx(p.ProductBox,{editItem:()=>{1===(null==$?void 0:$.length)&&"variable"===$[0].name?(J((()=>oe)),Q(!0)):ee(!Z)},cardBody:1===(null==$?void 0:$.length)&&"variable"===$[0].name?`${$[0].productName}`:`${null==$?void 0:$.length} Products Selected`,hideIcon:1===(null==$?void 0:$.length)&&"variable"===$[0].name,deleteItem:()=>{var e;if(1===(null==$?void 0:$.length)&&"variable"===$[0].name)return void(null==_||_([]));const t=s.cloneDeep(Object.assign({},b));t&&(z&&z.length>0?null==z||z.forEach(((e,n)=>{var l;t.components[1].cards[n].components[0].example.header_handle=[null!==(l=z[n])&&void 0!==l?l:"https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})):null===(e=null==t?void 0:t.components[1].cards)||void 0===e||e.forEach(((e,n)=>{t.components[1].cards[n].components[0].example.header_handle=["https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})),null==D||D(t)),null==_||_([]),null==H||H()}}),$&&(null==$?void 0:$.length)>0&&"variable"!=$[0].name&&e.jsxRuntimeExports.jsx(g.Button,{disabled:(null!==(L=null==$?void 0:$.length)&&void 0!==L?L:0)<=1,style:{alignSelf:"flex-end"},onClick:()=>{ne(!0),ee(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]})),!G&&V&&0===(null==$?void 0:$.length)&&null!=M&&M>=0&&e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({style:{marginLeft:12}},{children:[e.jsxRuntimeExports.jsx(m.TitleRegular,{children:"Product(s)"}),e.jsxRuntimeExports.jsx(m.BodySecondary,{children:`Select ${null!=N?N:1} products`})]})),e.jsxRuntimeExports.jsxs("div",Object.assign({style:{marginTop:16,marginBottom:16,marginLeft:W?16:12,marginRight:W?16:12,flexDirection:"column",display:"flex",alignItems:"center"}},{children:[e.jsxRuntimeExports.jsx(g.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12,border:W?`2px dashed ${v.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s)",buttonType:W?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",width:18,height:18}},{children:e.jsxRuntimeExports.jsx(o.default,{width:18,height:18,color:v.COLORS.content.secondary})})),onClick:e=>{ee(!0)}}),A===j.POD.CHATBOT&&e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flex:1,alignItems:"center",justifyContent:"space-between",flexDirection:"row",width:"100%"}},{children:[e.jsxRuntimeExports.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginRight:8}}),e.jsxRuntimeExports.jsx(m.BodyCaption,Object.assign({style:{color:"#616161",overflow:"unset"}},{children:"OR"})),e.jsxRuntimeExports.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginLeft:8}})]})),e.jsxRuntimeExports.jsx(g.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",marginTop:12,width:"100%",border:W?`2px dashed ${v.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s) Variable",buttonType:W?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex"}},{children:e.jsxRuntimeExports.jsx(o.default,{width:18,height:18,color:v.COLORS.content.secondary})})),onClick:e=>{J((()=>oe)),Q(!0)}})]})]})),W&&e.jsxRuntimeExports.jsx("div",Object.assign({style:{marginLeft:10,marginBottom:16}},{children:e.jsxRuntimeExports.jsx(d.Badge,{padding:"8px",errorText:"Please add products"})}))]}),!V&&(null!=M?M:-1)>-1&&e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",background:v.COLORS.surface.hovered,alignItems:"center"}},{children:[e.jsxRuntimeExports.jsx(h.IconButton,{Icon:l.default,disabled:ie,width:8,height:14,svgStyle:ie?{}:{color:v.COLORS.content.secondary},onClick:()=>{var e;null===(e=null==U?void 0:U.current)||void 0===e||e.slickPrev(),(null!=M?M:-1)<1||null==K||K((e=>e-1))}}),e.jsxRuntimeExports.jsx(m.TitleRegular,Object.assign({style:{flex:1,display:"flex",justifyContent:"center"},color:v.COLORS.content.secondary},{children:`Card ${(null!=M?M:0)+1}/${N}`})),e.jsxRuntimeExports.jsx(h.IconButton,{Icon:i.default,width:8,height:14,disabled:le,svgStyle:le?{}:{color:v.COLORS.content.secondary},onClick:()=>{var e;null===(e=null==U?void 0:U.current)||void 0===e||e.slickNext(),(null!=M?M:-1)>=(null!=N?N:-1)-1||null==K||K((e=>e+1))}})]})),e.jsxRuntimeExports.jsx(c.default,{whatsappSpecificPickerMeta:C,template:b,onTemplateChange:e=>{null==D||D(e)},showVariableModal:R,variableListForImage:E,discountCode:O,setDiscountCode:I}),Z&&F&&e.jsxRuntimeExports.jsx(y.ProductPickerModal,{zIndex:200,startupScreen:te?a.ScreenName.RearrangeProducts:a.ScreenName.Collections,rearrangeEnabled:!0,storeId:F.storeId,selectedItems:(e=>{if(e.length>0){const t={};for(const n of e){const e=null==n?void 0:n.collectionId,l=n.productId,i=n.variantId;e in t||(t[e]={products:{},name:"",image:"",isSmartCollection:!1}),l in t[e].products||(t[e].products[l]={variants:{},name:(null==n?void 0:n.productName)||"",image:(null==n?void 0:n.productImage)||""}),t[e].products[l].variants[i]={name:(null==n?void 0:n.name)||"",price:"",image:(null==n?void 0:n.image)||"",quantity:n.quantity||0,displayOrder:n.displayOrder}}return t}return{}})(null!=$?$:[]),collectionFetcher:F.fetchCollections,productFetcher:F.fetchProducts,onAdd:(e,t)=>{var n,l,i,o,r,a;ne(!1);const d=[];delete e.isCustom;for(const t of Object.keys(e)){const s=e[t].products;if(void 0!==s&&Object.keys(s).length)for(const e of Object.keys(s)){const u=s[e].variants;if(void 0!==u&&Object.keys(u).length)for(const c of Object.keys(u)){const{name:p,image:x,quantity:m,displayOrder:v}=u[c],h={name:p,image:null!==(l=null!=x?x:null===(n=s[e])||void 0===n?void 0:n.image)&&void 0!==l?l:"",quantity:m,variantId:c,productId:e,displayOrder:v,collectionId:t,productName:null!==(o=null===(i=s[e])||void 0===i?void 0:i.name)&&void 0!==o?o:"",productImage:null!==(a=null===(r=s[e])||void 0===r?void 0:r.image)&&void 0!==a?a:""};d.push(h)}}}const u=d.sort(((e,t)=>e.displayOrder-t.displayOrder)),c=d.map((e=>e.image)),p=s.cloneDeep(Object.assign({},b));p&&(c.forEach(((e,t)=>{var n;p.components[1].cards[t].components[0].example.header_handle=e?[e]:[null!==(n=null==z?void 0:z[t])&&void 0!==n?n:""]})),null==D||D(p)),null==_||_(u),ee(!1)},searchInCollectionFetcher:F.searchInCollection,searchFetcher:F.searchProducts,visible:Z,onClose:()=>{ee(!1)},exactLimit:null!=N?N:1,appType:F.appType||t.ApplicationType.BIK})]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("@bikdotai/bik-models/growth/models/bik-store"),l=require("../../../assets/icons/arrow_back.svg.js"),n=require("../../../assets/icons/chevronLeft.svg.js"),i=require("../../../assets/icons/chevronRight.svg.js"),s=require("../../../assets/icons/PlusIcon.js"),o=require("../../../node_modules/lodash/cloneDeep.js"),r=require("react"),a=require("../../button/Button.js"),d=require("../../icon-button/IconButton.js"),u=require("../../product-picker-v2/modal.js"),c=require("../../product-picker-v2/type.js"),p=require("../Badge/index.js"),m=require("../context/templateModalContext.js"),x=require("./EditWhatsAppTemplateV2.js"),v=require("./ProductBox.js");require("../../template-preview/TemplatePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js");var h=require("../../../constants/Theme.js");require("../../curtain/CurtainHelper.js"),require("../../variable-picker-v3/model.js"),require("../../template-preview/models/TemplateMeta.js");var g=require("../../template-preview/models/WhatsAppTemplate.js");require("../../template-preview/models/Channels.js");var j=require("../../template-preview/helpers/templateMiscHelper.js"),y=require("../../TypographyStyle.js");exports.default=f=>{let{template:b,whatsappSpecificPickerMeta:C,showVariableModal:R,variableListForImage:E,discountCode:O,setDiscountCode:I}=f;var S,k,q,w,P,T,B,L;const{selectedCarouselIndex:M,setTemplate:A,pickerConf:D,isProductCarouselType:F,pod:V,cardCount:W,carouselProducts:_,setCarouselProducts:N,isError:$,cardImages:z,disableEditVariable:G,onDeleteSelectedProducts:H,setSelectedCarouselIndex:K,setVariableCallback:J,setShowVariablePicker:Q,sliderRef:U}=m.useTemplateModalContext(),[X,Y]=r.useState(j.isRCSChannel(null==b?void 0:b.channel)?"Carousel Cards":-1==M?"First Message (Step 1/2)":F?"Product Carousel "+((null===(k=null===(S=null==b?void 0:b.mapping)||void 0===S?void 0:S.body)||void 0===k?void 0:k.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(w=null===(q=null==b?void 0:b.mapping)||void 0===q?void 0:q.body)||void 0===w?void 0:w.length)?"(Step 2/2)":"")),[Z,ee]=r.useState(!1),[te,le]=r.useState(!1),ne=M===(null!=W?W:-1)-1,ie=(null!=M?M:-1)<1;r.useEffect((()=>{var e,t,l,n;Y(j.isRCSChannel(null==b?void 0:b.channel)?"Carousel Cards":-1==M?"First Message (Step 1/2)":F?"Product Carousel "+((null===(t=null===(e=null==b?void 0:b.mapping)||void 0===e?void 0:e.body)||void 0===t?void 0:t.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(n=null===(l=null==b?void 0:b.mapping)||void 0===l?void 0:l.body)||void 0===n?void 0:n.length)?"(Step 2/2)":""))}),[M]);const se=e=>{null==N||N([{name:"variable",productName:e.actualValue}])};return r.useEffect((()=>{-1===M&&j.isRCSChannel(null==b?void 0:b.channel)&&(null==K||K(0))}),[M,null==b?void 0:b.channel]),e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"16px"}},{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center"}},{children:[!j.isRCSChannel(null==b?void 0:b.channel)&&null!=M&&M>=0&&!!(null===(T=null===(P=null==b?void 0:b.mapping)||void 0===P?void 0:P.body)||void 0===T?void 0:T.length)&&e.jsxRuntimeExports.jsx(d.IconButton,{Icon:l.default,onClick:()=>{null==K||K(-1)}}),e.jsxRuntimeExports.jsx(y.TitleMedium,Object.assign({style:{marginLeft:10}},{children:X}))]})),F&&(null!==(B=null==_?void 0:_.length)&&void 0!==B?B:0)>0&&null!=M&&M>=0&&e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",rowGap:8,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"}},{children:[e.jsxRuntimeExports.jsx(v.ProductBox,{editItem:()=>{1===(null==_?void 0:_.length)&&"variable"===_[0].name?(J((()=>se)),Q(!0)):ee(!Z)},cardBody:1===(null==_?void 0:_.length)&&"variable"===_[0].name?`${_[0].productName}`:`${null==_?void 0:_.length} Products Selected`,hideIcon:1===(null==_?void 0:_.length)&&"variable"===_[0].name,deleteItem:()=>{var e;if(1===(null==_?void 0:_.length)&&"variable"===_[0].name)return void(null==N||N([]));const t=o.default(Object.assign({},b));t&&(z&&z.length>0?null==z||z.forEach(((e,l)=>{var n;t.components[1].cards[l].components[0].example.header_handle=[null!==(n=z[l])&&void 0!==n?n:"https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})):null===(e=null==t?void 0:t.components[1].cards)||void 0===e||e.forEach(((e,l)=>{t.components[1].cards[l].components[0].example.header_handle=["https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})),null==A||A(t)),null==N||N([]),null==H||H()}}),_&&(null==_?void 0:_.length)>0&&"variable"!=_[0].name&&e.jsxRuntimeExports.jsx(a.Button,{disabled:(null!==(L=null==_?void 0:_.length)&&void 0!==L?L:0)<=1,style:{alignSelf:"flex-end"},onClick:()=>{le(!0),ee(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]})),!G&&F&&0===(null==_?void 0:_.length)&&null!=M&&M>=0&&e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({style:{marginLeft:12}},{children:[e.jsxRuntimeExports.jsx(y.TitleRegular,{children:"Product(s)"}),e.jsxRuntimeExports.jsx(y.BodySecondary,{children:`Select ${null!=W?W:1} products`})]})),e.jsxRuntimeExports.jsxs("div",Object.assign({style:{marginTop:16,marginBottom:16,marginLeft:$?16:12,marginRight:$?16:12,flexDirection:"column",display:"flex",alignItems:"center"}},{children:[e.jsxRuntimeExports.jsx(a.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12,border:$?`2px dashed ${h.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s)",buttonType:$?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",width:18,height:18}},{children:e.jsxRuntimeExports.jsx(s.default,{width:18,height:18,color:h.COLORS.content.secondary})})),onClick:e=>{ee(!0)}}),V===g.POD.CHATBOT&&e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flex:1,alignItems:"center",justifyContent:"space-between",flexDirection:"row",width:"100%"}},{children:[e.jsxRuntimeExports.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginRight:8}}),e.jsxRuntimeExports.jsx(y.BodyCaption,Object.assign({style:{color:"#616161",overflow:"unset"}},{children:"OR"})),e.jsxRuntimeExports.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginLeft:8}})]})),e.jsxRuntimeExports.jsx(a.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",marginTop:12,width:"100%",border:$?`2px dashed ${h.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s) Variable",buttonType:$?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex"}},{children:e.jsxRuntimeExports.jsx(s.default,{width:18,height:18,color:h.COLORS.content.secondary})})),onClick:e=>{J((()=>se)),Q(!0)}})]})]})),$&&e.jsxRuntimeExports.jsx("div",Object.assign({style:{marginLeft:10,marginBottom:16}},{children:e.jsxRuntimeExports.jsx(p.Badge,{padding:"8px",errorText:"Please add products"})}))]}),!F&&(null!=M?M:-1)>-1&&e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",background:h.COLORS.surface.hovered,alignItems:"center"}},{children:[e.jsxRuntimeExports.jsx(d.IconButton,{Icon:n.default,disabled:ie,width:8,height:14,svgStyle:ie?{}:{color:h.COLORS.content.secondary},onClick:()=>{var e;null===(e=null==U?void 0:U.current)||void 0===e||e.slickPrev(),(null!=M?M:-1)<1||null==K||K((e=>e-1))}}),e.jsxRuntimeExports.jsx(y.TitleRegular,Object.assign({style:{flex:1,display:"flex",justifyContent:"center"},color:h.COLORS.content.secondary},{children:`Card ${(null!=M?M:0)+1}/${W}`})),e.jsxRuntimeExports.jsx(d.IconButton,{Icon:i.default,width:8,height:14,disabled:ne,svgStyle:ne?{}:{color:h.COLORS.content.secondary},onClick:()=>{var e;null===(e=null==U?void 0:U.current)||void 0===e||e.slickNext(),(null!=M?M:-1)>=(null!=W?W:-1)-1||null==K||K((e=>e+1))}})]})),e.jsxRuntimeExports.jsx(x.default,{whatsappSpecificPickerMeta:C,template:b,onTemplateChange:e=>{null==A||A(e)},showVariableModal:R,variableListForImage:E,discountCode:O,setDiscountCode:I}),Z&&D&&e.jsxRuntimeExports.jsx(u.ProductPickerModal,{zIndex:200,startupScreen:te?c.ScreenName.RearrangeProducts:c.ScreenName.Collections,rearrangeEnabled:!0,storeId:D.storeId,selectedItems:(e=>{if(e.length>0){const t={};for(const l of e){const e=null==l?void 0:l.collectionId,n=l.productId,i=l.variantId;e in t||(t[e]={products:{},name:"",image:"",isSmartCollection:!1}),n in t[e].products||(t[e].products[n]={variants:{},name:(null==l?void 0:l.productName)||"",image:(null==l?void 0:l.productImage)||""}),t[e].products[n].variants[i]={name:(null==l?void 0:l.name)||"",price:"",image:(null==l?void 0:l.image)||"",quantity:l.quantity||0,displayOrder:l.displayOrder}}return t}return{}})(null!=_?_:[]),collectionFetcher:D.fetchCollections,productFetcher:D.fetchProducts,onAdd:(e,t)=>{var l,n,i,s,r,a;le(!1);const d=[];delete e.isCustom;for(const t of Object.keys(e)){const o=e[t].products;if(void 0!==o&&Object.keys(o).length)for(const e of Object.keys(o)){const u=o[e].variants;if(void 0!==u&&Object.keys(u).length)for(const c of Object.keys(u)){const{name:p,image:m,quantity:x,displayOrder:v}=u[c],h={name:p,image:null!==(n=null!=m?m:null===(l=o[e])||void 0===l?void 0:l.image)&&void 0!==n?n:"",quantity:x,variantId:c,productId:e,displayOrder:v,collectionId:t,productName:null!==(s=null===(i=o[e])||void 0===i?void 0:i.name)&&void 0!==s?s:"",productImage:null!==(a=null===(r=o[e])||void 0===r?void 0:r.image)&&void 0!==a?a:""};d.push(h)}}}const u=d.sort(((e,t)=>e.displayOrder-t.displayOrder)),c=d.map((e=>e.image)),p=o.default(Object.assign({},b));p&&(c.forEach(((e,t)=>{var l;p.components[1].cards[t].components[0].example.header_handle=e?[e]:[null!==(l=null==z?void 0:z[t])&&void 0!==l?l:""]})),null==A||A(p)),null==N||N(u),ee(!1)},searchInCollectionFetcher:D.searchInCollection,searchFetcher:D.searchProducts,visible:Z,onClose:()=>{ee(!1)},exactLimit:null!=W?W:1,appType:D.appType||t.ApplicationType.BIK})]}))};

package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js

@@ -1,7 +1,7 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js");require("../../../helpers/index.js");var n=require("lodash"),t=require("react"),o=require("styled-components");require("../../input/index.js"),require("../../input-with-vars/index.js");var i=require("../../template-preview/helpers/templateMiscHelper.js"),l=require("../../template-preview/models/TemplateMeta.js"),a=require("../../template-preview/models/WhatsAppTemplate.js"),s=require("../context/templateModalContext.js"),d=require("../utils/constants.js"),r=require("../utils/getDataFromTemplateComponent.js"),u=require("../utils/validateIsUrl.js"),p=require("../utils/validateName.js"),c=require("./BackTrackComponent.js"),v=require("./DiscountCodeComponent.js"),m=require("./EditMediaModal.js"),b=require("./EditMediaV2.js"),g=require("./EditMediaV2.style.js"),x=require("./useEditWhtasappTemplateMedia.js"),j=require("./VariableConnector.js"),h=require("./VariableConnectorsPanel.js"),f=require("./VariableConnectorWhatsApp.js"),C=require("./VariableEditorHeader.js"),T=require("./WhatsAppTemplateCardButtonV2.js"),E=require("../../input-with-vars/InputWithVariables.js"),O=require("../../variable-picker-v3/model.js"),y=require("../../input/Input.js");function R(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const V=R(o).default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js");require("../../curtain/CurtainHelper.js");var t=require("../../variable-picker-v3/model.js"),n=require("../../../node_modules/lodash/cloneDeep.js"),o=require("react"),i=require("styled-components"),l=require("../../input/Input.js"),a=require("../../input-with-vars/InputWithVariables.js"),s=require("../../template-preview/helpers/templateMiscHelper.js"),d=require("../../template-preview/models/TemplateMeta.js"),r=require("../../template-preview/models/WhatsAppTemplate.js"),u=require("../context/templateModalContext.js"),p=require("../utils/constants.js"),c=require("../utils/getDataFromTemplateComponent.js"),v=require("../utils/validateIsUrl.js"),m=require("../utils/validateName.js"),b=require("./BackTrackComponent.js"),g=require("./DiscountCodeComponent.js"),x=require("./EditMediaModal.js"),j=require("./EditMediaV2.js"),h=require("./EditMediaV2.style.js"),f=require("./useEditWhtasappTemplateMedia.js"),C=require("./VariableConnector.js"),T=require("./VariableConnectorsPanel.js"),E=require("./VariableConnectorWhatsApp.js"),O=require("./VariableEditorHeader.js"),y=require("./WhatsAppTemplateCardButtonV2.js");function R(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const V=R(i).default.div`
 	padding-top: 24px;
 	padding-left: 10px;
 	padding-right: 10px;
 	margin-bottom: 8px;
 	line-height: normal;
-`;exports.default=o=>{let{template:R,onTemplateChange:B,whatsappSpecificPickerMeta:M,showVariableModal:k,variableListForImage:I,setDiscountCode:q,fileName:D,setFileName:P}=o;var L,U,w,A,_,N,S,H,F,Q,Y,W,K,$,G,X,z,J,Z,ee,ne,te,oe,ie,le,ae,se,de,re,ue,pe,ce,ve,me,be,ge,xe,je,he;const fe=R.isCarouselType,{originalVariableList:Ce,pod:Te,extras:Ee,selectedCarouselIndex:Oe,isProductCarouselType:ye,disableCopyCode:Re,isError:Ve,cardIndex:Be}=s.useTemplateModalContext(),{descriptionComponents:Me,urlBtns:ke,qrbBtns:Ie,imageComponent:qe,bodyVariables:De,headerVariables:Pe,titleVariables:Le}=r.getAllDataFromTemplateComponent(R),Ue=t.useRef(null),[we,Ae]=t.useState(!1),[_e,Ne]=t.useState(-1===Oe?{descriptionComponents:Me,urlBtns:ke,qrbBtns:Ie,imageComponent:qe,bodyVariables:De,headerVariables:Pe,titleVariables:Le}:{}),{uploadMediaLink:Se,uploadMediaFiles:He,validateMimeType:Fe}=M,Qe=x.useEditWhatsappTemplateMedia({uploadMediaLink:Se,uploadMediaFiles:He,updateTemplateImageUrl:function(e,t){var o,i,l,a,s,d,r,u;let p;p=null!=Oe&&Oe>-1?{components:null===(i=null===(o=R.components[Be])||void 0===o?void 0:o.cards)||void 0===i?void 0:i[Oe].components,mapping:null===(a=null===(l=null==R?void 0:R.mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a[Oe]}:Object.assign({},R);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:t,example:{header_handle:[e]}}),o=[...p.components];o[c]=n,p=Object.assign(Object.assign({},p),{components:o})}p.mapping&&(p.mapping=Object.assign(Object.assign({},p.mapping),{header:void 0}));if(null!=Oe&&Oe>-1){const e=n.cloneDeep(R);e.components[Be].cards[Oe].components=p.components,(null===(d=null==e?void 0:e.mapping)||void 0===d?void 0:d.cards)&&(null===(r=null==e?void 0:e.mapping)||void 0===r?void 0:r.cards.length)>0&&(e.mapping.cards[Oe]=null!==(u=p.mapping)&&void 0!==u?u:{}),null==B||B(Object.assign({},e)),We(!0)}else null==B||B(Object.assign({},p))},validateMimeType:Fe,mediaComponent:fe?_e.imageComponent:qe,fileRef:Ue}),[Ye,We]=t.useState(!1),[Ke,$e]=t.useState(D),[Ge,Xe]=t.useState();function ze(e,t,o){var l,a,s,d,r,u,p,c,v,m;const b=null!=Oe&&Oe>-1?{components:null===(l=Object.assign({},R).components[Be].cards)||void 0===l?void 0:l[Oe].components,mapping:null===(a=Object.assign({},R).mapping.cards)||void 0===a?void 0:a[Oe]}:Object.assign({},R),g=n.cloneDeep(b),x="custom"===t&&"string"==typeof e,j=x?e:"string"!=typeof e?e.defaultValue?e.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=Oe&&Oe>-1&&ye){const t=Object.assign({},R).components.map((e=>{var n;return i.isCarouselComponent(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,t,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!==(t=null==l?void 0:l[o])&&void 0!==t?t:{};a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[j]});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})),l=null===(d=null===(s=Object.assign({},R).mapping)||void 0===s?void 0:s.cards)||void 0===d?void 0:d.map((n=>{var t;return Object.assign(Object.assign({},n),{buttons:null===(t=null==n?void 0:n.buttons)||void 0===t?void 0:t.map(((n,t)=>t===o?x?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"":n))})})),a=n.cloneDeep(R);return a.components=t,a.mapping.cards=l,void(null==B||B(Object.assign({},a)))}const h=null==g?void 0:g.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==h&&h>-1){const n=null===(r=null==g?void 0:g.components[h].buttons)||void 0===r?void 0:r.filter((e=>"URL"===e.type));if((null==n?void 0:n.length)>0){const i="custom"===t&&"string"==typeof e,l=i?e:"string"!=typeof e&&e.defaultValue?e.defaultValue:"https://d.bik.ai/";let a=n[o];a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[l]});const s=[...null!==(c=null===(p=null===(u=g.components)||void 0===u?void 0:u[h])||void 0===p?void 0:p.buttons)&&void 0!==c?c:[]].map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e)),d=Object.assign(Object.assign({},g.components[h]),{buttons:s}),r=null===(v=g.mapping)||void 0===v?void 0:v.buttons;r&&r.length>0&&(r[o]=i?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"");const m=Object.assign(Object.assign({},g.mapping),{buttons:r});g.mapping=m;const b=[...g.components];b[h]=d,g.components=b}}if("string"!=typeof e){"checkout.checkoutUrl"===(null===(m=e.placeHolder)||void 0===m?void 0:m.slice(2,-2))?Ae(!0):(Ae(!1),null==q||q(""))}if(null!=Oe&&Oe>-1){const e=n.cloneDeep(R);e.components[Be].cards[Oe].components=g.components,e.mapping.cards[Oe]=g.mapping,null==B||B(Object.assign({},e))}else null==B||B(g)}function Je(e,t,o){var l,a,s,d,r,u,p;const c=null!=Oe&&Oe>-1?{components:null===(l=Object.assign({},R).components[Be].cards)||void 0===l?void 0:l[Oe].components,mapping:null===(a=Object.assign({},R).mapping.cards)||void 0===a?void 0:a[Oe]}:Object.assign({},R);if(null!=Oe&&Oe>-1&&ye){const t=Object.assign({},R).components.map((n=>{var t;return i.isCarouselComponent(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((e=>"QUICK_REPLY"===e.type));let s=null!==(i=null==a?void 0:a[o])&&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})),l=n.cloneDeep(R);return l.components=t,void(null==B||B(Object.assign({},l)))}const v=null==c?void 0:c.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==v&&v>-1){const n=null===(d=null===(s=null==c?void 0:c.components[v])||void 0===s?void 0:s.buttons)||void 0===d?void 0:d.filter((e=>"QUICK_REPLY"===e.type));if(n){let t=n[o];t=Object.assign(Object.assign({},t),{flowId:e.flowId,flowName:e.flowName});const i=[...null!==(p=null===(u=null===(r=c.components)||void 0===r?void 0:r[v])||void 0===u?void 0:u.buttons)&&void 0!==p?p:[]].map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e)),l=Object.assign(Object.assign({},c.components[v]),{buttons:i}),a=[...c.components];a[v]=l,c.components=a}}if(null!=Oe&&Oe>-1){const e=n.cloneDeep(R);e.components[Be].cards[Oe].components=c.components,null==B||B(Object.assign({},e))}else null==B||B(c)}t.useEffect((()=>{var e,n;if(null===(e=R.mapping.buttons)||void 0===e?void 0:e.find((e=>"checkout.checkoutUrl"===e.slice(2,-2))))Ae(!0);else{Ae(!1);const e=null===(n=null==Ee?void 0:Ee.discountCodeExtra)||void 0===n?void 0:n[1];null==e||e("")}}),[R]),t.useEffect((()=>{var e,n,t,o;if(null!=Oe&&Oe>-1){const i={components:null===(n=null===(e=R.components[Be])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Oe].components,mapping:null===(o=null===(t=null==R?void 0:R.mapping)||void 0===t?void 0:t.cards)||void 0===o?void 0:o[Oe]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:u,headerVariables:p,titleVariables:c}=r.getAllDataFromTemplateComponent(i);Ne({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:u,headerVariables:p,titleVariables:c})}else if(null!=Oe&&-1===Oe){const{descriptionComponents:e,urlBtns:n,qrbBtns:t,imageComponent:o,bodyVariables:i,headerVariables:l,titleVariables:a}=r.getAllDataFromTemplateComponent(R);Ne({descriptionComponents:e,urlBtns:n,qrbBtns:t,imageComponent:o,bodyVariables:i,headerVariables:l,titleVariables:a})}}),[Oe]),t.useEffect((()=>{var e,n,t,o;if(null!=Oe&&Oe>-1&&Ye){const i={components:null===(n=null===(e=R.components[Be])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Oe].components,mapping:null===(o=null===(t=null==R?void 0:R.mapping)||void 0===t?void 0:t.cards)||void 0===o?void 0:o[Oe]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:u,headerVariables:p,titleVariables:c}=r.getAllDataFromTemplateComponent(i);Ne({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:u,headerVariables:p,titleVariables:c}),We(!1)}}),[Ye]);t.useEffect((()=>{Ve&&Te===a.POD.CHATBOT&&(()=>{if(!D)return void Xe("PDF name is Required");const e=p.validateInputNameChatbot(D);null==P||P(null!=D?D:""),Xe(e?"Please enter a valid PDF name":void 0)})()}),[Ve]);const Ze=fe?_e.imageComponent:qe;return Qe.openEditMedia?e.jsxRuntimeExports.jsx(h.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsxRuntimeExports.jsx(m.default,{mediaComponentFormat:null!==(L=Ze.format)&&void 0!==L?L:l.HEADER_TYPES.IMAGE,uploadMedia:Qe.uploadMedia,variableListForImage:I||[],useEditWhatsappTemplateMediaResponse:Qe,setOpenEditMedia:Qe.setOpenEditMedia,openEditMedia:Qe.openEditMedia,editIconRef:Qe.editIconRef,fileRef:Ue})})):e.jsxRuntimeExports.jsxs(h.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:ye?"420px":"auto"}},{children:[!!_e.imageComponent&&!ye&&!i.isRCSChannel(null==R?void 0:R.channel)&&e.jsxRuntimeExports.jsxs(g.EditTemplateMediaContainer,{children:[e.jsxRuntimeExports.jsx(b.default,{imageName:null!==(w=null===(U=null==Ze?void 0:Ze.example)||void 0===U?void 0:U.header_handle)&&void 0!==w?w:[],handleImageChange:Qe.handleImageChange,mediaType:null==Ze?void 0:Ze.format,error:Qe.error,isLoading:Qe.loading,setOpenEditMedia:Qe.setOpenEditMedia,selectedVariable:u.isVariable(null!==(N=null===(_=null===(A=null==Ze?void 0:Ze.example)||void 0===A?void 0:A.header_handle)||void 0===_?void 0:_[0])&&void 0!==N?N:"")?null===(H=null===(S=null==Ze?void 0:Ze.example)||void 0===S?void 0:S.header_handle)||void 0===H?void 0:H[0]:(null===(Q=null===(F=null==R?void 0:R.mapping)||void 0===F?void 0:F.header)||void 0===Q?void 0:Q[0])?null===(W=null===(Y=null==R?void 0:R.mapping)||void 0===Y?void 0:Y.header)||void 0===W?void 0:W[0]:Qe.selectedVariable}),(null==qe?void 0:qe.format)==l.HEADER_TYPES.DOCUMENT?e.jsxRuntimeExports.jsx(V,{children:Te===a.POD.CHATBOT?e.jsxRuntimeExports.jsx(E.InputWithVariables,{labelText:"PDF Name",placeHolder:"Enter the name",errorMessage:Ge||void 0,onChange:e=>{var n;Xe(""),null==P||P(null!==(n=null==e?void 0:e.actualValue)&&void 0!==n?n:"")},pickerType:O.PickerType.EMBEDDED,noMaxCharCheck:!0,allowMix:!0,showVarHeader:!0,varHeaderText:"Select variable",prevVariable:{actualValue:null!=D?D:"",variableType:"string"},variablesList:I,showAddButton:!0}):e.jsxRuntimeExports.jsx(y.Input,{labelText:"PDF Name",placeholder:"Enter the name",value:Ke,errorMessage:Ge||void 0,onBlur:()=>{if(!Ke)return null==P||P(""),void Xe("PDF name is Required");const e=p.validateInputName(Ke);null==P||P(Ke),Xe(e?"Please enter a valid PDF name":void 0)},onChangeText:e=>{Xe(""),$e(e)}})}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})]}),(null===(K=_e.bodyVariables)||void 0===K?void 0:K.length)>0&&e.jsxRuntimeExports.jsx(C.default,{containerStyle:{paddingTop:_e.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===($=_e.descriptionComponents)||void 0===$?void 0:$.map(((n,t)=>e.jsxRuntimeExports.jsx(f.default,{originalVariableList:null!=Oe&&Oe>-1?Ce.cards[Oe]:Ce,type:n.type,descriptionComponent:n.component,showVariableModal:k},t))),(null===(z=null===(X=null!=Oe&&Oe>-1?null===(G=Ce.cards[Oe])||void 0===G?void 0:G.buttons:null==Ce?void 0:Ce.buttons)||void 0===X?void 0:X.filter((e=>"URL"===e.type)))||void 0===z?void 0:z.length)>0&&e.jsxRuntimeExports.jsx(C.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(ee=null===(Z=null!=Oe&&Oe>-1?null===(J=Ce.cards[Oe])||void 0===J?void 0:J.buttons:null==Ce?void 0:Ce.buttons)||void 0===Z?void 0:Z.filter((e=>Te===a.POD.CHATBOT||"URL"===e.type)))||void 0===ee?void 0:ee.map(((n,t)=>{const o=n.buttonVariable===d.STATIC_URL_VARIABLE_NAME,i=n.buttonVariable===d.UNSUBSCRIBE_URL_VARIABLE;if("URL"===n.type)return e.jsxRuntimeExports.jsx(T.default,{variableListIndex:t,disableEdit:o||i,CTAoptions:null==M?void 0:M.CTAoptions,button:n,currentVariableList:null!=Oe&&Oe>-1?Object.assign({},Ce.cards[Oe]):Object.assign({},Ce),updateSelectedURLTemplateBtn:ze},`${t}_${Oe}`)})),Te===a.POD.CHATBOT&&(null===(te=null===(ne=Ie[0])||void 0===ne?void 0:ne.component)||void 0===te?void 0:te.buttons)&&(null===(le=null===(ie=null===(oe=Ie[0])||void 0===oe?void 0:oe.component)||void 0===ie?void 0:ie.buttons)||void 0===le?void 0:le.length)>0&&e.jsxRuntimeExports.jsx(c.BackTrackComponent,{backTrackMessage:null===(ae=null==Ee?void 0:Ee.backTrackExtra)||void 0===ae?void 0:ae[0],setBackTrackMessage:null===(se=null==Ee?void 0:Ee.backTrackExtra)||void 0===se?void 0:se[1]}),!i.isRCSChannel(null==R?void 0:R.channel)&&(null===(ue=null===(re=null!=Oe&&Oe>-1?null===(de=Ce.cards[Oe])||void 0===de?void 0:de.buttons:null==Ce?void 0:Ce.buttons)||void 0===re?void 0:re.filter((e=>"QUICK_REPLY"===e.type)))||void 0===ue?void 0:ue.length)>0&&(Te!==a.POD.CHATBOT?e.jsxRuntimeExports.jsx(C.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.jsxRuntimeExports.jsx(c.BackTrackComponent,{backTrackMessage:null===(pe=null==Ee?void 0:Ee.backTrackExtra)||void 0===pe?void 0:pe[0],setBackTrackMessage:null===(ce=null==Ee?void 0:Ee.backTrackExtra)||void 0===ce?void 0:ce[1]})),!i.isRCSChannel(null==R?void 0:R.channel)&&(null===(be=null===(me=null!=Oe&&Oe>-1?null===(ve=Ce.cards[Oe])||void 0===ve?void 0:ve.buttons:null==Ce?void 0:Ce.buttons)||void 0===me?void 0:me.filter((e=>"QUICK_REPLY"===e.type)))||void 0===be?void 0:be.map(((n,t)=>{if("QUICK_REPLY"===n.type&&Te!==a.POD.CHATBOT)return e.jsxRuntimeExports.jsx(T.default,{variableListIndex:t,QRBoptions:null==M?void 0:M.QRBoptions,button:n,currentVariableList:null!=Oe&&Oe>-1?Object.assign({},Ce.cards[Oe]):Object.assign({},Ce),updateSelectedQRBTemplateBtn:Je},`${t}_${Oe}`)}))),Te===a.POD.CHATBOT&&we&&e.jsxRuntimeExports.jsx(v.DiscountCodeComponent,{discountCode:null===(ge=null==Ee?void 0:Ee.discountCodeExtra)||void 0===ge?void 0:ge[0],setDiscountCode:null===(xe=null==Ee?void 0:Ee.discountCodeExtra)||void 0===xe?void 0:xe[1]}),null===(he=null!=Oe&&Oe>-1?null===(je=Ce.cards[Oe])||void 0===je?void 0:je.buttons:null==Ce?void 0:Ce.buttons)||void 0===he?void 0:he.map(((n,t)=>{var o,i,l,a,s;if("COPY_CODE"===n.type)return e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:Re?e.jsxRuntimeExports.jsx("div",Object.assign({style:{marginBottom:20,borderRadius:4,padding:"8px 10px"}},{children:e.jsxRuntimeExports.jsx(y.Input,{state:"disabled",labelText:null!==(o=n.text)&&void 0!==o?o:"Copy Code",value:null!==(i=n.buttonVariable)&&void 0!==i?i:"",onChangeText:()=>{}})})):e.jsxRuntimeExports.jsx(j.default,{index:t,variable:{variableName:null!==(l=n.text)&&void 0!==l?l:"Copy Code",updatedValue:null!==(a=n.buttonVariable)&&void 0!==a?a:"",type:"string",isEditableVariable:!0,index:null!==(s=n.index)&&void 0!==s?s:0},showVariableModal:!0,componentType:"BUTTONS",buttonType:n.type},t)})}))]}))};
+`;exports.default=i=>{let{template:R,onTemplateChange:B,whatsappSpecificPickerMeta:M,showVariableModal:k,variableListForImage:I,setDiscountCode:q,fileName:D,setFileName:P}=i;var L,U,A,w,_,N,S,H,F,Q,Y,W,K,$,G,X,z,J,Z,ee,te,ne,oe,ie,le,ae,se,de,re,ue,pe,ce,ve,me,be,ge,xe,je,he;const fe=R.isCarouselType,{originalVariableList:Ce,pod:Te,extras:Ee,selectedCarouselIndex:Oe,isProductCarouselType:ye,disableCopyCode:Re,isError:Ve,cardIndex:Be}=u.useTemplateModalContext(),{descriptionComponents:Me,urlBtns:ke,qrbBtns:Ie,imageComponent:qe,bodyVariables:De,headerVariables:Pe,titleVariables:Le}=c.getAllDataFromTemplateComponent(R),Ue=o.useRef(null),[Ae,we]=o.useState(!1),[_e,Ne]=o.useState(-1===Oe?{descriptionComponents:Me,urlBtns:ke,qrbBtns:Ie,imageComponent:qe,bodyVariables:De,headerVariables:Pe,titleVariables:Le}:{}),{uploadMediaLink:Se,uploadMediaFiles:He,validateMimeType:Fe}=M,Qe=f.useEditWhatsappTemplateMedia({uploadMediaLink:Se,uploadMediaFiles:He,updateTemplateImageUrl:function(e,t){var o,i,l,a,s,d,r,u;let p;p=null!=Oe&&Oe>-1?{components:null===(i=null===(o=R.components[Be])||void 0===o?void 0:o.cards)||void 0===i?void 0:i[Oe].components,mapping:null===(a=null===(l=null==R?void 0:R.mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a[Oe]}:Object.assign({},R);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:t,example:{header_handle:[e]}}),o=[...p.components];o[c]=n,p=Object.assign(Object.assign({},p),{components:o})}p.mapping&&(p.mapping=Object.assign(Object.assign({},p.mapping),{header:void 0}));if(null!=Oe&&Oe>-1){const e=n.default(R);e.components[Be].cards[Oe].components=p.components,(null===(d=null==e?void 0:e.mapping)||void 0===d?void 0:d.cards)&&(null===(r=null==e?void 0:e.mapping)||void 0===r?void 0:r.cards.length)>0&&(e.mapping.cards[Oe]=null!==(u=p.mapping)&&void 0!==u?u:{}),null==B||B(Object.assign({},e)),We(!0)}else null==B||B(Object.assign({},p))},validateMimeType:Fe,mediaComponent:fe?_e.imageComponent:qe,fileRef:Ue}),[Ye,We]=o.useState(!1),[Ke,$e]=o.useState(D),[Ge,Xe]=o.useState();function ze(e,t,o){var i,l,a,d,r,u,p,c,v,m;const b=null!=Oe&&Oe>-1?{components:null===(i=Object.assign({},R).components[Be].cards)||void 0===i?void 0:i[Oe].components,mapping:null===(l=Object.assign({},R).mapping.cards)||void 0===l?void 0:l[Oe]}:Object.assign({},R),g=n.default(b),x="custom"===t&&"string"==typeof e,j=x?e:"string"!=typeof e?e.defaultValue?e.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=Oe&&Oe>-1&&ye){const t=Object.assign({},R).components.map((e=>{var t;return s.isCarouselComponent(e.type)?Object.assign(Object.assign({},e),{cards:null===(t=e.cards)||void 0===t?void 0:t.map((e=>Object.assign(Object.assign({},e),{components:e.components.map((e=>{var t,n,i;if("BUTTONS"===e.type){const l=null===(t=e.buttons)||void 0===t?void 0:t.filter((e=>"URL"===e.type));let a=null!==(n=null==l?void 0:l[o])&&void 0!==n?n:{};a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[j]});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===(d=null===(a=Object.assign({},R).mapping)||void 0===a?void 0:a.cards)||void 0===d?void 0:d.map((t=>{var n;return Object.assign(Object.assign({},t),{buttons:null===(n=null==t?void 0:t.buttons)||void 0===n?void 0:n.map(((t,n)=>n===o?x?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"":t))})})),l=n.default(R);return l.components=t,l.mapping.cards=i,void(null==B||B(Object.assign({},l)))}const h=null==g?void 0:g.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==h&&h>-1){const n=null===(r=null==g?void 0:g.components[h].buttons)||void 0===r?void 0:r.filter((e=>"URL"===e.type));if((null==n?void 0:n.length)>0){const i="custom"===t&&"string"==typeof e,l=i?e:"string"!=typeof e&&e.defaultValue?e.defaultValue:"https://d.bik.ai/";let a=n[o];a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[l]});const s=[...null!==(c=null===(p=null===(u=g.components)||void 0===u?void 0:u[h])||void 0===p?void 0:p.buttons)&&void 0!==c?c:[]].map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e)),d=Object.assign(Object.assign({},g.components[h]),{buttons:s}),r=null===(v=g.mapping)||void 0===v?void 0:v.buttons;r&&r.length>0&&(r[o]=i?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"");const m=Object.assign(Object.assign({},g.mapping),{buttons:r});g.mapping=m;const b=[...g.components];b[h]=d,g.components=b}}if("string"!=typeof e){"checkout.checkoutUrl"===(null===(m=e.placeHolder)||void 0===m?void 0:m.slice(2,-2))?we(!0):(we(!1),null==q||q(""))}if(null!=Oe&&Oe>-1){const e=n.default(R);e.components[Be].cards[Oe].components=g.components,e.mapping.cards[Oe]=g.mapping,null==B||B(Object.assign({},e))}else null==B||B(g)}function Je(e,t,o){var i,l,a,d,r,u,p;const c=null!=Oe&&Oe>-1?{components:null===(i=Object.assign({},R).components[Be].cards)||void 0===i?void 0:i[Oe].components,mapping:null===(l=Object.assign({},R).mapping.cards)||void 0===l?void 0:l[Oe]}:Object.assign({},R);if(null!=Oe&&Oe>-1&&ye){const t=Object.assign({},R).components.map((t=>{var n;return s.isCarouselComponent(t.type)?Object.assign(Object.assign({},t),{cards:null===(n=t.cards)||void 0===n?void 0:n.map((t=>Object.assign(Object.assign({},t),{components:t.components.map((t=>{var n,i,l;if("BUTTONS"===t.type){const a=null===(n=null==t?void 0:t.buttons)||void 0===n?void 0:n.filter((e=>"QUICK_REPLY"===e.type));let s=null!==(i=null==a?void 0:a[o])&&void 0!==i?i:{};s=Object.assign(Object.assign({},s),{flowId:e.flowId,flowName:e.flowName});const d=null===(l=null==t?void 0:t.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({},t),{buttons:d})}return t}))})))}):t})),i=n.default(R);return i.components=t,void(null==B||B(Object.assign({},i)))}const v=null==c?void 0:c.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==v&&v>-1){const t=null===(d=null===(a=null==c?void 0:c.components[v])||void 0===a?void 0:a.buttons)||void 0===d?void 0:d.filter((e=>"QUICK_REPLY"===e.type));if(t){let n=t[o];n=Object.assign(Object.assign({},n),{flowId:e.flowId,flowName:e.flowName});const i=[...null!==(p=null===(u=null===(r=c.components)||void 0===r?void 0:r[v])||void 0===u?void 0:u.buttons)&&void 0!==p?p:[]].map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==n?void 0:n.text)?n:e)),l=Object.assign(Object.assign({},c.components[v]),{buttons:i}),a=[...c.components];a[v]=l,c.components=a}}if(null!=Oe&&Oe>-1){const e=n.default(R);e.components[Be].cards[Oe].components=c.components,null==B||B(Object.assign({},e))}else null==B||B(c)}o.useEffect((()=>{var e,t;if(null===(e=R.mapping.buttons)||void 0===e?void 0:e.find((e=>"checkout.checkoutUrl"===e.slice(2,-2))))we(!0);else{we(!1);const e=null===(t=null==Ee?void 0:Ee.discountCodeExtra)||void 0===t?void 0:t[1];null==e||e("")}}),[R]),o.useEffect((()=>{var e,t,n,o;if(null!=Oe&&Oe>-1){const i={components:null===(t=null===(e=R.components[Be])||void 0===e?void 0:e.cards)||void 0===t?void 0:t[Oe].components,mapping:null===(o=null===(n=null==R?void 0:R.mapping)||void 0===n?void 0:n.cards)||void 0===o?void 0:o[Oe]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:u,titleVariables:p}=c.getAllDataFromTemplateComponent(i);Ne({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:u,titleVariables:p})}else if(null!=Oe&&-1===Oe){const{descriptionComponents:e,urlBtns:t,qrbBtns:n,imageComponent:o,bodyVariables:i,headerVariables:l,titleVariables:a}=c.getAllDataFromTemplateComponent(R);Ne({descriptionComponents:e,urlBtns:t,qrbBtns:n,imageComponent:o,bodyVariables:i,headerVariables:l,titleVariables:a})}}),[Oe]),o.useEffect((()=>{var e,t,n,o;if(null!=Oe&&Oe>-1&&Ye){const i={components:null===(t=null===(e=R.components[Be])||void 0===e?void 0:e.cards)||void 0===t?void 0:t[Oe].components,mapping:null===(o=null===(n=null==R?void 0:R.mapping)||void 0===n?void 0:n.cards)||void 0===o?void 0:o[Oe]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:u,titleVariables:p}=c.getAllDataFromTemplateComponent(i);Ne({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:u,titleVariables:p}),We(!1)}}),[Ye]);o.useEffect((()=>{Ve&&Te===r.POD.CHATBOT&&(()=>{if(!D)return void Xe("PDF name is Required");const e=m.validateInputNameChatbot(D);null==P||P(null!=D?D:""),Xe(e?"Please enter a valid PDF name":void 0)})()}),[Ve]);const Ze=fe?_e.imageComponent:qe;return Qe.openEditMedia?e.jsxRuntimeExports.jsx(T.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsxRuntimeExports.jsx(x.default,{mediaComponentFormat:null!==(L=Ze.format)&&void 0!==L?L:d.HEADER_TYPES.IMAGE,uploadMedia:Qe.uploadMedia,variableListForImage:I||[],useEditWhatsappTemplateMediaResponse:Qe,setOpenEditMedia:Qe.setOpenEditMedia,openEditMedia:Qe.openEditMedia,editIconRef:Qe.editIconRef,fileRef:Ue})})):e.jsxRuntimeExports.jsxs(T.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:ye?"420px":"auto"}},{children:[!!_e.imageComponent&&!ye&&!s.isRCSChannel(null==R?void 0:R.channel)&&e.jsxRuntimeExports.jsxs(h.EditTemplateMediaContainer,{children:[e.jsxRuntimeExports.jsx(j.default,{imageName:null!==(A=null===(U=null==Ze?void 0:Ze.example)||void 0===U?void 0:U.header_handle)&&void 0!==A?A:[],handleImageChange:Qe.handleImageChange,mediaType:null==Ze?void 0:Ze.format,error:Qe.error,isLoading:Qe.loading,setOpenEditMedia:Qe.setOpenEditMedia,selectedVariable:v.isVariable(null!==(N=null===(_=null===(w=null==Ze?void 0:Ze.example)||void 0===w?void 0:w.header_handle)||void 0===_?void 0:_[0])&&void 0!==N?N:"")?null===(H=null===(S=null==Ze?void 0:Ze.example)||void 0===S?void 0:S.header_handle)||void 0===H?void 0:H[0]:(null===(Q=null===(F=null==R?void 0:R.mapping)||void 0===F?void 0:F.header)||void 0===Q?void 0:Q[0])?null===(W=null===(Y=null==R?void 0:R.mapping)||void 0===Y?void 0:Y.header)||void 0===W?void 0:W[0]:Qe.selectedVariable}),(null==qe?void 0:qe.format)==d.HEADER_TYPES.DOCUMENT?e.jsxRuntimeExports.jsx(V,{children:Te===r.POD.CHATBOT?e.jsxRuntimeExports.jsx(a.InputWithVariables,{labelText:"PDF Name",placeHolder:"Enter the name",errorMessage:Ge||void 0,onChange:e=>{var t;Xe(""),null==P||P(null!==(t=null==e?void 0:e.actualValue)&&void 0!==t?t:"")},pickerType:t.PickerType.EMBEDDED,noMaxCharCheck:!0,allowMix:!0,showVarHeader:!0,varHeaderText:"Select variable",prevVariable:{actualValue:null!=D?D:"",variableType:"string"},variablesList:I,showAddButton:!0}):e.jsxRuntimeExports.jsx(l.Input,{labelText:"PDF Name",placeholder:"Enter the name",value:Ke,errorMessage:Ge||void 0,onBlur:()=>{if(!Ke)return null==P||P(""),void Xe("PDF name is Required");const e=m.validateInputName(Ke);null==P||P(Ke),Xe(e?"Please enter a valid PDF name":void 0)},onChangeText:e=>{Xe(""),$e(e)}})}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})]}),(null===(K=_e.bodyVariables)||void 0===K?void 0:K.length)>0&&e.jsxRuntimeExports.jsx(O.default,{containerStyle:{paddingTop:_e.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===($=_e.descriptionComponents)||void 0===$?void 0:$.map(((t,n)=>e.jsxRuntimeExports.jsx(E.default,{originalVariableList:null!=Oe&&Oe>-1?Ce.cards[Oe]:Ce,type:t.type,descriptionComponent:t.component,showVariableModal:k},n))),(null===(z=null===(X=null!=Oe&&Oe>-1?null===(G=Ce.cards[Oe])||void 0===G?void 0:G.buttons:null==Ce?void 0:Ce.buttons)||void 0===X?void 0:X.filter((e=>"URL"===e.type)))||void 0===z?void 0:z.length)>0&&e.jsxRuntimeExports.jsx(O.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(ee=null===(Z=null!=Oe&&Oe>-1?null===(J=Ce.cards[Oe])||void 0===J?void 0:J.buttons:null==Ce?void 0:Ce.buttons)||void 0===Z?void 0:Z.filter((e=>Te===r.POD.CHATBOT||"URL"===e.type)))||void 0===ee?void 0:ee.map(((t,n)=>{const o=t.buttonVariable===p.STATIC_URL_VARIABLE_NAME,i=t.buttonVariable===p.UNSUBSCRIBE_URL_VARIABLE;if("URL"===t.type)return e.jsxRuntimeExports.jsx(y.default,{variableListIndex:n,disableEdit:o||i,CTAoptions:null==M?void 0:M.CTAoptions,button:t,currentVariableList:null!=Oe&&Oe>-1?Object.assign({},Ce.cards[Oe]):Object.assign({},Ce),updateSelectedURLTemplateBtn:ze},`${n}_${Oe}`)})),Te===r.POD.CHATBOT&&(null===(ne=null===(te=Ie[0])||void 0===te?void 0:te.component)||void 0===ne?void 0:ne.buttons)&&(null===(le=null===(ie=null===(oe=Ie[0])||void 0===oe?void 0:oe.component)||void 0===ie?void 0:ie.buttons)||void 0===le?void 0:le.length)>0&&e.jsxRuntimeExports.jsx(b.BackTrackComponent,{backTrackMessage:null===(ae=null==Ee?void 0:Ee.backTrackExtra)||void 0===ae?void 0:ae[0],setBackTrackMessage:null===(se=null==Ee?void 0:Ee.backTrackExtra)||void 0===se?void 0:se[1]}),!s.isRCSChannel(null==R?void 0:R.channel)&&(null===(ue=null===(re=null!=Oe&&Oe>-1?null===(de=Ce.cards[Oe])||void 0===de?void 0:de.buttons:null==Ce?void 0:Ce.buttons)||void 0===re?void 0:re.filter((e=>"QUICK_REPLY"===e.type)))||void 0===ue?void 0:ue.length)>0&&(Te!==r.POD.CHATBOT?e.jsxRuntimeExports.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.jsxRuntimeExports.jsx(b.BackTrackComponent,{backTrackMessage:null===(pe=null==Ee?void 0:Ee.backTrackExtra)||void 0===pe?void 0:pe[0],setBackTrackMessage:null===(ce=null==Ee?void 0:Ee.backTrackExtra)||void 0===ce?void 0:ce[1]})),!s.isRCSChannel(null==R?void 0:R.channel)&&(null===(be=null===(me=null!=Oe&&Oe>-1?null===(ve=Ce.cards[Oe])||void 0===ve?void 0:ve.buttons:null==Ce?void 0:Ce.buttons)||void 0===me?void 0:me.filter((e=>"QUICK_REPLY"===e.type)))||void 0===be?void 0:be.map(((t,n)=>{if("QUICK_REPLY"===t.type&&Te!==r.POD.CHATBOT)return e.jsxRuntimeExports.jsx(y.default,{variableListIndex:n,QRBoptions:null==M?void 0:M.QRBoptions,button:t,currentVariableList:null!=Oe&&Oe>-1?Object.assign({},Ce.cards[Oe]):Object.assign({},Ce),updateSelectedQRBTemplateBtn:Je},`${n}_${Oe}`)}))),Te===r.POD.CHATBOT&&Ae&&e.jsxRuntimeExports.jsx(g.DiscountCodeComponent,{discountCode:null===(ge=null==Ee?void 0:Ee.discountCodeExtra)||void 0===ge?void 0:ge[0],setDiscountCode:null===(xe=null==Ee?void 0:Ee.discountCodeExtra)||void 0===xe?void 0:xe[1]}),null===(he=null!=Oe&&Oe>-1?null===(je=Ce.cards[Oe])||void 0===je?void 0:je.buttons:null==Ce?void 0:Ce.buttons)||void 0===he?void 0:he.map(((t,n)=>{var o,i,a,s,d;if("COPY_CODE"===t.type)return e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:Re?e.jsxRuntimeExports.jsx("div",Object.assign({style:{marginBottom:20,borderRadius:4,padding:"8px 10px"}},{children:e.jsxRuntimeExports.jsx(l.Input,{state:"disabled",labelText:null!==(o=t.text)&&void 0!==o?o:"Copy Code",value:null!==(i=t.buttonVariable)&&void 0!==i?i:"",onChangeText:()=>{}})})):e.jsxRuntimeExports.jsx(C.default,{index:n,variable:{variableName:null!==(a=t.text)&&void 0!==a?a:"Copy Code",updatedValue:null!==(s=t.buttonVariable)&&void 0!==s?s:"",type:"string",isEditableVariable:!0,index:null!==(d=t.index)&&void 0!==d?d:0},showVariableModal:!0,componentType:"BUTTONS",buttonType:t.type},n)})}))]}))};

package/dist/cjs/components/template-context-mapper/modalElements/Footer.js

@@ -1,7 +1,7 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("../../../assets/icons/info.svg.js"),r=require("react"),s=require("styled-components");require("../../button/index.js"),require("../../tag/index.js"),require("../../template-preview/index.js");var i=require("../../template-preview/helpers/templateMiscHelper.js"),n=require("../../TypographyStyle.js"),o=require("../../../constants/Theme.js"),l=require("../Badge/index.js"),a=require("../context/templateModalContext.js"),u=require("../../template-preview/models/Channels.js"),d=require("../../tag/Tag.js"),p=require("../../button/Button.js");function x(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const c=x(s).default.div`
-	background: ${o.COLORS.surface.standard};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("../../../assets/icons/info.svg.js"),r=require("react"),s=require("styled-components"),i=require("../../button/Button.js"),l=require("../../tag/Tag.js");require("../../template-preview/TemplatePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js");var a=require("../../../constants/Theme.js");require("../../curtain/CurtainHelper.js"),require("../../variable-picker-v3/model.js"),require("../../template-preview/models/TemplateMeta.js"),require("../../template-preview/models/WhatsAppTemplate.js");var o=require("../../template-preview/models/Channels.js"),n=require("../../template-preview/helpers/templateMiscHelper.js"),p=require("../../TypographyStyle.js"),u=require("../Badge/index.js"),d=require("../context/templateModalContext.js");function x(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const c=x(s).default.div`
+	background: ${a.COLORS.surface.standard};
 	border-top-width: 1px;
-	border-top-color: ${o.COLORS.stroke.primary};
+	border-top-color: ${a.COLORS.stroke.primary};
 	box-shadow: 0px -4px 12px rgba(0, 0, 0, 0.12);
 	width: 100%;
 	padding: 0 24px;
@@ -12,4 +12,4 @@
 	border-bottom-left-radius: 4px;
 	border-bottom-right-radius: 4px;
 	height: ${e=>e.isWhatsappCarousel?64:80}px;
-`;exports.default=s=>{let{isWhatsappCarousel:x,onSelect:j,footerButtonText:m,footerInfoText:g}=s;var h,v,b,f;const{isError:y,selectedCarouselIndex:C,setSelectedCarouselIndex:q,setErrorIndexes:R,template:T,showVariablePicker:S,hideFooterButton:E}=a.useTemplateModalContext(),[O,w]=r.useState(x?"Next":"Select template");return r.useEffect((()=>{m?w(m):x&&-1===C?w("Next"):x&&null!=C&&C>-1&&w("Save & Select Template")}),[C]),e.jsxRuntimeExports.jsxs(c,Object.assign({isWhatsappCarousel:x,justifyContent:x&&(null===(v=null===(h=null==T?void 0:T.mapping)||void 0===h?void 0:h.body)||void 0===v?void 0:v.length)?"space-between":"end"},{children:[i.isRCSChannel((null==T?void 0:T.channel)||u.CHANNEL_TYPE.WHATSAPP)?e.jsxRuntimeExports.jsx(n.TitleRegular,{}):x&&null!=C&&C>=-1&&!!(null===(f=null===(b=null==T?void 0:T.mapping)||void 0===b?void 0:b.body)||void 0===f?void 0:f.length)&&e.jsxRuntimeExports.jsx(n.TitleRegular,Object.assign({color:o.COLORS.text.secondary},{children:`Step ${-1===C?1:2}/2`})),e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center"}},{children:[y&&e.jsxRuntimeExports.jsx(l.Badge,{errorText:"Some inputs are missing or incorrect. Please check"}),!y&&g&&e.jsxRuntimeExports.jsx("div",Object.assign({style:{marginRight:12}},{children:e.jsxRuntimeExports.jsx(d.Tag,{tagText:g,LeadingIcon:t.default})})),!E&&e.jsxRuntimeExports.jsx(p.Button,{disabled:S,id:"select-template-btn",buttonText:O,size:x?"small":"large",onClick:function(){x&&-1===C&&q?q(0):(null==R||R([]),j())}})]}))]}))};
+`;exports.default=s=>{let{isWhatsappCarousel:x,onSelect:m,footerButtonText:j,footerInfoText:v}=s;var g,h,b,f;const{isError:q,selectedCarouselIndex:C,setSelectedCarouselIndex:T,setErrorIndexes:y,template:w,showVariablePicker:R,hideFooterButton:S}=d.useTemplateModalContext(),[E,O]=r.useState(x?"Next":"Select template");return r.useEffect((()=>{j?O(j):x&&-1===C?O("Next"):x&&null!=C&&C>-1&&O("Save & Select Template")}),[C]),e.jsxRuntimeExports.jsxs(c,Object.assign({isWhatsappCarousel:x,justifyContent:x&&(null===(h=null===(g=null==w?void 0:w.mapping)||void 0===g?void 0:g.body)||void 0===h?void 0:h.length)?"space-between":"end"},{children:[n.isRCSChannel((null==w?void 0:w.channel)||o.CHANNEL_TYPE.WHATSAPP)?e.jsxRuntimeExports.jsx(p.TitleRegular,{}):x&&null!=C&&C>=-1&&!!(null===(f=null===(b=null==w?void 0:w.mapping)||void 0===b?void 0:b.body)||void 0===f?void 0:f.length)&&e.jsxRuntimeExports.jsx(p.TitleRegular,Object.assign({color:a.COLORS.text.secondary},{children:`Step ${-1===C?1:2}/2`})),e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center"}},{children:[q&&e.jsxRuntimeExports.jsx(u.Badge,{errorText:"Some inputs are missing or incorrect. Please check"}),!q&&v&&e.jsxRuntimeExports.jsx("div",Object.assign({style:{marginRight:12}},{children:e.jsxRuntimeExports.jsx(l.Tag,{tagText:v,LeadingIcon:t.default})})),!S&&e.jsxRuntimeExports.jsx(i.Button,{disabled:R,id:"select-template-btn",buttonText:E,size:x?"small":"large",onClick:function(){x&&-1===C&&T?T(0):(null==y||y([]),m())}})]}))]}))};

package/dist/cjs/components/template-context-mapper/modalElements/MobilePreview.js

@@ -1,12 +1,12 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("react"),i=require("styled-components");require("../../template-preview/index.js");var s=require("../../template-preview/models/Channels.js"),a=require("../../template-preview/models/WhatsAppTemplate.js"),r=require("../context/templateModalContext.js"),o=require("../utils/getPreviewDimension.js"),l=require("../../template-preview/TemplatePreview.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=n(t),d=n(i);const c=d.default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("react"),i=require("styled-components"),r=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 s=require("../../template-preview/models/WhatsAppTemplate.js"),a=require("../../template-preview/models/Channels.js"),o=require("../context/templateModalContext.js"),l=require("../utils/getPreviewDimension.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=n(t),d=n(i);const m=d.default.div`
 	position: relative;
 	height: 100%;
 	border-radius: 31px;
-	width: ${e=>o.getPreviewWidth(e.channel)}px;
+	width: ${e=>l.getPreviewWidth(e.channel)}px;
 	background-color: white;
 	margin: auto;
 	overflow-y: auto;
-`,m=d.default.div`
+`,c=d.default.div`
 	position: absolute;
 	flex: 1;
 	background-color: white;
@@ -17,7 +17,7 @@
 	height: calc(100% - 17px);
 	border-radius: 16px;
 	overflow-y: auto;
-`,u=p.default.forwardRef(((t,i)=>{let{display_content:n,channel:p,template:d,showSampleValues:u}=t;const{pod:x,hideDeviceContainerInPreview:j}=r.useTemplateModalContext(),f={showSampleValues:u,template:d,channel:p,smsSpecificMeta:{smsDisplayContent:n},whatsAppSpecificMeta:{showWhatsAppHeader:!0,whatsAppExtras:x!==a.POD.CHATBOT,containerStyle:{border:"none",borderBottomRightRadius:0,borderBottomLeftRadius:0,minHeight:426,width:p==s.CHANNEL_TYPE.RCS?"unset":240}},size:"small",hideHeader:!0,emailSpecificMeta:{emailDisplayContent:n,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_mobile",containerStyle:{height:"100%",width:"100%"},templateContainerStyles:{height:"100%"}},isPreview:!0,hidePointerEvents:!0};return j?e.jsxRuntimeExports.jsx(h,{children:e.jsxRuntimeExports.jsx(l.TemplatePreview,Object.assign({},f))}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:e.jsxRuntimeExports.jsxs(c,Object.assign({channel:p},{children:[e.jsxRuntimeExports.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:o.getPreviewWidth(p),height:443}}),e.jsxRuntimeExports.jsx(m,Object.assign({ref:i},{children:e.jsxRuntimeExports.jsx(l.TemplatePreview,Object.assign({},f))}))]}))})}));u.displayName="MobilePreview";const h=d.default.div`
+`,u=p.default.forwardRef(((t,i)=>{let{display_content:n,channel:p,template:d,showSampleValues:u}=t;const{pod:x,hideDeviceContainerInPreview:j}=o.useTemplateModalContext(),v={showSampleValues:u,template:d,channel:p,smsSpecificMeta:{smsDisplayContent:n},whatsAppSpecificMeta:{showWhatsAppHeader:!0,whatsAppExtras:x!==s.POD.CHATBOT,containerStyle:{border:"none",borderBottomRightRadius:0,borderBottomLeftRadius:0,minHeight:426,width:p==a.CHANNEL_TYPE.RCS?"unset":240}},size:"small",hideHeader:!0,emailSpecificMeta:{emailDisplayContent:n,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_mobile",containerStyle:{height:"100%",width:"100%"},templateContainerStyles:{height:"100%"}},isPreview:!0,hidePointerEvents:!0};return j?e.jsxRuntimeExports.jsx(h,{children:e.jsxRuntimeExports.jsx(r.TemplatePreview,Object.assign({},v))}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:e.jsxRuntimeExports.jsxs(m,Object.assign({channel:p},{children:[e.jsxRuntimeExports.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.jsxRuntimeExports.jsx(c,Object.assign({ref:i},{children:e.jsxRuntimeExports.jsx(r.TemplatePreview,Object.assign({},v))}))]}))})}));u.displayName="MobilePreview";const h=d.default.div`
 	display: flex;
 	align-items: center;
 	justify-content: center;

package/dist/cjs/components/template-context-mapper/modalElements/ProductBox.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("../../../assets/icons/box.svg.js"),s=require("../../../assets/icons/delete.svg.js"),o=require("../../../assets/icons/edit.svg.js"),n=require("styled-components");require("../../icon-button/index.js");var i=require("../../TypographyStyle.js"),r=require("../../../constants/Theme.js"),l=require("../../icon-button/IconButton.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const d=c(n).default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("../../../assets/icons/box.svg.js"),s=require("../../../assets/icons/delete.svg.js"),o=require("../../../assets/icons/edit.svg.js"),n=require("styled-components"),i=require("../../icon-button/IconButton.js"),r=require("../../TypographyStyle.js"),l=require("../../../constants/Theme.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const d=c(n).default.div`
 	width: ${e=>e.width};
 	padding: 12px;
 	display: flex;
@@ -44,4 +44,4 @@
 			color: #000000;
 		}
 	}
-`;exports.ProductBox=n=>{const{cardBody:c,deleteItem:x,editItem:a,hideIcon:u}=n;return e.jsxRuntimeExports.jsxs(d,Object.assign({width:"100%"},{children:[!u&&e.jsxRuntimeExports.jsx("div",Object.assign({style:{width:36,height:36}},{children:e.jsxRuntimeExports.jsx(t.default,{})})),e.jsxRuntimeExports.jsx("div",Object.assign({className:"card-body"},{children:e.jsxRuntimeExports.jsx(i.TitleSmall,Object.assign({color:r.COLORS.content.secondary},{children:c}))})),e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center"}},{children:[a&&e.jsxRuntimeExports.jsx(l.IconButton,{style:{display:"flex"},Icon:()=>e.jsxRuntimeExports.jsx(o.default,{width:24,height:24,color:r.COLORS.content.placeholder}),onClick:e=>{a(),e.stopPropagation()}}),e.jsxRuntimeExports.jsx(l.IconButton,{style:{display:"flex",color:"#919191"},Icon:()=>e.jsxRuntimeExports.jsx(s.default,{width:24,height:24,color:r.COLORS.content.placeholder}),onClick:e=>{x(),e.stopPropagation()}})]}))]}))};
+`;exports.ProductBox=n=>{const{cardBody:c,deleteItem:x,editItem:a,hideIcon:u}=n;return e.jsxRuntimeExports.jsxs(d,Object.assign({width:"100%"},{children:[!u&&e.jsxRuntimeExports.jsx("div",Object.assign({style:{width:36,height:36}},{children:e.jsxRuntimeExports.jsx(t.default,{})})),e.jsxRuntimeExports.jsx("div",Object.assign({className:"card-body"},{children:e.jsxRuntimeExports.jsx(r.TitleSmall,Object.assign({color:l.COLORS.content.secondary},{children:c}))})),e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center"}},{children:[a&&e.jsxRuntimeExports.jsx(i.IconButton,{style:{display:"flex"},Icon:()=>e.jsxRuntimeExports.jsx(o.default,{width:24,height:24,color:l.COLORS.content.placeholder}),onClick:e=>{a(),e.stopPropagation()}}),e.jsxRuntimeExports.jsx(i.IconButton,{style:{display:"flex",color:"#919191"},Icon:()=>e.jsxRuntimeExports.jsx(s.default,{width:24,height:24,color:l.COLORS.content.placeholder}),onClick:e=>{x(),e.stopPropagation()}})]}))]}))};

package/dist/cjs/components/template-context-mapper/modalElements/QueryParamsComponent.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("../../../assets/icons/delete.svg.js"),s=require("../../../assets/icons/PlusIcon.js"),n=require("react"),i=require("styled-components");require("../../button/index.js"),require("../../checkBox/index.js"),require("../../icon-button/index.js"),require("../../input/index.js");var r=require("../../TypographyStyle.js"),o=require("../../../constants/Theme.js"),u=require("../../checkBox/CheckBox.js"),a=require("../../input/Input.js"),l=require("../../icon-button/IconButton.js"),c=require("../../button/Button.js");function x(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const j=x(i).default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("../../../assets/icons/delete.svg.js"),s=require("../../../assets/icons/PlusIcon.js"),n=require("react"),i=require("styled-components"),o=require("../../button/Button.js"),r=require("../../checkBox/CheckBox.js"),a=require("../../icon-button/IconButton.js"),u=require("../../input/Input.js"),l=require("../../TypographyStyle.js"),c=require("../../../constants/Theme.js");function x(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const p=x(i).default.div`
 	display: flex;
 	flex-direction: column;
 	gap: 12px;
@@ -8,4 +8,4 @@
 		justify-content: center;
 		padding: 12px !important;
 	}
-`;exports.QueryParamsComponent=i=>{const{params:x,onChange:p,isError:d,variableValue:h}=i,[m,y]=n.useState(x.length>0),[g,f]=n.useState(x);return n.useEffect((()=>{f(x)}),[h]),e.jsxRuntimeExports.jsxs(j,{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex"}},{children:[e.jsxRuntimeExports.jsx(u.CheckBox,{isChecked:m,onValueChange:e=>{f([]),p([]),y(e)}}),e.jsxRuntimeExports.jsx(r.TitleSmall,Object.assign({style:{marginLeft:8}},{children:"Add custom query params"}))]})),m&&g.map(((s,n)=>e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",gap:"8px"}},{children:[e.jsxRuntimeExports.jsx(a.Input,{placeholder:"Key",value:s.key,onChangeText:e=>{const t=g.map(((t,s)=>s===n?Object.assign(Object.assign({},t),{key:e}):t));f(t),p(t)},state:d&&!s.key.length?"invalid":"none"}),e.jsxRuntimeExports.jsx(a.Input,{placeholder:"Value",value:s.value,onChangeText:e=>{const t=g.map(((t,s)=>s===n?Object.assign(Object.assign({},t),{value:e}):t));f(t),p(t)},state:d&&!s.value.length?"invalid":"none"}),e.jsxRuntimeExports.jsx(l.IconButton,{Icon:t.default,width:20,height:20,onClick:()=>{const e=g.filter(((e,t)=>t!=n));f(e),p(e)}})]}),n))),m&&x.length<10&&e.jsxRuntimeExports.jsx(c.Button,{buttonText:"Add Params",buttonType:"dashRegular",style:{display:"flex",alignItems:"center",justifyContent:"center"},IconComponent:()=>e.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",alignItems:"center",justifyContent:"center",width:"20px",height:"20px"}},{children:e.jsxRuntimeExports.jsx(s.default,{width:16,height:16,color:o.COLORS.content.secondary})})),onClick:()=>{const e=[...g,{key:"",value:""}];f(e),p(e)}})]})};
+`;exports.QueryParamsComponent=i=>{const{params:x,onChange:j,isError:d,variableValue:h}=i,[m,y]=n.useState(x.length>0),[g,f]=n.useState(x);return n.useEffect((()=>{f(x)}),[h]),e.jsxRuntimeExports.jsxs(p,{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex"}},{children:[e.jsxRuntimeExports.jsx(r.CheckBox,{isChecked:m,onValueChange:e=>{f([]),j([]),y(e)}}),e.jsxRuntimeExports.jsx(l.TitleSmall,Object.assign({style:{marginLeft:8}},{children:"Add custom query params"}))]})),m&&g.map(((s,n)=>e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",gap:"8px"}},{children:[e.jsxRuntimeExports.jsx(u.Input,{placeholder:"Key",value:s.key,onChangeText:e=>{const t=g.map(((t,s)=>s===n?Object.assign(Object.assign({},t),{key:e}):t));f(t),j(t)},state:d&&!s.key.length?"invalid":"none"}),e.jsxRuntimeExports.jsx(u.Input,{placeholder:"Value",value:s.value,onChangeText:e=>{const t=g.map(((t,s)=>s===n?Object.assign(Object.assign({},t),{value:e}):t));f(t),j(t)},state:d&&!s.value.length?"invalid":"none"}),e.jsxRuntimeExports.jsx(a.IconButton,{Icon:t.default,width:20,height:20,onClick:()=>{const e=g.filter(((e,t)=>t!=n));f(e),j(e)}})]}),n))),m&&x.length<10&&e.jsxRuntimeExports.jsx(o.Button,{buttonText:"Add Params",buttonType:"dashRegular",style:{display:"flex",alignItems:"center",justifyContent:"center"},IconComponent:()=>e.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",alignItems:"center",justifyContent:"center",width:"20px",height:"20px"}},{children:e.jsxRuntimeExports.jsx(s.default,{width:16,height:16,color:c.COLORS.content.secondary})})),onClick:()=>{const e=[...g,{key:"",value:""}];f(e),j(e)}})]})};

package/dist/cjs/components/template-context-mapper/modalElements/TemplateAnalyticsComponent.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("../../../assets/icons/click.svg.js"),s=require("../../../assets/icons/speedometer.svg.js"),n=require("react"),i=require("../../analytics-chips-and-dropdowns/chart/LineChart/LineChart.js");require("../../modals/index.js"),require("../../tag/index.js");var a=require("../../template-preview/models/WhatsAppTemplate.js"),r=require("../../TypographyStyle.js"),l=require("../../../constants/Theme.js"),c=require("../styles/TemplateAnalyticsStyles.js"),o=require("../utils/TemplateConstants.js"),x=require("./TemplateAnalyticsSkeleton.js"),u=require("../../modals/styledModal.js"),d=require("../../tag/Tag.js");const m=s=>{var n;const{analyticsData:i,skipTitle:a,fullWidth:x}=s;return e.jsxRuntimeExports.jsxs(c.RightPanelContainer,Object.assign({fullWidth:x},{children:[a?e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}):e.jsxRuntimeExports.jsx(r.TitleSmall,{children:"Here are your template's delivery & engagement stats for the last 30 days"}),e.jsxRuntimeExports.jsx("div",Object.assign({className:"mt-3"},{children:o.ANALYTICS_ENGAGEMENT_MAP.map(((t,s)=>e.jsxRuntimeExports.jsx(j,{icon:t.icon,title:t.title,value:i[t.valName]||0,percentValue:t.percentValName?i[t.percentValName]:null},s)))})),(null==i?void 0:i.clickAnalytics)&&Object.keys(null==i?void 0:i.clickAnalytics)&&Object.keys(null==i?void 0:i.clickAnalytics).length?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(r.TitleSmall,Object.assign({color:l.COLORS.content.secondary},{children:"Clicked"})),e.jsxRuntimeExports.jsx("div",Object.assign({className:"mt-3"},{children:Object.entries(i.clickAnalytics).map(((s,n)=>{let[i,a]=s;return e.jsxRuntimeExports.jsx(j,{icon:t.default,title:i,value:a.totalClicks||0,percentValue:a.clickPercentage},n)}))}))]}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}),(null===(n=null==i?void 0:i.performance)||void 0===n?void 0:n.qualityTimeLine)&&i.performance.qualityTimeLine.length>0?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(r.TitleSmall,Object.assign({color:l.COLORS.content.secondary},{children:"Performance"})),e.jsxRuntimeExports.jsx("div",Object.assign({className:"mt-3"},{children:e.jsxRuntimeExports.jsx(p,{qualityTimeLine:i.performance.qualityTimeLine})}))]}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})]}))},j=t=>{const{icon:s,title:n,value:i,percentValue:a}=t;return e.jsxRuntimeExports.jsxs("div",Object.assign({className:"each--analytics--container"},{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[e.jsxRuntimeExports.jsx("div",Object.assign({className:"each--icon--container"},{children:e.jsxRuntimeExports.jsx(s,{width:"16px",height:"16px",color:l.COLORS.background.brand})})),e.jsxRuntimeExports.jsx(r.Caption,{children:n})]})),e.jsxRuntimeExports.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[a?e.jsxRuntimeExports.jsx(d.Tag,{tagText:`${a}%`||0,theme:"light",type:"neutral"}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}),e.jsxRuntimeExports.jsx(c.CustomTitleMedium,{children:i})]}))]}))},p=t=>{const{qualityTimeLine:n}=t,c=n.map((e=>{switch(e){case a.TEMPLATE_QUALITY.GREEN:return 2;case a.TEMPLATE_QUALITY.YELLOW:return 1;case a.TEMPLATE_QUALITY.RED:return.2;default:return 0}})),o=n.map(((e,t)=>`T${t+1}`)),x=n.map((e=>(e=>{switch(e){case a.TEMPLATE_QUALITY.GREEN:return l.COLORS.content.positive;case a.TEMPLATE_QUALITY.YELLOW:return l.COLORS.content.warning;case a.TEMPLATE_QUALITY.RED:return l.COLORS.content.negative;default:return l.COLORS.content.secondary}})(e)));return e.jsxRuntimeExports.jsxs("div",Object.assign({className:"each--analytics--container",style:{padding:16,display:"flex",alignItems:"center",justifyContent:"space-between",width:"100%",borderRadius:8,border:`1px solid ${l.COLORS.background.inactive}`}},{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8,width:"50%"}},{children:[e.jsxRuntimeExports.jsx("div",Object.assign({className:"each--icon--container"},{children:e.jsxRuntimeExports.jsx(s.default,{width:16,height:16,color:l.COLORS.content.secondary})})),e.jsxRuntimeExports.jsx(r.Caption,{children:"Quality timeline"})]})),e.jsxRuntimeExports.jsx("div",Object.assign({className:"d-flex align--center",style:{width:"50%",height:"62px",marginTop:-80}},{children:e.jsxRuntimeExports.jsx(i.LineChart,{datas:[{data:c,lineColor:"green",lineWidth:1,gradientColor:{start:"#E6F4E7",end:"#E6F4E7"},gradient:!0,pointColors:x}],labels:o,legends:[],canvasHeight:120,maintainAspectRatio:!1,min:0,max:4,stepSize:1,isNewStyles:!0,pointRadius:3.5,scaleText:{xDrawBorder:!1,yDrawBorder:!1},ticksLabelCallback:()=>"",labelCallback:e=>`${(e=>{switch(e){case 2:return"High";case 1:return"Medium";case.2:return"Low";default:return"Unknown"}})(e.parsed.y)}`,titleTooltipCallback:()=>"",customYHeaders:{0:"",1:"",2:""}})}))]}))};exports.AnalyticsItem=j,exports.QualityTimelineChart=p,exports.RightPanelTemplateAnalytics=m,exports.TemplateAnalyticsComponent=t=>{const{templateAnalytics:s,onClose:i,onProceed:d,onCancel:j,headingTitle:p,headingSubtitle:E,templateId:h}=t,{templateQuality:T=a.TEMPLATE_QUALITY.GREEN,fetchAnalytics:g}=s||{},{Icon:R,title:y,subline:L,sublineTextType:O,sublineColor:b}=o.TEMPLATE_QUALITY_MAP[T||a.TEMPLATE_QUALITY.GREEN],[A,C]=n.useState((null==t?void 0:t.analyticsData)||{}),[v,N]=n.useState(!0);n.useEffect((()=>{(null==t?void 0:t.analyticsData)?N(!1):null==g||g(h||"").then((e=>{e.analytics&&C(e.analytics),N(!1)}))}),[]);const S=n.useMemo((()=>({primaryButton:{buttonText:"Proceed with selection",buttonType:"primary",onClick:d,disabled:v},secondaryButton:{buttonText:"Cancel",buttonType:"tertiaryGray",onClick:()=>{null==i||i(),null==j||j()},disabled:v}})),[T,v,d,i,j]),f=O||r.Caption;return e.jsxRuntimeExports.jsx(u.StyledModal,Object.assign({open:!0,headingTitle:p,tintedHeader:!0,modalHeaderStyles:{backgroundColor:l.COLORS.surface.subdued},onBackPress:()=>{null==i||i()},headingSubtitle:E,footerShadow:!0,primaryButton:S.primaryButton,secondaryButton:S.secondaryButton,onClose:()=>{null==i||i()},width:"700px"},{children:e.jsxRuntimeExports.jsxs(c.TemplateContainer,{children:[T!==a.TEMPLATE_QUALITY.UNKNOWN&&e.jsxRuntimeExports.jsx(c.LeftPanelContainer,{children:e.jsxRuntimeExports.jsxs("div",Object.assign({className:"inside--container"},{children:[e.jsxRuntimeExports.jsx("div",Object.assign({className:"icon--container",style:{background:T===a.TEMPLATE_QUALITY.GREEN?l.COLORS.background.positive.light:l.COLORS.background.warning.light}},{children:e.jsxRuntimeExports.jsx(R,{width:40,height:40,color:T===a.TEMPLATE_QUALITY.GREEN?l.COLORS.content.positive:l.COLORS.content.warning})})),y&&e.jsxRuntimeExports.jsx(r.TitleRegular,Object.assign({style:{textAlign:"center"}},{children:y})),e.jsxRuntimeExports.jsx(f,Object.assign({style:{textAlign:"center",color:b||l.COLORS.content.primary}},{children:L}))]}))}),v?e.jsxRuntimeExports.jsx(x.TemplateAnalyticsSkeleton,{fullWidth:T===a.TEMPLATE_QUALITY.UNKNOWN}):e.jsxRuntimeExports.jsx(m,{analyticsData:A,fullWidth:T===a.TEMPLATE_QUALITY.UNKNOWN})]})}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("../../../assets/icons/click.svg.js"),s=require("../../../assets/icons/speedometer.svg.js"),n=require("react"),i=require("../../analytics-chips-and-dropdowns/chart/LineChart/LineChart.js"),a=require("../../modals/styledModal.js"),r=require("../../tag/Tag.js"),l=require("../../template-preview/models/WhatsAppTemplate.js"),c=require("../../TypographyStyle.js"),o=require("../../../constants/Theme.js"),x=require("../styles/TemplateAnalyticsStyles.js"),u=require("../utils/TemplateConstants.js"),d=require("./TemplateAnalyticsSkeleton.js");const m=s=>{var n;const{analyticsData:i,skipTitle:a,fullWidth:r}=s;return e.jsxRuntimeExports.jsxs(x.RightPanelContainer,Object.assign({fullWidth:r},{children:[a?e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}):e.jsxRuntimeExports.jsx(c.TitleSmall,{children:"Here are your template's delivery & engagement stats for the last 30 days"}),e.jsxRuntimeExports.jsx("div",Object.assign({className:"mt-3"},{children:u.ANALYTICS_ENGAGEMENT_MAP.map(((t,s)=>e.jsxRuntimeExports.jsx(j,{icon:t.icon,title:t.title,value:i[t.valName]||0,percentValue:t.percentValName?i[t.percentValName]:null},s)))})),(null==i?void 0:i.clickAnalytics)&&Object.keys(null==i?void 0:i.clickAnalytics)&&Object.keys(null==i?void 0:i.clickAnalytics).length?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(c.TitleSmall,Object.assign({color:o.COLORS.content.secondary},{children:"Clicked"})),e.jsxRuntimeExports.jsx("div",Object.assign({className:"mt-3"},{children:Object.entries(i.clickAnalytics).map(((s,n)=>{let[i,a]=s;return e.jsxRuntimeExports.jsx(j,{icon:t.default,title:i,value:a.totalClicks||0,percentValue:a.clickPercentage},n)}))}))]}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}),(null===(n=null==i?void 0:i.performance)||void 0===n?void 0:n.qualityTimeLine)&&i.performance.qualityTimeLine.length>0?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(c.TitleSmall,Object.assign({color:o.COLORS.content.secondary},{children:"Performance"})),e.jsxRuntimeExports.jsx("div",Object.assign({className:"mt-3"},{children:e.jsxRuntimeExports.jsx(p,{qualityTimeLine:i.performance.qualityTimeLine})}))]}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})]}))},j=t=>{const{icon:s,title:n,value:i,percentValue:a}=t;return e.jsxRuntimeExports.jsxs("div",Object.assign({className:"each--analytics--container"},{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[e.jsxRuntimeExports.jsx("div",Object.assign({className:"each--icon--container"},{children:e.jsxRuntimeExports.jsx(s,{width:"16px",height:"16px",color:o.COLORS.background.brand})})),e.jsxRuntimeExports.jsx(c.Caption,{children:n})]})),e.jsxRuntimeExports.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[a?e.jsxRuntimeExports.jsx(r.Tag,{tagText:`${a}%`||0,theme:"light",type:"neutral"}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}),e.jsxRuntimeExports.jsx(x.CustomTitleMedium,{children:i})]}))]}))},p=t=>{const{qualityTimeLine:n}=t,a=n.map((e=>{switch(e){case l.TEMPLATE_QUALITY.GREEN:return 2;case l.TEMPLATE_QUALITY.YELLOW:return 1;case l.TEMPLATE_QUALITY.RED:return.2;default:return 0}})),r=n.map(((e,t)=>`T${t+1}`)),x=n.map((e=>(e=>{switch(e){case l.TEMPLATE_QUALITY.GREEN:return o.COLORS.content.positive;case l.TEMPLATE_QUALITY.YELLOW:return o.COLORS.content.warning;case l.TEMPLATE_QUALITY.RED:return o.COLORS.content.negative;default:return o.COLORS.content.secondary}})(e)));return e.jsxRuntimeExports.jsxs("div",Object.assign({className:"each--analytics--container",style:{padding:16,display:"flex",alignItems:"center",justifyContent:"space-between",width:"100%",borderRadius:8,border:`1px solid ${o.COLORS.background.inactive}`}},{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8,width:"50%"}},{children:[e.jsxRuntimeExports.jsx("div",Object.assign({className:"each--icon--container"},{children:e.jsxRuntimeExports.jsx(s.default,{width:16,height:16,color:o.COLORS.content.secondary})})),e.jsxRuntimeExports.jsx(c.Caption,{children:"Quality timeline"})]})),e.jsxRuntimeExports.jsx("div",Object.assign({className:"d-flex align--center",style:{width:"50%",height:"62px",marginTop:-80}},{children:e.jsxRuntimeExports.jsx(i.LineChart,{datas:[{data:a,lineColor:"green",lineWidth:1,gradientColor:{start:"#E6F4E7",end:"#E6F4E7"},gradient:!0,pointColors:x}],labels:r,legends:[],canvasHeight:120,maintainAspectRatio:!1,min:0,max:4,stepSize:1,isNewStyles:!0,pointRadius:3.5,scaleText:{xDrawBorder:!1,yDrawBorder:!1},ticksLabelCallback:()=>"",labelCallback:e=>`${(e=>{switch(e){case 2:return"High";case 1:return"Medium";case.2:return"Low";default:return"Unknown"}})(e.parsed.y)}`,titleTooltipCallback:()=>"",customYHeaders:{0:"",1:"",2:""}})}))]}))};exports.AnalyticsItem=j,exports.QualityTimelineChart=p,exports.RightPanelTemplateAnalytics=m,exports.TemplateAnalyticsComponent=t=>{const{templateAnalytics:s,onClose:i,onProceed:r,onCancel:j,headingTitle:p,headingSubtitle:E,templateId:h}=t,{templateQuality:T=l.TEMPLATE_QUALITY.GREEN,fetchAnalytics:g}=s||{},{Icon:R,title:y,subline:L,sublineTextType:O,sublineColor:b}=u.TEMPLATE_QUALITY_MAP[T||l.TEMPLATE_QUALITY.GREEN],[A,C]=n.useState((null==t?void 0:t.analyticsData)||{}),[v,N]=n.useState(!0);n.useEffect((()=>{(null==t?void 0:t.analyticsData)?N(!1):null==g||g(h||"").then((e=>{e.analytics&&C(e.analytics),N(!1)}))}),[]);const S=n.useMemo((()=>({primaryButton:{buttonText:"Proceed with selection",buttonType:"primary",onClick:r,disabled:v},secondaryButton:{buttonText:"Cancel",buttonType:"tertiaryGray",onClick:()=>{null==i||i(),null==j||j()},disabled:v}})),[T,v,r,i,j]),f=O||c.Caption;return e.jsxRuntimeExports.jsx(a.StyledModal,Object.assign({open:!0,headingTitle:p,tintedHeader:!0,modalHeaderStyles:{backgroundColor:o.COLORS.surface.subdued},onBackPress:()=>{null==i||i()},headingSubtitle:E,footerShadow:!0,primaryButton:S.primaryButton,secondaryButton:S.secondaryButton,onClose:()=>{null==i||i()},width:"700px"},{children:e.jsxRuntimeExports.jsxs(x.TemplateContainer,{children:[T!==l.TEMPLATE_QUALITY.UNKNOWN&&e.jsxRuntimeExports.jsx(x.LeftPanelContainer,{children:e.jsxRuntimeExports.jsxs("div",Object.assign({className:"inside--container"},{children:[e.jsxRuntimeExports.jsx("div",Object.assign({className:"icon--container",style:{background:T===l.TEMPLATE_QUALITY.GREEN?o.COLORS.background.positive.light:o.COLORS.background.warning.light}},{children:e.jsxRuntimeExports.jsx(R,{width:40,height:40,color:T===l.TEMPLATE_QUALITY.GREEN?o.COLORS.content.positive:o.COLORS.content.warning})})),y&&e.jsxRuntimeExports.jsx(c.TitleRegular,Object.assign({style:{textAlign:"center"}},{children:y})),e.jsxRuntimeExports.jsx(f,Object.assign({style:{textAlign:"center",color:b||o.COLORS.content.primary}},{children:L}))]}))}),v?e.jsxRuntimeExports.jsx(d.TemplateAnalyticsSkeleton,{fullWidth:T===l.TEMPLATE_QUALITY.UNKNOWN}):e.jsxRuntimeExports.jsx(m,{analyticsData:A,fullWidth:T===l.TEMPLATE_QUALITY.UNKNOWN})]})}))};

package/dist/cjs/components/template-context-mapper/modalElements/TemplateAnalyticsSkeleton.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var s=require("../../../node_modules/react/jsx-runtime.js");require("../../shimmer/index.js");var e=require("../styles/TemplateAnalyticsStyles.js"),i=require("../../shimmer/ShimmerComponent/BikShimmer.js");const t=()=>s.jsxRuntimeExports.jsxs("div",Object.assign({className:"each--analytics--container"},{children:[s.jsxRuntimeExports.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[s.jsxRuntimeExports.jsx(i.BikShimmer,{boxes:[{width:"24px",height:"24px"}]}),s.jsxRuntimeExports.jsx(i.BikShimmer,{boxes:[{width:"69px",height:"11px"}]})]})),s.jsxRuntimeExports.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[s.jsxRuntimeExports.jsx(i.BikShimmer,{boxes:[{width:"43px",height:"18px"}]}),s.jsxRuntimeExports.jsx(i.BikShimmer,{boxes:[{width:"69px",height:"28px"}]})]}))]}));exports.TemplateAnalyticsSkeleton=x=>{const{skipTitleShimmer:r,fullWidth:n}=x;return s.jsxRuntimeExports.jsxs(e.RightPanelContainer,Object.assign({fullWidth:n},{children:[s.jsxRuntimeExports.jsx("div",{children:r?s.jsxRuntimeExports.jsx(s.jsxRuntimeExports.Fragment,{}):s.jsxRuntimeExports.jsx(i.BikShimmer,{boxes:[{width:"76px",height:"18px"}]})}),s.jsxRuntimeExports.jsx("div",Object.assign({className:"mt-3"},{children:[0,1,2].map((e=>s.jsxRuntimeExports.jsx(t,{},e)))})),s.jsxRuntimeExports.jsxs(s.jsxRuntimeExports.Fragment,{children:[s.jsxRuntimeExports.jsx("div",{children:s.jsxRuntimeExports.jsx(i.BikShimmer,{boxes:[{width:"76px",height:"18px"}]})}),s.jsxRuntimeExports.jsx("div",Object.assign({className:"mt-3"},{children:s.jsxRuntimeExports.jsx(t,{})}))]})]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var s=require("../../../node_modules/react/jsx-runtime.js"),e=require("../../shimmer/ShimmerComponent/BikShimmer.js"),t=require("../styles/TemplateAnalyticsStyles.js");const i=()=>s.jsxRuntimeExports.jsxs("div",Object.assign({className:"each--analytics--container"},{children:[s.jsxRuntimeExports.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[s.jsxRuntimeExports.jsx(e.BikShimmer,{boxes:[{width:"24px",height:"24px"}]}),s.jsxRuntimeExports.jsx(e.BikShimmer,{boxes:[{width:"69px",height:"11px"}]})]})),s.jsxRuntimeExports.jsxs("div",Object.assign({className:"d-flex align--center",style:{gap:8}},{children:[s.jsxRuntimeExports.jsx(e.BikShimmer,{boxes:[{width:"43px",height:"18px"}]}),s.jsxRuntimeExports.jsx(e.BikShimmer,{boxes:[{width:"69px",height:"28px"}]})]}))]}));exports.TemplateAnalyticsSkeleton=x=>{const{skipTitleShimmer:r,fullWidth:n}=x;return s.jsxRuntimeExports.jsxs(t.RightPanelContainer,Object.assign({fullWidth:n},{children:[s.jsxRuntimeExports.jsx("div",{children:r?s.jsxRuntimeExports.jsx(s.jsxRuntimeExports.Fragment,{}):s.jsxRuntimeExports.jsx(e.BikShimmer,{boxes:[{width:"76px",height:"18px"}]})}),s.jsxRuntimeExports.jsx("div",Object.assign({className:"mt-3"},{children:[0,1,2].map((e=>s.jsxRuntimeExports.jsx(i,{},e)))})),s.jsxRuntimeExports.jsxs(s.jsxRuntimeExports.Fragment,{children:[s.jsxRuntimeExports.jsx("div",{children:s.jsxRuntimeExports.jsx(e.BikShimmer,{boxes:[{width:"76px",height:"18px"}]})}),s.jsxRuntimeExports.jsx("div",Object.assign({className:"mt-3"},{children:s.jsxRuntimeExports.jsx(i,{})}))]})]}))};