@bikdotai/bik-component-library 0.0.388-beta.4 → 0.0.388-beta.6

package/dist/cjs/components/template-context-mapper/TemplateContextMapper.d.ts

@@ -3,7 +3,7 @@ import { CHANNEL_TYPE } from '../template-preview/models/Channels';
 import { EmailTemplateType } from '../template-preview/models/EmailTemplate';
 import { SMSTemplateType } from '../template-preview/models/SmsTemplate';
 import { CUSTOM_VARIABLE, GlobalPlaceholderType } from '../template-preview/models/TemplateMeta';
-import { WhatsAppPickerMeta, WhatsAppTemplate, WhatsAppTemplateVariables } from '../template-preview/models/WhatsAppTemplate';
+import { Extras, WhatsAppPickerMeta, WhatsAppTemplate, WhatsAppTemplateVariables } from '../template-preview/models/WhatsAppTemplate';
 export interface TemplateContextMapperProps {
     selectedTemplate: WhatsAppTemplate | EmailTemplateType | SMSTemplateType;
     closeDialog?: () => void;
@@ -26,5 +26,7 @@ export interface TemplateContextMapperProps {
     setDiscountCode?: (code: string) => void;
     enabledCustomText?: boolean;
     disableEditVariable?: boolean;
+    pod?: string;
+    extras?: Extras;
 }
-export declare const TemplateContextMapper: ({ selectedTemplate, closeDialog, showVariableMapping, channel, htmlContent, templateVariables, onTemplateSelect, globalPlaceholders, showOnlyContent, whatsappSpecificPickerMeta, zIndex, showVariableModal, variableList, discountCode, setDiscountCode, onBackPress, enabledCustomText, disableEditVariable, variableListForImage, }: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TemplateContextMapper: ({ selectedTemplate, closeDialog, showVariableMapping, channel, htmlContent, templateVariables, onTemplateSelect, globalPlaceholders, showOnlyContent, whatsappSpecificPickerMeta, zIndex, showVariableModal, variableList, discountCode, setDiscountCode, onBackPress, enabledCustomText, disableEditVariable, variableListForImage, pod, extras, }: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/template-context-mapper/TemplateContextMapper.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),l=require("../../utils/StringUtils.js"),a=require("../modals/styledModal.js"),i=require("../template-preview/models/Channels.js"),s=require("./context/templateModalContext.js"),o=require("./modalElements/Footer.js"),r=require("./modalElements/TemplateSelectModalContent.js"),n=require("./utils/convertPlaceholdersToBikDropdown.js");exports.TemplateContextMapper=d=>{let{selectedTemplate:c,closeDialog:u,showVariableMapping:p,channel:m,htmlContent:b,templateVariables:h,onTemplateSelect:g,globalPlaceholders:v,showOnlyContent:C,whatsappSpecificPickerMeta:S,zIndex:T,showVariableModal:E,variableList:j,discountCode:x,setDiscountCode:M,onBackPress:P,enabledCustomText:L,disableEditVariable:f,variableListForImage:w}=d;var q,y;t.useEffect((()=>{I(b)}),[b]);const[A,N]=t.useState(m===i.CHANNEL_TYPE.EMAIL?"desktop":"mobile"),[V,I]=t.useState(b),[k,D]=t.useState(!1),[_,H]=t.useState(c),[O,F]=t.useState(null!=h?h:[]),[B,Y]=t.useState(!1);const z=t.useMemo((()=>n.convertPlaceholdersToBikDropdown(v)),[v]);return e.jsx(s.TemplateModalContext.Provider,Object.assign({value:{template:_,setTemplate:H,device:A,setDevice:N,display_content:V,setDisplayContent:I,originalVariableList:O,setOriginalVariableList:F,isError:k,setIsError:D,channel:m,globalNormalizedPlaceholders:z,templateSelectionTriggered:B,setTemplateSelectionTriggered:Y,enabledCustomText:L,disableEditVariable:f}},{children:C?e.jsx(r.default,{channel:i.CHANNEL_TYPE.EMAIL,hideHeader:!0}):e.jsxs(a.StyledModal,Object.assign({zIndex:T,centralContainerStyles:{width:m===i.CHANNEL_TYPE.EMAIL&&p?1e3:650},open:!0,onClose:()=>{null==u||u()},headingTitle:null==_?void 0:_.label,headingSubtitle:m===i.CHANNEL_TYPE.WHATSAPP?`${l.default.capitaliseFirstLetterOfString(null!==(q=null==_?void 0:_.category)&&void 0!==q?q:"")} • ${null!==(y=null==_?void 0:_.templateCategory)&&void 0!==y?y:""}`:"",onBackPress:()=>{null==P||P()}},{children:[e.jsx(r.default,{showVariableMapping:p,channel:m,whatsappSpecificPickerMeta:S,showVariableModal:E,variableList:j,discountCode:x,setDiscountCode:M,variableListForImage:w&&(null==w?void 0:w.length)>0?w:j}),g?e.jsx(o.default,{onSelect:function(){const e=null==g?void 0:g(_,O,null!=V?V:"");e?D(!!e):Y(!0)}}):e.jsx(e.Fragment,{})]}))}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),l=require("../../utils/StringUtils.js"),a=require("../modals/styledModal.js"),s=require("../template-preview/models/Channels.js"),i=require("./context/templateModalContext.js"),o=require("./modalElements/Footer.js"),r=require("./modalElements/TemplateSelectModalContent.js"),n=require("./utils/convertPlaceholdersToBikDropdown.js");exports.TemplateContextMapper=d=>{let{selectedTemplate:c,closeDialog:u,showVariableMapping:p,channel:m,htmlContent:b,templateVariables:h,onTemplateSelect:g,globalPlaceholders:v,showOnlyContent:C,whatsappSpecificPickerMeta:x,zIndex:S,showVariableModal:T,variableList:E,discountCode:j,setDiscountCode:M,onBackPress:P,enabledCustomText:L,disableEditVariable:f,variableListForImage:w,pod:q,extras:y}=d;var A,N;t.useEffect((()=>{D(b)}),[b]);const[V,I]=t.useState(m===s.CHANNEL_TYPE.EMAIL?"desktop":"mobile"),[k,D]=t.useState(b),[_,H]=t.useState(!1),[O,F]=t.useState(c),[B,Y]=t.useState(null!=h?h:[]),[z,$]=t.useState(!1);const U=t.useMemo((()=>n.convertPlaceholdersToBikDropdown(v)),[v]);return e.jsx(i.TemplateModalContext.Provider,Object.assign({value:{template:O,setTemplate:F,device:V,setDevice:I,display_content:k,setDisplayContent:D,originalVariableList:B,setOriginalVariableList:Y,isError:_,setIsError:H,channel:m,globalNormalizedPlaceholders:U,templateSelectionTriggered:z,setTemplateSelectionTriggered:$,enabledCustomText:L,disableEditVariable:f,pod:q,extras:y}},{children:C?e.jsx(r.default,{channel:s.CHANNEL_TYPE.EMAIL,hideHeader:!0}):e.jsxs(a.StyledModal,Object.assign({zIndex:S,centralContainerStyles:{width:m===s.CHANNEL_TYPE.EMAIL&&p?1e3:650},open:!0,onClose:()=>{null==u||u()},headingTitle:null==O?void 0:O.label,headingSubtitle:m===s.CHANNEL_TYPE.WHATSAPP?`${l.default.capitaliseFirstLetterOfString(null!==(A=null==O?void 0:O.category)&&void 0!==A?A:"")} • ${null!==(N=null==O?void 0:O.templateCategory)&&void 0!==N?N:""}`:"",onBackPress:()=>{null==P||P()}},{children:[e.jsx(r.default,{showVariableMapping:p,channel:m,whatsappSpecificPickerMeta:x,showVariableModal:T,variableList:E,discountCode:j,setDiscountCode:M,variableListForImage:w&&(null==w?void 0:w.length)>0?w:E}),g?e.jsx(o.default,{onSelect:function(){const e=null==g?void 0:g(O,B,null!=k?k:"");e?H(!!e):$(!0)}}):e.jsx(e.Fragment,{})]}))}))};

package/dist/cjs/components/template-context-mapper/context/templateModalContext.d.ts

@@ -3,7 +3,7 @@ import { CHANNEL_TYPE } from "../../template-preview/models/Channels";
 import { EmailTemplateType } from "../../template-preview/models/EmailTemplate";
 import { SMSTemplateType } from "../../template-preview/models/SmsTemplate";
 import { CUSTOM_VARIABLE, globalNormalizedPlaceholdersType } from "../../template-preview/models/TemplateMeta";
-import { WhatsAppTemplate, WhatsAppTemplateVariables } from "../../template-preview/models/WhatsAppTemplate";
+import { Extras, WhatsAppTemplate, WhatsAppTemplateVariables } from "../../template-preview/models/WhatsAppTemplate";
 export type DEVICE_TYPES = 'desktop' | 'mobile';
 export declare const TemplateModalContext: React.Context<{
     device: DEVICE_TYPES;
@@ -23,6 +23,8 @@ export declare const TemplateModalContext: React.Context<{
     setTemplateSelectionTriggered?: React.Dispatch<React.SetStateAction<boolean>> | undefined;
     enabledCustomText?: boolean | undefined;
     disableEditVariable?: boolean | undefined;
+    pod?: string | undefined;
+    extras?: Extras | undefined;
 }>;
 export declare const useTemplateModalContext: () => {
     device: DEVICE_TYPES;
@@ -42,4 +44,6 @@ export declare const useTemplateModalContext: () => {
     setTemplateSelectionTriggered?: React.Dispatch<React.SetStateAction<boolean>> | undefined;
     enabledCustomText?: boolean | undefined;
     disableEditVariable?: boolean | undefined;
+    pod?: string | undefined;
+    extras?: Extras | undefined;
 };

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

@@ -0,0 +1,4 @@
+export declare const BackTrackComponent: (props: {
+    backTrackMessage?: string | undefined;
+    setBackTrackMessage?: ((backTrackMessage: string) => void) | undefined;
+}) => import("react/jsx-runtime").JSX.Element;

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

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

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

@@ -1,17 +1,17 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),l=require("styled-components"),n=require("../../template-preview/models/Channels.js"),o=require("../../../constants/Theme.js"),i=require("../context/templateModalContext.js"),a=require("../utils/getVariableNameEmail.js"),r=require("../utils/highlightFor.js"),s=require("./DesktopPreview.js"),d=require("./EditWhatsAppTemplateV2.js"),u=require("./MobilePreview.js"),c=require("./VariableConnectorsPanel.js");function p(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var h=p(l);const m=h.default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),l=require("styled-components"),o=require("../../template-preview/models/Channels.js"),n=require("../../../constants/Theme.js"),i=require("../context/templateModalContext.js"),a=require("../utils/getVariableNameEmail.js"),r=require("../utils/highlightFor.js"),s=require("./DesktopPreview.js"),d=require("./EditWhatsAppTemplateV2.js"),u=require("./MobilePreview.js"),c=require("./VariableConnectorsPanel.js");function p(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var h=p(l);const m=h.default.div`
 	display: flex;
 	//	height: 100%;
 `,f=h.default.div`
 	padding: 16px 14px;
 	max-width: 350px;
 
-	height: ${e=>e.channel===n.CHANNEL_TYPE.WHATSAPP?"500px":"475px"};
+	height: ${e=>e.channel===o.CHANNEL_TYPE.WHATSAPP?"500px":"475px"};
 	overflow-y: 'auto';
 	padding-bottom: 24px;
-	border-left: ${o.COLORS.stroke.primary} 1px solid;
+	border-left: ${n.COLORS.stroke.primary} 1px solid;
 `,g=h.default.div`
 	padding: ${e=>e.showOnlyContent?"16px 14px":"16px 32px"};
 	flex: 1;
 	height: 475px;
 	overflow-y: auto;
-`;exports.default=l=>{const{showVariableMapping:p,showOnlyContent:h,whatsappSpecificPickerMeta:x,showVariableModal:v,variableList:b,discountCode:j,setDiscountCode:w,variableListForImage:C}=l,E=t.useRef(),y=t.useRef(),{device:L,display_content:P,channel:T,template:M,setTemplate:_}=i.useTemplateModalContext();const A=e=>{let t=0;for(;e;)t+=e.offsetTop,e=e.offsetParent;return t};return e.jsxs(m,{children:[e.jsx(g,Object.assign({showOnlyContent:h,showVariableMapping:p},{children:"mobile"===L?e.jsx(u.default,{ref:y,display_content:null!=P?P:"",channel:T,template:M}):T!==n.CHANNEL_TYPE.MESSAGE?e.jsx(s.default,{ref:E,channel:T,display_content:null!=P?P:""}):e.jsx(e.Fragment,{})})),p&&e.jsx(f,Object.assign({channel:T},{children:T!==n.CHANNEL_TYPE.WHATSAPP?e.jsx(c.default,{onFocus:T===n.CHANNEL_TYPE.EMAIL?function(e){var t,l,i;const s=null===document||void 0===document?void 0:document.getElementById("mobile"===L?"template_html_mobile":"template_html_desktop"),d=a.getVariableNameForEmailByIndex(e+1),u=T===n.CHANNEL_TYPE.EMAIL?null===(t=null==s?void 0:s.contentWindow)||void 0===t?void 0:t.document.getElementById(d):document.getElementById(d),c=A(u),p=null==u?void 0:u.offsetLeft;"desktop"===L?c&&E.current&&(null===(l=null==s?void 0:s.contentWindow)||void 0===l||l.scrollTo(null!=p?p:0,c),r.highlightFor(d,o.COLORS.background.warning.light,2,T,L)):c&&y.current&&(null===(i=null==s?void 0:s.contentWindow)||void 0===i||i.scrollTo(null!=p?p:0,c),r.highlightFor(d,o.COLORS.background.warning.light,2,T,L))}:void 0,showVariableModal:v,variableList:b,discountCode:j,setDiscountCode:w}):e.jsx(d.default,{whatsappSpecificPickerMeta:x,template:M,onTemplateChange:e=>{null==_||_(e)},showVariableModal:v,variableList:b,variableListForImage:C})}))]})};
+`;exports.default=l=>{const{showVariableMapping:p,showOnlyContent:h,whatsappSpecificPickerMeta:x,showVariableModal:v,variableList:b,discountCode:j,setDiscountCode:C,variableListForImage:w}=l,E=t.useRef(),y=t.useRef(),{device:L,display_content:P,channel:T,template:M,setTemplate:_}=i.useTemplateModalContext();const A=e=>{let t=0;for(;e;)t+=e.offsetTop,e=e.offsetParent;return t};return e.jsxs(m,{children:[e.jsx(g,Object.assign({showOnlyContent:h,showVariableMapping:p},{children:"mobile"===L?e.jsx(u.default,{ref:y,display_content:null!=P?P:"",channel:T,template:M}):T!==o.CHANNEL_TYPE.MESSAGE?e.jsx(s.default,{ref:E,channel:T,display_content:null!=P?P:""}):e.jsx(e.Fragment,{})})),p&&e.jsx(f,Object.assign({channel:T},{children:T!==o.CHANNEL_TYPE.WHATSAPP?e.jsx(c.default,{onFocus:T===o.CHANNEL_TYPE.EMAIL?function(e){var t,l,i;const s=null===document||void 0===document?void 0:document.getElementById("mobile"===L?"template_html_mobile":"template_html_desktop"),d=a.getVariableNameForEmailByIndex(e+1),u=T===o.CHANNEL_TYPE.EMAIL?null===(t=null==s?void 0:s.contentWindow)||void 0===t?void 0:t.document.getElementById(d):document.getElementById(d),c=A(u),p=null==u?void 0:u.offsetLeft;"desktop"===L?c&&E.current&&(null===(l=null==s?void 0:s.contentWindow)||void 0===l||l.scrollTo(null!=p?p:0,c),r.highlightFor(d,n.COLORS.background.warning.light,2,T,L)):c&&y.current&&(null===(i=null==s?void 0:s.contentWindow)||void 0===i||i.scrollTo(null!=p?p:0,c),r.highlightFor(d,n.COLORS.background.warning.light,2,T,L))}:void 0,showVariableModal:v,variableList:b,discountCode:j,setDiscountCode:C}):e.jsx(d.default,{whatsappSpecificPickerMeta:x,template:M,onTemplateChange:e=>{null==_||_(e)},showVariableModal:v,variableList:b,variableListForImage:w,discountCode:j,setDiscountCode:C})}))]})};

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

@@ -0,0 +1,6 @@
+import { VariableListInterfaceV2 } from "../../add-variableV2";
+export declare const DiscountCodeComponent: (props: {
+    discountCode?: string | undefined;
+    setDiscountCode?: ((code: string) => void) | undefined;
+    variableList?: VariableListInterfaceV2[] | undefined;
+}) => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("../../../assets/icons/PlusIcon.js"),a=require("react"),s=require("../../add-variableV2/AddVariableV2SideModal.js");require("../../../_virtual/_tslib.js"),require("../../add-variableV2/AddVariableV2.styled.js"),require("../../button/Button.js"),require("../../icon-button/IconButton.js");var i=require("../../input/Input.js");require("@tippyjs/react"),require("../../tooltips/TooltipInternal.js"),require("../../../constants/Theme.js"),require("../../switch/Switch.js");var t=require("../../TypographyStyle.js"),l=require("../../checkBox/CheckBox.js"),o=require("./VariableConnectorsPanel.js");exports.DiscountCodeComponent=d=>{const{discountCode:n,setDiscountCode:u,variableList:c}=d,[j,b]=a.useState(""),[h,v]=a.useState(!1),[x,g]=a.useState(!1),[p,V]=a.useState(!1),q=a.useRef(),f=a.useRef();return a.useEffect((()=>{console.log("vj: setDiscountCode",u,j),u&&u(n+j)}),[j]),e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",marginLeft:10,marginTop:8}},{children:[e.jsx(l.CheckBox,{isChecked:h,onValueChange:()=>{h&&u&&u(""),v(!h)}}),e.jsx(t.TitleSmall,Object.assign({style:{marginLeft:8}},{children:"Add discount code"}))]})),h&&e.jsxs("div",Object.assign({ref:q,style:{margin:10}},{children:[e.jsx(i.Input,{placeholder:"Enter your discount code",onChangeText:e=>{u&&u(e)},value:n,onFocus:()=>{g(!0)},onBlur:e=>{var r;"addVar"===(null===(r=e.relatedTarget)||void 0===r?void 0:r.id)?(q.current&&q.current.focus(),g(!0)):(g(!1),V(!1))},noErrorHint:!0,validate:e=>[!0,""]}),x&&e.jsx(o.AddVariableStyled,Object.assign({ref:f,id:"addVar",onClick:e=>{e.stopPropagation(),V(!0)}},{children:e.jsxs("div",Object.assign({className:"add"},{children:[e.jsx(r.default,{width:20,height:20,color:"white"}),e.jsx("div",Object.assign({className:"variable"},{children:"Add variable"}))]}))}))]})),p&&e.jsx(s.AddVariableV2SideModal,{zIndex:2e3,data:null!=c?c:[],showVariable:p,setShowVariable:V,variableValue:j,setVariableValue:b,placeholder:"Add a variable",customTrigger:e=>{b(e.actualValue),g(!1)}})]})};

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),i=require("react"),a=require("../../helpers/FileUploaderHelper.js"),n=require("../../image-cropper/BikImageCropper.js");require("../../image-compress/ImageCompress.js"),require("../../states/StateComponent.js"),require("../../../constants/zindex.js"),require("../../modals/styledModal.js"),require("../../spinner/Spinner.js");var o=require("../../template-preview/models/TemplateMeta.js"),r=require("../context/templateModalContext.js"),l=require("./EditMediaModal.js"),s=require("./EditMediaV2.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=d(i);exports.default=d=>{let{mediaComponent:p,template:u,updateTemplateImageUrl:m,whatsappSpecificPickerMeta:f,variableListForImage:v}=d;var E,g,j;const{disableEditVariable:h}=r.useTemplateModalContext(),[b,M]=i.useState(void 0),[_,x]=i.useState(),[y,A]=i.useState(),[C,S]=i.useState(!1),T=c.default.createRef(),[I,q]=i.useState(!1),[R,O]=i.useState(""),{template:w,setTemplate:D}=r.useTemplateModalContext();let H;function k(){var e;(null===(e=null==T?void 0:T.current)||void 0===e?void 0:e.click)&&T.current.click()}function P(t){var i;return e.__awaiter(this,void 0,void 0,(function*(){const e=new a.FileUploaderHelper;if(t instanceof Blob){const a=e.validate(t);if(a)O(a),q(!1);else{const e=p.format===o.HEADER_TYPES.IMAGE,a=yield f.uploadMediaFiles({file:t,fileName:b,isImage:e});if(a.success){const[e]=t.type.split("/");m(null!==(i=a.url)&&void 0!==i?i:"","application"===e?o.HEADER_TYPES.DOCUMENT:o.HEADER_TYPES[e.toUpperCase()])}else O("An unknown technical error occured");q(!1)}}else O("An unknown technical error occured"),q(!1)}))}return console.log("vj: ignore",h),H=p.format===o.HEADER_TYPES.IMAGE?"image/png, image/jpeg":p.format===o.HEADER_TYPES.VIDEO?"video/mp4":"application/pdf",t.jsxs(t.Fragment,{children:[t.jsx(l.default,{mediaComponentFormat:null!==(E=p.format)&&void 0!==E?E:o.HEADER_TYPES.IMAGE,uploadMedia:function(t){var i;return e.__awaiter(this,void 0,void 0,(function*(){if(O(""),A(""),S(!1),t)if(t.startsWith("https"))try{q(!0);const e=yield fetch(t),i=yield e.blob();yield P(i)}catch(e){O("An unknown technical error occurred")}else if(/^{{.*}}$/.test(t)){A(t);const e=Object.assign({},w);if(e.components){const t=null===(i=null==e?void 0:e.components)||void 0===i?void 0:i.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==t&&t>-1&&(null==e?void 0:e.components[t])){const i=Object.assign(Object.assign({},e.components[t]),{format:p.format,example:{header_handle:["https://jkfenner.com/wp-content/uploads/2019/11/default.jpg"]}}),a=[...e.components];a[t]=i,e.components=a}}e.mapping&&(e.mapping=Object.assign(Object.assign({},e.mapping),{header:[t]})),q(!1),null==D||D(Object.assign({},e))}else q(!1),O("Invalid URL or variable");else k()}))},variableListForImage:v||[],setOpenEditMedia:S,openEditMedia:C}),!!_&&t.jsx(n.BikImageCropper,{aspectRatio:15/8,src:_,onCropComplete:function(t){return e.__awaiter(this,void 0,void 0,(function*(){q(!1),O("");const e=yield fetch(t);P(yield e.blob()).then((()=>{x(void 0)}))}))},onCancel:()=>{q(!1),x("")}}),t.jsx("input",{ref:T,style:{display:"none"},type:"file",onChange:function(e){var t;O(""),q(!0);const i=null===(t=e.target.files)||void 0===t?void 0:t[0];if(p.format===o.HEADER_TYPES.IMAGE){const e=new FileReader;x(""),M(""),e.onload=()=>{x(e.result),M(null==i?void 0:i.name)},i&&e.readAsDataURL(i)}else P(i)},accept:H}),t.jsx(s.default,{imageName:null!==(j=null===(g=null==p?void 0:p.example)||void 0===g?void 0:g.header_handle)&&void 0!==j?j:[],handleImageChange:k,mediaType:null==p?void 0:p.format,error:R,isLoading:I,setOpenEditMedia:S,selectedVariable:y})]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),i=require("react"),a=require("../../helpers/FileUploaderHelper.js"),n=require("../../image-cropper/BikImageCropper.js");require("../../image-compress/ImageCompress.js"),require("../../states/StateComponent.js"),require("../../../constants/zindex.js"),require("../../modals/styledModal.js"),require("../../spinner/Spinner.js");var o=require("../../template-preview/models/TemplateMeta.js"),r=require("../context/templateModalContext.js"),l=require("./EditMediaModal.js"),s=require("./EditMediaV2.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=d(i);exports.default=d=>{let{mediaComponent:p,template:u,updateTemplateImageUrl:m,whatsappSpecificPickerMeta:f,variableListForImage:v}=d;var E,g,j;const{disableEditVariable:h}=r.useTemplateModalContext(),[b,M]=i.useState(void 0),[_,x]=i.useState(),[y,A]=i.useState(),[C,S]=i.useState(!1),T=c.default.createRef(),[I,q]=i.useState(!1),[R,O]=i.useState(""),{template:w,setTemplate:D}=r.useTemplateModalContext();let H;function k(){var e;(null===(e=null==T?void 0:T.current)||void 0===e?void 0:e.click)&&T.current.click()}function P(t){var i;return e.__awaiter(this,void 0,void 0,(function*(){const e=new a.FileUploaderHelper;if(t instanceof Blob){const a=e.validate(t);if(a)O(a),q(!1);else{const e=p.format===o.HEADER_TYPES.IMAGE,a=yield f.uploadMediaFiles({file:t,fileName:b,isImage:e});if(a.success){const[e]=t.type.split("/");m(null!==(i=a.url)&&void 0!==i?i:"","application"===e?o.HEADER_TYPES.DOCUMENT:o.HEADER_TYPES[e.toUpperCase()])}else O("An unknown technical error occured");q(!1)}}else O("An unknown technical error occured"),q(!1)}))}return console.log("ignore: ",h),H=p.format===o.HEADER_TYPES.IMAGE?"image/png, image/jpeg":p.format===o.HEADER_TYPES.VIDEO?"video/mp4":"application/pdf",t.jsxs(t.Fragment,{children:[t.jsx(l.default,{mediaComponentFormat:null!==(E=p.format)&&void 0!==E?E:o.HEADER_TYPES.IMAGE,uploadMedia:function(t){var i;return e.__awaiter(this,void 0,void 0,(function*(){if(O(""),A(""),S(!1),t)if(t.startsWith("https"))try{q(!0);const e=yield fetch(t),i=yield e.blob();yield P(i)}catch(e){O("An unknown technical error occurred")}else if(/^{{.*}}$/.test(t)){A(t);const e=Object.assign({},w);if(e.components){const t=null===(i=null==e?void 0:e.components)||void 0===i?void 0:i.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==t&&t>-1&&(null==e?void 0:e.components[t])){const i=Object.assign(Object.assign({},e.components[t]),{format:p.format,example:{header_handle:["https://jkfenner.com/wp-content/uploads/2019/11/default.jpg"]}}),a=[...e.components];a[t]=i,e.components=a}}e.mapping&&(e.mapping=Object.assign(Object.assign({},e.mapping),{header:[t]})),q(!1),null==D||D(Object.assign({},e))}else q(!1),O("Invalid URL or variable");else k()}))},variableListForImage:v||[],setOpenEditMedia:S,openEditMedia:C}),!!_&&t.jsx(n.BikImageCropper,{aspectRatio:15/8,src:_,onCropComplete:function(t){return e.__awaiter(this,void 0,void 0,(function*(){q(!1),O("");const e=yield fetch(t);P(yield e.blob()).then((()=>{x(void 0)}))}))},onCancel:()=>{q(!1),x("")}}),t.jsx("input",{ref:T,style:{display:"none"},type:"file",onChange:function(e){var t;O(""),q(!0);const i=null===(t=e.target.files)||void 0===t?void 0:t[0];if(p.format===o.HEADER_TYPES.IMAGE){const e=new FileReader;x(""),M(""),e.onload=()=>{x(e.result),M(null==i?void 0:i.name)},i&&e.readAsDataURL(i)}else P(i)},accept:H}),t.jsx(s.default,{imageName:null!==(j=null===(g=null==p?void 0:p.example)||void 0===g?void 0:g.header_handle)&&void 0!==j?j:[],handleImageChange:k,mediaType:null==p?void 0:p.format,error:R,isLoading:I,setOpenEditMedia:S,selectedVariable:y})]})};

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

@@ -9,6 +9,8 @@ export interface EditWhatsAppTemplateV2Props {
     showVariableModal?: boolean;
     variableList?: VariableListInterfaceV2[];
     variableListForImage?: VariableListInterfaceV2[];
+    discountCode?: string;
+    setDiscountCode?: (code: string) => void;
 }
-declare const EditWhatsAppTemplateV2: ({ template, onTemplateChange, whatsappSpecificPickerMeta, showVariableModal, variableList, variableListForImage, }: EditWhatsAppTemplateV2Props) => import("react/jsx-runtime").JSX.Element;
+declare const EditWhatsAppTemplateV2: ({ template, onTemplateChange, whatsappSpecificPickerMeta, showVariableModal, variableList, variableListForImage, discountCode, setDiscountCode, }: EditWhatsAppTemplateV2Props) => import("react/jsx-runtime").JSX.Element;
 export default EditWhatsAppTemplateV2;

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../context/templateModalContext.js"),n=require("../utils/getDataFromTemplateComponent.js"),o=require("./EditMediaV2.style.js"),i=require("./EditWhatsAppTemplateMediaV2.js"),a=require("./VariableConnectorsPanel.js"),l=require("./VariableConnectorWhatsApp.js"),s=require("./VariableEditorHeader.js"),d=require("./WhatsAppTemplateCardButtonV2.js");exports.default=r=>{let{template:p,onTemplateChange:u,whatsappSpecificPickerMeta:c,showVariableModal:m,variableList:b,variableListForImage:v}=r;var g,h,f,j,x,T,O,y,C,E,V,w;const{originalVariableList:I}=t.useTemplateModalContext(),{descriptionComponents:L,urlBtns:B,qrbBtns:M,imageComponent:q,bodyVariables:R,headerVariables:A}=n.getAllDataFromTemplateComponent(p);function U(e,t){var n,o,i,a;const l=Object.assign({},p),s=null==l?void 0:l.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==s&&s>-1){const d=null===(n=null==l?void 0:l.components[s].buttons)||void 0===n?void 0:n.findIndex((e=>"URL"===e.type));if(void 0!==d&&d>-1){const n="custom"===t&&"string"==typeof e,r=[...null!==(a=null===(i=null===(o=l.components)||void 0===o?void 0:o[s])||void 0===i?void 0:i.buttons)&&void 0!==a?a:[]];r[d]=Object.assign(Object.assign({},r[d]),{url:"https://d.bik.ai/{{1}}",example:[n?e:"string"!=typeof e?e.defaultValue:""]});const p=Object.assign(Object.assign({},l.components[s]),{buttons:r}),u=Object.assign(Object.assign({},l.mapping),{buttons:n?["((customBtnPlaceholder))"]:"string"!=typeof e?[e.placeHolder]:void 0});l.mapping=u;const c=[...l.components];c[s]=p,l.components=c}}null==u||u(l)}function P(e,t,n){var o;const i=Object.assign({},p),a=null==i?void 0:i.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==a&&a>-1){const t=null===(o=null==i?void 0:i.components[a].buttons)||void 0===o?void 0:o.filter((e=>"QUICK_REPLY"===e.type));t&&(t[n]=Object.assign(Object.assign({},t[n]),{flowId:e.flowId,flowName:e.flowName}));const l=Object.assign(Object.assign({},i.components[a]),{buttons:t}),s=[...i.components];s[a]=l,i.components=s}null==u||u(i)}return e.jsxs(a.Container,Object.assign({style:{flexDirection:"column",maxHeight:460}},{children:[!!q&&e.jsx(o.EditTemplateMediaContainer,{children:e.jsx(i.default,{whatsappSpecificPickerMeta:c,mediaComponent:q,updateTemplateImageUrl:function(e,t){var n;let o=Object.assign({},p);const i=null===(n=null==o?void 0:o.components)||void 0===n?void 0:n.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==i&&i>-1&&(null==o?void 0:o.components[i])){const n=Object.assign(Object.assign({},o.components[i]),{format:t,example:{header_handle:[e]}}),a=[...o.components];a[i]=n,o=Object.assign(Object.assign({},o),{components:a})}o.mapping&&(o.mapping=Object.assign(Object.assign({},o.mapping),{header:void 0})),null==u||u(Object.assign({},o))},template:p,variableListForImage:v})}),(R.length>0||A.length>0)&&e.jsx(s.default,{containerStyle:{paddingTop:q?24:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}),null==L?void 0:L.map(((t,n)=>e.jsx(l.default,{originalVariableList:I,type:t.type,descriptionComponent:t.component,variableMapping:"HEADER"===t.type?p.mapping.header:p.mapping.body,showVariableModal:m,variableList:b},n))),(null===(h=null===(g=B[0])||void 0===g?void 0:g.component)||void 0===h?void 0:h.buttons)&&(null===(x=null===(j=null===(f=B[0])||void 0===f?void 0:f.component)||void 0===j?void 0:j.buttons)||void 0===x?void 0:x.length)>0&&e.jsx(s.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(T=null==I?void 0:I.buttons)||void 0===T?void 0:T.map(((t,n)=>{if("URL"===t.type)return e.jsx(d.default,{CTAoptions:null==c?void 0:c.CTAoptions,button:t,originalVariableList:I,updateSelectedURLTemplateBtn:U},`${n}`)})),(null===(y=null===(O=M[0])||void 0===O?void 0:O.component)||void 0===y?void 0:y.buttons)&&(null===(V=null===(E=null===(C=M[0])||void 0===C?void 0:C.component)||void 0===E?void 0:E.buttons)||void 0===V?void 0:V.length)>0&&e.jsx(s.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"}),null===(w=null==I?void 0:I.buttons)||void 0===w?void 0:w.map(((t,n)=>{if("QUICK_REPLY"===t.type)return e.jsx(d.default,{QRBoptions:null==c?void 0:c.QRBoptions,button:t,originalVariableList:I,updateSelectedQRBTemplateBtn:P},`${n}`)}))]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),o=require("../context/templateModalContext.js"),n=require("../utils/getDataFromTemplateComponent.js"),i=require("./BackTrackComponent.js"),a=require("./DiscountCodeComponent.js"),l=require("./EditMediaV2.style.js"),s=require("./EditWhatsAppTemplateMediaV2.js"),d=require("./VariableConnectorsPanel.js"),r=require("./VariableConnectorWhatsApp.js"),u=require("./VariableEditorHeader.js"),c=require("./WhatsAppTemplateCardButtonV2.js");exports.default=p=>{let{template:v,onTemplateChange:m,whatsappSpecificPickerMeta:b,showVariableModal:g,variableList:h,variableListForImage:f,discountCode:j,setDiscountCode:T}=p;var x,C,O,E,y,k,B,V,w,L,q,I,M,A,R,D;const{originalVariableList:U,pod:H,extras:S}=o.useTemplateModalContext(),{descriptionComponents:P,urlBtns:N,qrbBtns:Q,imageComponent:_,bodyVariables:F,headerVariables:W}=n.getAllDataFromTemplateComponent(v),[K,Y]=t.useState(!1);function $(e,t){var o,n,i,a,l;const s=Object.assign({},v),d=null==s?void 0:s.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==d&&d>-1){const l=null===(o=null==s?void 0:s.components[d].buttons)||void 0===o?void 0:o.findIndex((e=>"URL"===e.type));if(void 0!==l&&l>-1){const o="custom"===t&&"string"==typeof e,r=[...null!==(a=null===(i=null===(n=s.components)||void 0===n?void 0:n[d])||void 0===i?void 0:i.buttons)&&void 0!==a?a:[]];r[l]=Object.assign(Object.assign({},r[l]),{url:"https://d.bik.ai/{{1}}",example:[o?e:"string"!=typeof e?e.defaultValue:""]});const u=Object.assign(Object.assign({},s.components[d]),{buttons:r}),c=Object.assign(Object.assign({},s.mapping),{buttons:o?["((customBtnPlaceholder))"]:"string"!=typeof e?[e.placeHolder]:void 0});s.mapping=c;const p=[...s.components];p[d]=u,s.components=p}}"string"!=typeof e&&Y("checkout.Url"===(null===(l=e.placeHolder)||void 0===l?void 0:l.slice(2,-2))),null==m||m(s)}function X(e,t,o){var n;const i=Object.assign({},v),a=null==i?void 0:i.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==a&&a>-1){const t=null===(n=null==i?void 0:i.components[a].buttons)||void 0===n?void 0:n.filter((e=>"QUICK_REPLY"===e.type));t&&(t[o]=Object.assign(Object.assign({},t[o]),{flowId:e.flowId,flowName:e.flowName}));const l=Object.assign(Object.assign({},i.components[a]),{buttons:t}),s=[...i.components];s[a]=l,i.components=s}null==m||m(i)}return e.jsxs(d.Container,Object.assign({style:{flexDirection:"column",maxHeight:460}},{children:[!!_&&e.jsx(l.EditTemplateMediaContainer,{children:e.jsx(s.default,{whatsappSpecificPickerMeta:b,mediaComponent:_,updateTemplateImageUrl:function(e,t){var o;let n=Object.assign({},v);const i=null===(o=null==n?void 0:n.components)||void 0===o?void 0:o.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==i&&i>-1&&(null==n?void 0:n.components[i])){const o=Object.assign(Object.assign({},n.components[i]),{format:t,example:{header_handle:[e]}}),a=[...n.components];a[i]=o,n=Object.assign(Object.assign({},n),{components:a})}n.mapping&&(n.mapping=Object.assign(Object.assign({},n.mapping),{header:void 0})),null==m||m(Object.assign({},n))},template:v,variableListForImage:f})}),(F.length>0||W.length>0)&&e.jsx(u.default,{containerStyle:{paddingTop:_?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==P?void 0:P.map(((t,o)=>e.jsx(r.default,{originalVariableList:U,type:t.type,descriptionComponent:t.component,variableMapping:"HEADER"===t.type?v.mapping.header:v.mapping.body,showVariableModal:g,variableList:h},o))),(null===(C=null===(x=N[0])||void 0===x?void 0:x.component)||void 0===C?void 0:C.buttons)&&(null===(y=null===(E=null===(O=N[0])||void 0===O?void 0:O.component)||void 0===E?void 0:E.buttons)||void 0===y?void 0:y.length)>0&&e.jsx(u.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(k=null==U?void 0:U.buttons)||void 0===k?void 0:k.map(((t,o)=>{if("URL"===t.type)return e.jsx(c.default,{CTAoptions:null==b?void 0:b.CTAoptions,button:t,originalVariableList:U,updateSelectedURLTemplateBtn:$},`${o}`)})),(null===(V=null===(B=Q[0])||void 0===B?void 0:B.component)||void 0===V?void 0:V.buttons)&&(null===(q=null===(L=null===(w=Q[0])||void 0===w?void 0:w.component)||void 0===L?void 0:L.buttons)||void 0===q?void 0:q.length)>0&&("CHATBOT"!==H?e.jsx(u.default,{headerText:"Edit buttons",subText:"Edit the chatflows triggered on clicking  the buttons",toolTipInfo:"There is an option to trigger chatflows through the buttons which can keep the user engaged"}):e.jsx(i.BackTrackComponent,{backTrackMessage:null===(I=null==S?void 0:S.backTrackExtra)||void 0===I?void 0:I[0],setBackTrackMessage:null===(M=null==S?void 0:S.backTrackExtra)||void 0===M?void 0:M[1]})),null===(A=null==U?void 0:U.buttons)||void 0===A?void 0:A.map(((t,o)=>{if("QUICK_REPLY"===t.type)return e.jsx(c.default,{QRBoptions:null==b?void 0:b.QRBoptions,button:t,originalVariableList:U,updateSelectedQRBTemplateBtn:X},`${o}`)})),"CHATBOT"===H&&K&&e.jsx(a.DiscountCodeComponent,{discountCode:null===(R=null==S?void 0:S.discountCodeExtra)||void 0===R?void 0:R[0],setDiscountCode:null===(D=null==S?void 0:S.discountCodeExtra)||void 0===D?void 0:D[1],variableList:h})]}))};

package/dist/cjs/components/template-preview/models/WhatsAppTemplate.d.ts

@@ -226,3 +226,13 @@ export declare enum BUTTON_TYPE {
     URL = "URL",
     PHONE_NUMBER = "PHONE_NUMBER"
 }
+export type Extras = {
+    discountCodeExtra?: [
+        discountCode: string,
+        setDiscountCode: (discountCode: string) => void
+    ];
+    backTrackExtra?: [
+        backTrackMessage: string,
+        setBackTrackMessage: (backTrackMessage: string) => void
+    ];
+};

package/dist/esm/components/template-context-mapper/TemplateContextMapper.d.ts

@@ -3,7 +3,7 @@ import { CHANNEL_TYPE } from '../template-preview/models/Channels';
 import { EmailTemplateType } from '../template-preview/models/EmailTemplate';
 import { SMSTemplateType } from '../template-preview/models/SmsTemplate';
 import { CUSTOM_VARIABLE, GlobalPlaceholderType } from '../template-preview/models/TemplateMeta';
-import { WhatsAppPickerMeta, WhatsAppTemplate, WhatsAppTemplateVariables } from '../template-preview/models/WhatsAppTemplate';
+import { Extras, WhatsAppPickerMeta, WhatsAppTemplate, WhatsAppTemplateVariables } from '../template-preview/models/WhatsAppTemplate';
 export interface TemplateContextMapperProps {
     selectedTemplate: WhatsAppTemplate | EmailTemplateType | SMSTemplateType;
     closeDialog?: () => void;
@@ -26,5 +26,7 @@ export interface TemplateContextMapperProps {
     setDiscountCode?: (code: string) => void;
     enabledCustomText?: boolean;
     disableEditVariable?: boolean;
+    pod?: string;
+    extras?: Extras;
 }
-export declare const TemplateContextMapper: ({ selectedTemplate, closeDialog, showVariableMapping, channel, htmlContent, templateVariables, onTemplateSelect, globalPlaceholders, showOnlyContent, whatsappSpecificPickerMeta, zIndex, showVariableModal, variableList, discountCode, setDiscountCode, onBackPress, enabledCustomText, disableEditVariable, variableListForImage, }: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TemplateContextMapper: ({ selectedTemplate, closeDialog, showVariableMapping, channel, htmlContent, templateVariables, onTemplateSelect, globalPlaceholders, showOnlyContent, whatsappSpecificPickerMeta, zIndex, showVariableModal, variableList, discountCode, setDiscountCode, onBackPress, enabledCustomText, disableEditVariable, variableListForImage, pod, extras, }: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/template-context-mapper/TemplateContextMapper.js

@@ -1 +1 @@
-import{jsx as e,jsxs as t,Fragment as l}from"react/jsx-runtime";import{useEffect as o,useState as a,useMemo as i}from"react";import n from"../../utils/StringUtils.js";import{StyledModal as r}from"../modals/styledModal.js";import{CHANNEL_TYPE as s}from"../template-preview/models/Channels.js";import{TemplateModalContext as d}from"./context/templateModalContext.js";import c from"./modalElements/Footer.js";import m from"./modalElements/TemplateSelectModalContent.js";import{convertPlaceholdersToBikDropdown as p}from"./utils/convertPlaceholdersToBikDropdown.js";const b=b=>{let{selectedTemplate:u,closeDialog:h,showVariableMapping:g,channel:v,htmlContent:C,templateVariables:f,onTemplateSelect:M,globalPlaceholders:S,showOnlyContent:T,whatsappSpecificPickerMeta:j,zIndex:w,showVariableModal:L,variableList:P,discountCode:E,setDiscountCode:V,onBackPress:x,enabledCustomText:I,disableEditVariable:y,variableListForImage:k}=b;var D,A;o((()=>{B(C)}),[C]);const[O,F]=a(v===s.EMAIL?"desktop":"mobile"),[z,B]=a(C),[H,$]=a(!1),[N,U]=a(u),[W,_]=a(null!=f?f:[]),[q,G]=a(!1);const J=i((()=>p(S)),[S]);return e(d.Provider,Object.assign({value:{template:N,setTemplate:U,device:O,setDevice:F,display_content:z,setDisplayContent:B,originalVariableList:W,setOriginalVariableList:_,isError:H,setIsError:$,channel:v,globalNormalizedPlaceholders:J,templateSelectionTriggered:q,setTemplateSelectionTriggered:G,enabledCustomText:I,disableEditVariable:y}},{children:T?e(m,{channel:s.EMAIL,hideHeader:!0}):t(r,Object.assign({zIndex:w,centralContainerStyles:{width:v===s.EMAIL&&g?1e3:650},open:!0,onClose:()=>{null==h||h()},headingTitle:null==N?void 0:N.label,headingSubtitle:v===s.WHATSAPP?`${n.capitaliseFirstLetterOfString(null!==(D=null==N?void 0:N.category)&&void 0!==D?D:"")} • ${null!==(A=null==N?void 0:N.templateCategory)&&void 0!==A?A:""}`:"",onBackPress:()=>{null==x||x()}},{children:[e(m,{showVariableMapping:g,channel:v,whatsappSpecificPickerMeta:j,showVariableModal:L,variableList:P,discountCode:E,setDiscountCode:V,variableListForImage:k&&(null==k?void 0:k.length)>0?k:P}),M?e(c,{onSelect:function(){const e=null==M?void 0:M(N,W,null!=z?z:"");e?$(!!e):G(!0)}}):e(l,{})]}))}))};export{b as TemplateContextMapper};
+import{jsx as e,jsxs as t,Fragment as l}from"react/jsx-runtime";import{useEffect as o,useState as a,useMemo as i}from"react";import r from"../../utils/StringUtils.js";import{StyledModal as n}from"../modals/styledModal.js";import{CHANNEL_TYPE as s}from"../template-preview/models/Channels.js";import{TemplateModalContext as d}from"./context/templateModalContext.js";import c from"./modalElements/Footer.js";import m from"./modalElements/TemplateSelectModalContent.js";import{convertPlaceholdersToBikDropdown as p}from"./utils/convertPlaceholdersToBikDropdown.js";const b=b=>{let{selectedTemplate:u,closeDialog:h,showVariableMapping:g,channel:v,htmlContent:C,templateVariables:f,onTemplateSelect:M,globalPlaceholders:S,showOnlyContent:T,whatsappSpecificPickerMeta:j,zIndex:w,showVariableModal:x,variableList:L,discountCode:P,setDiscountCode:E,onBackPress:V,enabledCustomText:I,disableEditVariable:y,variableListForImage:k,pod:D,extras:A}=b;var O,F;o((()=>{$(C)}),[C]);const[z,B]=a(v===s.EMAIL?"desktop":"mobile"),[H,$]=a(C),[N,U]=a(!1),[W,_]=a(u),[q,G]=a(null!=f?f:[]),[J,K]=a(!1);const Q=i((()=>p(S)),[S]);return e(d.Provider,Object.assign({value:{template:W,setTemplate:_,device:z,setDevice:B,display_content:H,setDisplayContent:$,originalVariableList:q,setOriginalVariableList:G,isError:N,setIsError:U,channel:v,globalNormalizedPlaceholders:Q,templateSelectionTriggered:J,setTemplateSelectionTriggered:K,enabledCustomText:I,disableEditVariable:y,pod:D,extras:A}},{children:T?e(m,{channel:s.EMAIL,hideHeader:!0}):t(n,Object.assign({zIndex:w,centralContainerStyles:{width:v===s.EMAIL&&g?1e3:650},open:!0,onClose:()=>{null==h||h()},headingTitle:null==W?void 0:W.label,headingSubtitle:v===s.WHATSAPP?`${r.capitaliseFirstLetterOfString(null!==(O=null==W?void 0:W.category)&&void 0!==O?O:"")} • ${null!==(F=null==W?void 0:W.templateCategory)&&void 0!==F?F:""}`:"",onBackPress:()=>{null==V||V()}},{children:[e(m,{showVariableMapping:g,channel:v,whatsappSpecificPickerMeta:j,showVariableModal:x,variableList:L,discountCode:P,setDiscountCode:E,variableListForImage:k&&(null==k?void 0:k.length)>0?k:L}),M?e(c,{onSelect:function(){const e=null==M?void 0:M(W,q,null!=H?H:"");e?U(!!e):K(!0)}}):e(l,{})]}))}))};export{b as TemplateContextMapper};

package/dist/esm/components/template-context-mapper/context/templateModalContext.d.ts

@@ -3,7 +3,7 @@ import { CHANNEL_TYPE } from "../../template-preview/models/Channels";
 import { EmailTemplateType } from "../../template-preview/models/EmailTemplate";
 import { SMSTemplateType } from "../../template-preview/models/SmsTemplate";
 import { CUSTOM_VARIABLE, globalNormalizedPlaceholdersType } from "../../template-preview/models/TemplateMeta";
-import { WhatsAppTemplate, WhatsAppTemplateVariables } from "../../template-preview/models/WhatsAppTemplate";
+import { Extras, WhatsAppTemplate, WhatsAppTemplateVariables } from "../../template-preview/models/WhatsAppTemplate";
 export type DEVICE_TYPES = 'desktop' | 'mobile';
 export declare const TemplateModalContext: React.Context<{
     device: DEVICE_TYPES;
@@ -23,6 +23,8 @@ export declare const TemplateModalContext: React.Context<{
     setTemplateSelectionTriggered?: React.Dispatch<React.SetStateAction<boolean>> | undefined;
     enabledCustomText?: boolean | undefined;
     disableEditVariable?: boolean | undefined;
+    pod?: string | undefined;
+    extras?: Extras | undefined;
 }>;
 export declare const useTemplateModalContext: () => {
     device: DEVICE_TYPES;
@@ -42,4 +44,6 @@ export declare const useTemplateModalContext: () => {
     setTemplateSelectionTriggered?: React.Dispatch<React.SetStateAction<boolean>> | undefined;
     enabledCustomText?: boolean | undefined;
     disableEditVariable?: boolean | undefined;
+    pod?: string | undefined;
+    extras?: Extras | undefined;
 };

package/dist/esm/components/template-context-mapper/modalElements/BackTrackComponent.d.ts

@@ -0,0 +1,4 @@
+export declare const BackTrackComponent: (props: {
+    backTrackMessage?: string | undefined;
+    setBackTrackMessage?: ((backTrackMessage: string) => void) | undefined;
+}) => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1 @@
+import{jsxs as e,Fragment as r,jsx as t}from"react/jsx-runtime";import{useState as i}from"react";import{CheckBox as a}from"../../checkBox/CheckBox.js";import{TitleSmall as n}from"../../TypographyStyle.js";import{Input as s}from"../../input/Input.js";const c=c=>{const{backTrackMessage:o,setBackTrackMessage:l}=c,[g,m]=i(!1);return e(r,{children:[e("div",Object.assign({style:{display:"flex",flexDirection:"row",marginLeft:10,marginTop:8}},{children:[t(a,{isChecked:g,onValueChange:()=>{g&&l&&l(""),m(!g)}}),t(n,Object.assign({style:{marginLeft:8}},{children:"Prevent BackTracking"}))]})),g&&t("div",Object.assign({style:{margin:10}},{children:t(s,{placeholder:"Enter your text here",labelText:"Message if user tries backtracking",onChangeText:e=>{l&&l(e)},height:"120px",value:o,noErrorHint:!0,validate:e=>[!0,""]})}))]})};export{c as BackTrackComponent};

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

@@ -1,17 +1,17 @@
-import{jsxs as e,jsx as t,Fragment as o}from"react/jsx-runtime";import{useRef as n}from"react";import l from"styled-components";import{CHANNEL_TYPE as i}from"../../template-preview/models/Channels.js";import{COLORS as a}from"../../../constants/Theme.js";import{useTemplateModalContext as r}from"../context/templateModalContext.js";import{getVariableNameForEmailByIndex as s}from"../utils/getVariableNameEmail.js";import{highlightFor as p}from"../utils/highlightFor.js";import d from"./DesktopPreview.js";import m from"./EditWhatsAppTemplateV2.js";import c from"./MobilePreview.js";import h from"./VariableConnectorsPanel.js";const u=l.div`
+import{jsxs as e,jsx as t,Fragment as o}from"react/jsx-runtime";import{useRef as n}from"react";import i from"styled-components";import{CHANNEL_TYPE as l}from"../../template-preview/models/Channels.js";import{COLORS as a}from"../../../constants/Theme.js";import{useTemplateModalContext as r}from"../context/templateModalContext.js";import{getVariableNameForEmailByIndex as s}from"../utils/getVariableNameEmail.js";import{highlightFor as d}from"../utils/highlightFor.js";import p from"./DesktopPreview.js";import m from"./EditWhatsAppTemplateV2.js";import c from"./MobilePreview.js";import u from"./VariableConnectorsPanel.js";const h=i.div`
 	display: flex;
 	//	height: 100%;
-`,f=l.div`
+`,f=i.div`
 	padding: 16px 14px;
 	max-width: 350px;
 
-	height: ${e=>e.channel===i.WHATSAPP?"500px":"475px"};
+	height: ${e=>e.channel===l.WHATSAPP?"500px":"475px"};
 	overflow-y: 'auto';
 	padding-bottom: 24px;
 	border-left: ${a.stroke.primary} 1px solid;
-`,v=l.div`
+`,v=i.div`
 	padding: ${e=>e.showOnlyContent?"16px 14px":"16px 32px"};
 	flex: 1;
 	height: 475px;
 	overflow-y: auto;
-`,g=l=>{const{showVariableMapping:g,showOnlyContent:b,whatsappSpecificPickerMeta:w,showVariableModal:x,variableList:y,discountCode:j,setDiscountCode:M,variableListForImage:C}=l,P=n(),E=n(),{device:T,display_content:k,channel:A,template:L,setTemplate:V}=r();const I=e=>{let t=0;for(;e;)t+=e.offsetTop,e=e.offsetParent;return t};return e(u,{children:[t(v,Object.assign({showOnlyContent:b,showVariableMapping:g},{children:"mobile"===T?t(c,{ref:E,display_content:null!=k?k:"",channel:A,template:L}):A!==i.MESSAGE?t(d,{ref:P,channel:A,display_content:null!=k?k:""}):t(o,{})})),g&&t(f,Object.assign({channel:A},{children:A!==i.WHATSAPP?t(h,{onFocus:A===i.EMAIL?function(e){var t,o,n;const l=null===document||void 0===document?void 0:document.getElementById("mobile"===T?"template_html_mobile":"template_html_desktop"),r=s(e+1),d=A===i.EMAIL?null===(t=null==l?void 0:l.contentWindow)||void 0===t?void 0:t.document.getElementById(r):document.getElementById(r),m=I(d),c=null==d?void 0:d.offsetLeft;"desktop"===T?m&&P.current&&(null===(o=null==l?void 0:l.contentWindow)||void 0===o||o.scrollTo(null!=c?c:0,m),p(r,a.background.warning.light,2,A,T)):m&&E.current&&(null===(n=null==l?void 0:l.contentWindow)||void 0===n||n.scrollTo(null!=c?c:0,m),p(r,a.background.warning.light,2,A,T))}:void 0,showVariableModal:x,variableList:y,discountCode:j,setDiscountCode:M}):t(m,{whatsappSpecificPickerMeta:w,template:L,onTemplateChange:e=>{null==V||V(e)},showVariableModal:x,variableList:y,variableListForImage:C})}))]})};export{g as default};
+`,g=i=>{const{showVariableMapping:g,showOnlyContent:b,whatsappSpecificPickerMeta:w,showVariableModal:x,variableList:y,discountCode:C,setDiscountCode:j,variableListForImage:M}=i,P=n(),E=n(),{device:T,display_content:k,channel:A,template:L,setTemplate:V}=r();const I=e=>{let t=0;for(;e;)t+=e.offsetTop,e=e.offsetParent;return t};return e(h,{children:[t(v,Object.assign({showOnlyContent:b,showVariableMapping:g},{children:"mobile"===T?t(c,{ref:E,display_content:null!=k?k:"",channel:A,template:L}):A!==l.MESSAGE?t(p,{ref:P,channel:A,display_content:null!=k?k:""}):t(o,{})})),g&&t(f,Object.assign({channel:A},{children:A!==l.WHATSAPP?t(u,{onFocus:A===l.EMAIL?function(e){var t,o,n;const i=null===document||void 0===document?void 0:document.getElementById("mobile"===T?"template_html_mobile":"template_html_desktop"),r=s(e+1),p=A===l.EMAIL?null===(t=null==i?void 0:i.contentWindow)||void 0===t?void 0:t.document.getElementById(r):document.getElementById(r),m=I(p),c=null==p?void 0:p.offsetLeft;"desktop"===T?m&&P.current&&(null===(o=null==i?void 0:i.contentWindow)||void 0===o||o.scrollTo(null!=c?c:0,m),d(r,a.background.warning.light,2,A,T)):m&&E.current&&(null===(n=null==i?void 0:i.contentWindow)||void 0===n||n.scrollTo(null!=c?c:0,m),d(r,a.background.warning.light,2,A,T))}:void 0,showVariableModal:x,variableList:y,discountCode:C,setDiscountCode:j}):t(m,{whatsappSpecificPickerMeta:w,template:L,onTemplateChange:e=>{null==V||V(e)},showVariableModal:x,variableList:y,variableListForImage:M,discountCode:C,setDiscountCode:j})}))]})};export{g as default};

package/dist/esm/components/template-context-mapper/modalElements/DiscountCodeComponent.d.ts

@@ -0,0 +1,6 @@
+import { VariableListInterfaceV2 } from "../../add-variableV2";
+export declare const DiscountCodeComponent: (props: {
+    discountCode?: string | undefined;
+    setDiscountCode?: ((code: string) => void) | undefined;
+    variableList?: VariableListInterfaceV2[] | undefined;
+}) => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1 @@
+import{jsxs as e,Fragment as t,jsx as i}from"react/jsx-runtime";import o from"../../../assets/icons/PlusIcon.js";import{useState as r,useRef as a,useEffect as s}from"react";import{AddVariableV2SideModal as n}from"../../add-variableV2/AddVariableV2SideModal.js";import"../../../_virtual/_tslib.js";import"../../add-variableV2/AddVariableV2.styled.js";import"../../button/Button.js";import"../../icon-button/IconButton.js";import{Input as l}from"../../input/Input.js";import"@tippyjs/react";import"../../tooltips/TooltipInternal.js";import"../../../constants/Theme.js";import"../../switch/Switch.js";import{TitleSmall as d}from"../../TypographyStyle.js";import{CheckBox as c}from"../../checkBox/CheckBox.js";import{AddVariableStyled as m}from"./VariableConnectorsPanel.js";const p=p=>{const{discountCode:u,setDiscountCode:h,variableList:b}=p,[j,g]=r(""),[v,V]=r(!1),[f,y]=r(!1),[C,x]=r(!1),w=a(),T=a();return s((()=>{console.log("vj: setDiscountCode",h,j),h&&h(u+j)}),[j]),e(t,{children:[e("div",Object.assign({style:{display:"flex",flexDirection:"row",marginLeft:10,marginTop:8}},{children:[i(c,{isChecked:v,onValueChange:()=>{v&&h&&h(""),V(!v)}}),i(d,Object.assign({style:{marginLeft:8}},{children:"Add discount code"}))]})),v&&e("div",Object.assign({ref:w,style:{margin:10}},{children:[i(l,{placeholder:"Enter your discount code",onChangeText:e=>{h&&h(e)},value:u,onFocus:()=>{y(!0)},onBlur:e=>{var t;"addVar"===(null===(t=e.relatedTarget)||void 0===t?void 0:t.id)?(w.current&&w.current.focus(),y(!0)):(y(!1),x(!1))},noErrorHint:!0,validate:e=>[!0,""]}),f&&i(m,Object.assign({ref:T,id:"addVar",onClick:e=>{e.stopPropagation(),x(!0)}},{children:e("div",Object.assign({className:"add"},{children:[i(o,{width:20,height:20,color:"white"}),i("div",Object.assign({className:"variable"},{children:"Add variable"}))]}))}))]})),C&&i(n,{zIndex:2e3,data:null!=b?b:[],showVariable:C,setShowVariable:x,variableValue:j,setVariableValue:g,placeholder:"Add a variable",customTrigger:e=>{g(e.actualValue),y(!1)}})]})};export{p as DiscountCodeComponent};

package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppTemplateMediaV2.js

@@ -1 +1 @@
-import{__awaiter as e}from"../../../_virtual/_tslib.js";import{jsxs as t,Fragment as o,jsx as i}from"react/jsx-runtime";import n,{useState as a}from"react";import{FileUploaderHelper as r}from"../../helpers/FileUploaderHelper.js";import{BikImageCropper as l}from"../../image-cropper/BikImageCropper.js";import"../../image-compress/ImageCompress.js";import"../../states/StateComponent.js";import"../../../constants/zindex.js";import"../../modals/styledModal.js";import"../../spinner/Spinner.js";import{HEADER_TYPES as s}from"../../template-preview/models/TemplateMeta.js";import{useTemplateModalContext as p}from"../context/templateModalContext.js";import d from"./EditMediaModal.js";import m from"./EditMediaV2.js";const c=c=>{let{mediaComponent:f,template:u,updateTemplateImageUrl:v,whatsappSpecificPickerMeta:g,variableListForImage:h}=c;var j,b,M;const{disableEditVariable:E}=p(),[y,I]=a(void 0),[C,O]=a(),[A,k]=a(),[w,x]=a(!1),T=n.createRef(),[F,R]=a(!1),[U,L]=a(""),{template:N,setTemplate:D}=p();let G;function V(){var e;(null===(e=null==T?void 0:T.current)||void 0===e?void 0:e.click)&&T.current.click()}function _(t){var o;return e(this,void 0,void 0,(function*(){const e=new r;if(t instanceof Blob){const i=e.validate(t);if(i)L(i),R(!1);else{const e=f.format===s.IMAGE,i=yield g.uploadMediaFiles({file:t,fileName:y,isImage:e});if(i.success){const[e]=t.type.split("/");v(null!==(o=i.url)&&void 0!==o?o:"","application"===e?s.DOCUMENT:s[e.toUpperCase()])}else L("An unknown technical error occured");R(!1)}}else L("An unknown technical error occured"),R(!1)}))}return console.log("vj: ignore",E),G=f.format===s.IMAGE?"image/png, image/jpeg":f.format===s.VIDEO?"video/mp4":"application/pdf",t(o,{children:[i(d,{mediaComponentFormat:null!==(j=f.format)&&void 0!==j?j:s.IMAGE,uploadMedia:function(t){var o;return e(this,void 0,void 0,(function*(){if(L(""),k(""),x(!1),t)if(t.startsWith("https"))try{R(!0);const e=yield fetch(t),o=yield e.blob();yield _(o)}catch(e){L("An unknown technical error occurred")}else if(/^{{.*}}$/.test(t)){k(t);const e=Object.assign({},N);if(e.components){const t=null===(o=null==e?void 0:e.components)||void 0===o?void 0:o.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==t&&t>-1&&(null==e?void 0:e.components[t])){const o=Object.assign(Object.assign({},e.components[t]),{format:f.format,example:{header_handle:["https://jkfenner.com/wp-content/uploads/2019/11/default.jpg"]}}),i=[...e.components];i[t]=o,e.components=i}}e.mapping&&(e.mapping=Object.assign(Object.assign({},e.mapping),{header:[t]})),R(!1),null==D||D(Object.assign({},e))}else R(!1),L("Invalid URL or variable");else V()}))},variableListForImage:h||[],setOpenEditMedia:x,openEditMedia:w}),!!C&&i(l,{aspectRatio:15/8,src:C,onCropComplete:function(t){return e(this,void 0,void 0,(function*(){R(!1),L("");const e=yield fetch(t);_(yield e.blob()).then((()=>{O(void 0)}))}))},onCancel:()=>{R(!1),O("")}}),i("input",{ref:T,style:{display:"none"},type:"file",onChange:function(e){var t;L(""),R(!0);const o=null===(t=e.target.files)||void 0===t?void 0:t[0];if(f.format===s.IMAGE){const e=new FileReader;O(""),I(""),e.onload=()=>{O(e.result),I(null==o?void 0:o.name)},o&&e.readAsDataURL(o)}else _(o)},accept:G}),i(m,{imageName:null!==(M=null===(b=null==f?void 0:f.example)||void 0===b?void 0:b.header_handle)&&void 0!==M?M:[],handleImageChange:V,mediaType:null==f?void 0:f.format,error:U,isLoading:F,setOpenEditMedia:x,selectedVariable:A})]})};export{c as default};
+import{__awaiter as e}from"../../../_virtual/_tslib.js";import{jsxs as t,Fragment as o,jsx as i}from"react/jsx-runtime";import n,{useState as a}from"react";import{FileUploaderHelper as r}from"../../helpers/FileUploaderHelper.js";import{BikImageCropper as l}from"../../image-cropper/BikImageCropper.js";import"../../image-compress/ImageCompress.js";import"../../states/StateComponent.js";import"../../../constants/zindex.js";import"../../modals/styledModal.js";import"../../spinner/Spinner.js";import{HEADER_TYPES as s}from"../../template-preview/models/TemplateMeta.js";import{useTemplateModalContext as p}from"../context/templateModalContext.js";import d from"./EditMediaModal.js";import m from"./EditMediaV2.js";const c=c=>{let{mediaComponent:f,template:u,updateTemplateImageUrl:v,whatsappSpecificPickerMeta:g,variableListForImage:h}=c;var j,b,M;const{disableEditVariable:E}=p(),[y,I]=a(void 0),[C,O]=a(),[A,k]=a(),[w,x]=a(!1),T=n.createRef(),[F,R]=a(!1),[U,L]=a(""),{template:N,setTemplate:D}=p();let G;function V(){var e;(null===(e=null==T?void 0:T.current)||void 0===e?void 0:e.click)&&T.current.click()}function _(t){var o;return e(this,void 0,void 0,(function*(){const e=new r;if(t instanceof Blob){const i=e.validate(t);if(i)L(i),R(!1);else{const e=f.format===s.IMAGE,i=yield g.uploadMediaFiles({file:t,fileName:y,isImage:e});if(i.success){const[e]=t.type.split("/");v(null!==(o=i.url)&&void 0!==o?o:"","application"===e?s.DOCUMENT:s[e.toUpperCase()])}else L("An unknown technical error occured");R(!1)}}else L("An unknown technical error occured"),R(!1)}))}return console.log("ignore: ",E),G=f.format===s.IMAGE?"image/png, image/jpeg":f.format===s.VIDEO?"video/mp4":"application/pdf",t(o,{children:[i(d,{mediaComponentFormat:null!==(j=f.format)&&void 0!==j?j:s.IMAGE,uploadMedia:function(t){var o;return e(this,void 0,void 0,(function*(){if(L(""),k(""),x(!1),t)if(t.startsWith("https"))try{R(!0);const e=yield fetch(t),o=yield e.blob();yield _(o)}catch(e){L("An unknown technical error occurred")}else if(/^{{.*}}$/.test(t)){k(t);const e=Object.assign({},N);if(e.components){const t=null===(o=null==e?void 0:e.components)||void 0===o?void 0:o.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==t&&t>-1&&(null==e?void 0:e.components[t])){const o=Object.assign(Object.assign({},e.components[t]),{format:f.format,example:{header_handle:["https://jkfenner.com/wp-content/uploads/2019/11/default.jpg"]}}),i=[...e.components];i[t]=o,e.components=i}}e.mapping&&(e.mapping=Object.assign(Object.assign({},e.mapping),{header:[t]})),R(!1),null==D||D(Object.assign({},e))}else R(!1),L("Invalid URL or variable");else V()}))},variableListForImage:h||[],setOpenEditMedia:x,openEditMedia:w}),!!C&&i(l,{aspectRatio:15/8,src:C,onCropComplete:function(t){return e(this,void 0,void 0,(function*(){R(!1),L("");const e=yield fetch(t);_(yield e.blob()).then((()=>{O(void 0)}))}))},onCancel:()=>{R(!1),O("")}}),i("input",{ref:T,style:{display:"none"},type:"file",onChange:function(e){var t;L(""),R(!0);const o=null===(t=e.target.files)||void 0===t?void 0:t[0];if(f.format===s.IMAGE){const e=new FileReader;O(""),I(""),e.onload=()=>{O(e.result),I(null==o?void 0:o.name)},o&&e.readAsDataURL(o)}else _(o)},accept:G}),i(m,{imageName:null!==(M=null===(b=null==f?void 0:f.example)||void 0===b?void 0:b.header_handle)&&void 0!==M?M:[],handleImageChange:V,mediaType:null==f?void 0:f.format,error:U,isLoading:F,setOpenEditMedia:x,selectedVariable:A})]})};export{c as default};

package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.d.ts

@@ -9,6 +9,8 @@ export interface EditWhatsAppTemplateV2Props {
     showVariableModal?: boolean;
     variableList?: VariableListInterfaceV2[];
     variableListForImage?: VariableListInterfaceV2[];
+    discountCode?: string;
+    setDiscountCode?: (code: string) => void;
 }
-declare const EditWhatsAppTemplateV2: ({ template, onTemplateChange, whatsappSpecificPickerMeta, showVariableModal, variableList, variableListForImage, }: EditWhatsAppTemplateV2Props) => import("react/jsx-runtime").JSX.Element;
+declare const EditWhatsAppTemplateV2: ({ template, onTemplateChange, whatsappSpecificPickerMeta, showVariableModal, variableList, variableListForImage, discountCode, setDiscountCode, }: EditWhatsAppTemplateV2Props) => import("react/jsx-runtime").JSX.Element;
 export default EditWhatsAppTemplateV2;

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

@@ -1 +1 @@
-import{jsxs as t,jsx as e}from"react/jsx-runtime";import{useTemplateModalContext as o}from"../context/templateModalContext.js";import{getAllDataFromTemplateComponent as n}from"../utils/getDataFromTemplateComponent.js";import{EditTemplateMediaContainer as i}from"./EditMediaV2.style.js";import a from"./EditWhatsAppTemplateMediaV2.js";import{Container as l}from"./VariableConnectorsPanel.js";import s from"./VariableConnectorWhatsApp.js";import d from"./VariableEditorHeader.js";import p from"./WhatsAppTemplateCardButtonV2.js";const r=r=>{let{template:c,onTemplateChange:m,whatsappSpecificPickerMeta:u,showVariableModal:b,variableList:v,variableListForImage:g}=r;var h,f,j,T,O,x,y,E,V,C,w,I;const{originalVariableList:L}=o(),{descriptionComponents:B,urlBtns:R,qrbBtns:A,imageComponent:M,bodyVariables:U,headerVariables:S}=n(c);function k(t,e){var o,n,i,a;const l=Object.assign({},c),s=null==l?void 0:l.components.findIndex((t=>"BUTTONS"===t.type));if(void 0!==s&&s>-1){const d=null===(o=null==l?void 0:l.components[s].buttons)||void 0===o?void 0:o.findIndex((t=>"URL"===t.type));if(void 0!==d&&d>-1){const o="custom"===e&&"string"==typeof t,p=[...null!==(a=null===(i=null===(n=l.components)||void 0===n?void 0:n[s])||void 0===i?void 0:i.buttons)&&void 0!==a?a:[]];p[d]=Object.assign(Object.assign({},p[d]),{url:"https://d.bik.ai/{{1}}",example:[o?t:"string"!=typeof t?t.defaultValue:""]});const r=Object.assign(Object.assign({},l.components[s]),{buttons:p}),c=Object.assign(Object.assign({},l.mapping),{buttons:o?["((customBtnPlaceholder))"]:"string"!=typeof t?[t.placeHolder]:void 0});l.mapping=c;const m=[...l.components];m[s]=r,l.components=m}}null==m||m(l)}function N(t,e,o){var n;const i=Object.assign({},c),a=null==i?void 0:i.components.findIndex((t=>"BUTTONS"===t.type));if(void 0!==a&&a>-1){const e=null===(n=null==i?void 0:i.components[a].buttons)||void 0===n?void 0:n.filter((t=>"QUICK_REPLY"===t.type));e&&(e[o]=Object.assign(Object.assign({},e[o]),{flowId:t.flowId,flowName:t.flowName}));const l=Object.assign(Object.assign({},i.components[a]),{buttons:e}),s=[...i.components];s[a]=l,i.components=s}null==m||m(i)}return t(l,Object.assign({style:{flexDirection:"column",maxHeight:460}},{children:[!!M&&e(i,{children:e(a,{whatsappSpecificPickerMeta:u,mediaComponent:M,updateTemplateImageUrl:function(t,e){var o;let n=Object.assign({},c);const i=null===(o=null==n?void 0:n.components)||void 0===o?void 0:o.findIndex((t=>{if("HEADER"===t.type&&"NONE"!==t.format&&"TEXT"!==t.format)return!0}));if(void 0!==i&&i>-1&&(null==n?void 0:n.components[i])){const o=Object.assign(Object.assign({},n.components[i]),{format:e,example:{header_handle:[t]}}),a=[...n.components];a[i]=o,n=Object.assign(Object.assign({},n),{components:a})}n.mapping&&(n.mapping=Object.assign(Object.assign({},n.mapping),{header:void 0})),null==m||m(Object.assign({},n))},template:c,variableListForImage:g})}),(U.length>0||S.length>0)&&e(d,{containerStyle:{paddingTop:M?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==B?void 0:B.map(((t,o)=>e(s,{originalVariableList:L,type:t.type,descriptionComponent:t.component,variableMapping:"HEADER"===t.type?c.mapping.header:c.mapping.body,showVariableModal:b,variableList:v},o))),(null===(f=null===(h=R[0])||void 0===h?void 0:h.component)||void 0===f?void 0:f.buttons)&&(null===(O=null===(T=null===(j=R[0])||void 0===j?void 0:j.component)||void 0===T?void 0:T.buttons)||void 0===O?void 0:O.length)>0&&e(d,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(x=null==L?void 0:L.buttons)||void 0===x?void 0:x.map(((t,o)=>{if("URL"===t.type)return e(p,{CTAoptions:null==u?void 0:u.CTAoptions,button:t,originalVariableList:L,updateSelectedURLTemplateBtn:k},`${o}`)})),(null===(E=null===(y=A[0])||void 0===y?void 0:y.component)||void 0===E?void 0:E.buttons)&&(null===(w=null===(C=null===(V=A[0])||void 0===V?void 0:V.component)||void 0===C?void 0:C.buttons)||void 0===w?void 0:w.length)>0&&e(d,{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"}),null===(I=null==L?void 0:L.buttons)||void 0===I?void 0:I.map(((t,o)=>{if("QUICK_REPLY"===t.type)return e(p,{QRBoptions:null==u?void 0:u.QRBoptions,button:t,originalVariableList:L,updateSelectedQRBTemplateBtn:N},`${o}`)}))]}))};export{r as default};
+import{jsxs as t,jsx as o}from"react/jsx-runtime";import{useState as e}from"react";import{useTemplateModalContext as n}from"../context/templateModalContext.js";import{getAllDataFromTemplateComponent as i}from"../utils/getDataFromTemplateComponent.js";import{BackTrackComponent as a}from"./BackTrackComponent.js";import{DiscountCodeComponent as l}from"./DiscountCodeComponent.js";import{EditTemplateMediaContainer as s}from"./EditMediaV2.style.js";import d from"./EditWhatsAppTemplateMediaV2.js";import{Container as r}from"./VariableConnectorsPanel.js";import p from"./VariableConnectorWhatsApp.js";import c from"./VariableEditorHeader.js";import u from"./WhatsAppTemplateCardButtonV2.js";const m=m=>{let{template:v,onTemplateChange:b,whatsappSpecificPickerMeta:g,showVariableModal:h,variableList:f,variableListForImage:T,discountCode:j,setDiscountCode:C}=m;var O,x,E,y,k,V,B,w,L,I,A,M,R,U,H,D;const{originalVariableList:S,pod:N,extras:P}=n(),{descriptionComponents:Q,urlBtns:F,qrbBtns:W,imageComponent:_,bodyVariables:K,headerVariables:Y}=i(v),[$,q]=e(!1);function X(t,o){var e,n,i,a,l;const s=Object.assign({},v),d=null==s?void 0:s.components.findIndex((t=>"BUTTONS"===t.type));if(void 0!==d&&d>-1){const l=null===(e=null==s?void 0:s.components[d].buttons)||void 0===e?void 0:e.findIndex((t=>"URL"===t.type));if(void 0!==l&&l>-1){const e="custom"===o&&"string"==typeof t,r=[...null!==(a=null===(i=null===(n=s.components)||void 0===n?void 0:n[d])||void 0===i?void 0:i.buttons)&&void 0!==a?a:[]];r[l]=Object.assign(Object.assign({},r[l]),{url:"https://d.bik.ai/{{1}}",example:[e?t:"string"!=typeof t?t.defaultValue:""]});const p=Object.assign(Object.assign({},s.components[d]),{buttons:r}),c=Object.assign(Object.assign({},s.mapping),{buttons:e?["((customBtnPlaceholder))"]:"string"!=typeof t?[t.placeHolder]:void 0});s.mapping=c;const u=[...s.components];u[d]=p,s.components=u}}"string"!=typeof t&&q("checkout.Url"===(null===(l=t.placeHolder)||void 0===l?void 0:l.slice(2,-2))),null==b||b(s)}function z(t,o,e){var n;const i=Object.assign({},v),a=null==i?void 0:i.components.findIndex((t=>"BUTTONS"===t.type));if(void 0!==a&&a>-1){const o=null===(n=null==i?void 0:i.components[a].buttons)||void 0===n?void 0:n.filter((t=>"QUICK_REPLY"===t.type));o&&(o[e]=Object.assign(Object.assign({},o[e]),{flowId:t.flowId,flowName:t.flowName}));const l=Object.assign(Object.assign({},i.components[a]),{buttons:o}),s=[...i.components];s[a]=l,i.components=s}null==b||b(i)}return t(r,Object.assign({style:{flexDirection:"column",maxHeight:460}},{children:[!!_&&o(s,{children:o(d,{whatsappSpecificPickerMeta:g,mediaComponent:_,updateTemplateImageUrl:function(t,o){var e;let n=Object.assign({},v);const i=null===(e=null==n?void 0:n.components)||void 0===e?void 0:e.findIndex((t=>{if("HEADER"===t.type&&"NONE"!==t.format&&"TEXT"!==t.format)return!0}));if(void 0!==i&&i>-1&&(null==n?void 0:n.components[i])){const e=Object.assign(Object.assign({},n.components[i]),{format:o,example:{header_handle:[t]}}),a=[...n.components];a[i]=e,n=Object.assign(Object.assign({},n),{components:a})}n.mapping&&(n.mapping=Object.assign(Object.assign({},n.mapping),{header:void 0})),null==b||b(Object.assign({},n))},template:v,variableListForImage:T})}),(K.length>0||Y.length>0)&&o(c,{containerStyle:{paddingTop:_?24:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}),null==Q?void 0:Q.map(((t,e)=>o(p,{originalVariableList:S,type:t.type,descriptionComponent:t.component,variableMapping:"HEADER"===t.type?v.mapping.header:v.mapping.body,showVariableModal:h,variableList:f},e))),(null===(x=null===(O=F[0])||void 0===O?void 0:O.component)||void 0===x?void 0:x.buttons)&&(null===(k=null===(y=null===(E=F[0])||void 0===E?void 0:E.component)||void 0===y?void 0:y.buttons)||void 0===k?void 0:k.length)>0&&o(c,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(V=null==S?void 0:S.buttons)||void 0===V?void 0:V.map(((t,e)=>{if("URL"===t.type)return o(u,{CTAoptions:null==g?void 0:g.CTAoptions,button:t,originalVariableList:S,updateSelectedURLTemplateBtn:X},`${e}`)})),(null===(w=null===(B=W[0])||void 0===B?void 0:B.component)||void 0===w?void 0:w.buttons)&&(null===(A=null===(I=null===(L=W[0])||void 0===L?void 0:L.component)||void 0===I?void 0:I.buttons)||void 0===A?void 0:A.length)>0&&("CHATBOT"!==N?o(c,{headerText:"Edit buttons",subText:"Edit the chatflows triggered on clicking  the buttons",toolTipInfo:"There is an option to trigger chatflows through the buttons which can keep the user engaged"}):o(a,{backTrackMessage:null===(M=null==P?void 0:P.backTrackExtra)||void 0===M?void 0:M[0],setBackTrackMessage:null===(R=null==P?void 0:P.backTrackExtra)||void 0===R?void 0:R[1]})),null===(U=null==S?void 0:S.buttons)||void 0===U?void 0:U.map(((t,e)=>{if("QUICK_REPLY"===t.type)return o(u,{QRBoptions:null==g?void 0:g.QRBoptions,button:t,originalVariableList:S,updateSelectedQRBTemplateBtn:z},`${e}`)})),"CHATBOT"===N&&$&&o(l,{discountCode:null===(H=null==P?void 0:P.discountCodeExtra)||void 0===H?void 0:H[0],setDiscountCode:null===(D=null==P?void 0:P.discountCodeExtra)||void 0===D?void 0:D[1],variableList:f})]}))};export{m as default};

package/dist/esm/components/template-preview/models/WhatsAppTemplate.d.ts

@@ -226,3 +226,13 @@ export declare enum BUTTON_TYPE {
     URL = "URL",
     PHONE_NUMBER = "PHONE_NUMBER"
 }
+export type Extras = {
+    discountCodeExtra?: [
+        discountCode: string,
+        setDiscountCode: (discountCode: string) => void
+    ];
+    backTrackExtra?: [
+        backTrackMessage: string,
+        setBackTrackMessage: (backTrackMessage: string) => void
+    ];
+};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bikdotai/bik-component-library",
-	"version": "0.0.388-beta.4",
+	"version": "0.0.388-beta.6",
 	"description": "Bik Component Library",
 	"repository": {
 		"type": "git",