@bikdotai/bik-component-library 0.0.11345610-beta.1 → 0.1.0-analytics-chips-beta

package/dist/cjs/components/tag/Tag.styled.js

@@ -1 +1,26 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var c=require("@emotion/styled/base"),e=require("./themes.js");function l(c){return c&&"object"==typeof c&&"default"in c?c:{default:c}}const t=l(c).default("div","production"===process.env.NODE_ENV?{target:"e930jd90"}:{target:"e930jd90",label:"Tag"})("cursor:",(c=>{var e;return null!==(e=c.cursor)&&void 0!==e?e:"default"}),";",(c=>"regular"===c.variant?"display: block;\n\t\t     min-height: 26px;\n\t\t":"min-height: 20px;")," .container{display:flex;align-items:center;gap:6px;padding:",(c=>e.getPadding(c.variant)),";background-color:",(c=>e.getBackgroundColor(c.theme,c.type)),";border-radius:",(c=>"regular"===c.variant?"4px":"12px"),";",(c=>"light"===c.theme&&`border: ${"2.0"===c.version?.5:1}px solid ${e.generateBorder(c.type)};`)," .text{color:",(c=>e.getTextColor(c.theme,c.type)),";}.icon-trailing{all:unset;display:flex;}.icon-leading{all:unset;display:flex;}}"+("production"===process.env.NODE_ENV?"":"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRhZy5zdHlsZWQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUU4QiIsImZpbGUiOiJUYWcuc3R5bGVkLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcclxuaW1wb3J0IHsgZ2VuZXJhdGVCb3JkZXIsIGdldEJhY2tncm91bmRDb2xvciwgZ2V0UGFkZGluZywgZ2V0VGV4dENvbG9yLCB9IGZyb20gJy4vdGhlbWVzJztcclxuZXhwb3J0IGNvbnN0IFRhZyA9IHN0eWxlZC5kaXYgYFxuXHRjdXJzb3I6ICR7KHByb3BzKSA9PiB7IHZhciBfYTsgcmV0dXJuIChfYSA9IHByb3BzLmN1cnNvcikgIT09IG51bGwgJiYgX2EgIT09IHZvaWQgMCA/IF9hIDogJ2RlZmF1bHQnOyB9fTtcblx0JHsocHJvcHMpID0+IHByb3BzLnZhcmlhbnQgPT09ICdyZWd1bGFyJ1xyXG4gICAgPyBgZGlzcGxheTogYmxvY2s7XG5cdFx0ICAgICBtaW4taGVpZ2h0OiAyNnB4O1xuXHRcdGBcclxuICAgIDogYG1pbi1oZWlnaHQ6IDIwcHg7YH1cblx0LmNvbnRhaW5lciB7XG5cdFx0ZGlzcGxheTogZmxleDtcblx0XHRhbGlnbi1pdGVtczogY2VudGVyO1xuXHRcdGdhcDogNnB4O1xuXHRcdHBhZGRpbmc6ICR7KHByb3BzKSA9PiBnZXRQYWRkaW5nKHByb3BzLnZhcmlhbnQpfTtcblxuXHRcdGJhY2tncm91bmQtY29sb3I6ICR7KHByb3BzKSA9PiBnZXRCYWNrZ3JvdW5kQ29sb3IocHJvcHMudGhlbWUsIHByb3BzLnR5cGUpfTtcblxuXHRcdGJvcmRlci1yYWRpdXM6ICR7KHByb3BzKSA9PiAocHJvcHMudmFyaWFudCA9PT0gJ3JlZ3VsYXInID8gJzRweCcgOiAnMTJweCcpfTtcblxuXHRcdCR7KHByb3BzKSA9PiBwcm9wcy50aGVtZSA9PT0gJ2xpZ2h0JyAmJlxyXG4gICAgYGJvcmRlcjogJHtwcm9wcy52ZXJzaW9uID09PSAnMi4wJyA/IDAuNSA6IDF9cHggc29saWQgJHtnZW5lcmF0ZUJvcmRlcihwcm9wcy50eXBlKX07YH1cblxuXHRcdC50ZXh0IHtcblx0XHRcdGNvbG9yOiAkeyhwcm9wcykgPT4gZ2V0VGV4dENvbG9yKHByb3BzLnRoZW1lLCBwcm9wcy50eXBlKX07XG5cdFx0fVxuXG5cdFx0Lmljb24tdHJhaWxpbmcge1xuXHRcdFx0YWxsOiB1bnNldDtcblx0XHRcdGRpc3BsYXk6IGZsZXg7XG5cdFx0fVxuXG5cdFx0Lmljb24tbGVhZGluZyB7XG5cdFx0XHRhbGw6IHVuc2V0O1xuXHRcdFx0ZGlzcGxheTogZmxleDtcblx0XHR9XG5cdH1cbmA7XHJcbi8vIyBzb3VyY2VNYXBwaW5nVVJMPVRhZy5zdHlsZWQuanMubWFwIl19 */"));exports.Tag=t;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),r=require("./themes.js");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const a=t(e).default.div`
+	cursor: default;
+	${e=>"regular"===e.variant?"display: block;":""}
+	${e=>"circle"===e.variant&&"height: 20px;"}
+	.container {
+		display: flex;
+		gap: 6px;
+		padding: ${e=>r.getPadding(e.variant)};
+
+		background-color: ${e=>r.getBackgroundColor(e.theme,e.type)};
+
+		border-radius: ${e=>"regular"===e.variant?"4px":"12px"};
+
+		${e=>"light"===e.theme&&`border: 1px solid ${r.generateBorder(e.type)};`}
+
+		.text {
+			color: ${e=>r.getTextColor(e.theme,e.type)};
+		}
+
+		.icon-trailing {
+		}
+
+		.icon-leading {
+		}
+	}
+`;exports.Tag=a;

package/dist/cjs/components/tag/model.d.ts

@@ -1,5 +1,4 @@
-import React from 'react';
-import { MouseEventHandler } from 'react';
+/// <reference types="react" />
 export type TagTheme = 'light' | 'dark';
 export type TagVariant = 'regular' | 'circle';
 export type TagType = 'negative' | 'warning' | 'positive' | 'neutral' | 'white' | 'purple' | 'blue' | 'grey';
@@ -22,7 +21,7 @@ export declare const ValidTagTypeMap: {
         grey: boolean;
     };
 };
-export interface TagProps extends React.BaseHTMLAttributes<HTMLDivElement> {
+export interface TagProps {
     /**
      * Set the theme of the Tag
      * @default default light
@@ -39,36 +38,16 @@ export interface TagProps extends React.BaseHTMLAttributes<HTMLDivElement> {
      */
     variant?: TagVariant;
     /**
-     * The icon component that is the right of the text
+     * The icon component that is the left of the text
      * Referred to https://ozzie.sh/passing-icons-as-props-in-a-consistent-way-using-react
      * @default undefined
      */
     TrailingIcon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
     /**
-     * The right icon id,
-     * @default trailing-icon
-     */
-    trailingIconId?: string;
-    /**
-     * The left icon on click event, defaults to () => {}
-     */
-    onTrailingIconClicked?: MouseEventHandler<HTMLButtonElement>;
-    /**
-     * The icon component that is to the left of the text
+     * The icon component that is to the right of the text
      * Referred to https://ozzie.sh/passing-icons-as-props-in-a-consistent-way-using-react
      * @default undefined
      */
     LeadingIcon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
-    /**
-     * The right icon on click event, defaults to () => {}
-     */
-    onLeadingIconClicked?: MouseEventHandler<HTMLButtonElement>;
-    /**
-     * The left icon id,
-     * @default leading-icon
-     */
-    leadingIconId?: string;
     tagText: string | number;
-    version?: '1.0' | '2.0';
-    cursor?: string;
 }

package/dist/cjs/components/tag/themes.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=require("../../constants/Theme.js");const e={blue:{iconColor:{light:r.COLORS.content.blue,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.blue,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.blue.lightAlt,backgroundColor:{light:r.COLORS.background.blue.light,dark:r.COLORS.content.blue,circle:r.COLORS.content.blue}},purple:{iconColor:{light:r.COLORS.background.inverseLight,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.background.inverseLight,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.brandLightAlt,backgroundColor:{light:r.COLORS.background.brandLight,dark:r.COLORS.background.inverse,circle:r.COLORS.background.inverse}},negative:{iconColor:{light:r.COLORS.content.negative,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.negative,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.negative.lightAlt,backgroundColor:{light:r.COLORS.background.negative.light,dark:r.COLORS.background.negative.vibrant,circle:r.COLORS.background.negative.vibrant}},positive:{iconColor:{light:r.COLORS.content.positive,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.positive,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.positive.lightAlt,backgroundColor:{light:r.COLORS.background.positive.light,dark:r.COLORS.background.positive.vibrant,circle:r.COLORS.background.positive.vibrant}},warning:{iconColor:{light:r.COLORS.content.warning,dark:r.COLORS.content.primary},textColor:{light:r.COLORS.content.warning,dark:r.COLORS.content.primary},border:r.COLORS.stroke.warning.lightAlt,backgroundColor:{light:r.COLORS.background.warning.light,dark:r.COLORS.background.warning.vibrant,circle:r.COLORS.background.warning.vibrant}},neutral:{iconColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.primary,backgroundColor:{light:r.COLORS.surface.subdued,dark:r.COLORS.background.inverse,circle:r.COLORS.background.inverseLight}},white:{iconColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.primary,backgroundColor:{light:r.COLORS.surface.standard,dark:r.COLORS.background.inverse,circle:r.COLORS.background.inverseLight}},grey:{iconColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.primary,backgroundColor:{light:r.COLORS.surface.subdued,dark:r.COLORS.content.secondary,circle:r.COLORS.content.secondary}}};exports.generateBorder=r=>e[r].border,exports.getBackgroundColor=(r,t)=>e[t].backgroundColor[r],exports.getPadding=r=>"regular"===r?"4px 8px":"2px 6px",exports.getTagIconColor=(r,t)=>e[t].iconColor[r],exports.getTextColor=(r,t)=>e[t].textColor[r];
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=require("../../constants/Theme.js");const e={blue:{iconColor:{light:r.COLORS.content.blue,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.blue,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.blue.lightAlt,backgroundColor:{light:r.COLORS.background.blue.light,dark:r.COLORS.content.blue,circle:r.COLORS.content.blue}},purple:{iconColor:{light:r.COLORS.background.inverseLight,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.background.inverseLight,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.brandLightAlt,backgroundColor:{light:r.COLORS.background.brandLight,dark:r.COLORS.background.inverse,circle:r.COLORS.background.inverse}},negative:{iconColor:{light:r.COLORS.content.negative,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.negative,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.negative.lightAlt,backgroundColor:{light:r.COLORS.background.negative.light,dark:r.COLORS.background.negative.vibrant,circle:r.COLORS.background.negative.vibrant}},positive:{iconColor:{light:r.COLORS.content.positive,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.positive,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.positive.lightAlt,backgroundColor:{light:r.COLORS.background.positive.light,dark:r.COLORS.background.positive.vibrant,circle:r.COLORS.background.positive.vibrant}},warning:{iconColor:{light:r.COLORS.content.warning,dark:r.COLORS.content.primary},textColor:{light:r.COLORS.content.warning,dark:r.COLORS.content.primary},border:r.COLORS.stroke.warning.lightAlt,backgroundColor:{light:r.COLORS.background.warning.light,dark:r.COLORS.background.warning.vibrant,circle:r.COLORS.background.warning.vibrant}},neutral:{iconColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.primary,backgroundColor:{light:r.COLORS.surface.subdued,dark:r.COLORS.background.inverse,circle:r.COLORS.background.inverseLight}},white:{iconColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.primary,backgroundColor:{light:r.COLORS.surface.subdued,dark:r.COLORS.background.inverse,circle:r.COLORS.background.inverseLight}},grey:{iconColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},textColor:{light:r.COLORS.content.secondary,dark:r.COLORS.content.primaryInverse},border:r.COLORS.stroke.primary,backgroundColor:{light:r.COLORS.surface.subdued,dark:r.COLORS.content.secondary,circle:r.COLORS.content.secondary}}};exports.generateBorder=r=>e[r].border,exports.getBackgroundColor=(r,t)=>e[t].backgroundColor[r],exports.getPadding=r=>"regular"===r?"4px 8px":"2px 6px",exports.getTagIconColor=(r,t)=>e[t].iconColor[r],exports.getTextColor=(r,t)=>e[t].textColor[r];

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

@@ -1,5 +1,6 @@
+/// <reference types="react" />
 export declare const BadgeContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
 export interface BadgeProps {
     errorText: string;
 }
-export declare const Badge: (props: BadgeProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Badge: (props: BadgeProps) => JSX.Element;

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

@@ -1,9 +1,9 @@
-import { VariableListInterfaceV2 } from "../add-variableV2/AddVariableV2";
+/// <reference types="react" />
 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 { ExtrasWhatsapp, POD, WhatsAppPickerMeta, WhatsAppTemplate, WhatsAppTemplateVariables } from '../template-preview/models/WhatsAppTemplate';
+import { WhatsAppPickerMeta, WhatsAppTemplate, WhatsAppTemplateVariables } from '../template-preview/models/WhatsAppTemplate';
 export interface TemplateContextMapperProps {
     selectedTemplate: WhatsAppTemplate | EmailTemplateType | SMSTemplateType;
     closeDialog?: () => void;
@@ -11,23 +11,11 @@ export interface TemplateContextMapperProps {
     channel: CHANNEL_TYPE;
     globalPlaceholders: GlobalPlaceholderType;
     /** List of variables being used in this template */
-    templateVariables: CUSTOM_VARIABLE[] | WhatsAppTemplateVariables;
+    templateVariables: CUSTOM_VARIABLE[];
     /** Only for initial-UI-purpose for the modal */
     htmlContent: string;
     showOnlyContent?: boolean;
     onTemplateSelect?(template: EmailTemplateType | SMSTemplateType | WhatsAppTemplate, variables: CUSTOM_VARIABLE[] | WhatsAppTemplateVariables, display_content?: string): string | void;
     whatsappSpecificPickerMeta?: WhatsAppPickerMeta;
-    zIndex?: number;
-    showVariableModal?: boolean;
-    variableList?: VariableListInterfaceV2[];
-    variableListForImage?: VariableListInterfaceV2[];
-    onBackPress?: () => void;
-    discountCode?: string;
-    setDiscountCode?: (code: string) => void;
-    enabledCustomText?: boolean;
-    showSampleValues?: boolean;
-    disableEditVariable?: boolean;
-    pod?: POD;
-    extras?: ExtrasWhatsapp;
 }
-export declare const TemplateContextMapper: ({ selectedTemplate, closeDialog, showVariableMapping, channel, htmlContent, templateVariables, onTemplateSelect, globalPlaceholders, showOnlyContent, whatsappSpecificPickerMeta, zIndex, showVariableModal, variableList, discountCode, setDiscountCode, onBackPress, enabledCustomText, variableListForImage, showSampleValues, disableEditVariable, pod, extras, }: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TemplateContextMapper: ({ selectedTemplate, closeDialog, showVariableMapping, channel, htmlContent, templateVariables, onTemplateSelect, globalPlaceholders, showOnlyContent, whatsappSpecificPickerMeta, }: TemplateContextMapperProps) => 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"),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:u,closeDialog:c,showVariableMapping:p,channel:m,htmlContent:h,templateVariables:b,onTemplateSelect:g,globalPlaceholders:v,showOnlyContent:C,whatsappSpecificPickerMeta:S,zIndex:x,showVariableModal:T,variableList:E,discountCode:j,setDiscountCode:M,onBackPress:P,enabledCustomText:L,variableListForImage:w,showSampleValues:f,disableEditVariable:V,pod:q,extras:y}=d;var A,N;t.useEffect((()=>{_(h)}),[h]);const[I,k]=t.useState(m===s.CHANNEL_TYPE.EMAIL?"desktop":"mobile"),[D,_]=t.useState(h),[H,O]=t.useState(!1),[F,B]=t.useState(u),[Y,z]=t.useState(null!=b?b:[]),[$,U]=t.useState(!1);const W=t.useMemo((()=>n.convertPlaceholdersToBikDropdown(v)),[v]);return e.jsx(i.TemplateModalContext.Provider,Object.assign({value:{template:F,setTemplate:B,device:I,setDevice:k,display_content:D,setDisplayContent:_,originalVariableList:Y,setOriginalVariableList:z,isError:H,setIsError:O,channel:m,globalNormalizedPlaceholders:W,templateSelectionTriggered:$,setTemplateSelectionTriggered:U,enabledCustomText:L,disableEditVariable:V,pod:q,extras:y}},{children:C?e.jsx(r.default,{channel:s.CHANNEL_TYPE.EMAIL,hideHeader:!0}):e.jsxs(a.StyledModal,Object.assign({zIndex:x,centralContainerStyles:{width:m===s.CHANNEL_TYPE.EMAIL&&p?1e3:800},open:!0,onClose:()=>{null==c||c()},headingTitle:null==F?void 0:F.label,headingSubtitle:m===s.CHANNEL_TYPE.WHATSAPP?`${l.default.capitaliseFirstLetterOfString(null!==(A=null==F?void 0:F.category)&&void 0!==A?A:"")} • ${null!==(N=null==F?void 0:F.templateCategory)&&void 0!==N?N:""}`:"",onBackPress:()=>{null==P||P()}},{children:[e.jsx(r.default,{showSampleValues:f,showVariableMapping:p,channel:m,whatsappSpecificPickerMeta:S,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(F,Y,null!=D?D:"");e?O(!!e):U(!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"),r=require("../template-preview/models/Channels.js"),s=require("./context/templateModalContext.js"),i=require("./modalElements/Footer.js"),o=require("./modalElements/TemplateSelectModalContent.js"),n=require("./utils/convertPlaceholdersToBikDropdown.js");exports.TemplateContextMapper=d=>{let{selectedTemplate:c,closeDialog:u,showVariableMapping:p,channel:m,htmlContent:h,templateVariables:j,onTemplateSelect:g,globalPlaceholders:v,showOnlyContent:E,whatsappSpecificPickerMeta:S}=d;var C,M;t.useEffect((()=>{x(h)}),[h]);const[P,T]=t.useState(m===r.CHANNEL_TYPE.EMAIL?"desktop":"mobile"),[b,x]=t.useState(h),[f,L]=t.useState(!1),[q,w]=t.useState(c),[y,A]=t.useState(null!=j?j:[]);const N=t.useMemo((()=>n.convertPlaceholdersToBikDropdown(v)),[v]);return e.jsx(s.TemplateModalContext.Provider,Object.assign({value:{template:q,setTemplate:w,device:P,setDevice:T,display_content:b,setDisplayContent:x,originalVariableList:y,setOriginalVariableList:A,isError:f,setIsError:L,channel:m,globalNormalizedPlaceholders:N}},{children:E?e.jsx(o.default,{channel:r.CHANNEL_TYPE.EMAIL,hideHeader:!0}):e.jsxs(a.StyledModal,Object.assign({centralContainerStyles:{width:m===r.CHANNEL_TYPE.EMAIL&&p?1e3:650},open:!0,onClose:()=>{null==u||u()},headingTitle:null==q?void 0:q.label,headingSubtitle:m===r.CHANNEL_TYPE.WHATSAPP?`${l.default.capitaliseFirstLetterOfString(null!==(C=null==q?void 0:q.category)&&void 0!==C?C:"")} • ${null!==(M=null==q?void 0:q.templateCategory)&&void 0!==M?M:""}`:""},{children:[e.jsx(o.default,{showVariableMapping:p,channel:m,whatsappSpecificPickerMeta:S}),g?e.jsx(i.default,{onSelect:function(){const e=null==g?void 0:g(q,y,null!=b?b:"");e&&L(!!e)}}):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 { ExtrasWhatsapp, WhatsAppTemplate, WhatsAppTemplateVariables } from "../../template-preview/models/WhatsAppTemplate";
+import { WhatsAppTemplate, WhatsAppTemplateVariables } from "../../template-preview/models/WhatsAppTemplate";
 export type DEVICE_TYPES = 'desktop' | 'mobile';
 export declare const TemplateModalContext: React.Context<{
     device: DEVICE_TYPES;
@@ -19,12 +19,6 @@ export declare const TemplateModalContext: React.Context<{
     isError: boolean;
     setIsError?: React.Dispatch<React.SetStateAction<boolean>> | undefined;
     globalNormalizedPlaceholders?: globalNormalizedPlaceholdersType[] | undefined;
-    templateSelectionTriggered: boolean;
-    setTemplateSelectionTriggered?: React.Dispatch<React.SetStateAction<boolean>> | undefined;
-    enabledCustomText?: boolean | undefined;
-    disableEditVariable?: boolean | undefined;
-    pod?: string | undefined;
-    extras?: ExtrasWhatsapp | undefined;
 }>;
 export declare const useTemplateModalContext: () => {
     device: DEVICE_TYPES;
@@ -40,10 +34,4 @@ export declare const useTemplateModalContext: () => {
     isError: boolean;
     setIsError?: React.Dispatch<React.SetStateAction<boolean>> | undefined;
     globalNormalizedPlaceholders?: globalNormalizedPlaceholdersType[] | undefined;
-    templateSelectionTriggered: boolean;
-    setTemplateSelectionTriggered?: React.Dispatch<React.SetStateAction<boolean>> | undefined;
-    enabledCustomText?: boolean | undefined;
-    disableEditVariable?: boolean | undefined;
-    pod?: string | undefined;
-    extras?: ExtrasWhatsapp | undefined;
 };

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("../../template-preview/models/Channels.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const a=l(e).default.createContext({device:"desktop",templateSelectionTriggered:!1,display_content:null,originalVariableList:[],channel:t.CHANNEL_TYPE.EMAIL,template:null,isError:!1,enabledCustomText:!1,disableEditVariable:!1});exports.TemplateModalContext=a,exports.useTemplateModalContext=()=>e.useContext(a);
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("../../template-preview/models/Channels.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const r=l(e).default.createContext({device:"desktop",display_content:null,originalVariableList:[],channel:t.CHANNEL_TYPE.EMAIL,template:null,isError:!1});exports.TemplateModalContext=r,exports.useTemplateModalContext=()=>e.useContext(r);

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

@@ -1,15 +1,9 @@
-import { VariableListInterfaceV2 } from "../../add-variableV2/AddVariableV2";
+/// <reference types="react" />
 import { WhatsAppPickerMeta } from "../../template-preview/models/WhatsAppTemplate";
 export interface BodyProps {
     showVariableMapping: boolean;
     showOnlyContent?: boolean;
     whatsappSpecificPickerMeta?: WhatsAppPickerMeta;
-    showVariableModal?: boolean;
-    variableList?: VariableListInterfaceV2[];
-    variableListForImage?: VariableListInterfaceV2[];
-    discountCode?: string;
-    setDiscountCode?: (code: string) => void;
-    showSampleValues?: boolean;
 }
-declare const Body: (props: BodyProps) => import("react/jsx-runtime").JSX.Element;
+declare const Body: (props: BodyProps) => JSX.Element;
 export default Body;

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

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

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

@@ -3,6 +3,5 @@ import { CHANNEL_TYPE } from "../../template-preview/models/Channels";
 declare const DesktopPreview: React.ForwardRefExoticComponent<{
     display_content: string;
     channel: CHANNEL_TYPE;
-    showSampleValues?: boolean | undefined;
 } & React.RefAttributes<HTMLDivElement>>;
 export default DesktopPreview;

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

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

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

@@ -2,14 +2,11 @@
 import { HEADER_TYPES } from "../../template-preview/models/TemplateMeta";
 export interface EditMediaV2Props {
     imageName: string[];
-    selectedVariable?: string;
     errorSecondaryText?: string;
     error?: string;
     isLoading?: boolean;
     mediaType?: HEADER_TYPES;
     handleImageChange?: () => void;
-    disableEditVariable?: boolean;
-    setOpenEditMedia?: React.Dispatch<React.SetStateAction<boolean>>;
 }
-declare const EditMediaV2: (props: EditMediaV2Props) => import("react/jsx-runtime").JSX.Element;
+declare const EditMediaV2: (props: EditMediaV2Props) => JSX.Element;
 export default EditMediaV2;

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

@@ -1,8 +1,8 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("../../../assets/icons/document_pdf.svg.js"),t=require("../../../assets/icons/edit.svg.js"),s=require("../../../assets/icons/refresh.svg.js"),r=require("styled-components"),n=require("../../shimmer-image/ShimmerImage.js"),l=require("../../spinner/Spinner.js"),o=require("../../template-preview/models/TemplateMeta.js"),a=require("../../TypographyStyle.js"),d=require("../../../utils/StringUtils.js"),c=require("../../../constants/Theme.js"),g=require("./EditMediaV2.style.js");function h(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const u=h(r).default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../assets/icons/document_pdf.svg.js"),i=require("../../../assets/icons/edit.svg.js"),s=require("../../../assets/icons/refresh.svg.js"),r=require("../../../assets/icons/video_camcorder.svg.js"),n=require("styled-components"),o=require("../../spinner/Spinner.js"),l=require("../../template-preview/models/TemplateMeta.js"),d=require("../../TypographyStyle.js"),a=require("../../../utils/StringUtils.js"),c=require("../../../constants/Theme.js"),h=require("./EditMediaV2.style.js");function g(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const j=g(n).default.div`
 	padding-left: 14px;
 	padding-right: 6px;
 	width: 44px;
 	height: 24px;
 	border-left: 1px solid ${c.COLORS.stroke.primary};
 	cursor: pointer;
-`;exports.default=r=>{const{imageName:h,error:j,isLoading:p,mediaType:m,disableEditVariable:x,selectedVariable:y,setOpenEditMedia:O}=r,f=null==h?void 0:h[0].split("/"),v=null==f?void 0:f[f.length-1];return e.jsxs(g.Container,{children:[e.jsx(g.ImageContainer,Object.assign({error:!!j,onClick:()=>null==O?void 0:O(!0)},{children:j?e.jsx(s.default,{color:c.COLORS.content.brand,width:32,height:32}):p?e.jsx(l.Spinner,{size:"small"}):m===o.HEADER_TYPES.IMAGE?e.jsx(n.ShimmerImage,{imageUrl:null==h?void 0:h[0],width:56,height:56}):m===o.HEADER_TYPES.VIDEO?e.jsx("video",Object.assign({src:h[0],style:{width:56,height:56}},{children:e.jsx("track",{default:!0,kind:"captions",srcLang:"en",src:h[0]})})):e.jsx(i.default,{width:18,height:22,color:c.COLORS.content.placeholder})})),e.jsxs(g.RightComponent,{children:[e.jsx("div",Object.assign({style:{flex:1}},{children:h&&j?e.jsx(e.Fragment,{}):p?e.jsx(a.BodyCaption,Object.assign({style:{marginLeft:8}},{children:"Your media is getting loaded..."})):e.jsx(a.BodySecondary,Object.assign({style:{color:c.COLORS.content.primary,marginLeft:8}},{children:y||d.default.toCapitilize(null==m?void 0:m.toLowerCase())||v}))})),!!j&&e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",marginLeft:8}},{children:[e.jsxs(a.BodySecondary,Object.assign({style:{color:c.COLORS.content.negative}},{children:["Error loading this ",null==m?void 0:m.toLowerCase(),". Retry"]})),e.jsx(a.Caption,Object.assign({style:{color:c.COLORS.content.secondary}},{children:j}))]})),!x&&!j&&!p&&e.jsx(u,Object.assign({onClick:()=>null==O?void 0:O(!0),onKeyDown:()=>null==O?void 0:O(!0),role:"presentation"},{children:e.jsx(t.default,{width:24,height:24,color:c.COLORS.content.placeholder})}))]})]})};
+`;exports.default=n=>{const{imageName:g,error:u,isLoading:p,mediaType:x,handleImageChange:y}=n,O=null==g?void 0:g[0].split("/"),m=null==O?void 0:O[O.length-1];return e.jsxs(h.Container,{children:[e.jsx(h.ImageContainer,Object.assign({error:!!u,onClick:u?y:void 0},{children:u?e.jsx(s.default,{color:c.COLORS.content.brand,width:32,height:32}):p?e.jsx(o.Spinner,{size:"small"}):x===l.HEADER_TYPES.IMAGE?e.jsx("img",{alt:"",src:null==g?void 0:g[0],style:{width:"100%",height:"56px",borderRadius:8,objectFit:"cover"}}):x===l.HEADER_TYPES.VIDEO?e.jsx(r.default,{width:18,height:22,color:c.COLORS.content.placeholder}):e.jsx(t.default,{width:18,height:22,color:c.COLORS.content.placeholder})})),e.jsxs(h.RightComponent,{children:[e.jsx("div",Object.assign({style:{flex:1}},{children:g&&u?e.jsx(e.Fragment,{}):p?e.jsx(d.BodyCaption,Object.assign({style:{marginLeft:8}},{children:"Your media is getting loaded..."})):e.jsx(d.BodySecondary,Object.assign({style:{color:c.COLORS.content.primary,marginLeft:8}},{children:a.default.toCapitilize(null==x?void 0:x.toLowerCase())||m}))})),!!u&&e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",marginLeft:8}},{children:[e.jsxs(d.BodySecondary,Object.assign({style:{color:c.COLORS.content.negative}},{children:["Error loading this ",null==x?void 0:x.toLowerCase(),". Retry"]})),e.jsx(d.Caption,Object.assign({style:{color:c.COLORS.content.secondary}},{children:u}))]})),!u&&!p&&e.jsx(j,Object.assign({onClick:y,onKeyDown:y,role:"presentation"},{children:e.jsx(i.default,{width:24,height:24,color:c.COLORS.content.placeholder})}))]})]})};

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

@@ -1,11 +1,9 @@
 import React from 'react';
-import { VariableListInterfaceV2 } from "../../add-variableV2";
 import { WhatsAppPickerMeta, WhatsAppTemplate } from "../../template-preview/models/WhatsAppTemplate";
 declare const EditMediaTemplateMediaV2: React.FC<{
     mediaComponent: WhatsAppTemplate['components'][0];
     template: WhatsAppTemplate;
     whatsappSpecificPickerMeta: WhatsAppPickerMeta;
     updateTemplateImageUrl(url: string, format: WhatsAppTemplate['components'][0]['format']): void;
-    variableListForImage?: VariableListInterfaceV2[];
 }>;
 export default EditMediaTemplateMediaV2;

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 u=d(i);const c=e=>/^{{.*}}$/.test(e);exports.default=d=>{let{mediaComponent:p,template:m,updateTemplateImageUrl:v,whatsappSpecificPickerMeta:f,variableListForImage:E}=d;var g,h,j,b,_,M,x,y;const{disableEditVariable:A}=r.useTemplateModalContext(),[C,S]=i.useState(void 0),[T,I]=i.useState(),[q,R]=i.useState(),[O,D]=i.useState(!1),w=u.default.createRef(),[H,P]=i.useState(!1),[k,F]=i.useState(""),{template:U,setTemplate:Y}=r.useTemplateModalContext();let L;function N(){var e;(null===(e=null==w?void 0:w.current)||void 0===e?void 0:e.click)&&w.current.click()}function V(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)F(a),P(!1);else{const e=p.format===o.HEADER_TYPES.IMAGE,a=yield f.uploadMediaFiles({file:t,fileName:C,isImage:e});if(a.success){const[e]=t.type.split("/");v(null!==(i=a.url)&&void 0!==i?i:"","application"===e?o.HEADER_TYPES.DOCUMENT:o.HEADER_TYPES[e.toUpperCase()])}else F("An unknown technical error occured");P(!1)}}else F("An unknown technical error occured"),P(!1)}))}return L=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!==(g=p.format)&&void 0!==g?g:o.HEADER_TYPES.IMAGE,uploadMedia:function(t){var i;return e.__awaiter(this,void 0,void 0,(function*(){if(F(""),R(""),D(!1),t)if(t.startsWith("https"))try{P(!0);const e=yield fetch(t),i=yield e.blob();yield V(i)}catch(e){F("An unknown technical error occurred")}else if(c(t)){R(t);const e=Object.assign({},U);if(e.components){const a=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!==a&&a>-1&&(null==e?void 0:e.components[a])){const i=Object.assign(Object.assign({},e.components[a]),{format:p.format,example:{header_handle:[t]}}),n=[...e.components];n[a]=i,e.components=n}}e.mapping&&(e.mapping=Object.assign(Object.assign({},e.mapping),{header:[t]})),P(!1),null==Y||Y(Object.assign({},e))}else P(!1),F("Invalid URL or variable");else N()}))},variableListForImage:E||[],setOpenEditMedia:D,openEditMedia:O}),!!T&&t.jsx(n.BikImageCropper,{aspectRatio:15/8,src:T,onCropComplete:function(t){return e.__awaiter(this,void 0,void 0,(function*(){P(!1),F("");const e=yield fetch(t);V(yield e.blob()).then((()=>{I(void 0)}))}))},onCancel:()=>{P(!1),I(""),w.current&&(w.current.value="")}}),t.jsx("input",{ref:w,style:{display:"none"},type:"file",onChange:function(e){var t;F(""),P(!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;I(""),S(""),e.onload=()=>{I(e.result),S(null==i?void 0:i.name)},i&&e.readAsDataURL(i)}else V(i)},accept:L}),t.jsx(s.default,{imageName:null!==(j=null===(h=null==p?void 0:p.example)||void 0===h?void 0:h.header_handle)&&void 0!==j?j:[],handleImageChange:N,mediaType:null==p?void 0:p.format,error:k,isLoading:H,setOpenEditMedia:D,selectedVariable:c(null!==(M=null===(_=null===(b=null==p?void 0:p.example)||void 0===b?void 0:b.header_handle)||void 0===_?void 0:_[0])&&void 0!==M?M:"")?null===(y=null===(x=null==p?void 0:p.example)||void 0===x?void 0:x.header_handle)||void 0===y?void 0:y[0]:q,disableEditVariable:A})]})};
+"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"),r=require("../../template-preview/models/TemplateMeta.js"),l=require("./EditMediaV2.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=n(i);exports.default=n=>{let{mediaComponent:u,template:d,updateTemplateImageUrl:s,whatsappSpecificPickerMeta:c}=n;var p,f;const m=o.default.createRef(),[v,E]=i.useState(!1),[g,_]=i.useState("");let h;return h=u.format===r.HEADER_TYPES.IMAGE?"image/png, image/jpeg":u.format===r.HEADER_TYPES.VIDEO?"video/mp4":"application/pdf",t.jsxs(t.Fragment,{children:[t.jsx("input",{ref:m,style:{display:"none"},type:"file",onChange:function(t){var i,l;return e.__awaiter(this,void 0,void 0,(function*(){_(""),E(!0);const e=new a.FileUploaderHelper,n=null===(i=t.target.files)||void 0===i?void 0:i[0];if(n instanceof Blob){const t=e.validate(n);if(t)_(t),E(!1);else{const e=u.format===r.HEADER_TYPES.IMAGE,t=yield c.uploadMediaFiles({file:n,fileName:n.name,isImage:e});if(t.success){const[e]=n.type.split("/");s(null!==(l=t.url)&&void 0!==l?l:"","application"===e?r.HEADER_TYPES.DOCUMENT:r.HEADER_TYPES[e.toUpperCase()])}else _("An unknown technical error occured");E(!1)}}else _("An unknown technical error occured"),E(!1)}))},accept:h}),t.jsx(l.default,{imageName:null!==(f=null===(p=null==u?void 0:u.example)||void 0===p?void 0:p.header_handle)&&void 0!==f?f:[],handleImageChange:function(){var e;(null===(e=null==m?void 0:m.current)||void 0===e?void 0:e.click)&&m.current.click()},mediaType:null==u?void 0:u.format,error:g,isLoading:v})]})};

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

@@ -1,4 +1,4 @@
-import { VariableListInterfaceV2 } from "../../add-variableV2/AddVariableV2";
+/// <reference types="react" />
 import { EmailTemplateType } from "../../template-preview/models/EmailTemplate";
 import { SMSTemplateType } from "../../template-preview/models/SmsTemplate";
 import { WhatsAppPickerMeta, WhatsAppTemplate } from "../../template-preview/models/WhatsAppTemplate";
@@ -6,11 +6,6 @@ export interface EditWhatsAppTemplateV2Props {
     whatsappSpecificPickerMeta?: WhatsAppPickerMeta;
     template: WhatsAppTemplate;
     onTemplateChange?: (template: WhatsAppTemplate | EmailTemplateType | SMSTemplateType) => void;
-    showVariableModal?: boolean;
-    variableList?: VariableListInterfaceV2[];
-    variableListForImage?: VariableListInterfaceV2[];
-    discountCode?: string;
-    setDiscountCode?: (code: string) => void;
 }
-declare const EditWhatsAppTemplateV2: ({ template, onTemplateChange, whatsappSpecificPickerMeta, showVariableModal, variableList, variableListForImage, discountCode, setDiscountCode, }: EditWhatsAppTemplateV2Props) => import("react/jsx-runtime").JSX.Element;
+declare const EditWhatsAppTemplateV2: ({ template, onTemplateChange, whatsappSpecificPickerMeta, }: EditWhatsAppTemplateV2Props) => 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("react"),o=require("../../template-preview/models/WhatsAppTemplate.js"),i=require("../context/templateModalContext.js"),n=require("../custom-hooks/useAdditionalVariables.js"),a=require("../utils/getDataFromTemplateComponent.js"),l=require("./BackTrackComponent.js"),s=require("./DiscountCodeComponent.js"),d=require("./EditMediaV2.style.js"),r=require("./EditWhatsAppTemplateMediaV2.js"),u=require("./VariableConnector.js"),c=require("./VariableConnectorsPanel.js"),p=require("./VariableConnectorWhatsApp.js"),v=require("./VariableEditorHeader.js"),b=require("./WhatsAppTemplateCardButtonV2.js");exports.default=m=>{let{template:g,onTemplateChange:h,whatsappSpecificPickerMeta:f,showVariableModal:j,variableList:x,variableListForImage:T,discountCode:C,setDiscountCode:O}=m;var y,E,V,k,L,w,B,q,I,A,D,M,U,N,P,R,S;const{originalVariableList:H,pod:_,extras:Q}=i.useTemplateModalContext(),{descriptionComponents:F,urlBtns:W,qrbBtns:Y,imageComponent:K,bodyVariables:$,headerVariables:X}=a.getAllDataFromTemplateComponent(g),[z,G]=t.useState(!1);function J(e,t){var o,i,n,a,l;const s=Object.assign({},g),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===(n=null===(i=s.components)||void 0===i?void 0:i[d])||void 0===n?void 0:n.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}}if("string"!=typeof e){"checkout.checkoutUrl"===(null===(l=e.placeHolder)||void 0===l?void 0:l.slice(2,-2))?G(!0):(G(!1),null==O||O(""))}null==h||h(s)}function Z(e,t,o){var i;const n=Object.assign({},g),a=null==n?void 0:n.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==a&&a>-1){const t=null===(i=null==n?void 0:n.components[a].buttons)||void 0===i?void 0:i.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({},n.components[a]),{buttons:t}),s=[...n.components];s[a]=l,n.components=s}null==h||h(n)}t.useEffect((()=>{var e,t;if(null===(e=g.mapping.buttons)||void 0===e?void 0:e.find((e=>"checkout.checkoutUrl"===e.slice(2,-2))))G(!0);else{G(!1);const e=null===(t=null==Q?void 0:Q.discountCodeExtra)||void 0===t?void 0:t[1];null==e||e("")}}),[g]);const ee=n.useAdditionalVariables({variableList:x,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom Text",variableValue:"{{custom.text}}"});return e.jsxs(c.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:[!!K&&e.jsx(d.EditTemplateMediaContainer,{children:e.jsx(r.default,{whatsappSpecificPickerMeta:f,mediaComponent:K,updateTemplateImageUrl:function(e,t){var o;let i=Object.assign({},g);const n=null===(o=null==i?void 0:i.components)||void 0===o?void 0:o.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==n&&n>-1&&(null==i?void 0:i.components[n])){const o=Object.assign(Object.assign({},i.components[n]),{format:t,example:{header_handle:[e]}}),a=[...i.components];a[n]=o,i=Object.assign(Object.assign({},i),{components:a})}i.mapping&&(i.mapping=Object.assign(Object.assign({},i.mapping),{header:void 0})),null==h||h(Object.assign({},i))},template:g,variableListForImage:T})}),($.length>0||X.length>0)&&e.jsx(v.default,{containerStyle:{paddingTop:K?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==F?void 0:F.map(((t,o)=>e.jsx(p.default,{originalVariableList:H,type:t.type,descriptionComponent:t.component,variableMapping:"HEADER"===t.type?g.mapping.header:g.mapping.body,showVariableModal:j,variableList:x},o))),(null===(E=null===(y=W[0])||void 0===y?void 0:y.component)||void 0===E?void 0:E.buttons)&&(null===(L=null===(k=null===(V=W[0])||void 0===V?void 0:V.component)||void 0===k?void 0:k.buttons)||void 0===L?void 0:L.length)>0&&e.jsx(v.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(w=null==H?void 0:H.buttons)||void 0===w?void 0:w.map(((t,o)=>{if("URL"===t.type)return e.jsx(b.default,{variableListIndex:o,CTAoptions:null==f?void 0:f.CTAoptions,button:t,originalVariableList:H,updateSelectedURLTemplateBtn:J,variableList:x},`${o}`)})),(null===(q=null===(B=Y[0])||void 0===B?void 0:B.component)||void 0===q?void 0:q.buttons)&&(null===(D=null===(A=null===(I=Y[0])||void 0===I?void 0:I.component)||void 0===A?void 0:A.buttons)||void 0===D?void 0:D.length)>0&&(_!==o.POD.CHATBOT?e.jsx(v.default,{headerText:"Edit buttons",subText:"Edit the chatflows triggered on clicking  the buttons",toolTipInfo:"There is an option to trigger chatflows through the buttons which can keep the user engaged"}):e.jsx(l.BackTrackComponent,{backTrackMessage:null===(M=null==Q?void 0:Q.backTrackExtra)||void 0===M?void 0:M[0],setBackTrackMessage:null===(U=null==Q?void 0:Q.backTrackExtra)||void 0===U?void 0:U[1]})),null===(N=null==H?void 0:H.buttons)||void 0===N?void 0:N.map(((t,o)=>{if("QUICK_REPLY"===t.type)return e.jsx(b.default,{variableListIndex:o,QRBoptions:null==f?void 0:f.QRBoptions,button:t,originalVariableList:H,updateSelectedQRBTemplateBtn:Z},`${o}`)})),_===o.POD.CHATBOT&&z&&e.jsx(s.DiscountCodeComponent,{discountCode:null===(P=null==Q?void 0:Q.discountCodeExtra)||void 0===P?void 0:P[0],setDiscountCode:null===(R=null==Q?void 0:Q.discountCodeExtra)||void 0===R?void 0:R[1],variableList:x}),null===(S=null==H?void 0:H.buttons)||void 0===S?void 0:S.map(((t,o)=>{var i,n,a;if("COPY_CODE"===t.type)return e.jsx(u.default,{index:o,variable:{variableName:null!==(i=t.text)&&void 0!==i?i:"",updatedValue:null!==(n=t.buttonVariable)&&void 0!==n?n:"",type:"string",isEditableVariable:!0,index:null!==(a=t.index)&&void 0!==a?a:0},showVariableModal:!0,variableList:ee,componentType:"BUTTONS"},o)}))]}))};
+"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"),l=require("./VariableConnectorsPanel.js"),s=require("./VariableConnectorWhatsApp.js"),a=require("./VariableEditorHeader.js"),d=require("./WhatsAppTemplateCardButtonV2.js");exports.default=r=>{let{template:p,onTemplateChange:u,whatsappSpecificPickerMeta:c}=r;var m,v,b,g,h,f,j,x,T,O,y,C;const{originalVariableList:E}=t.useTemplateModalContext(),{descriptionComponents:V,urlBtns:w,qrbBtns:B,imageComponent:I,bodyVariables:q,headerVariables:R}=n.getAllDataFromTemplateComponent(p);function A(e,t){var n,o,i,l;const s=Object.assign({},p),a=null==s?void 0:s.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==a&&a>-1){const d=null===(n=null==s?void 0:s.components[a].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!==(l=null===(i=null===(o=s.components)||void 0===o?void 0:o[a])||void 0===i?void 0:i.buttons)&&void 0!==l?l:[]];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({},s.components[a]),{buttons:r}),u=Object.assign(Object.assign({},s.mapping),{buttons:n?["((customBtnPlaceholder))"]:"string"!=typeof e?[e.placeHolder]:void 0});s.mapping=u;const c=[...s.components];c[a]=p,s.components=c}}null==u||u(s)}function L(e,t,n){var o;const i=Object.assign({},p),l=null==i?void 0:i.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==l&&l>-1){const t=null===(o=null==i?void 0:i.components[l].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 s=Object.assign(Object.assign({},i.components[l]),{buttons:t}),a=[...i.components];a[l]=s,i.components=a}null==u||u(i)}return e.jsxs(l.Container,Object.assign({style:{flexDirection:"column",maxHeight:460}},{children:[!!I&&e.jsx(o.EditTemplateMediaContainer,{children:e.jsx(i.default,{whatsappSpecificPickerMeta:c,mediaComponent:I,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]}}),l=[...o.components];l[i]=n,o=Object.assign(Object.assign({},o),{components:l})}null==u||u(o)},template:p})}),(q.length>0||R.length>0)&&e.jsx(a.default,{containerStyle:{paddingTop:I?24:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}),null==V?void 0:V.map(((t,n)=>e.jsx(s.default,{originalVariableList:E,type:t.type,descriptionComponent:t.component,variableMapping:"HEADER"===t.type?p.mapping.header:p.mapping.body},n))),(null===(v=null===(m=w[0])||void 0===m?void 0:m.component)||void 0===v?void 0:v.buttons)&&(null===(h=null===(g=null===(b=w[0])||void 0===b?void 0:b.component)||void 0===g?void 0:g.buttons)||void 0===h?void 0:h.length)>0&&e.jsx(a.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(f=null==E?void 0:E.buttons)||void 0===f?void 0:f.map(((t,n)=>{if("URL"===t.type)return e.jsx(d.default,{CTAoptions:null==c?void 0:c.CTAoptions,button:t,originalVariableList:E,updateSelectedURLTemplateBtn:A},`${n}`)})),(null===(x=null===(j=B[0])||void 0===j?void 0:j.component)||void 0===x?void 0:x.buttons)&&(null===(y=null===(O=null===(T=B[0])||void 0===T?void 0:T.component)||void 0===O?void 0:O.buttons)||void 0===y?void 0:y.length)>0&&e.jsx(a.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===(C=null==E?void 0:E.buttons)||void 0===C?void 0:C.map(((t,n)=>{if("QUICK_REPLY"===t.type)return e.jsx(d.default,{QRBoptions:null==c?void 0:c.QRBoptions,button:t,originalVariableList:E,updateSelectedQRBTemplateBtn:L},`${n}`)}))]}))};

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

@@ -1,5 +1,6 @@
+/// <reference types="react" />
 export interface FooterProps {
     onSelect: () => void;
 }
-declare const Footer: ({ onSelect }: FooterProps) => import("react/jsx-runtime").JSX.Element;
+declare const Footer: ({ onSelect }: FooterProps) => JSX.Element;
 export default Footer;

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

@@ -1,5 +1,6 @@
+/// <reference types="react" />
 export interface HeaderProps {
     showOnlyContent?: boolean;
 }
-declare const Header: ({ showOnlyContent }: HeaderProps) => import("react/jsx-runtime").JSX.Element;
+declare const Header: ({ showOnlyContent }: HeaderProps) => JSX.Element;
 export default Header;

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

@@ -7,6 +7,5 @@ declare const MobilePreview: React.ForwardRefExoticComponent<{
     display_content: string;
     channel: CHANNEL_TYPE;
     template: WhatsAppTemplate | EmailTemplateType | SMSTemplateType | null;
-    showSampleValues?: boolean | undefined;
 } & React.RefAttributes<HTMLDivElement>>;
 export default MobilePreview;

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("react/jsx-runtime"),t=require("react"),i=require("styled-components"),a=require("../../template-preview/TemplatePreview.js");require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js"),require("../../../constants/Theme.js"),require("../../curtain/CurtainHelper.js"),require("../../template-preview/models/TemplateMeta.js");var r=require("../../template-preview/models/WhatsAppTemplate.js"),o=require("../context/templateModalContext.js"),s=require("../utils/getPreviewDimension.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=l(t),n=l(i);const d=n.default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),i=require("styled-components"),a=require("../../template-preview/TemplatePreview.js");require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../../constants/Theme.js");var r=require("../../template-preview/models/Channels.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var s=o(t),l=o(i);const n=l.default.div`
 	position: relative;
 	height: 100%;
 	border-radius: 31px;
-	width: ${e=>s.getPreviewWidth(e.channel)}px;
+	width: ${e=>e.channel===r.CHANNEL_TYPE.WHATSAPP?"236px":"213px"};
 	background-color: white;
 	margin: auto;
 	overflow-y: auto;
-`,c=n.default.div`
+`,p=l.default.div`
 	position: absolute;
 	flex: 1;
 	background-color: white;
@@ -17,4 +17,4 @@
 	height: calc(100% - 17px);
 	border-radius: 16px;
 	overflow-y: auto;
-`,h=p.default.forwardRef(((t,i)=>{let{display_content:l,channel:p,template:n,showSampleValues:h}=t;const{pod:m}=o.useTemplateModalContext();return e.jsx("div",{children:e.jsxs(d,Object.assign({channel:p},{children:[e.jsx("img",{alt:"",src:"https://firebasestorage.googleapis.com/v0/b/staging-bikayi.appspot.com/o/bik%2FkNwEVoGlLpVjOsXoO1M8WgvWicP2%2F6f07b850-8b4b-4d58-96cc-8ba6df7b4e4a-Device___Frame.jpg?alt=media&token=253f1bfe-8481-4f54-bdef-3c0a73697d6a",style:{width:s.getPreviewWidth(p),height:443}}),e.jsx(c,Object.assign({ref:i},{children:e.jsx(a.TemplatePreview,{showSampleValues:h,template:n,channel:p,smsSpecificMeta:{smsDisplayContent:l},whatsAppSpecificMeta:{showWhatsAppHeader:!0,whatsAppExtras:m!==r.POD.CHATBOT,containerStyle:{border:"none",borderBottomRightRadius:0,borderBottomLeftRadius:0,minHeight:426,width:240}},size:"small",hideHeader:!0,emailSpecificMeta:{emailDisplayContent:l,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_mobile",containerStyle:{height:"100%",width:"100%"},templateContainerStyles:{height:"100%"}}})}))]}))})}));h.displayName="MobilePreview",exports.default=h;
+`,c=s.default.forwardRef(((t,i)=>{let{display_content:o,channel:s,template:l}=t;return e.jsx("div",{children:e.jsxs(n,Object.assign({channel:s},{children:[e.jsx("img",{alt:"",src:"https://firebasestorage.googleapis.com/v0/b/staging-bikayi.appspot.com/o/bik%2FkNwEVoGlLpVjOsXoO1M8WgvWicP2%2F6f07b850-8b4b-4d58-96cc-8ba6df7b4e4a-Device___Frame.jpg?alt=media&token=253f1bfe-8481-4f54-bdef-3c0a73697d6a",style:{width:s===r.CHANNEL_TYPE.WHATSAPP?236:213,height:443}}),e.jsx(p,Object.assign({ref:i},{children:e.jsx(a.TemplatePreview,{template:l,channel:s,smsSpecificMeta:{smsDisplayContent:o},whatsAppSpecificMeta:{showWhatsAppHeader:!0,whatsAppExtras:!0,containerStyle:{border:"none",borderBottomRightRadius:0,borderBottomLeftRadius:0,minHeight:426}},size:"small",hideHeader:!0,emailSpecificMeta:{emailDisplayContent:o,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_mobile",containerStyle:{height:"100%"},templateContainerStyles:{height:"100%"}}})}))]}))})}));c.displayName="MobilePreview",exports.default=c;

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

@@ -1,4 +1,4 @@
-import { VariableListInterfaceV2 } from "../../add-variableV2/AddVariableV2";
+/// <reference types="react" />
 import { CHANNEL_TYPE } from "../../template-preview/models/Channels";
 import { WhatsAppPickerMeta } from "../../template-preview/models/WhatsAppTemplate";
 export interface TemplateSelectModalContentProps {
@@ -7,12 +7,6 @@ export interface TemplateSelectModalContentProps {
     hideHeader?: boolean;
     showOnlyContent?: boolean;
     whatsappSpecificPickerMeta?: WhatsAppPickerMeta;
-    showVariableModal?: boolean;
-    variableList?: VariableListInterfaceV2[];
-    variableListForImage?: VariableListInterfaceV2[];
-    discountCode?: string;
-    setDiscountCode?: (code: string) => void;
-    showSampleValues?: boolean;
 }
-declare const TemplateSelectModalContent: ({ channel, showVariableMapping, showOnlyContent, whatsappSpecificPickerMeta, showVariableModal, variableList, discountCode, setDiscountCode, variableListForImage, showSampleValues, }: TemplateSelectModalContentProps) => import("react/jsx-runtime").JSX.Element;
+declare const TemplateSelectModalContent: ({ channel, showVariableMapping, showOnlyContent, whatsappSpecificPickerMeta, }: TemplateSelectModalContentProps) => JSX.Element;
 export default TemplateSelectModalContent;

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),a=require("../../template-preview/models/Channels.js"),s=require("./Body.js"),t=require("./Header.js");exports.default=i=>{let{channel:r,showVariableMapping:o,showOnlyContent:l,whatsappSpecificPickerMeta:n,showVariableModal:d,variableList:p,discountCode:u,setDiscountCode:c,variableListForImage:h,showSampleValues:w}=i;return e.jsx("div",Object.assign({style:{paddingBottom:0}},{children:e.jsxs("div",{children:[r===a.CHANNEL_TYPE.EMAIL&&e.jsx(t.default,{showOnlyContent:l}),e.jsx(s.default,{whatsappSpecificPickerMeta:n,showVariableMapping:!!o,showOnlyContent:l,showVariableModal:d,variableList:p,discountCode:u,setDiscountCode:c,variableListForImage:h,showSampleValues:w})]})}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../template-preview/models/Channels.js"),r=require("./Body.js"),s=require("./Header.js");exports.default=a=>{let{channel:i,showVariableMapping:n,showOnlyContent:l,whatsappSpecificPickerMeta:o}=a;return e.jsx("div",Object.assign({style:{paddingBottom:0}},{children:e.jsxs("div",{children:[i===t.CHANNEL_TYPE.EMAIL&&e.jsx(s.default,{showOnlyContent:l}),e.jsx(r.default,{whatsappSpecificPickerMeta:o,showVariableMapping:!!n,showOnlyContent:l})]})}))};

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

@@ -1,7 +1,6 @@
 /// <reference types="react" />
-import { VariableListInterfaceV2 } from "../../add-variableV2/AddVariableV2";
 import { CHANNEL_TYPE } from "../../template-preview/models/Channels";
-import { ButtonPlaceHolderOptions, CUSTOM_VARIABLE } from "../../template-preview/models/TemplateMeta";
+import { CUSTOM_VARIABLE } from "../../template-preview/models/TemplateMeta";
 export declare const Container: import("styled-components").StyledComponent<"div", any, {
     focused?: boolean | undefined;
     channel?: CHANNEL_TYPE | undefined;
@@ -11,11 +10,6 @@ export interface VariableConnectorProps {
     onFocus?: () => void;
     variable: CUSTOM_VARIABLE;
     index: number;
-    showVariableModal?: boolean;
-    variableList?: VariableListInterfaceV2[];
-    setShowDiscountCheckBox?: any;
-    componentType?: 'HEADER' | 'BODY' | 'BUTTONS' | 'FOOTER' | 'limited_time_offer';
-    CTAoptions?: ButtonPlaceHolderOptions[];
 }
-declare const VariableConnector: React.FC<VariableConnectorProps>;
+declare const VariableConnector: ({ onFocus, variable, index, }: VariableConnectorProps) => JSX.Element;
 export default VariableConnector;