@bikdotai/bik-component-library 0.0.734 → 0.0.735-beta.1

package/dist/esm/components/template-preview/RCS/RCSPreview.styled.d.ts

@@ -1,33 +1,33 @@
-import { RCS_TEMPLATE_TYPE } from '../models/RCSTemplate';
-export declare const RCSContainer: import("styled-components").StyledComponent<"div", any, {
-    isCarousal?: boolean | undefined;
-    templateType?: RCS_TEMPLATE_TYPE | undefined;
-}, never>;
-export declare const RcsHtmlContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const HeaderTextContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const TitleTextContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const RCSPreviewContainer: import("styled-components").StyledComponent<"div", any, {
-    isCarouselCard?: boolean | undefined;
-    showBorder?: boolean | undefined;
-    showDashedBorder?: boolean | undefined;
-    isWhatsappCarousel?: boolean | undefined;
-    hasError?: boolean | undefined;
-    isPreview?: boolean | undefined;
-    needBorder?: boolean | undefined;
-    isHorizontalOrientation?: boolean | undefined;
-}, never>;
-export declare const RCSChatBtnContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const RCSMediaContainer: import("styled-components").StyledComponent<"div", any, {
-    isHorizontal: boolean;
-}, never>;
-export declare const RCSPdfContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const PdfComineText: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const PdfText: import("styled-components").StyledComponent<"p", any, {}, never>;
-export declare const RCSCarousalContainer: import("styled-components").StyledComponent<"div", any, {
-    borderRadius?: string | undefined;
-}, never>;
-export declare const HeaderContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const LeftContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const IconContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const TitleContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const SubTitle: import("styled-components").StyledComponent<"p", any, {}, never>;
+import { RCS_TEMPLATE_TYPE } from '../models/RCSTemplate';
+export declare const RCSContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    isCarousal?: boolean;
+    templateType?: RCS_TEMPLATE_TYPE;
+}>> & string;
+export declare const RcsHtmlContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const HeaderTextContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>, never>> & string;
+export declare const TitleTextContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>, never>> & string;
+export declare const RCSPreviewContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    isCarouselCard?: boolean;
+    showBorder?: boolean;
+    showDashedBorder?: boolean;
+    isWhatsappCarousel?: boolean;
+    hasError?: boolean;
+    isPreview?: boolean;
+    needBorder?: boolean;
+    isHorizontalOrientation?: boolean;
+}>> & string;
+export declare const RCSChatBtnContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const RCSMediaContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    isHorizontal: boolean;
+}>> & string;
+export declare const RCSPdfContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const PdfComineText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const PdfText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
+export declare const RCSCarousalContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    borderRadius?: string;
+}>> & string;
+export declare const HeaderContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const LeftContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const IconContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const TitleContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const SubTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;

package/dist/esm/components/template-preview/RCS/RCSTemplateLikePreview.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
-import { RCSPreviewPropsV2 } from '../models/RCSTemplate';
-export declare const RCSTemplateLikePreview: React.FC<RCSPreviewPropsV2>;
+import React from 'react';
+import { RCSPreviewPropsV2 } from '../models/RCSTemplate';
+export declare const RCSTemplateLikePreview: React.FC<RCSPreviewPropsV2>;

package/dist/esm/components/template-preview/RCS/RCSTemplateLikePreview.js

@@ -1,8 +1,8 @@
-import{j as e}from"../../../node_modules/react/jsx-runtime.js";import s from"styled-components";import{useTemplateModalContext as t}from"../../template-context-mapper/context/templateModalContext.js";import{TitleRegular as r}from"../../TypographyStyle.js";import{COLORS as o}from"../../../constants/Theme.js";import{getPreviewPropLen as a}from"../utils/getPreviewPropLen.js";import i from"./RCSChatHeader.js";import{RCSChatPreview as p}from"./RCSChatPreview.js";const n=s.div`
+import{jsx as e,Fragment as r,jsxs as t}from"react/jsx-runtime";import o from"styled-components";import{useTemplateModalContext as s}from"../../template-context-mapper/context/templateModalContext.js";import{TitleRegular as a}from"../../TypographyStyle.js";import{COLORS as i}from"../../../constants/Theme.js";import{getPreviewPropLen as p}from"../utils/getPreviewPropLen.js";import n from"./RCSChatHeader.js";import{RCSChatPreview as h}from"./RCSChatPreview.js";const l=o.div`
 	background-color: white;
 	border-radius: 4px;
 	position: relative;
 	height: ${e=>e.isWhatsappCarousel?"100%":"auto"};
-`,h=s(r)`
-	color: ${o.content.primary};
-`,m=s=>{const{hideDeviceContainerInPreview:r}=t();return 3===a(s)?e.jsx(e.Fragment,{children:s.zeroStateComponent}):r?e.jsx(p,Object.assign({showHeader:s.showHeader},s)):e.jsx(e.Fragment,{children:e.jsxs(n,Object.assign({style:s.containerStyle,showHeader:s.showHeader,isWhatsappCarousel:s.isWhatsappCarousel},{children:[s.showHeader&&e.jsx(i,{}),e.jsxs("div",Object.assign({style:{padding:"small"===s.size?"10px 32px 10px 10px":`10px ${s.isWhatsappCarousel?"0px":"12px"} ${s.isWhatsappCarousel?"2px":"16px"} 16px`,height:s.isWhatsappCarousel?"100%":"auto"}},{children:[!s.hidePreviewText&&e.jsx("div",Object.assign({style:{marginBottom:16}},{children:e.jsx(h,{children:"Preview"})})),e.jsx(p,Object.assign({showHeader:s.showHeader},s))]}))]}))})};export{m as RCSTemplateLikePreview};
+`,m=o(a)`
+	color: ${i.content.primary};
+`,d=o=>{const{hideDeviceContainerInPreview:a}=s();return 3===p(o)?e(r,{children:o.zeroStateComponent}):a?e(h,Object.assign({showHeader:o.showHeader},o)):e(r,{children:t(l,{style:o.containerStyle,showHeader:o.showHeader,isWhatsappCarousel:o.isWhatsappCarousel,children:[o.showHeader&&e(n,{}),t("div",{style:{padding:"small"===o.size?"10px 32px 10px 10px":`10px ${o.isWhatsappCarousel?"0px":"12px"} ${o.isWhatsappCarousel?"2px":"16px"} 16px`,height:o.isWhatsappCarousel?"100%":"auto"},children:[!o.hidePreviewText&&e("div",{style:{marginBottom:16},children:e(m,{children:"Preview"})}),e(h,Object.assign({showHeader:o.showHeader},o))]})]})})};export{d as RCSTemplateLikePreview};

package/dist/esm/components/template-preview/SMS/SMSBubble.d.ts

@@ -1,8 +1,8 @@
-export declare const SideCaret: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const SMSContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export type SMSBubbleProps = {
-    content: string;
-    size?: 'small' | 'large';
-};
-declare const SMSBubble: (props: SMSBubbleProps) => import("react/jsx-runtime").JSX.Element;
-export default SMSBubble;
+export declare const SideCaret: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const SMSContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export type SMSBubbleProps = {
+    content: string;
+    size?: 'small' | 'large';
+};
+declare const SMSBubble: (props: SMSBubbleProps) => import("react/jsx-runtime").JSX.Element;
+export default SMSBubble;

package/dist/esm/components/template-preview/SMS/SMSBubble.js

@@ -1,12 +1,12 @@
-import{j as o}from"../../../node_modules/react/jsx-runtime.js";import s from"../../../assets/icons/union.svg.js";import t from"styled-components";import{COLORS as e}from"../../../constants/Theme.js";const n=t.div`
+import{jsxs as t,jsx as o}from"react/jsx-runtime";import e from"../../../assets/icons/union.svg.js";import i from"styled-components";import{COLORS as n}from"../../../constants/Theme.js";const r=i.div`
 	position: absolute;
 	width: 30px;
 	height: 30px;
 	left: -10px;
 	bottom: -1px;
-`,i=t.div`
+`,s=i.div`
 	padding: 12px;
-	background: ${e.background.base};
+	background: ${n.background.base};
 	border-radius: 16px;
 	position: relative;
-`,r=t=>{const{content:r,size:d}=t;return o.jsxs(i,{children:[o.jsx(n,{children:o.jsx(s,{color:e.background.base,height:27,width:27})}),o.jsx("div",{style:{fontSize:"small"===d?12:14},dangerouslySetInnerHTML:{__html:r}})]})};export{i as SMSContainer,n as SideCaret,r as default};
+`,d=i=>{const{content:d,size:a}=i;return t(s,{children:[o(r,{children:o(e,{color:n.background.base,height:27,width:27})}),o("div",{style:{fontSize:"small"===a?12:14},dangerouslySetInnerHTML:{__html:d}})]})};export{s as SMSContainer,r as SideCaret,d as default};

package/dist/esm/components/template-preview/SmsTemplatePreview.d.ts

@@ -1,13 +1,13 @@
-import React from 'react';
-import { SMSTemplateType } from './models/SmsTemplate';
-import { CUSTOM_VARIABLE } from './models/TemplateMeta';
-declare const SmsTemplatePreview: React.FC<{
-    template: SMSTemplateType;
-    variableStore?: CUSTOM_VARIABLE[];
-    hideHeader?: boolean;
-    onlyTemplateContent?: boolean;
-    display_content?: string;
-    size?: 'small' | 'large';
-    uniqueId?: string;
-}>;
-export default SmsTemplatePreview;
+import React from 'react';
+import { SMSTemplateType } from './models/SmsTemplate';
+import { CUSTOM_VARIABLE } from './models/TemplateMeta';
+declare const SmsTemplatePreview: React.FC<{
+    template: SMSTemplateType;
+    variableStore?: CUSTOM_VARIABLE[];
+    hideHeader?: boolean;
+    onlyTemplateContent?: boolean;
+    display_content?: string;
+    size?: 'small' | 'large';
+    uniqueId?: string;
+}>;
+export default SmsTemplatePreview;

package/dist/esm/components/template-preview/SmsTemplatePreview.js

@@ -1 +1 @@
-import{j as e}from"../../node_modules/react/jsx-runtime.js";import s from"../../assets/icons/arrow_left.svg.js";import t from"../../assets/icons/more_vertical.svg.js";import n from"../../assets/icons/search.svg.js";import{COLORS as l}from"../../constants/Theme.js";import{useTemplateModalContext as o}from"../template-context-mapper/context/templateModalContext.js";import{TitleRegular as r,Caption as i}from"../TypographyStyle.js";import{renderVariableUIForPreview as a}from"./helpers/SmsTemplateHelper.js";import c from"./SMS/SMSBubble.js";import{SMSBubbleContainer as d,SMSCardHeader as m,SMSHeader as j}from"./SmsTemplatePreview.styled.js";const p=p=>{let{template:h,variableStore:x,hideHeader:g,display_content:u,onlyTemplateContent:v,size:f,uniqueId:y}=p;var b;const w=null==h?void 0:h.content,{hideDeviceContainerInPreview:S}=o();return S?e.jsx(d,Object.assign({size:f},{children:e.jsx(c,{size:null!=f?f:"large",content:null!=u?u:a(w,null!=x?x:[],void 0,null!=y?y:"")})})):e.jsxs(e.Fragment,{children:[!g&&!v&&e.jsx(m,{children:e.jsx(r,Object.assign({style:{maxWidth:"100%"}},{children:h.name}))}),!v&&e.jsx(j,{children:e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8}},{children:[e.jsx(s,{width:16,height:16,color:l.content.secondary}),e.jsx(i,{children:null===(b=null==h?void 0:h.headers)||void 0===b?void 0:b[0]})]})),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8}},{children:[e.jsx(n,{width:16,height:16,color:l.content.secondary}),e.jsx(t,{width:16,height:16,color:l.content.secondary})]}))]})}),e.jsx(d,Object.assign({size:f},{children:e.jsx(c,{size:null!=f?f:"large",content:null!=u?u:a(w,null!=x?x:[],void 0,null!=y?y:"")})}))]})};export{p as default};
+import{jsx as e,jsxs as t,Fragment as l}from"react/jsx-runtime";import o from"../../assets/icons/arrow_left.svg.js";import r from"../../assets/icons/more_vertical.svg.js";import i from"../../assets/icons/search.svg.js";import{COLORS as n}from"../../constants/Theme.js";import{useTemplateModalContext as s}from"../template-context-mapper/context/templateModalContext.js";import{TitleRegular as a,Caption as c}from"../TypographyStyle.js";import{renderVariableUIForPreview as d}from"./helpers/SmsTemplateHelper.js";import m from"./SMS/SMSBubble.js";import{SMSBubbleContainer as p,SMSCardHeader as h,SMSHeader as u}from"./SmsTemplatePreview.styled.js";const v=v=>{let{template:f,variableStore:y,hideHeader:g,display_content:j,onlyTemplateContent:x,size:w,uniqueId:S}=v;var z;const T=null==f?void 0:f.content,{hideDeviceContainerInPreview:b}=s();return b?e(p,{size:w,children:e(m,{size:null!=w?w:"large",content:null!=j?j:d(T,null!=y?y:[],void 0,null!=S?S:"")})}):t(l,{children:[!g&&!x&&e(h,{children:e(a,{style:{maxWidth:"100%"},children:f.name})}),!x&&e(u,{children:t(l,{children:[t("div",{style:{display:"flex",flexDirection:"row",gap:8},children:[e(o,{width:16,height:16,color:n.content.secondary}),e(c,{children:null===(z=null==f?void 0:f.headers)||void 0===z?void 0:z[0]})]}),t("div",{style:{display:"flex",flexDirection:"row",gap:8},children:[e(i,{width:16,height:16,color:n.content.secondary}),e(r,{width:16,height:16,color:n.content.secondary})]})]})}),e(p,{size:w,children:e(m,{size:null!=w?w:"large",content:null!=j?j:d(T,null!=y?y:[],void 0,null!=S?S:"")})})]})};export{v as default};

package/dist/esm/components/template-preview/SmsTemplatePreview.styled.d.ts

@@ -1,13 +1,13 @@
-export declare const SideCaret: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const SMSBubbleContainer: import("styled-components").StyledComponent<"div", any, {
-    size?: "small" | "large" | undefined;
-}, never>;
-export declare const SMSCardHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const SMSContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const SMSInnerContainer: import("styled-components").StyledComponent<"div", any, {
-    hideHeader?: boolean | undefined;
-    outsidePreview?: boolean | undefined;
-}, never>;
-export declare const BubbleSideCaret: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const BubbleContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const SMSHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const SideCaret: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const SMSBubbleContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    size?: "small" | "large";
+}>> & string;
+export declare const SMSCardHeader: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const SMSContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const SMSInnerContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    hideHeader?: boolean;
+    outsidePreview?: boolean;
+}>> & string;
+export declare const BubbleSideCaret: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const BubbleContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const SMSHeader: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/esm/components/template-preview/TemplatePreview.d.ts

@@ -1,28 +1,28 @@
-import React from 'react';
-import { CHANNEL_TYPE } from './models/Channels';
-import { EmailMeta } from './models/EmailTemplate';
-import { SMSMeta } from './models/SmsTemplate';
-import { AllTemplateTypes } from './models/types';
-import { WebpushMetaType } from './models/WebpushTemplate';
-import { WhatsappMeta } from './models/WhatsAppTemplate';
-export interface TemplatePreviewProps {
-    template?: AllTemplateTypes;
-    channel: CHANNEL_TYPE;
-    onlyTemplateContent?: boolean;
-    outsidePreview?: boolean;
-    templateCreationsInfo?: boolean;
-    whatsAppSpecificMeta?: WhatsappMeta;
-    emailSpecificMeta?: EmailMeta;
-    smsSpecificMeta?: SMSMeta;
-    hideHeader?: boolean;
-    size?: 'small' | 'large';
-    templateContainerStyles?: React.CSSProperties;
-    showSampleValues?: boolean;
-    carouselCardIndex?: number;
-    isWhatsappCarousel?: boolean;
-    isPreview?: boolean;
-    applyBorderBottom?: boolean;
-    webPushSpecificMeta?: WebpushMetaType;
-    hidePointerEvents?: boolean;
-}
-export declare const TemplatePreview: ({ template, channel, whatsAppSpecificMeta, templateCreationsInfo, hideHeader, size, onlyTemplateContent, emailSpecificMeta, smsSpecificMeta, showSampleValues, carouselCardIndex, isWhatsappCarousel, isPreview, applyBorderBottom, webPushSpecificMeta, hidePointerEvents, }: TemplatePreviewProps) => import("react/jsx-runtime").JSX.Element;
+import React from 'react';
+import { CHANNEL_TYPE } from './models/Channels';
+import { EmailMeta } from './models/EmailTemplate';
+import { SMSMeta } from './models/SmsTemplate';
+import { AllTemplateTypes } from './models/types';
+import { WebpushMetaType } from './models/WebpushTemplate';
+import { WhatsappMeta } from './models/WhatsAppTemplate';
+export interface TemplatePreviewProps {
+    template?: AllTemplateTypes;
+    channel: CHANNEL_TYPE;
+    onlyTemplateContent?: boolean;
+    outsidePreview?: boolean;
+    templateCreationsInfo?: boolean;
+    whatsAppSpecificMeta?: WhatsappMeta;
+    emailSpecificMeta?: EmailMeta;
+    smsSpecificMeta?: SMSMeta;
+    hideHeader?: boolean;
+    size?: 'small' | 'large';
+    templateContainerStyles?: React.CSSProperties;
+    showSampleValues?: boolean;
+    carouselCardIndex?: number;
+    isWhatsappCarousel?: boolean;
+    isPreview?: boolean;
+    applyBorderBottom?: boolean;
+    webPushSpecificMeta?: WebpushMetaType;
+    hidePointerEvents?: boolean;
+}
+export declare const TemplatePreview: ({ template, channel, whatsAppSpecificMeta, templateCreationsInfo, hideHeader, size, onlyTemplateContent, emailSpecificMeta, smsSpecificMeta, showSampleValues, carouselCardIndex, isWhatsappCarousel, isPreview, applyBorderBottom, webPushSpecificMeta, hidePointerEvents, }: TemplatePreviewProps) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/template-preview/TemplatePreview.js

@@ -1 +1 @@
-import{j as e}from"../../node_modules/react/jsx-runtime.js";import{useTemplateModalContext as t}from"../template-context-mapper/context/templateModalContext.js";import i from"../../utils/StringUtils.js";import{COLORS as l}from"../../constants/Theme.js";import n from"../../assets/icons/aiContentIcon.svg.js";import{TitleRegular as a}from"../TypographyStyle.js";import o from"./EmailTemplateThumbnailPreview.js";import{CHANNEL_TYPE as s}from"./models/Channels.js";import r from"./SmsTemplatePreview.js";import d from"./webpush/WebpushPreview.js";import p from"./WhatsAppTemplatePreview.js";const m=m=>{let{template:c,channel:v,whatsAppSpecificMeta:h,templateCreationsInfo:j,hideHeader:g,size:C,onlyTemplateContent:b,emailSpecificMeta:x,smsSpecificMeta:y,showSampleValues:S,carouselCardIndex:f,isWhatsappCarousel:w,isPreview:T,applyBorderBottom:O,webPushSpecificMeta:P,hidePointerEvents:I}=m;var W,H;const{setSelectedCarouselIndex:A}=t();return v===s.SMS?e.jsx("div",Object.assign({style:Object.assign({marginTop:j?16:0,border:j?`1px solid ${l.stroke.primary}`:"none",borderRadius:4},null==y?void 0:y.templateContainerStyles)},{children:e.jsx(r,{template:c,hideHeader:g,onlyTemplateContent:b,size:null!=C?C:"large",variableStore:null==y?void 0:y.smsVariableStore,display_content:null==y?void 0:y.smsDisplayContent,uniqueId:null==y?void 0:y.uniqueId})})):v===s.EMAIL?e.jsx("div",Object.assign({style:Object.assign({marginTop:j?16:0},null==x?void 0:x.templateContainerStyles)},{children:e.jsx(o,{template:c,handleViewTemplate:()=>{var e;null===(e=null==x?void 0:x.handleViewTemplate)||void 0===e||e.call(x)},hideHeader:g,hideViewButton:null==x?void 0:x.hideViewButtonForEmail,containerStyle:null==x?void 0:x.containerStyle,emailDisplayContent:null==x?void 0:x.emailDisplayContent,emailHtmlContainerId:null==x?void 0:x.emailHtmlContainerId,applyBorderBottom:O,hidePointerEvents:I})})):v===s.WHATSAPP||v===s.RCS?e.jsxs("div",Object.assign({style:Object.assign(Object.assign(Object.assign({},null==h?void 0:h.templateContainerStyles),j?u.WhatsAppWrapper:{}),{position:"relative"}),onClick:()=>{var e,t;if(A&&w){if(-1===f&&!(null===(t=null===(e=null==c?void 0:c.mapping)||void 0===e?void 0:e.body)||void 0===t?void 0:t.length))return;A(null!=f?f:-1)}}},{children:[j?e.jsx("div",Object.assign({style:{padding:16}},{children:e.jsx(a,{children:i.convertToTitleCase(null!==(W=null==c?void 0:c.label)&&void 0!==W?W:"")})})):e.jsx(e.Fragment,{}),e.jsx(p,{showSampleValues:S,showHeader:null==h?void 0:h.showWhatsAppHeader,extras:null==h?void 0:h.whatsAppExtras,template:c,size:j?"small":null!=C?C:"large",containerStyle:Object.assign(Object.assign({borderWidth:j?0:1,borderTopWidth:1},null!==(H=null==h?void 0:h.containerStyle)&&void 0!==H?H:{}),{height:"100%"}),zeroStateComponent:null==h?void 0:h.zeroStateComponent,usePlaceHolderName:null==h?void 0:h.usePlaceHolderName,carouselCardIndex:f,isWhatsappCarousel:w,isPreview:T,channel:v}),!!(null==c?void 0:c.aiContentConfigId)&&e.jsx("div",Object.assign({style:{position:"absolute",top:0,right:0,display:"flex",alignItems:"center",justifyContent:"center",width:48,height:48,zIndex:5}},{children:e.jsx(n,{width:48,height:48})}))]})):v==s.WEBPUSH?e.jsx("div",Object.assign({style:Object.assign({},null==P?void 0:P.containerStyle)},{children:e.jsx(d,{template:c,extraContainerCss:null==P?void 0:P.extraContainerCss})})):e.jsx(e.Fragment,{})},u={WhatsAppWrapper:{backgroundColor:l.surface.standard,borderRadius:4,border:`1px solid ${l.background.inactive}`,marginTop:16}};export{m as TemplatePreview};
+import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import{useTemplateModalContext as l}from"../template-context-mapper/context/templateModalContext.js";import n from"../../utils/StringUtils.js";import{COLORS as o}from"../../constants/Theme.js";import a from"../../assets/icons/aiContentIcon.svg.js";import{TitleRegular as r}from"../TypographyStyle.js";import s from"./EmailTemplateThumbnailPreview.js";import{CHANNEL_TYPE as d}from"./models/Channels.js";import p from"./SmsTemplatePreview.js";import m from"./webpush/WebpushPreview.js";import u from"./WhatsAppTemplatePreview.js";const c=c=>{let{template:h,channel:C,whatsAppSpecificMeta:y,templateCreationsInfo:g,hideHeader:S,size:b,onlyTemplateContent:f,emailSpecificMeta:j,smsSpecificMeta:w,showSampleValues:T,carouselCardIndex:x,isWhatsappCarousel:P,isPreview:I,applyBorderBottom:W,webPushSpecificMeta:H,hidePointerEvents:A}=c;var O,B;const{setSelectedCarouselIndex:E}=l();return C===d.SMS?e("div",{style:Object.assign({marginTop:g?16:0,border:g?`1px solid ${o.stroke.primary}`:"none",borderRadius:4},null==w?void 0:w.templateContainerStyles),children:e(p,{template:h,hideHeader:S,onlyTemplateContent:f,size:null!=b?b:"large",variableStore:null==w?void 0:w.smsVariableStore,display_content:null==w?void 0:w.smsDisplayContent,uniqueId:null==w?void 0:w.uniqueId})}):C===d.EMAIL?e("div",{style:Object.assign({marginTop:g?16:0},null==j?void 0:j.templateContainerStyles),children:e(s,{template:h,handleViewTemplate:()=>{var e;null===(e=null==j?void 0:j.handleViewTemplate)||void 0===e||e.call(j)},hideHeader:S,hideViewButton:null==j?void 0:j.hideViewButtonForEmail,containerStyle:null==j?void 0:j.containerStyle,emailDisplayContent:null==j?void 0:j.emailDisplayContent,emailHtmlContainerId:null==j?void 0:j.emailHtmlContainerId,applyBorderBottom:W,hidePointerEvents:A})}):C===d.WHATSAPP||C===d.RCS?t("div",{style:Object.assign(Object.assign(Object.assign({},null==y?void 0:y.templateContainerStyles),g?v.WhatsAppWrapper:{}),{position:"relative"}),onClick:()=>{var e,t;if(E&&P){if(-1===x&&!(null===(t=null===(e=null==h?void 0:h.mapping)||void 0===e?void 0:e.body)||void 0===t?void 0:t.length))return;E(null!=x?x:-1)}},children:[g?e("div",{style:{padding:16},children:e(r,{children:n.convertToTitleCase(null!==(O=null==h?void 0:h.label)&&void 0!==O?O:"")})}):e(i,{}),e(u,{showSampleValues:T,showHeader:null==y?void 0:y.showWhatsAppHeader,extras:null==y?void 0:y.whatsAppExtras,template:h,size:g?"small":null!=b?b:"large",containerStyle:Object.assign(Object.assign({borderWidth:g?0:1,borderTopWidth:1},null!==(B=null==y?void 0:y.containerStyle)&&void 0!==B?B:{}),{height:"100%"}),zeroStateComponent:null==y?void 0:y.zeroStateComponent,usePlaceHolderName:null==y?void 0:y.usePlaceHolderName,carouselCardIndex:x,isWhatsappCarousel:P,isPreview:I,channel:C}),!!(null==h?void 0:h.aiContentConfigId)&&e("div",{style:{position:"absolute",top:0,right:0,display:"flex",alignItems:"center",justifyContent:"center",width:48,height:48,zIndex:5},children:e(a,{width:48,height:48})})]}):C==d.WEBPUSH?e("div",{style:Object.assign({},null==H?void 0:H.containerStyle),children:e(m,{template:h,extraContainerCss:null==H?void 0:H.extraContainerCss})}):e(i,{})},v={WhatsAppWrapper:{backgroundColor:o.surface.standard,borderRadius:4,border:`1px solid ${o.background.inactive}`,marginTop:16}};export{c as TemplatePreview};

package/dist/esm/components/template-preview/WhatsApp/ChatBtn.d.ts

@@ -1,10 +1,10 @@
-import React from 'react';
-export declare const ChatBtn: React.FC<{
-    Icon?: React.FC<React.SVGProps<SVGSVGElement>>;
-    text: string;
-    extraContent?: string;
-    placeholder?: string;
-    textTypography?: React.FC;
-    size?: 'small' | 'large';
-    iconPosition?: 'left' | 'right';
-}>;
+import React from 'react';
+export declare const ChatBtn: React.FC<{
+    Icon?: React.FC<React.SVGProps<SVGSVGElement>>;
+    text: string;
+    extraContent?: string;
+    placeholder?: string;
+    textTypography?: React.FC;
+    size?: 'small' | 'large';
+    iconPosition?: 'left' | 'right';
+}>;

package/dist/esm/components/template-preview/WhatsApp/ChatBtn.js

@@ -1 +1 @@
-import{j as e}from"../../../node_modules/react/jsx-runtime.js";import{Caption as t,BodySecondary as r}from"../../TypographyStyle.js";import{COLORS as o}from"../../../constants/Theme.js";import{ChatBtnContainer as i}from"./ChatUI.style.js";const n=n=>{let{Icon:s,text:l,extraContent:c,placeholder:a,textTypography:p,size:h,iconPosition:d="left"}=n;const f=p||r;return e.jsx(i,{children:e.jsxs("div",Object.assign({style:{textAlign:"center",maxWidth:"100%"}},{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center"}},{children:[s&&"left"===d&&e.jsx(s,{color:o.special.brand.facebook,height:16,width:16,style:{marginRight:8}}),e.jsx(f,Object.assign({style:{color:o.special.brand.facebook,textAlign:"center",fontSize:"small"===h?12:14,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"}},{children:l})),s&&"right"===d&&e.jsx(s,{color:o.special.brand.facebook,height:16,width:16,style:{marginLeft:8}})]})),!!c&&e.jsx(t,Object.assign({style:{marginTop:2,color:o.content.placeholder,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"}},{children:a?function(e){return e.replace("[[","").replace("]]","").replace(/([A-Z])/g," $1").replace(/^./,(function(e){return e.toUpperCase()}))}(a):c}))]}))})};export{n as ChatBtn};
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{Caption as r,BodySecondary as o}from"../../TypographyStyle.js";import{COLORS as i}from"../../../constants/Theme.js";import{ChatBtnContainer as l}from"./ChatUI.style.js";const n=n=>{let{Icon:c,text:a,extraContent:s,placeholder:p,textTypography:h,size:d,iconPosition:f="left"}=n;const m=h||o;return e(l,{children:t("div",{style:{textAlign:"center",maxWidth:"100%"},children:[t("div",{style:{display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center"},children:[c&&"left"===f&&e(c,{color:i.special.brand.facebook,height:16,width:16,style:{marginRight:8}}),e(m,{style:{color:i.special.brand.facebook,textAlign:"center",fontSize:"small"===d?12:14,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"},children:a}),c&&"right"===f&&e(c,{color:i.special.brand.facebook,height:16,width:16,style:{marginLeft:8}})]}),!!s&&e(r,{style:{marginTop:2,color:i.content.placeholder,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"},children:p?function(e){return e.replace("[[","").replace("]]","").replace(/([A-Z])/g," $1").replace(/^./,(function(e){return e.toUpperCase()}))}(p):s})]})})};export{n as ChatBtn};

package/dist/esm/components/template-preview/WhatsApp/ChatHeader.d.ts

@@ -1,2 +1,2 @@
-declare const ChatHeader: () => import("react/jsx-runtime").JSX.Element;
-export default ChatHeader;
+declare const ChatHeader: () => import("react/jsx-runtime").JSX.Element;
+export default ChatHeader;

package/dist/esm/components/template-preview/WhatsApp/ChatHeader.js

@@ -1 +1 @@
-import{j as s}from"../../../node_modules/react/jsx-runtime.js";import r from"../../../assets/icons/arrow_left.svg.js";import e from"../../../assets/icons/user_icon.svg.js";import o from"../../../assets/icons/vertical_dots.svg.js";import{BodyTiny as t}from"../../TypographyStyle.js";import{COLORS as n}from"../../../constants/Theme.js";import{HeaderContainer as i,LeftContainer as c,IconContainer as m,TitleContainer as a,SubTitle as j}from"./ChatHeader.style.js";const h=()=>s.jsxs(i,{children:[s.jsxs(c,{children:[s.jsx(r,{height:16,width:16,color:n.content.primaryInverse}),s.jsx(m,{children:s.jsx(e,{height:14,width:14,color:n.content.primaryInverse})}),s.jsxs(a,{children:[s.jsx(t,Object.assign({color:n.content.primaryInverse},{children:"Brand name"})),s.jsx(j,{children:"Business account"})]})]}),s.jsx(o,{height:16,width:16,color:n.content.primaryInverse})]});export{h as default};
+import{jsxs as r,jsx as e}from"react/jsx-runtime";import t from"../../../assets/icons/arrow_left.svg.js";import o from"../../../assets/icons/user_icon.svg.js";import s from"../../../assets/icons/vertical_dots.svg.js";import{BodyTiny as i}from"../../TypographyStyle.js";import{COLORS as n}from"../../../constants/Theme.js";import{HeaderContainer as c,LeftContainer as m,IconContainer as a,TitleContainer as h,SubTitle as l}from"./ChatHeader.style.js";const p=()=>r(c,{children:[r(m,{children:[e(t,{height:16,width:16,color:n.content.primaryInverse}),e(a,{children:e(o,{height:14,width:14,color:n.content.primaryInverse})}),r(h,{children:[e(i,{color:n.content.primaryInverse,children:"Brand name"}),e(l,{children:"Business account"})]})]}),e(s,{height:16,width:16,color:n.content.primaryInverse})]});export{p as default};

package/dist/esm/components/template-preview/WhatsApp/ChatHeader.style.d.ts

@@ -1,5 +1,5 @@
-export declare const HeaderContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const LeftContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const IconContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const TitleContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const SubTitle: import("styled-components").StyledComponent<"p", any, {}, never>;
+export declare const HeaderContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const LeftContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const IconContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const TitleContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const SubTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;

package/dist/esm/components/template-preview/WhatsApp/ChatUI.d.ts

@@ -1,3 +1,3 @@
-import { WhatsappLikePreviewTypes } from '../models/WhatsAppTemplate';
-declare const ChatUI: (props: WhatsappLikePreviewTypes) => import("react/jsx-runtime").JSX.Element;
-export default ChatUI;
+import { WhatsappLikePreviewTypes } from '../models/WhatsAppTemplate';
+declare const ChatUI: (props: WhatsappLikePreviewTypes) => import("react/jsx-runtime").JSX.Element;
+export default ChatUI;

package/dist/esm/components/template-preview/WhatsApp/ChatUI.js

@@ -1,7 +1,7 @@
-import{j as e}from"../../../node_modules/react/jsx-runtime.js";import t from"../../../assets/icons/halfRectangle.svg.js";import r from"../../../assets/icons/phone.svg.js";import o from"../../../assets/icons/RedirectToNew.svg.js";import{useMemo as s}from"react";import i from"styled-components";import{Tooltip as a}from"../../tooltips/Tooltip.js";import{BodySecondary as n,Caption as l}from"../../TypographyStyle.js";import{COLORS as m,FONTS as p}from"../../../constants/Theme.js";import{WhatsAppFormatToHTML as d}from"../helpers/WhatsAppFormatToHTML.js";import{HEADER_TYPES as c,ACTIONS_TYPES as h}from"../models/TemplateMeta.js";import{ChatBtn as x}from"./ChatBtn.js";import{Container as j,FooterWrapper as g,FooterText as f,TimeStamp as y}from"./ChatUI.style.js";import{MediaCard as T}from"./MediaCard.js";import v from"./RenderTemplateWithVariable.js";const w=i.div`
+import{jsxs as e,jsx as t,Fragment as r}from"react/jsx-runtime";import o from"../../../assets/icons/halfRectangle.svg.js";import i from"../../../assets/icons/phone.svg.js";import a from"../../../assets/icons/RedirectToNew.svg.js";import{useMemo as s}from"react";import l from"styled-components";import{Tooltip as n}from"../../tooltips/Tooltip.js";import{BodySecondary as p,Caption as m}from"../../TypographyStyle.js";import{COLORS as d,FONTS as h}from"../../../constants/Theme.js";import{WhatsAppFormatToHTML as c}from"../helpers/WhatsAppFormatToHTML.js";import{HEADER_TYPES as f,ACTIONS_TYPES as y}from"../models/TemplateMeta.js";import{ChatBtn as T}from"./ChatBtn.js";import{Container as g,FooterWrapper as x,FooterText as v,TimeStamp as w}from"./ChatUI.style.js";import{MediaCard as j}from"./MediaCard.js";import u from"./RenderTemplateWithVariable.js";const b=l.div`
 	position: absolute;
 	width: 8px;
 	height: 8px;
 	left: -7.7px;
 	top: -8px;
-`,b=i=>{const{bodyText:b,footerText:u,headerMediaType:S,headerText:N,headerAssetLink:A,headerAssetName:M,quickReplybtn:C,ctaBtn:F,actionTypes:L,textType:k,extras:z,showHeader:B,imagePreviewStyles:E,size:I,children:P,isPreview:R}=i,W=new d,_=s((()=>({color:m.content.primary,margin:12,fontSize:B?p.caption.fontSize:p.bodySecondary.fontSize,fontWeight:p.bodySecondary.fontWeight,maxWidth:"100%",whiteSpace:"pre-wrap",marginBottom:0,marginTop:8,wordBreak:"break-word"})),[]);return e.jsxs(j,Object.assign({isPreview:R},{children:[e.jsx(w,{children:e.jsx(t,{color:"white",height:8,width:8})}),S===c.TEXT?e.jsx(v,{bold:!0,text:null==N?void 0:N.replace(/</g,"&lt;").replace(/>/g,"&gt;")}):S!==c.NONE?e.jsx(T,{headerAssetLink:A,headerAssetName:M,mediaType:S,imagePreviewStyles:S===c.IMAGE?E:{}}):e.jsx(e.Fragment,{}),!!b&&e.jsx(e.Fragment,{children:P?e.jsx(e.Fragment,{children:P}):e.jsx(e.Fragment,{children:"html"===k?e.jsx("div",{className:"richTextEditor",style:_,dangerouslySetInnerHTML:{__html:W.convertToHTML(b)}}):e.jsx(n,{children:null==b?void 0:b.replace(/</g,"&lt;").replace(/>/g,"&gt;")})})}),e.jsxs(g,{children:[e.jsx(a,Object.assign({body:null!=u?u:"",placement:"top"},{children:e.jsx(f,Object.assign({style:{flex:1}},{children:u}))})),e.jsx(y,{children:"16:48"})]}),L===h.QUICK_REPLY?e.jsx("div",{children:null==C?void 0:C.map(((t,r)=>e.jsx(x,{text:t.text},r)))}):L===h.CTA_BTN?e.jsx("div",{children:null==F?void 0:F.map(((t,s)=>e.jsx(x,{textTypography:B?l:n,extraContent:z?t.extra:void 0,placeholder:t.placeholder,text:t.text,Icon:"phoneNumber"===t.type?r:o,size:I},s)))}):e.jsx(e.Fragment,{})]}))};export{b as default};
+`,S=l=>{const{bodyText:S,footerText:N,headerMediaType:A,headerText:M,headerAssetLink:C,headerAssetName:L,quickReplybtn:k,ctaBtn:z,actionTypes:B,textType:E,extras:I,showHeader:P,imagePreviewStyles:R,size:W,children:H,isPreview:_}=l,U=new c,q=s((()=>({color:d.content.primary,margin:12,fontSize:P?h.caption.fontSize:h.bodySecondary.fontSize,fontWeight:h.bodySecondary.fontWeight,maxWidth:"100%",whiteSpace:"pre-wrap",marginBottom:0,marginTop:8,wordBreak:"break-word"})),[]);return e(g,{isPreview:_,children:[t(b,{children:t(o,{color:"white",height:8,width:8})}),A===f.TEXT?t(u,{bold:!0,text:null==M?void 0:M.replace(/</g,"&lt;").replace(/>/g,"&gt;")}):A!==f.NONE?t(j,{headerAssetLink:C,headerAssetName:L,mediaType:A,imagePreviewStyles:A===f.IMAGE?R:{}}):t(r,{}),!!S&&t(r,{children:t(r,H?{children:H}:{children:"html"===E?t("div",{className:"richTextEditor",style:q,dangerouslySetInnerHTML:{__html:U.convertToHTML(S)}}):t(p,{children:null==S?void 0:S.replace(/</g,"&lt;").replace(/>/g,"&gt;")})})}),e(x,{children:[t(n,{body:null!=N?N:"",placement:"top",children:t(v,{style:{flex:1},children:N})}),t(w,{children:"16:48"})]}),B===y.QUICK_REPLY?t("div",{children:null==k?void 0:k.map(((e,r)=>t(T,{text:e.text},r)))}):B===y.CTA_BTN?t("div",{children:null==z?void 0:z.map(((e,r)=>t(T,{textTypography:P?m:p,extraContent:I?e.extra:void 0,placeholder:e.placeholder,text:e.text,Icon:"phoneNumber"===e.type?i:a,size:W},r)))}):t(r,{})]})};export{S as default};

package/dist/esm/components/template-preview/WhatsApp/ChatUI.style.d.ts

@@ -1,21 +1,21 @@
-export declare const Container: import("styled-components").StyledComponent<"div", any, {
-    isCarouselCard?: boolean | undefined;
-    showBorder?: boolean | undefined;
-    showDashedBorder?: boolean | undefined;
-    isWhatsappCarousel?: boolean | undefined;
-    hasError?: boolean | undefined;
-    isPreview?: boolean | undefined;
-}, never>;
-export declare const TimeStamp: import("styled-components").StyledComponent<"div", any, {
-    numberOfLines?: number | undefined;
-    color?: string | undefined;
-}, never>;
-export declare const FooterText: import("styled-components").StyledComponent<"div", any, {
-    numberOfLines?: number | undefined;
-    color?: string | undefined;
-}, never>;
-export declare const MediaContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const ChatBtnContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const FooterWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const MediaNameAbsWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const DownloadMediaIconHolder: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const Container: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    isCarouselCard?: boolean;
+    showBorder?: boolean;
+    showDashedBorder?: boolean;
+    isWhatsappCarousel?: boolean;
+    hasError?: boolean;
+    isPreview?: boolean;
+}>> & string;
+export declare const TimeStamp: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "color" | "numberOfLines"> & {
+    numberOfLines?: number;
+    color?: string;
+}, never>> & string;
+export declare const FooterText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "color" | "numberOfLines"> & {
+    numberOfLines?: number;
+    color?: string;
+}, never>, never>> & string;
+export declare const MediaContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const ChatBtnContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const FooterWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const MediaNameAbsWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const DownloadMediaIconHolder: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/esm/components/template-preview/WhatsApp/ChatUiV2.d.ts

@@ -1,3 +1,3 @@
-import { WhatsappLikePreviewTypes } from '../models/WhatsAppTemplate';
-export declare const HtmlContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const ChatUIV2: (props: WhatsappLikePreviewTypes) => import("react/jsx-runtime").JSX.Element;
+import { WhatsappLikePreviewTypes } from '../models/WhatsAppTemplate';
+export declare const HtmlContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const ChatUIV2: (props: WhatsappLikePreviewTypes) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/template-preview/WhatsApp/ChatUiV2.js

@@ -1,19 +1,19 @@
-import{j as e}from"../../../node_modules/react/jsx-runtime.js";import t from"../../../assets/icons/chevronDownOutline.svg.js";import o from"../../../assets/icons/copy-code-icon.svg.js";import s from"../../../assets/icons/halfRectangle.svg.js";import r from"../../../assets/icons/phone.svg.js";import i from"../../../assets/icons/qrb.svg.js";import l from"../../../assets/icons/RedirectToNew.svg.js";import n from"styled-components";import{useTemplateModalContext as a}from"../../template-context-mapper/context/templateModalContext.js";import{Tooltip as p}from"../../tooltips/Tooltip.js";import{TitleSmall as d,Caption as m,BodySecondary as x}from"../../TypographyStyle.js";import{COLORS as c}from"../../../constants/Theme.js";import{VariableEditorHelper as h}from"../helpers/VariableEditorHelper.js";import{HEADER_TYPES as j,ACTIONS_TYPES as f}from"../models/TemplateMeta.js";import{ChatBtn as g}from"./ChatBtn.js";import{Container as u,FooterWrapper as y,FooterText as C,TimeStamp as T}from"./ChatUI.style.js";import{LimitedTimeOffer as v}from"./LimitedTimeOffer/LimitedTimeOffer.index.js";import{MediaCard as I}from"./MediaCard.js";const L=n.div`
+import{jsxs as e,jsx as t,Fragment as o}from"react/jsx-runtime";import r from"../../../assets/icons/chevronDownOutline.svg.js";import i from"../../../assets/icons/copy-code-icon.svg.js";import s from"../../../assets/icons/halfRectangle.svg.js";import l from"../../../assets/icons/phone.svg.js";import n from"../../../assets/icons/qrb.svg.js";import a from"../../../assets/icons/RedirectToNew.svg.js";import p from"styled-components";import{useTemplateModalContext as d}from"../../template-context-mapper/context/templateModalContext.js";import{Tooltip as m}from"../../tooltips/Tooltip.js";import{TitleSmall as h,Caption as c,BodySecondary as f}from"../../TypographyStyle.js";import{COLORS as x}from"../../../constants/Theme.js";import{VariableEditorHelper as y}from"../helpers/VariableEditorHelper.js";import{HEADER_TYPES as u,ACTIONS_TYPES as g}from"../models/TemplateMeta.js";import{ChatBtn as C}from"./ChatBtn.js";import{Container as T,FooterWrapper as v,FooterText as I,TimeStamp as L}from"./ChatUI.style.js";import{LimitedTimeOffer as w}from"./LimitedTimeOffer/LimitedTimeOffer.index.js";import{MediaCard as j}from"./MediaCard.js";const E=p.div`
 	position: absolute;
 	width: 8px;
 	height: 8px;
 	left: -7.7px;
 	top: -8px;
-`,w=n.div`
+`,O=p.div`
 	font-family: 'Inter';
 	font-style: normal;
 	font-weight: 400;
 	font-size: 14px;
 	line-height: 20px;
 	padding: 8px 12px 0px;
-	color: ${c.content.primary};
+	color: ${x.content.primary};
 	word-wrap: break-word;
-`,O=n(w)`
+`,P=p(O)`
 	font-weight: 600;
 	margin-bottom: 8px;
-`,b=new h,E=n=>{const{bodyText:c,footerText:h,headerMediaType:E,headerText:_,headerAssetLink:P,headerAssetName:N,quickReplybtn:M,ctaBtn:S,actionTypes:A,extras:R,showHeader:B,imagePreviewStyles:H,size:F,bodyVariableList:U,headerVariableList:k,buttons:z,limitedTimeOfferComponent:D,carouselCardIndex:V,isWhatsappCarousel:Y,isPreview:q,children:K,hideFooter:Q=!1}=n,W=b.format(null==c?void 0:c.replace(/</g,"&lt;").replace(/>/g,"&gt;"),U),G=b.format(null==_?void 0:_.replace(/</g,"&lt;").replace(/>/g,"&gt;"),k),{selectedCarouselIndex:X,isProductCarouselType:$,errorIndexes:J,isCarouselHovered:Z}=a(),ee={COPY_CODE:o,PHONE_NUMBER:r,URL:l,QUICK_REPLY:i,VOICE_CALL:r,CALL_PERMISSION:t};return e.jsxs(u,Object.assign({isCarouselCard:null!=V&&V>-1,showBorder:null!=V&&V===X||$&&null!=V&&V>-1&&null!=X&&X>-1,hasError:null==J?void 0:J.includes(null!=V?V:-2),isWhatsappCarousel:Y,isPreview:q,showDashedBorder:$&&Z&&(null!=X?X:-1)<0&&(null!=V?V:-1)>-1},{children:[!Y&&e.jsx(L,{children:e.jsx(s,{color:"white",height:8,width:8})}),E===j.TEXT?e.jsx(O,{dangerouslySetInnerHTML:{__html:G}}):E!==j.NONE?e.jsx(I,{headerAssetLink:P,headerAssetName:N,mediaType:E,imagePreviewStyles:E===j.IMAGE?H:{}}):e.jsx(e.Fragment,{}),(null==D?void 0:D.dateTime)?e.jsx(v,{text:D.text,dateTime:D.dateTime,code:D.code}):e.jsx(e.Fragment,{}),!!c&&e.jsx(e.Fragment,{children:e.jsx(w,{dangerouslySetInnerHTML:{__html:W},style:{flex:1}})}),K,!Q&&e.jsxs(y,{children:[e.jsx(p,Object.assign({body:null!=h?h:"",placement:"top"},{children:e.jsx(C,Object.assign({style:{flex:1}},{children:h}))})),e.jsx(T,{children:"16:48"})]}),z&&z.length>0?z.map(((t,o)=>e.jsx(g,{text:"COPY_CODE"===t.type?"Copy code":t.text,Icon:ee[t.type],size:F,iconPosition:"CALL_PERMISSION"===t.type?"right":"left",textTypography:"CALL_PERMISSION"===t.type?d:void 0},o))):A===f.QUICK_REPLY?e.jsx("div",{children:null==M?void 0:M.map(((t,o)=>e.jsx(g,{text:t.text},o)))}):A===f.CTA_BTN?e.jsx("div",{children:null==S?void 0:S.map(((t,o)=>e.jsx(g,{textTypography:B?m:x,extraContent:R?t.extra:void 0,placeholder:t.placeholder,text:t.text,Icon:"phoneNumber"===t.type?r:l,size:F},o)))}):e.jsx(e.Fragment,{})]}))};export{E as ChatUIV2,w as HtmlContainer};
+`,_=new y,b=p=>{const{bodyText:x,footerText:y,headerMediaType:b,headerText:N,headerAssetLink:M,headerAssetName:S,quickReplybtn:A,ctaBtn:R,actionTypes:B,extras:H,showHeader:U,imagePreviewStyles:k,size:z,bodyVariableList:D,headerVariableList:V,buttons:Y,limitedTimeOfferComponent:q,carouselCardIndex:K,isWhatsappCarousel:Q,isPreview:W,children:F,hideFooter:G=!1}=p,X=_.format(null==x?void 0:x.replace(/</g,"&lt;").replace(/>/g,"&gt;"),D),$=_.format(null==N?void 0:N.replace(/</g,"&lt;").replace(/>/g,"&gt;"),V),{selectedCarouselIndex:J,isProductCarouselType:Z,errorIndexes:ee,isCarouselHovered:te}=d(),oe={COPY_CODE:i,PHONE_NUMBER:l,URL:a,QUICK_REPLY:n,VOICE_CALL:l,CALL_PERMISSION:r};return e(T,{isCarouselCard:null!=K&&K>-1,showBorder:null!=K&&K===J||Z&&null!=K&&K>-1&&null!=J&&J>-1,hasError:null==ee?void 0:ee.includes(null!=K?K:-2),isWhatsappCarousel:Q,isPreview:W,showDashedBorder:Z&&te&&(null!=J?J:-1)<0&&(null!=K?K:-1)>-1,children:[!Q&&t(E,{children:t(s,{color:"white",height:8,width:8})}),b===u.TEXT?t(P,{dangerouslySetInnerHTML:{__html:$}}):b!==u.NONE?t(j,{headerAssetLink:M,headerAssetName:S,mediaType:b,imagePreviewStyles:b===u.IMAGE?k:{}}):t(o,{}),(null==q?void 0:q.dateTime)?t(w,{text:q.text,dateTime:q.dateTime,code:q.code}):t(o,{}),!!x&&t(o,{children:t(O,{dangerouslySetInnerHTML:{__html:X},style:{flex:1}})}),F,!G&&e(v,{children:[t(m,{body:null!=y?y:"",placement:"top",children:t(I,{style:{flex:1},children:y})}),t(L,{children:"16:48"})]}),Y&&Y.length>0?Y.map(((e,o)=>t(C,{text:"COPY_CODE"===e.type?"Copy code":e.text,Icon:oe[e.type],size:z,iconPosition:"CALL_PERMISSION"===e.type?"right":"left",textTypography:"CALL_PERMISSION"===e.type?h:void 0},o))):B===g.QUICK_REPLY?t("div",{children:null==A?void 0:A.map(((e,o)=>t(C,{text:e.text},o)))}):B===g.CTA_BTN?t("div",{children:null==R?void 0:R.map(((e,o)=>t(C,{textTypography:U?c:f,extraContent:H?e.extra:void 0,placeholder:e.placeholder,text:e.text,Icon:"phoneNumber"===e.type?l:a,size:z},o)))}):t(o,{})]})};export{b as ChatUIV2,O as HtmlContainer};

package/dist/esm/components/template-preview/WhatsApp/LimitedTimeOffer/LimitedTimeOffer.index.d.ts

@@ -1,9 +1,9 @@
-import { CreateTemplateType } from '../../models/WhatsAppTemplate';
-/**
- * Renders Limited Time Offer component
- * Type of props is infered from template
- */
-export declare const LimitedTimeOffer: (props: CreateTemplateType['limitedTimeOfferComponent']) => import("react/jsx-runtime").JSX.Element;
-export declare const StyledLimitedOfferTime: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const StyledLtoIcon: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const StyledLtoText: import("styled-components").StyledComponent<"div", any, {}, never>;
+import { CreateTemplateType } from '../../models/WhatsAppTemplate';
+/**
+ * Renders Limited Time Offer component
+ * Type of props is infered from template
+ */
+export declare const LimitedTimeOffer: (props: CreateTemplateType["limitedTimeOfferComponent"]) => import("react/jsx-runtime").JSX.Element;
+export declare const StyledLimitedOfferTime: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledLtoIcon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledLtoText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/esm/components/template-preview/WhatsApp/LimitedTimeOffer/LimitedTimeOffer.index.js

@@ -1,11 +1,11 @@
-import{j as e}from"../../../../node_modules/react/jsx-runtime.js";import n from"../../../../assets/icons/lto_icon.svg.js";import r from"styled-components";import{BodySecondary as s,BodyTiny as o}from"../../../TypographyStyle.js";import{COLORS as i}from"../../../../constants/Theme.js";const t=r=>{const{text:t,dateTime:a,code:f}=r;return e.jsxs(c,{children:[e.jsx(d,{children:e.jsx(n,{width:24,height:24,style:{display:"flex"}})}),e.jsxs(l,{children:[e.jsx(s,Object.assign({numberOfLines:2,color:i.content.primary},{children:t})),e.jsxs(o,Object.assign({numberOfLines:3,style:{overflowWrap:"anywhere"},color:i.content.secondary},{children:["Offer Ends on ",a]})),e.jsxs(o,Object.assign({numberOfLines:2,color:i.content.placeholder},{children:["Code ",f]}))]})]})},c=r.div`
+import{jsxs as e,jsx as r}from"react/jsx-runtime";import n from"../../../../assets/icons/lto_icon.svg.js";import o from"styled-components";import{BodySecondary as i,BodyTiny as t}from"../../../TypographyStyle.js";import{COLORS as l}from"../../../../constants/Theme.js";const c=o=>{const{text:c,dateTime:m,code:p}=o;return e(d,{children:[r(s,{children:r(n,{width:24,height:24,style:{display:"flex"}})}),e(f,{children:[r(i,{numberOfLines:2,color:l.content.primary,children:c}),e(t,{numberOfLines:3,style:{overflowWrap:"anywhere"},color:l.content.secondary,children:["Offer Ends on ",m]}),e(t,{numberOfLines:2,color:l.content.placeholder,children:["Code ",p]})]})]})},d=o.div`
 	display: flex;
 	flex-direction: row;
 	background: #f6f6f6;
 	margin: 0px 10px;
 	overflow: hidden;
 	align-items: center;
-`,d=r.div`
+`,s=o.div`
 	width: 48px;
 	height: 48px;
 	display: flex;
@@ -14,8 +14,8 @@ import{j as e}from"../../../../node_modules/react/jsx-runtime.js";import n from"
 	border-radius: 24px;
 	background: #d8f0e7;
 	margin: 5px;
-`,l=r.div`
+`,f=o.div`
 	display: flex;
 	flex-direction: column;
 	flex: 1;
-`;export{t as LimitedTimeOffer,c as StyledLimitedOfferTime,d as StyledLtoIcon,l as StyledLtoText};
+`;export{c as LimitedTimeOffer,d as StyledLimitedOfferTime,s as StyledLtoIcon,f as StyledLtoText};