@bikdotai/bik-component-library 0.0.433-beta.14 → 0.0.433-beta.15

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"),l=require("react"),t=require("../../utils/StringUtils.js"),a=require("../modals/styledModal.js"),o=require("../template-preview/models/Channels.js"),s=require("./context/templateModalContext.js"),r=require("./modalElements/Footer.js"),i=require("./modalElements/TemplateSelectModalContent.js"),n=require("./utils/convertPlaceholdersToBikDropdown.js");exports.TemplateContextMapper=d=>{let{selectedTemplate:u,closeDialog:c,showVariableMapping:p,channel:m,htmlContent:v,templateVariables:C,onTemplateSelect:h,globalPlaceholders:S,showOnlyContent:b,whatsappSpecificPickerMeta:g,zIndex:x,showVariableModal:T,variableList:E,discountCode:P,setDiscountCode:j,onBackPress:M,enabledCustomText:L,variableListForImage:I,showSampleValues:f,disableEditVariable:w,pod:A,extras:y,pickerConf:N}=d;var V,k,q,H,_,D;l.useEffect((()=>{W(v)}),[v]);const O=m===o.CHANNEL_TYPE.WHATSAPP&&"CAROUSEL"===(null===(k=null===(V=u.components)||void 0===V?void 0:V[1])||void 0===k?void 0:k.type),[F,Y]=l.useState(m===o.CHANNEL_TYPE.EMAIL||O?"desktop":"mobile"),[B,W]=l.useState(v),[z,U]=l.useState(!1),[$,R]=l.useState([]),[G,J]=l.useState(u),[K,Q]=l.useState(null!=C?C:[]),[X,Z]=l.useState(!1),[ee,le]=l.useState(-1);const te=l.useMemo((()=>n.convertPlaceholdersToBikDropdown(S)),[S]);return e.jsx(s.TemplateModalContext.Provider,Object.assign({value:{template:G,setTemplate:J,device:F,setDevice:Y,display_content:B,setDisplayContent:W,originalVariableList:K,setOriginalVariableList:Q,isError:z,setIsError:U,channel:m,globalNormalizedPlaceholders:te,templateSelectionTriggered:X,setTemplateSelectionTriggered:Z,enabledCustomText:L,disableEditVariable:w,pod:A,extras:y,isWhatsappCarousel:O,selectedCarouselIndex:ee,setSelectedCarouselIndex:le,isProductCarouselType:u.isProductCarouselType,cardCount:null===(H=null===(q=u.components)||void 0===q?void 0:q[1].cards)||void 0===H?void 0:H.length,errorIndexes:$,setErrorIndexes:R,pickerConf:N}},{children:b?e.jsx(i.default,{channel:o.CHANNEL_TYPE.EMAIL,hideHeader:!0}):e.jsxs(a.StyledModal,Object.assign({zIndex:x,centralContainerStyles:{width:O?900:m===o.CHANNEL_TYPE.EMAIL&&p?1e3:800},open:!0,onClose:()=>{null==c||c()},headingTitle:null==G?void 0:G.label,headingSubtitle:m===o.CHANNEL_TYPE.WHATSAPP?`${t.default.capitaliseFirstLetterOfString(null!==(_=null==G?void 0:G.category)&&void 0!==_?_:"")} • ${null!==(D=null==G?void 0:G.templateCategory)&&void 0!==D?D:""}`:"",onBackPress:()=>{null==M||M()}},{children:[e.jsx(i.default,{showSampleValues:f,showVariableMapping:p,channel:m,whatsappSpecificPickerMeta:g,showVariableModal:T,variableList:E,discountCode:P,setDiscountCode:j,variableListForImage:I&&(null==I?void 0:I.length)>0?I:E}),h?e.jsx(r.default,{isWhatsappCarousel:null!=O&&O,onSelect:function(){const e=null==h?void 0:h(G,K,null!=B?B:"");console.log("error: ",e),R([-1,2]),(null==e?void 0:e.errorIndexes)?R(e.errorIndexes):(null==e?void 0:e.error)?U(!!(null==e?void 0:e.error)):Z(!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"),o=require("../template-preview/models/Channels.js"),s=require("./context/templateModalContext.js"),r=require("./modalElements/Footer.js"),i=require("./modalElements/TemplateSelectModalContent.js"),n=require("./utils/convertPlaceholdersToBikDropdown.js");exports.TemplateContextMapper=d=>{let{selectedTemplate:u,closeDialog:c,showVariableMapping:p,channel:m,htmlContent:v,templateVariables:C,onTemplateSelect:h,globalPlaceholders:S,showOnlyContent:b,whatsappSpecificPickerMeta:x,zIndex:g,showVariableModal:T,variableList:E,discountCode:P,setDiscountCode:j,onBackPress:M,enabledCustomText:L,variableListForImage:I,showSampleValues:f,disableEditVariable:w,pod:A,extras:y,pickerConf:N}=d;var V,k,q,H,_,D;t.useEffect((()=>{W(v)}),[v]);const O=m===o.CHANNEL_TYPE.WHATSAPP&&"CAROUSEL"===(null===(k=null===(V=u.components)||void 0===V?void 0:V[1])||void 0===k?void 0:k.type),[F,Y]=t.useState(m===o.CHANNEL_TYPE.EMAIL||O?"desktop":"mobile"),[B,W]=t.useState(v),[z,U]=t.useState(!1),[$,R]=t.useState([]),[G,J]=t.useState(u),[K,Q]=t.useState(null!=C?C:[]),[X,Z]=t.useState(!1),[ee,te]=t.useState(-1);const le=t.useMemo((()=>n.convertPlaceholdersToBikDropdown(S)),[S]);return e.jsx(s.TemplateModalContext.Provider,Object.assign({value:{template:G,setTemplate:J,device:F,setDevice:Y,display_content:B,setDisplayContent:W,originalVariableList:K,setOriginalVariableList:Q,isError:z,setIsError:U,channel:m,globalNormalizedPlaceholders:le,templateSelectionTriggered:X,setTemplateSelectionTriggered:Z,enabledCustomText:L,disableEditVariable:w,pod:A,extras:y,isWhatsappCarousel:O,selectedCarouselIndex:ee,setSelectedCarouselIndex:te,isProductCarouselType:u.isProductCarouselType,cardCount:null===(H=null===(q=u.components)||void 0===q?void 0:q[1].cards)||void 0===H?void 0:H.length,errorIndexes:$,setErrorIndexes:R,pickerConf:N}},{children:b?e.jsx(i.default,{channel:o.CHANNEL_TYPE.EMAIL,hideHeader:!0}):e.jsxs(a.StyledModal,Object.assign({zIndex:g,centralContainerStyles:{width:O?900:m===o.CHANNEL_TYPE.EMAIL&&p?1e3:800},open:!0,onClose:()=>{null==c||c()},headingTitle:null==G?void 0:G.label,headingSubtitle:m===o.CHANNEL_TYPE.WHATSAPP?`${l.default.capitaliseFirstLetterOfString(null!==(_=null==G?void 0:G.category)&&void 0!==_?_:"")} • ${null!==(D=null==G?void 0:G.templateCategory)&&void 0!==D?D:""}`:"",onBackPress:()=>{null==M||M()}},{children:[e.jsx(i.default,{showSampleValues:f,showVariableMapping:p,channel:m,whatsappSpecificPickerMeta:x,showVariableModal:T,variableList:E,discountCode:P,setDiscountCode:j,variableListForImage:I&&(null==I?void 0:I.length)>0?I:E}),h?e.jsx(r.default,{isWhatsappCarousel:null!=O&&O,onSelect:function(){const e=null==h?void 0:h(G,K,null!=B?B:"");(null==e?void 0:e.errorIndexes)?R(e.errorIndexes):(null==e?void 0:e.error)?U(!!(null==e?void 0:e.error)):Z(!0)}}):e.jsx(e.Fragment,{})]}))}))};

package/dist/cjs/components/template-preview/WhatsApp/ChatUI.style.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../TypographyStyle.js"),r=require("../../../constants/Theme.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=o(e);const d=i.default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../TypographyStyle.js"),r=require("../../../constants/Theme.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=o(e);const a=i.default.div`
 	background: ${r.COLORS.surface.standard};
 	box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.12);
 	border-top-left-radius: ${e=>e.isCarouselCard?"12px":"0px"};
@@ -7,22 +7,21 @@
 	border-bottom-left-radius: 12px;
 	position: relative;
 	padding: 8px 0px;
-	border-width: 2px;
-	border-color: ${e=>e.hasError?`${r.COLORS.content.negative}`:`${r.COLORS.stroke.brand}`};
-	border-style: ${e=>e.showBorder?"solid":"none"};
+	border: 2px solid
+		${e=>e.hasError?`${r.COLORS.content.negative}`:e.showBorder?`${r.COLORS.stroke.brand}`:`${r.COLORS.text.white}`};
 	:hover {
 		border: 2px
-			${e=>e.isWhatsappCarousel?e.hasError?"dashed":e.showBorder?"solid":"dashed":"none"}
+			${e=>e.isWhatsappCarousel?e.hasError?"dashed":e.showBorder?"solid":"dashed":"solid"}
 			${r.COLORS.stroke.brand};
 	}
-`,a=i.default(t.Caption)`
+`,d=i.default(t.Caption)`
 	color: ${r.COLORS.content.secondary};
 	max-width: 80px;
 	text-overflow: ellipsis;
 	white-space: nowrap;
 	overflow: hidden;
 	text-wrap: wrap;
-`,n=i.default.div`
+`,s=i.default.div`
 	border-radius: 8px;
 	display: flex;
 	flex-direction: column;
@@ -31,14 +30,14 @@
 	min-height: 152px;
 	margin-bottom: 4px;
 	margin: 0px 8px;
-`,s=i.default.div`
+`,p=i.default.div`
 	padding: 12px;
 	display: flex;
 	flex-direction: row;
 	justify-content: center;
 	align-items: center;
 	border-top: 1px solid ${r.COLORS.stroke.primary};
-`,p=i.default.div`
+`,n=i.default.div`
 	display: flex;
 	flex-direction: row;
 	justify-content: space-between;
@@ -61,4 +60,4 @@
 	position: absolute;
 	top: 16px;
 	right: 16px;
-`,exports.ChatBtnContainer=s,exports.Container=d,exports.FooterWrapper=p,exports.MediaContainer=n,exports.TimeStamp=a;
+`,exports.ChatBtnContainer=p,exports.Container=a,exports.FooterWrapper=n,exports.MediaContainer=s,exports.TimeStamp=d;

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

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

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

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

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

@@ -1,4 +1,4 @@
-import r from"styled-components";import{Caption as o}from"../../TypographyStyle.js";import{COLORS as e}from"../../../constants/Theme.js";const t=r.div`
+import r from"styled-components";import{Caption as t}from"../../TypographyStyle.js";import{COLORS as e}from"../../../constants/Theme.js";const o=r.div`
 	background: ${e.surface.standard};
 	box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.12);
 	border-top-left-radius: ${r=>r.isCarouselCard?"12px":"0px"};
@@ -7,15 +7,14 @@ import r from"styled-components";import{Caption as o}from"../../TypographyStyle.
 	border-bottom-left-radius: 12px;
 	position: relative;
 	padding: 8px 0px;
-	border-width: 2px;
-	border-color: ${r=>r.hasError?`${e.content.negative}`:`${e.stroke.brand}`};
-	border-style: ${r=>r.showBorder?"solid":"none"};
+	border: 2px solid
+		${r=>r.hasError?`${e.content.negative}`:r.showBorder?`${e.stroke.brand}`:`${e.text.white}`};
 	:hover {
 		border: 2px
-			${r=>r.isWhatsappCarousel?r.hasError?"dashed":r.showBorder?"solid":"dashed":"none"}
+			${r=>r.isWhatsappCarousel?r.hasError?"dashed":r.showBorder?"solid":"dashed":"solid"}
 			${e.stroke.brand};
 	}
-`,i=r(o)`
+`,i=r(t)`
 	color: ${e.content.secondary};
 	max-width: 80px;
 	text-overflow: ellipsis;
@@ -61,4 +60,4 @@ import r from"styled-components";import{Caption as o}from"../../TypographyStyle.
 	position: absolute;
 	top: 16px;
 	right: 16px;
-`;export{p as ChatBtnContainer,t as Container,s as FooterWrapper,d as MediaContainer,i as TimeStamp};
+`;export{p as ChatBtnContainer,o as Container,s as FooterWrapper,d as MediaContainer,i as TimeStamp};

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

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

package/package.json

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