@bikdotai/bik-component-library 0.0.682-beta.pp-2 → 0.0.683-0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),n=require("react"),o=require("../spinner/Spinner.js"),s=require("./Button.styled.js"),i=require("./themes.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=r(n);const c=n.forwardRef(((n,r)=>{var{version:c,id:l,buttonType:d="primary",size:u="small",buttonText:b,disabled:m,IconComponent:j,LeadingIcon:x,TrailingIcon:h,isLoading:p,inverse:v,onClick:g,matchParentWidth:C,subtitle:y,darkMode:f,activated:I,error:N,buttonTextColor:T,buttonFontSize:z,customIconColor:O,buttonColor:B}=n,k=e.__rest(n,["version","id","buttonType","size","buttonText","disabled","IconComponent","LeadingIcon","TrailingIcon","isLoading","inverse","onClick","matchParentWidth","subtitle","darkMode","activated","error","buttonTextColor","buttonFontSize","customIconColor","buttonColor"]);const q=i.GetButtonTextComponent(u,d,m),S=i.getButtonIconColor(u,d,v,m,p,f),_="chip"===u?16:20,L={height:_,width:_,color:O||S,style:{display:"block"},className:"icon"};return t.jsx(s.Button,Object.assign({"data-test":k["data-test"],version:c,onClick:p?()=>{}:g,ref:r,id:l,disabled:m,size:u,buttonType:d,isLoading:p,inverse:v,matchParentWidth:C,darkMode:f,activated:I,error:N,buttonColor:B},k,{children:t.jsxs("div",Object.assign({className:"button-container"},{children:[d.startsWith("dash")&&t.jsx(s.ButtonCustomDashedBorder,{}),t.jsx("div",Object.assign({className:"overlay-container"},{children:p&&t.jsx(o.Spinner,{className:"spinner",size:"small",color:i.SpinnerColorMap(d,v)})})),j&&t.jsx("div",Object.assign({className:"icon-component"},{children:a.default.createElement(j,L)})),x&&t.jsx("div",Object.assign({className:"icon-leading",style:{zIndex:1}},{children:a.default.createElement(x,L)})),b?t.jsxs(q,Object.assign({className:"text",style:{color:T,fontSize:z}},{children:[b,t.jsx("div",Object.assign({className:"text-subtitle"},{children:y}))]})):t.jsx(t.Fragment,{}),h&&t.jsx("div",Object.assign({className:"icon-trailing",style:{zIndex:1}},{children:a.default.createElement(h,L)}))]}))}))}));c.displayName="Button",exports.Button=c;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),n=require("react"),s=require("../spinner/Spinner.js"),o=require("./Button.styled.js"),i=require("./themes.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=r(n);const c=n.forwardRef(((n,r)=>{var{version:c,id:l,buttonType:d="primary",size:u="small",buttonText:b,disabled:m,IconComponent:j,LeadingIcon:g,TrailingIcon:x,isLoading:h,inverse:p,onClick:v,matchParentWidth:y,subtitle:C,darkMode:I,activated:f,error:N,buttonTextColor:O,buttonFontSize:T,customIconColor:z,buttonColor:B,LeadingIconStyles:S}=n,k=e.__rest(n,["version","id","buttonType","size","buttonText","disabled","IconComponent","LeadingIcon","TrailingIcon","isLoading","inverse","onClick","matchParentWidth","subtitle","darkMode","activated","error","buttonTextColor","buttonFontSize","customIconColor","buttonColor","LeadingIconStyles"]);const L=i.GetButtonTextComponent(u,d,m),q=i.getButtonIconColor(u,d,p,m,h,I),_="chip"===u?16:20,M={height:_,width:_,color:z||q,style:{display:"block"},className:"icon"};return t.jsx(o.Button,Object.assign({"data-test":k["data-test"],version:c,onClick:h?()=>{}:v,ref:r,id:l,disabled:m,size:u,buttonType:d,isLoading:h,inverse:p,matchParentWidth:y,darkMode:I,activated:f,error:N,buttonColor:B},k,{children:t.jsxs("div",Object.assign({className:"button-container"},{children:[d.startsWith("dash")&&t.jsx(o.ButtonCustomDashedBorder,{}),t.jsx("div",Object.assign({className:"overlay-container"},{children:h&&t.jsx(s.Spinner,{className:"spinner",size:"small",color:i.SpinnerColorMap(d,p)})})),j&&t.jsx("div",Object.assign({className:"icon-component"},{children:a.default.createElement(j,M)})),g&&t.jsx("div",Object.assign({className:"icon-leading",style:Object.assign({zIndex:1},S)},{children:a.default.createElement(g,M)})),b?t.jsxs(L,Object.assign({className:"text",style:{color:O,fontSize:T}},{children:[b,t.jsx("div",Object.assign({className:"text-subtitle"},{children:C}))]})):t.jsx(t.Fragment,{}),x&&t.jsx("div",Object.assign({className:"icon-trailing",style:{zIndex:1}},{children:a.default.createElement(x,M)}))]}))}))}));c.displayName="Button",exports.Button=c;
@@ -35,6 +35,11 @@ export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElemen
35
35
  * @default undefined
36
36
  */
37
37
  LeadingIcon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
38
+ /**
39
+ * Custom styles to be applied to the LeadingIcon
40
+ * @default undefined
41
+ */
42
+ LeadingIconStyles?: React.CSSProperties;
38
43
  /**
39
44
  * The icon component that is the left of the buttonText
40
45
  * Referred to https://ozzie.sh/passing-icons-as-props-in-a-consistent-way-using-react
@@ -9,7 +9,7 @@
9
9
  background-position: center;
10
10
  background-size: cover;
11
11
  position: relative;
12
- height: 500px;
12
+ height: 100%;
13
13
  overflow-y: auto;
14
14
  border-radius: ${e=>{var r;return null!==(r=e.borderRadius)&&void 0!==r?r:"0px"}};
15
15
  `,d=o.default.div`
@@ -1,4 +1,3 @@
1
- import { ApplicationType } from '@bikdotai/bik-models/growth/models/bik-store';
2
1
  import { VariableListInterfaceV2 } from "../add-variableV2/AddVariableV2";
3
2
  import { CarouselProduct } from "./modalElements/EditWhatsAppCarouselTemplateV2";
4
3
  import { WhatsAppCarouselTemplateVariables } from "../template-preview/models/WhatsappCarouselTemplate";
@@ -46,7 +45,6 @@ export interface TemplateContextMapperProps {
46
45
  fetchCollections: any;
47
46
  fetchProducts: any;
48
47
  storeId: string;
49
- appType?: ApplicationType;
50
48
  };
51
49
  selectedCarouselProducts?: CarouselProduct[];
52
50
  disableEditExpiry?: boolean;
@@ -1,4 +1,3 @@
1
- import { ApplicationType } from '@bikdotai/bik-models/growth/models/bik-store';
2
1
  import { VariableV3 } from "../../../helpers";
3
2
  import React, { LegacyRef } from 'react';
4
3
  import Slider from 'react-slick';
@@ -56,7 +55,6 @@ export declare const TemplateModalContext: React.Context<{
56
55
  fetchCollections: any;
57
56
  fetchProducts: any;
58
57
  storeId: string;
59
- appType?: ApplicationType | undefined;
60
58
  } | undefined;
61
59
  carouselProducts?: CarouselProduct[] | undefined;
62
60
  setCarouselProducts?: React.Dispatch<React.SetStateAction<CarouselProduct[]>> | undefined;
@@ -129,7 +127,6 @@ export declare const useTemplateModalContext: () => {
129
127
  fetchCollections: any;
130
128
  fetchProducts: any;
131
129
  storeId: string;
132
- appType?: ApplicationType | undefined;
133
130
  } | undefined;
134
131
  carouselProducts?: CarouselProduct[] | undefined;
135
132
  setCarouselProducts?: React.Dispatch<React.SetStateAction<CarouselProduct[]>> | undefined;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");require("../../../node_modules/@bikdotai/bik-models/growth/models/bik-store.js");var t=require("../../../assets/icons/arrow_back.svg.js"),l=require("../../../assets/icons/chevronLeft.svg.js"),n=require("../../../assets/icons/chevronRight.svg.js"),i=require("../../../assets/icons/PlusIcon.js"),o=require("lodash"),r=require("react"),a=require("../../button/Button.js"),s=require("../../icon-button/IconButton.js"),d=require("../../product-picker-v2/modal.js"),c=require("../Badge/index.js"),u=require("../context/templateModalContext.js"),p=require("./EditWhatsAppTemplateV2.js"),v=require("./ProductBox.js");require("../../template-preview/TemplatePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js");var h=require("../../../constants/Theme.js");require("../../curtain/CurtainHelper.js"),require("../../variable-picker-v3/model.js"),require("../../template-preview/models/TemplateMeta.js");var m=require("../../template-preview/models/WhatsAppTemplate.js");require("../../template-preview/models/Channels.js");var g=require("../../template-preview/helpers/templateMiscHelper.js"),y=require("../../TypographyStyle.js"),j=require("../../../_virtual/bik-store.js");exports.default=x=>{let{template:f,whatsappSpecificPickerMeta:b,showVariableModal:C,variableListForImage:O,discountCode:I,setDiscountCode:S}=x;var k,q,w,P,T,B,L,R;const{selectedCarouselIndex:E,setTemplate:M,pickerConf:A,isProductCarouselType:D,pod:F,cardCount:_,carouselProducts:V,setCarouselProducts:W,isError:N,cardImages:$,disableEditVariable:z,onDeleteSelectedProducts:G,setSelectedCarouselIndex:H,setVariableCallback:K,setShowVariablePicker:J,sliderRef:Q}=u.useTemplateModalContext(),[U,X]=r.useState(g.isRCSChannel(null==f?void 0:f.channel)?"Carousel Cards":-1==E?"First Message (Step 1/2)":D?"Product Carousel "+((null===(q=null===(k=null==f?void 0:f.mapping)||void 0===k?void 0:k.body)||void 0===q?void 0:q.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(P=null===(w=null==f?void 0:f.mapping)||void 0===w?void 0:w.body)||void 0===P?void 0:P.length)?"(Step 2/2)":"")),[Y,Z]=r.useState(!1),[ee,te]=r.useState(!1),le=E===(null!=_?_:-1)-1,ne=(null!=E?E:-1)<1;r.useEffect((()=>{var e,t,l,n;X(g.isRCSChannel(null==f?void 0:f.channel)?"Carousel Cards":-1==E?"First Message (Step 1/2)":D?"Product Carousel "+((null===(t=null===(e=null==f?void 0:f.mapping)||void 0===e?void 0:e.body)||void 0===t?void 0:t.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(n=null===(l=null==f?void 0:f.mapping)||void 0===l?void 0:l.body)||void 0===n?void 0:n.length)?"(Step 2/2)":""))}),[E]);const ie=e=>{null==W||W([{name:"variable",productName:e.actualValue}])};return r.useEffect((()=>{-1===E&&g.isRCSChannel(null==f?void 0:f.channel)&&(null==H||H(0))}),[E,null==f?void 0:f.channel]),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"16px"}},{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center"}},{children:[!g.isRCSChannel(null==f?void 0:f.channel)&&null!=E&&E>=0&&!!(null===(B=null===(T=null==f?void 0:f.mapping)||void 0===T?void 0:T.body)||void 0===B?void 0:B.length)&&e.jsx(s.IconButton,{Icon:t.default,onClick:()=>{null==H||H(-1)}}),e.jsx(y.TitleMedium,Object.assign({style:{marginLeft:10}},{children:U}))]})),D&&(null!==(L=null==V?void 0:V.length)&&void 0!==L?L:0)>0&&null!=E&&E>=0&&e.jsxs("div",Object.assign({style:{display:"flex",rowGap:8,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"}},{children:[e.jsx(v.ProductBox,{editItem:()=>{1===(null==V?void 0:V.length)&&"variable"===V[0].name?(K((()=>ie)),J(!0)):Z(!Y)},cardBody:1===(null==V?void 0:V.length)&&"variable"===V[0].name?`${V[0].productName}`:`${null==V?void 0:V.length} Products Selected`,hideIcon:1===(null==V?void 0:V.length)&&"variable"===V[0].name,deleteItem:()=>{var e;if(1===(null==V?void 0:V.length)&&"variable"===V[0].name)return void(null==W||W([]));const t=o.cloneDeep(Object.assign({},f));t&&($&&$.length>0?null==$||$.forEach(((e,l)=>{var n;t.components[1].cards[l].components[0].example.header_handle=[null!==(n=$[l])&&void 0!==n?n:"https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})):null===(e=null==t?void 0:t.components[1].cards)||void 0===e||e.forEach(((e,l)=>{t.components[1].cards[l].components[0].example.header_handle=["https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})),null==M||M(t)),null==W||W([]),null==G||G()}}),V&&(null==V?void 0:V.length)>0&&"variable"!=V[0].name&&e.jsx(a.Button,{disabled:(null!==(R=null==V?void 0:V.length)&&void 0!==R?R:0)<=1,style:{alignSelf:"flex-end"},onClick:()=>{te(!0),Z(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]})),!z&&D&&0===(null==V?void 0:V.length)&&null!=E&&E>=0&&e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{marginLeft:12}},{children:[e.jsx(y.TitleRegular,{children:"Product(s)"}),e.jsx(y.BodySecondary,{children:`Select ${null!=_?_:1} products`})]})),e.jsxs("div",Object.assign({style:{marginTop:16,marginBottom:16,marginLeft:N?16:12,marginRight:N?16:12,flexDirection:"column",display:"flex",alignItems:"center"}},{children:[e.jsx(a.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12,border:N?`2px dashed ${h.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s)",buttonType:N?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsx("div",Object.assign({style:{display:"flex",width:18,height:18}},{children:e.jsx(i.default,{width:18,height:18,color:h.COLORS.content.secondary})})),onClick:e=>{Z(!0)}}),F===m.POD.CHATBOT&&e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{display:"flex",flex:1,alignItems:"center",justifyContent:"space-between",flexDirection:"row",width:"100%"}},{children:[e.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginRight:8}}),e.jsx(y.BodyCaption,Object.assign({style:{color:"#616161",overflow:"unset"}},{children:"OR"})),e.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginLeft:8}})]})),e.jsx(a.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",marginTop:12,width:"100%",border:N?`2px dashed ${h.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s) Variable",buttonType:N?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsx("div",Object.assign({style:{display:"flex"}},{children:e.jsx(i.default,{width:18,height:18,color:h.COLORS.content.secondary})})),onClick:e=>{K((()=>ie)),J(!0)}})]})]})),N&&e.jsx("div",Object.assign({style:{marginLeft:10,marginBottom:16}},{children:e.jsx(c.Badge,{padding:"8px",errorText:"Please add products"})}))]}),!D&&(null!=E?E:-1)>-1&&e.jsxs("div",Object.assign({style:{display:"flex",background:h.COLORS.surface.hovered,alignItems:"center"}},{children:[e.jsx(s.IconButton,{Icon:l.default,disabled:ne,width:8,height:14,svgStyle:ne?{}:{color:h.COLORS.content.secondary},onClick:()=>{var e;null===(e=null==Q?void 0:Q.current)||void 0===e||e.slickPrev(),(null!=E?E:-1)<1||null==H||H((e=>e-1))}}),e.jsx(y.TitleRegular,Object.assign({style:{flex:1,display:"flex",justifyContent:"center"},color:h.COLORS.content.secondary},{children:`Card ${(null!=E?E:0)+1}/${_}`})),e.jsx(s.IconButton,{Icon:n.default,width:8,height:14,disabled:le,svgStyle:le?{}:{color:h.COLORS.content.secondary},onClick:()=>{var e;null===(e=null==Q?void 0:Q.current)||void 0===e||e.slickNext(),(null!=E?E:-1)>=(null!=_?_:-1)-1||null==H||H((e=>e+1))}})]})),e.jsx(p.default,{whatsappSpecificPickerMeta:b,template:f,onTemplateChange:e=>{null==M||M(e)},showVariableModal:C,variableListForImage:O,discountCode:I,setDiscountCode:S}),Y&&A&&e.jsx(d.ProductPickerModal,{zIndex:200,startupScreen:ee?d.ScreenName.RearrangeProducts:d.ScreenName.Collections,rearrangeEnabled:!0,storeId:A.storeId,selectedItems:(e=>{if(e.length>0){const t={};for(const l of e){const e=null==l?void 0:l.collectionId,n=l.productId,i=l.variantId;e in t||(t[e]={products:{},name:"",image:"",isSmartCollection:!1}),n in t[e].products||(t[e].products[n]={variants:{},name:(null==l?void 0:l.productName)||"",image:(null==l?void 0:l.productImage)||""}),t[e].products[n].variants[i]={name:(null==l?void 0:l.name)||"",price:"",image:(null==l?void 0:l.image)||"",quantity:l.quantity||0,displayOrder:l.displayOrder}}return t}return{}})(null!=V?V:[]),collectionFetcher:A.fetchCollections,productFetcher:A.fetchProducts,onAdd:(e,t)=>{var l,n,i,r,a,s;te(!1);const d=[];delete e.isCustom;for(const t of Object.keys(e)){const o=e[t].products;if(void 0!==o&&Object.keys(o).length)for(const e of Object.keys(o)){const c=o[e].variants;if(void 0!==c&&Object.keys(c).length)for(const u of Object.keys(c)){const{name:p,image:v,quantity:h,displayOrder:m}=c[u],g={name:p,image:null!==(n=null!=v?v:null===(l=o[e])||void 0===l?void 0:l.image)&&void 0!==n?n:"",quantity:h,variantId:u,productId:e,displayOrder:m,collectionId:t,productName:null!==(r=null===(i=o[e])||void 0===i?void 0:i.name)&&void 0!==r?r:"",productImage:null!==(s=null===(a=o[e])||void 0===a?void 0:a.image)&&void 0!==s?s:""};d.push(g)}}}const c=d.sort(((e,t)=>e.displayOrder-t.displayOrder)),u=d.map((e=>e.image)),p=o.cloneDeep(Object.assign({},f));p&&(u.forEach(((e,t)=>{var l;p.components[1].cards[t].components[0].example.header_handle=e?[e]:[null!==(l=null==$?void 0:$[t])&&void 0!==l?l:""]})),null==M||M(p)),null==W||W(c),Z(!1)},searchInCollectionFetcher:A.searchInCollection,searchFetcher:A.searchProducts,visible:Y,onClose:()=>{Z(!1)},exactLimit:null!=_?_:1,appType:A.appType||j.__exports.ApplicationType.BIK})]}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("../../../assets/icons/arrow_back.svg.js"),t=require("../../../assets/icons/chevronLeft.svg.js"),n=require("../../../assets/icons/chevronRight.svg.js"),i=require("../../../assets/icons/PlusIcon.js"),o=require("lodash"),r=require("react"),a=require("../../button/Button.js"),s=require("../../icon-button/IconButton.js"),d=require("../../product-picker-v2/modal.js"),c=require("../Badge/index.js"),u=require("../context/templateModalContext.js"),p=require("./EditWhatsAppTemplateV2.js"),v=require("./ProductBox.js");require("../../template-preview/TemplatePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js");var h=require("../../../constants/Theme.js");require("../../curtain/CurtainHelper.js"),require("../../variable-picker-v3/model.js"),require("../../template-preview/models/TemplateMeta.js");var m=require("../../template-preview/models/WhatsAppTemplate.js");require("../../template-preview/models/Channels.js");var g=require("../../template-preview/helpers/templateMiscHelper.js"),j=require("../../TypographyStyle.js");exports.default=x=>{let{template:y,whatsappSpecificPickerMeta:f,showVariableModal:b,variableListForImage:C,discountCode:O,setDiscountCode:S}=x;var I,q,w,P,k,T,B,L;const{selectedCarouselIndex:R,setTemplate:E,pickerConf:M,isProductCarouselType:D,pod:A,cardCount:F,carouselProducts:V,setCarouselProducts:W,isError:N,cardImages:$,disableEditVariable:_,onDeleteSelectedProducts:z,setSelectedCarouselIndex:G,setVariableCallback:H,setShowVariablePicker:J,sliderRef:K}=u.useTemplateModalContext(),[Q,U]=r.useState(g.isRCSChannel(null==y?void 0:y.channel)?"Carousel Cards":-1==R?"First Message (Step 1/2)":D?"Product Carousel "+((null===(q=null===(I=null==y?void 0:y.mapping)||void 0===I?void 0:I.body)||void 0===q?void 0:q.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(P=null===(w=null==y?void 0:y.mapping)||void 0===w?void 0:w.body)||void 0===P?void 0:P.length)?"(Step 2/2)":"")),[X,Y]=r.useState(!1),[Z,ee]=r.useState(!1),le=R===(null!=F?F:-1)-1,te=(null!=R?R:-1)<1;r.useEffect((()=>{var e,l,t,n;U(g.isRCSChannel(null==y?void 0:y.channel)?"Carousel Cards":-1==R?"First Message (Step 1/2)":D?"Product Carousel "+((null===(l=null===(e=null==y?void 0:y.mapping)||void 0===e?void 0:e.body)||void 0===l?void 0:l.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(n=null===(t=null==y?void 0:y.mapping)||void 0===t?void 0:t.body)||void 0===n?void 0:n.length)?"(Step 2/2)":""))}),[R]);const ne=e=>{null==W||W([{name:"variable",productName:e.actualValue}])};return r.useEffect((()=>{-1===R&&g.isRCSChannel(null==y?void 0:y.channel)&&(null==G||G(0))}),[R,null==y?void 0:y.channel]),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"16px"}},{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center"}},{children:[!g.isRCSChannel(null==y?void 0:y.channel)&&null!=R&&R>=0&&!!(null===(T=null===(k=null==y?void 0:y.mapping)||void 0===k?void 0:k.body)||void 0===T?void 0:T.length)&&e.jsx(s.IconButton,{Icon:l.default,onClick:()=>{null==G||G(-1)}}),e.jsx(j.TitleMedium,Object.assign({style:{marginLeft:10}},{children:Q}))]})),D&&(null!==(B=null==V?void 0:V.length)&&void 0!==B?B:0)>0&&null!=R&&R>=0&&e.jsxs("div",Object.assign({style:{display:"flex",rowGap:8,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"}},{children:[e.jsx(v.ProductBox,{editItem:()=>{1===(null==V?void 0:V.length)&&"variable"===V[0].name?(H((()=>ne)),J(!0)):Y(!X)},cardBody:1===(null==V?void 0:V.length)&&"variable"===V[0].name?`${V[0].productName}`:`${null==V?void 0:V.length} Products Selected`,hideIcon:1===(null==V?void 0:V.length)&&"variable"===V[0].name,deleteItem:()=>{var e;if(1===(null==V?void 0:V.length)&&"variable"===V[0].name)return void(null==W||W([]));const l=o.cloneDeep(Object.assign({},y));l&&($&&$.length>0?null==$||$.forEach(((e,t)=>{var n;l.components[1].cards[t].components[0].example.header_handle=[null!==(n=$[t])&&void 0!==n?n:"https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})):null===(e=null==l?void 0:l.components[1].cards)||void 0===e||e.forEach(((e,t)=>{l.components[1].cards[t].components[0].example.header_handle=["https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})),null==E||E(l)),null==W||W([]),null==z||z()}}),V&&(null==V?void 0:V.length)>0&&"variable"!=V[0].name&&e.jsx(a.Button,{disabled:(null!==(L=null==V?void 0:V.length)&&void 0!==L?L:0)<=1,style:{alignSelf:"flex-end"},onClick:()=>{ee(!0),Y(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]})),!_&&D&&0===(null==V?void 0:V.length)&&null!=R&&R>=0&&e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{marginLeft:12}},{children:[e.jsx(j.TitleRegular,{children:"Product(s)"}),e.jsx(j.BodySecondary,{children:`Select ${null!=F?F:1} products`})]})),e.jsxs("div",Object.assign({style:{marginTop:16,marginBottom:16,marginLeft:N?16:12,marginRight:N?16:12,flexDirection:"column",display:"flex",alignItems:"center"}},{children:[e.jsx(a.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12,border:N?`2px dashed ${h.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s)",buttonType:N?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsx("div",Object.assign({style:{display:"flex",width:18,height:18}},{children:e.jsx(i.default,{width:18,height:18,color:h.COLORS.content.secondary})})),onClick:e=>{Y(!0)}}),A===m.POD.CHATBOT&&e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{display:"flex",flex:1,alignItems:"center",justifyContent:"space-between",flexDirection:"row",width:"100%"}},{children:[e.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginRight:8}}),e.jsx(j.BodyCaption,Object.assign({style:{color:"#616161",overflow:"unset"}},{children:"OR"})),e.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginLeft:8}})]})),e.jsx(a.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",marginTop:12,width:"100%",border:N?`2px dashed ${h.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s) Variable",buttonType:N?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsx("div",Object.assign({style:{display:"flex"}},{children:e.jsx(i.default,{width:18,height:18,color:h.COLORS.content.secondary})})),onClick:e=>{H((()=>ne)),J(!0)}})]})]})),N&&e.jsx("div",Object.assign({style:{marginLeft:10,marginBottom:16}},{children:e.jsx(c.Badge,{padding:"8px",errorText:"Please add products"})}))]}),!D&&(null!=R?R:-1)>-1&&e.jsxs("div",Object.assign({style:{display:"flex",background:h.COLORS.surface.hovered,alignItems:"center"}},{children:[e.jsx(s.IconButton,{Icon:t.default,disabled:te,width:8,height:14,svgStyle:te?{}:{color:h.COLORS.content.secondary},onClick:()=>{var e;null===(e=null==K?void 0:K.current)||void 0===e||e.slickPrev(),(null!=R?R:-1)<1||null==G||G((e=>e-1))}}),e.jsx(j.TitleRegular,Object.assign({style:{flex:1,display:"flex",justifyContent:"center"},color:h.COLORS.content.secondary},{children:`Card ${(null!=R?R:0)+1}/${F}`})),e.jsx(s.IconButton,{Icon:n.default,width:8,height:14,disabled:le,svgStyle:le?{}:{color:h.COLORS.content.secondary},onClick:()=>{var e;null===(e=null==K?void 0:K.current)||void 0===e||e.slickNext(),(null!=R?R:-1)>=(null!=F?F:-1)-1||null==G||G((e=>e+1))}})]})),e.jsx(p.default,{whatsappSpecificPickerMeta:f,template:y,onTemplateChange:e=>{null==E||E(e)},showVariableModal:b,variableListForImage:C,discountCode:O,setDiscountCode:S}),X&&M&&e.jsx(d.ProductPickerModal,{zIndex:200,startupScreen:Z?d.ScreenName.RearrangeProducts:d.ScreenName.Collections,rearrangeEnabled:!0,storeId:M.storeId,selectedItems:(e=>{if(e.length>0){const l={};for(const t of e){const e=null==t?void 0:t.collectionId,n=t.productId,i=t.variantId;e in l||(l[e]={products:{},name:"",image:"",isSmartCollection:!1}),n in l[e].products||(l[e].products[n]={variants:{},name:(null==t?void 0:t.productName)||"",image:(null==t?void 0:t.productImage)||""}),l[e].products[n].variants[i]={name:(null==t?void 0:t.name)||"",price:"",image:(null==t?void 0:t.image)||"",quantity:t.quantity||0,displayOrder:t.displayOrder}}return l}return{}})(null!=V?V:[]),collectionFetcher:M.fetchCollections,productFetcher:M.fetchProducts,onAdd:(e,l)=>{var t,n,i,r,a,s;ee(!1);const d=[];delete e.isCustom;for(const l of Object.keys(e)){const o=e[l].products;if(void 0!==o&&Object.keys(o).length)for(const e of Object.keys(o)){const c=o[e].variants;if(void 0!==c&&Object.keys(c).length)for(const u of Object.keys(c)){const{name:p,image:v,quantity:h,displayOrder:m}=c[u],g={name:p,image:null!==(n=null!=v?v:null===(t=o[e])||void 0===t?void 0:t.image)&&void 0!==n?n:"",quantity:h,variantId:u,productId:e,displayOrder:m,collectionId:l,productName:null!==(r=null===(i=o[e])||void 0===i?void 0:i.name)&&void 0!==r?r:"",productImage:null!==(s=null===(a=o[e])||void 0===a?void 0:a.image)&&void 0!==s?s:""};d.push(g)}}}const c=d.sort(((e,l)=>e.displayOrder-l.displayOrder)),u=d.map((e=>e.image)),p=o.cloneDeep(Object.assign({},y));p&&(u.forEach(((e,l)=>{var t;p.components[1].cards[l].components[0].example.header_handle=e?[e]:[null!==(t=null==$?void 0:$[l])&&void 0!==t?t:""]})),null==E||E(p)),null==W||W(c),Y(!1)},searchInCollectionFetcher:M.searchInCollection,searchFetcher:M.searchProducts,visible:X,onClose:()=>{Y(!1)},exactLimit:null!=F?F:1})]}))};
@@ -1,4 +1,4 @@
1
- "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`
1
+ "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`
2
2
  background: ${r.COLORS.surface.standard};
3
3
  border-top-left-radius: ${e=>e.isCarouselCard?"12px":"0px"};
4
4
  border-top-right-radius: 12px;
@@ -9,7 +9,7 @@
9
9
  border: 2px solid
10
10
  ${e=>e.hasError?`${r.COLORS.content.negative}`:e.showBorder?`${r.COLORS.stroke.brand}`:`${r.COLORS.stroke.primary}`};
11
11
  border: ${e=>e.showDashedBorder&&`2px dashed ${r.COLORS.content.brand}`};
12
- height: 100%;
12
+ height: ${e=>e.isWhatsappCarousel?"100%":"auto"};
13
13
  display: flex;
14
14
  flex-direction: column;
15
15
  :hover {
@@ -18,16 +18,16 @@
18
18
  ${r.COLORS.stroke.brand};
19
19
  box-shadow: ${e=>!e.isPreview&&"4px 4px 12px rgba(0, 0, 0, 0.25)"};
20
20
  }
21
- `,a=i.default(t.Caption)`
21
+ `,d=i.default(t.Caption)`
22
22
  color: ${r.COLORS.content.secondary};
23
23
  max-width: 80px;
24
24
  text-overflow: ellipsis;
25
25
  white-space: nowrap;
26
26
  overflow: hidden;
27
27
  text-wrap: wrap;
28
- `,s=i.default(a)`
28
+ `,s=i.default(d)`
29
29
  max-width: 200px;
30
- `,n=i.default.div`
30
+ `,p=i.default.div`
31
31
  border-radius: 8px;
32
32
  display: flex;
33
33
  flex-direction: column;
@@ -36,14 +36,14 @@
36
36
  min-height: 152px;
37
37
  margin-bottom: 4px;
38
38
  margin: 0px 8px;
39
- `,p=i.default.div`
39
+ `,n=i.default.div`
40
40
  padding: 12px;
41
41
  display: flex;
42
42
  flex-direction: row;
43
43
  justify-content: center;
44
44
  align-items: center;
45
45
  border-top: 1px solid ${r.COLORS.stroke.primary};
46
- `,x=i.default.div`
46
+ `,l=i.default.div`
47
47
  display: flex;
48
48
  flex-direction: row;
49
49
  justify-content: space-between;
@@ -66,4 +66,4 @@
66
66
  position: absolute;
67
67
  top: 16px;
68
68
  right: 16px;
69
- `,exports.ChatBtnContainer=p,exports.Container=d,exports.FooterText=s,exports.FooterWrapper=x,exports.MediaContainer=n,exports.TimeStamp=a;
69
+ `,exports.ChatBtnContainer=n,exports.Container=a,exports.FooterText=s,exports.FooterWrapper=l,exports.MediaContainer=p,exports.TimeStamp=d;
@@ -8,4 +8,4 @@
8
8
  height: ${e=>e.isWhatsappCarousel?"100%":"auto"};
9
9
  `,c=u.default(a.TitleRegular)`
10
10
  color: ${i.COLORS.content.primary};
11
- `;exports.WhatsappLikePreviewV2=t=>{const{hideDeviceContainerInPreview:s}=r.useTemplateModalContext();return 3===o.getPreviewPropLen(t)?e.jsx(e.Fragment,{children:t.zeroStateComponent}):s?e.jsx(p.ChatUIV2,Object.assign({showHeader:t.showHeader},t)):e.jsx(e.Fragment,{children:e.jsxs(d,Object.assign({style:t.containerStyle,showHeader:t.showHeader,isWhatsappCarousel:t.isWhatsappCarousel},{children:[t.showHeader&&e.jsx(n.default,{}),e.jsxs("div",Object.assign({style:{padding:"small"===t.size?"12px 32px 12px 12px":`16px ${t.isWhatsappCarousel?"0px":"56px"} ${t.isWhatsappCarousel?"2px":"16px"} 16px`,height:t.isWhatsappCarousel?"100%":"auto"}},{children:[!t.hidePreviewText&&e.jsx("div",Object.assign({style:{marginBottom:16}},{children:e.jsx(c,{children:"Preview"})})),e.jsx(p.ChatUIV2,Object.assign({showHeader:t.showHeader},t))]}))]}))})};
11
+ `;exports.WhatsappLikePreviewV2=t=>{const{hideDeviceContainerInPreview:s}=r.useTemplateModalContext();return 3===o.getPreviewPropLen(t)?e.jsx(e.Fragment,{children:t.zeroStateComponent}):s?e.jsx(p.ChatUIV2,Object.assign({showHeader:t.showHeader},t)):e.jsx(e.Fragment,{children:e.jsxs(d,Object.assign({style:t.containerStyle,showHeader:t.showHeader,isWhatsappCarousel:t.isWhatsappCarousel},{children:[t.showHeader&&e.jsx(n.default,{}),e.jsxs("div",Object.assign({style:{padding:"small"===t.size?"12px 32px 12px 12px":`16px ${t.isWhatsappCarousel?"0px":"56px"} ${t.isWhatsappCarousel?"2px":"16px"} 16px`,height:"100%",overflowY:"auto"}},{children:[!t.hidePreviewText&&e.jsx("div",Object.assign({style:{marginBottom:16}},{children:e.jsx(c,{children:"Preview"})})),e.jsx(p.ChatUIV2,Object.assign({showHeader:t.showHeader},t))]}))]}))})};
@@ -1 +1 @@
1
- import{__rest as t}from"../../_virtual/_tslib.js";import{jsx as e,jsxs as i,Fragment as n}from"react/jsx-runtime";import o,{forwardRef as s}from"react";import{Spinner as a}from"../spinner/Spinner.js";import{Button as r,ButtonCustomDashedBorder as c}from"./Button.styled.js";import{getButtonIconColor as l,SpinnerColorMap as d,GetButtonTextComponent as m}from"./themes.js";const b=s(((s,b)=>{var{version:u,id:h,buttonType:p="primary",size:g="small",buttonText:v,disabled:j,IconComponent:y,LeadingIcon:C,TrailingIcon:x,isLoading:I,inverse:N,onClick:z,matchParentWidth:T,subtitle:f,darkMode:O,activated:k,error:L,buttonTextColor:S,buttonFontSize:W,customIconColor:B,buttonColor:E}=s,M=t(s,["version","id","buttonType","size","buttonText","disabled","IconComponent","LeadingIcon","TrailingIcon","isLoading","inverse","onClick","matchParentWidth","subtitle","darkMode","activated","error","buttonTextColor","buttonFontSize","customIconColor","buttonColor"]);const P=m(g,p,j),F=l(g,p,N,j,I,O),_="chip"===g?16:20,w={height:_,width:_,color:B||F,style:{display:"block"},className:"icon"};return e(r,Object.assign({"data-test":M["data-test"],version:u,onClick:I?()=>{}:z,ref:b,id:h,disabled:j,size:g,buttonType:p,isLoading:I,inverse:N,matchParentWidth:T,darkMode:O,activated:k,error:L,buttonColor:E},M,{children:i("div",Object.assign({className:"button-container"},{children:[p.startsWith("dash")&&e(c,{}),e("div",Object.assign({className:"overlay-container"},{children:I&&e(a,{className:"spinner",size:"small",color:d(p,N)})})),y&&e("div",Object.assign({className:"icon-component"},{children:o.createElement(y,w)})),C&&e("div",Object.assign({className:"icon-leading",style:{zIndex:1}},{children:o.createElement(C,w)})),v?i(P,Object.assign({className:"text",style:{color:S,fontSize:W}},{children:[v,e("div",Object.assign({className:"text-subtitle"},{children:f}))]})):e(n,{}),x&&e("div",Object.assign({className:"icon-trailing",style:{zIndex:1}},{children:o.createElement(x,w)}))]}))}))}));b.displayName="Button";export{b as Button};
1
+ import{__rest as t}from"../../_virtual/_tslib.js";import{jsx as e,jsxs as n,Fragment as i}from"react/jsx-runtime";import o,{forwardRef as s}from"react";import{Spinner as a}from"../spinner/Spinner.js";import{Button as r,ButtonCustomDashedBorder as c}from"./Button.styled.js";import{getButtonIconColor as l,SpinnerColorMap as d,GetButtonTextComponent as m}from"./themes.js";const b=s(((s,b)=>{var{version:u,id:g,buttonType:h="primary",size:p="small",buttonText:v,disabled:j,IconComponent:y,LeadingIcon:C,TrailingIcon:I,isLoading:x,inverse:N,onClick:z,matchParentWidth:O,subtitle:T,darkMode:f,activated:k,error:L,buttonTextColor:S,buttonFontSize:W,customIconColor:B,buttonColor:E,LeadingIconStyles:M}=s,P=t(s,["version","id","buttonType","size","buttonText","disabled","IconComponent","LeadingIcon","TrailingIcon","isLoading","inverse","onClick","matchParentWidth","subtitle","darkMode","activated","error","buttonTextColor","buttonFontSize","customIconColor","buttonColor","LeadingIconStyles"]);const F=m(p,h,j),_=l(p,h,N,j,x,f),w="chip"===p?16:20,q={height:w,width:w,color:B||_,style:{display:"block"},className:"icon"};return e(r,Object.assign({"data-test":P["data-test"],version:u,onClick:x?()=>{}:z,ref:b,id:g,disabled:j,size:p,buttonType:h,isLoading:x,inverse:N,matchParentWidth:O,darkMode:f,activated:k,error:L,buttonColor:E},P,{children:n("div",Object.assign({className:"button-container"},{children:[h.startsWith("dash")&&e(c,{}),e("div",Object.assign({className:"overlay-container"},{children:x&&e(a,{className:"spinner",size:"small",color:d(h,N)})})),y&&e("div",Object.assign({className:"icon-component"},{children:o.createElement(y,q)})),C&&e("div",Object.assign({className:"icon-leading",style:Object.assign({zIndex:1},M)},{children:o.createElement(C,q)})),v?n(F,Object.assign({className:"text",style:{color:S,fontSize:W}},{children:[v,e("div",Object.assign({className:"text-subtitle"},{children:T}))]})):e(i,{}),I&&e("div",Object.assign({className:"icon-trailing",style:{zIndex:1}},{children:o.createElement(I,q)}))]}))}))}));b.displayName="Button";export{b as Button};
@@ -35,6 +35,11 @@ export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElemen
35
35
  * @default undefined
36
36
  */
37
37
  LeadingIcon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
38
+ /**
39
+ * Custom styles to be applied to the LeadingIcon
40
+ * @default undefined
41
+ */
42
+ LeadingIconStyles?: React.CSSProperties;
38
43
  /**
39
44
  * The icon component that is the left of the buttonText
40
45
  * Referred to https://ozzie.sh/passing-icons-as-props-in-a-consistent-way-using-react
@@ -9,7 +9,7 @@ import e from"styled-components";import{COLORS as o}from"../../constants/Theme.j
9
9
  background-position: center;
10
10
  background-size: cover;
11
11
  position: relative;
12
- height: 500px;
12
+ height: 100%;
13
13
  overflow-y: auto;
14
14
  border-radius: ${e=>{var o;return null!==(o=e.borderRadius)&&void 0!==o?o:"0px"}};
15
15
  `,t=e.div`
@@ -1,4 +1,3 @@
1
- import { ApplicationType } from '@bikdotai/bik-models/growth/models/bik-store';
2
1
  import { VariableListInterfaceV2 } from "../add-variableV2/AddVariableV2";
3
2
  import { CarouselProduct } from "./modalElements/EditWhatsAppCarouselTemplateV2";
4
3
  import { WhatsAppCarouselTemplateVariables } from "../template-preview/models/WhatsappCarouselTemplate";
@@ -46,7 +45,6 @@ export interface TemplateContextMapperProps {
46
45
  fetchCollections: any;
47
46
  fetchProducts: any;
48
47
  storeId: string;
49
- appType?: ApplicationType;
50
48
  };
51
49
  selectedCarouselProducts?: CarouselProduct[];
52
50
  disableEditExpiry?: boolean;
@@ -1,4 +1,3 @@
1
- import { ApplicationType } from '@bikdotai/bik-models/growth/models/bik-store';
2
1
  import { VariableV3 } from "../../../helpers";
3
2
  import React, { LegacyRef } from 'react';
4
3
  import Slider from 'react-slick';
@@ -56,7 +55,6 @@ export declare const TemplateModalContext: React.Context<{
56
55
  fetchCollections: any;
57
56
  fetchProducts: any;
58
57
  storeId: string;
59
- appType?: ApplicationType | undefined;
60
58
  } | undefined;
61
59
  carouselProducts?: CarouselProduct[] | undefined;
62
60
  setCarouselProducts?: React.Dispatch<React.SetStateAction<CarouselProduct[]>> | undefined;
@@ -129,7 +127,6 @@ export declare const useTemplateModalContext: () => {
129
127
  fetchCollections: any;
130
128
  fetchProducts: any;
131
129
  storeId: string;
132
- appType?: ApplicationType | undefined;
133
130
  } | undefined;
134
131
  carouselProducts?: CarouselProduct[] | undefined;
135
132
  setCarouselProducts?: React.Dispatch<React.SetStateAction<CarouselProduct[]>> | undefined;
@@ -1 +1 @@
1
- import{jsxs as e,jsx as t,Fragment as l}from"react/jsx-runtime";import"../../../node_modules/@bikdotai/bik-models/growth/models/bik-store.js";import o from"../../../assets/icons/arrow_back.svg.js";import i from"../../../assets/icons/chevronLeft.svg.js";import n from"../../../assets/icons/chevronRight.svg.js";import r from"../../../assets/icons/PlusIcon.js";import{cloneDeep as a}from"lodash";import{useState as d,useEffect as s}from"react";import{Button as c}from"../../button/Button.js";import{IconButton as u}from"../../icon-button/IconButton.js";import{ProductPickerModal as p,ScreenName as m}from"../../product-picker-v2/modal.js";import{Badge as v}from"../Badge/index.js";import{useTemplateModalContext as h}from"../context/templateModalContext.js";import g from"./EditWhatsAppTemplateV2.js";import{ProductBox as f}from"./ProductBox.js";import"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import{COLORS as y}from"../../../constants/Theme.js";import"../../curtain/CurtainHelper.js";import"../../variable-picker-v3/model.js";import"../../template-preview/models/TemplateMeta.js";import{POD as b}from"../../template-preview/models/WhatsAppTemplate.js";import"../../template-preview/models/Channels.js";import{isRCSChannel as j}from"../../template-preview/helpers/templateMiscHelper.js";import{TitleMedium as x,TitleRegular as C,BodySecondary as I,BodyCaption as k}from"../../TypographyStyle.js";import{__exports as w}from"../../../_virtual/bik-store.js";const O=O=>{let{template:P,whatsappSpecificPickerMeta:T,showVariableModal:S,variableListForImage:L,discountCode:B,setDiscountCode:E}=O;var A,M,V,D,F,R,W,_;const{selectedCarouselIndex:$,setTemplate:q,pickerConf:N,isProductCarouselType:z,pod:G,cardCount:H,carouselProducts:K,setCarouselProducts:J,isError:Q,cardImages:U,disableEditVariable:X,onDeleteSelectedProducts:Y,setSelectedCarouselIndex:Z,setVariableCallback:ee,setShowVariablePicker:te,sliderRef:le}=h(),[oe,ie]=d(j(null==P?void 0:P.channel)?"Carousel Cards":-1==$?"First Message (Step 1/2)":z?"Product Carousel "+((null===(M=null===(A=null==P?void 0:P.mapping)||void 0===A?void 0:A.body)||void 0===M?void 0:M.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(D=null===(V=null==P?void 0:P.mapping)||void 0===V?void 0:V.body)||void 0===D?void 0:D.length)?"(Step 2/2)":"")),[ne,re]=d(!1),[ae,de]=d(!1),se=$===(null!=H?H:-1)-1,ce=(null!=$?$:-1)<1;s((()=>{var e,t,l,o;ie(j(null==P?void 0:P.channel)?"Carousel Cards":-1==$?"First Message (Step 1/2)":z?"Product Carousel "+((null===(t=null===(e=null==P?void 0:P.mapping)||void 0===e?void 0:e.body)||void 0===t?void 0:t.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(o=null===(l=null==P?void 0:P.mapping)||void 0===l?void 0:l.body)||void 0===o?void 0:o.length)?"(Step 2/2)":""))}),[$]);const ue=e=>{null==J||J([{name:"variable",productName:e.actualValue}])};return s((()=>{-1===$&&j(null==P?void 0:P.channel)&&(null==Z||Z(0))}),[$,null==P?void 0:P.channel]),e("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"16px"}},{children:[e("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center"}},{children:[!j(null==P?void 0:P.channel)&&null!=$&&$>=0&&!!(null===(R=null===(F=null==P?void 0:P.mapping)||void 0===F?void 0:F.body)||void 0===R?void 0:R.length)&&t(u,{Icon:o,onClick:()=>{null==Z||Z(-1)}}),t(x,Object.assign({style:{marginLeft:10}},{children:oe}))]})),z&&(null!==(W=null==K?void 0:K.length)&&void 0!==W?W:0)>0&&null!=$&&$>=0&&e("div",Object.assign({style:{display:"flex",rowGap:8,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"}},{children:[t(f,{editItem:()=>{1===(null==K?void 0:K.length)&&"variable"===K[0].name?(ee((()=>ue)),te(!0)):re(!ne)},cardBody:1===(null==K?void 0:K.length)&&"variable"===K[0].name?`${K[0].productName}`:`${null==K?void 0:K.length} Products Selected`,hideIcon:1===(null==K?void 0:K.length)&&"variable"===K[0].name,deleteItem:()=>{var e;if(1===(null==K?void 0:K.length)&&"variable"===K[0].name)return void(null==J||J([]));const t=a(Object.assign({},P));t&&(U&&U.length>0?null==U||U.forEach(((e,l)=>{var o;t.components[1].cards[l].components[0].example.header_handle=[null!==(o=U[l])&&void 0!==o?o:"https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})):null===(e=null==t?void 0:t.components[1].cards)||void 0===e||e.forEach(((e,l)=>{t.components[1].cards[l].components[0].example.header_handle=["https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})),null==q||q(t)),null==J||J([]),null==Y||Y()}}),K&&(null==K?void 0:K.length)>0&&"variable"!=K[0].name&&t(c,{disabled:(null!==(_=null==K?void 0:K.length)&&void 0!==_?_:0)<=1,style:{alignSelf:"flex-end"},onClick:()=>{de(!0),re(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]})),!X&&z&&0===(null==K?void 0:K.length)&&null!=$&&$>=0&&e(l,{children:[e("div",Object.assign({style:{marginLeft:12}},{children:[t(C,{children:"Product(s)"}),t(I,{children:`Select ${null!=H?H:1} products`})]})),e("div",Object.assign({style:{marginTop:16,marginBottom:16,marginLeft:Q?16:12,marginRight:Q?16:12,flexDirection:"column",display:"flex",alignItems:"center"}},{children:[t(c,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12,border:Q?`2px dashed ${y.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s)",buttonType:Q?"tertiaryGray":"dashBold",LeadingIcon:()=>t("div",Object.assign({style:{display:"flex",width:18,height:18}},{children:t(r,{width:18,height:18,color:y.content.secondary})})),onClick:e=>{re(!0)}}),G===b.CHATBOT&&e(l,{children:[e("div",Object.assign({style:{display:"flex",flex:1,alignItems:"center",justifyContent:"space-between",flexDirection:"row",width:"100%"}},{children:[t("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginRight:8}}),t(k,Object.assign({style:{color:"#616161",overflow:"unset"}},{children:"OR"})),t("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginLeft:8}})]})),t(c,{matchParentWidth:!0,style:{flex:1,display:"flex",marginTop:12,width:"100%",border:Q?`2px dashed ${y.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s) Variable",buttonType:Q?"tertiaryGray":"dashBold",LeadingIcon:()=>t("div",Object.assign({style:{display:"flex"}},{children:t(r,{width:18,height:18,color:y.content.secondary})})),onClick:e=>{ee((()=>ue)),te(!0)}})]})]})),Q&&t("div",Object.assign({style:{marginLeft:10,marginBottom:16}},{children:t(v,{padding:"8px",errorText:"Please add products"})}))]}),!z&&(null!=$?$:-1)>-1&&e("div",Object.assign({style:{display:"flex",background:y.surface.hovered,alignItems:"center"}},{children:[t(u,{Icon:i,disabled:ce,width:8,height:14,svgStyle:ce?{}:{color:y.content.secondary},onClick:()=>{var e;null===(e=null==le?void 0:le.current)||void 0===e||e.slickPrev(),(null!=$?$:-1)<1||null==Z||Z((e=>e-1))}}),t(C,Object.assign({style:{flex:1,display:"flex",justifyContent:"center"},color:y.content.secondary},{children:`Card ${(null!=$?$:0)+1}/${H}`})),t(u,{Icon:n,width:8,height:14,disabled:se,svgStyle:se?{}:{color:y.content.secondary},onClick:()=>{var e;null===(e=null==le?void 0:le.current)||void 0===e||e.slickNext(),(null!=$?$:-1)>=(null!=H?H:-1)-1||null==Z||Z((e=>e+1))}})]})),t(g,{whatsappSpecificPickerMeta:T,template:P,onTemplateChange:e=>{null==q||q(e)},showVariableModal:S,variableListForImage:L,discountCode:B,setDiscountCode:E}),ne&&N&&t(p,{zIndex:200,startupScreen:ae?m.RearrangeProducts:m.Collections,rearrangeEnabled:!0,storeId:N.storeId,selectedItems:(e=>{if(e.length>0){const t={};for(const l of e){const e=null==l?void 0:l.collectionId,o=l.productId,i=l.variantId;e in t||(t[e]={products:{},name:"",image:"",isSmartCollection:!1}),o in t[e].products||(t[e].products[o]={variants:{},name:(null==l?void 0:l.productName)||"",image:(null==l?void 0:l.productImage)||""}),t[e].products[o].variants[i]={name:(null==l?void 0:l.name)||"",price:"",image:(null==l?void 0:l.image)||"",quantity:l.quantity||0,displayOrder:l.displayOrder}}return t}return{}})(null!=K?K:[]),collectionFetcher:N.fetchCollections,productFetcher:N.fetchProducts,onAdd:(e,t)=>{var l,o,i,n,r,d;de(!1);const s=[];delete e.isCustom;for(const t of Object.keys(e)){const a=e[t].products;if(void 0!==a&&Object.keys(a).length)for(const e of Object.keys(a)){const c=a[e].variants;if(void 0!==c&&Object.keys(c).length)for(const u of Object.keys(c)){const{name:p,image:m,quantity:v,displayOrder:h}=c[u],g={name:p,image:null!==(o=null!=m?m:null===(l=a[e])||void 0===l?void 0:l.image)&&void 0!==o?o:"",quantity:v,variantId:u,productId:e,displayOrder:h,collectionId:t,productName:null!==(n=null===(i=a[e])||void 0===i?void 0:i.name)&&void 0!==n?n:"",productImage:null!==(d=null===(r=a[e])||void 0===r?void 0:r.image)&&void 0!==d?d:""};s.push(g)}}}const c=s.sort(((e,t)=>e.displayOrder-t.displayOrder)),u=s.map((e=>e.image)),p=a(Object.assign({},P));p&&(u.forEach(((e,t)=>{var l;p.components[1].cards[t].components[0].example.header_handle=e?[e]:[null!==(l=null==U?void 0:U[t])&&void 0!==l?l:""]})),null==q||q(p)),null==J||J(c),re(!1)},searchInCollectionFetcher:N.searchInCollection,searchFetcher:N.searchProducts,visible:ne,onClose:()=>{re(!1)},exactLimit:null!=H?H:1,appType:N.appType||w.ApplicationType.BIK})]}))};export{O as default};
1
+ import{jsxs as e,jsx as t,Fragment as l}from"react/jsx-runtime";import o from"../../../assets/icons/arrow_back.svg.js";import n from"../../../assets/icons/chevronLeft.svg.js";import i from"../../../assets/icons/chevronRight.svg.js";import r from"../../../assets/icons/PlusIcon.js";import{cloneDeep as a}from"lodash";import{useState as d,useEffect as s}from"react";import{Button as c}from"../../button/Button.js";import{IconButton as u}from"../../icon-button/IconButton.js";import{ProductPickerModal as p,ScreenName as m}from"../../product-picker-v2/modal.js";import{Badge as v}from"../Badge/index.js";import{useTemplateModalContext as h}from"../context/templateModalContext.js";import g from"./EditWhatsAppTemplateV2.js";import{ProductBox as f}from"./ProductBox.js";import"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import{COLORS as y}from"../../../constants/Theme.js";import"../../curtain/CurtainHelper.js";import"../../variable-picker-v3/model.js";import"../../template-preview/models/TemplateMeta.js";import{POD as b}from"../../template-preview/models/WhatsAppTemplate.js";import"../../template-preview/models/Channels.js";import{isRCSChannel as j}from"../../template-preview/helpers/templateMiscHelper.js";import{TitleMedium as C,TitleRegular as x,BodySecondary as I,BodyCaption as w}from"../../TypographyStyle.js";const k=k=>{let{template:O,whatsappSpecificPickerMeta:P,showVariableModal:T,variableListForImage:S,discountCode:L,setDiscountCode:E}=k;var B,A,M,V,D,F,R,W;const{selectedCarouselIndex:$,setTemplate:q,pickerConf:N,isProductCarouselType:_,pod:z,cardCount:G,carouselProducts:H,setCarouselProducts:J,isError:K,cardImages:Q,disableEditVariable:U,onDeleteSelectedProducts:X,setSelectedCarouselIndex:Y,setVariableCallback:Z,setShowVariablePicker:ee,sliderRef:te}=h(),[le,oe]=d(j(null==O?void 0:O.channel)?"Carousel Cards":-1==$?"First Message (Step 1/2)":_?"Product Carousel "+((null===(A=null===(B=null==O?void 0:O.mapping)||void 0===B?void 0:B.body)||void 0===A?void 0:A.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(V=null===(M=null==O?void 0:O.mapping)||void 0===M?void 0:M.body)||void 0===V?void 0:V.length)?"(Step 2/2)":"")),[ne,ie]=d(!1),[re,ae]=d(!1),de=$===(null!=G?G:-1)-1,se=(null!=$?$:-1)<1;s((()=>{var e,t,l,o;oe(j(null==O?void 0:O.channel)?"Carousel Cards":-1==$?"First Message (Step 1/2)":_?"Product Carousel "+((null===(t=null===(e=null==O?void 0:O.mapping)||void 0===e?void 0:e.body)||void 0===t?void 0:t.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(o=null===(l=null==O?void 0:O.mapping)||void 0===l?void 0:l.body)||void 0===o?void 0:o.length)?"(Step 2/2)":""))}),[$]);const ce=e=>{null==J||J([{name:"variable",productName:e.actualValue}])};return s((()=>{-1===$&&j(null==O?void 0:O.channel)&&(null==Y||Y(0))}),[$,null==O?void 0:O.channel]),e("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"16px"}},{children:[e("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center"}},{children:[!j(null==O?void 0:O.channel)&&null!=$&&$>=0&&!!(null===(F=null===(D=null==O?void 0:O.mapping)||void 0===D?void 0:D.body)||void 0===F?void 0:F.length)&&t(u,{Icon:o,onClick:()=>{null==Y||Y(-1)}}),t(C,Object.assign({style:{marginLeft:10}},{children:le}))]})),_&&(null!==(R=null==H?void 0:H.length)&&void 0!==R?R:0)>0&&null!=$&&$>=0&&e("div",Object.assign({style:{display:"flex",rowGap:8,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"}},{children:[t(f,{editItem:()=>{1===(null==H?void 0:H.length)&&"variable"===H[0].name?(Z((()=>ce)),ee(!0)):ie(!ne)},cardBody:1===(null==H?void 0:H.length)&&"variable"===H[0].name?`${H[0].productName}`:`${null==H?void 0:H.length} Products Selected`,hideIcon:1===(null==H?void 0:H.length)&&"variable"===H[0].name,deleteItem:()=>{var e;if(1===(null==H?void 0:H.length)&&"variable"===H[0].name)return void(null==J||J([]));const t=a(Object.assign({},O));t&&(Q&&Q.length>0?null==Q||Q.forEach(((e,l)=>{var o;t.components[1].cards[l].components[0].example.header_handle=[null!==(o=Q[l])&&void 0!==o?o:"https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})):null===(e=null==t?void 0:t.components[1].cards)||void 0===e||e.forEach(((e,l)=>{t.components[1].cards[l].components[0].example.header_handle=["https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})),null==q||q(t)),null==J||J([]),null==X||X()}}),H&&(null==H?void 0:H.length)>0&&"variable"!=H[0].name&&t(c,{disabled:(null!==(W=null==H?void 0:H.length)&&void 0!==W?W:0)<=1,style:{alignSelf:"flex-end"},onClick:()=>{ae(!0),ie(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]})),!U&&_&&0===(null==H?void 0:H.length)&&null!=$&&$>=0&&e(l,{children:[e("div",Object.assign({style:{marginLeft:12}},{children:[t(x,{children:"Product(s)"}),t(I,{children:`Select ${null!=G?G:1} products`})]})),e("div",Object.assign({style:{marginTop:16,marginBottom:16,marginLeft:K?16:12,marginRight:K?16:12,flexDirection:"column",display:"flex",alignItems:"center"}},{children:[t(c,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12,border:K?`2px dashed ${y.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s)",buttonType:K?"tertiaryGray":"dashBold",LeadingIcon:()=>t("div",Object.assign({style:{display:"flex",width:18,height:18}},{children:t(r,{width:18,height:18,color:y.content.secondary})})),onClick:e=>{ie(!0)}}),z===b.CHATBOT&&e(l,{children:[e("div",Object.assign({style:{display:"flex",flex:1,alignItems:"center",justifyContent:"space-between",flexDirection:"row",width:"100%"}},{children:[t("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginRight:8}}),t(w,Object.assign({style:{color:"#616161",overflow:"unset"}},{children:"OR"})),t("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginLeft:8}})]})),t(c,{matchParentWidth:!0,style:{flex:1,display:"flex",marginTop:12,width:"100%",border:K?`2px dashed ${y.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s) Variable",buttonType:K?"tertiaryGray":"dashBold",LeadingIcon:()=>t("div",Object.assign({style:{display:"flex"}},{children:t(r,{width:18,height:18,color:y.content.secondary})})),onClick:e=>{Z((()=>ce)),ee(!0)}})]})]})),K&&t("div",Object.assign({style:{marginLeft:10,marginBottom:16}},{children:t(v,{padding:"8px",errorText:"Please add products"})}))]}),!_&&(null!=$?$:-1)>-1&&e("div",Object.assign({style:{display:"flex",background:y.surface.hovered,alignItems:"center"}},{children:[t(u,{Icon:n,disabled:se,width:8,height:14,svgStyle:se?{}:{color:y.content.secondary},onClick:()=>{var e;null===(e=null==te?void 0:te.current)||void 0===e||e.slickPrev(),(null!=$?$:-1)<1||null==Y||Y((e=>e-1))}}),t(x,Object.assign({style:{flex:1,display:"flex",justifyContent:"center"},color:y.content.secondary},{children:`Card ${(null!=$?$:0)+1}/${G}`})),t(u,{Icon:i,width:8,height:14,disabled:de,svgStyle:de?{}:{color:y.content.secondary},onClick:()=>{var e;null===(e=null==te?void 0:te.current)||void 0===e||e.slickNext(),(null!=$?$:-1)>=(null!=G?G:-1)-1||null==Y||Y((e=>e+1))}})]})),t(g,{whatsappSpecificPickerMeta:P,template:O,onTemplateChange:e=>{null==q||q(e)},showVariableModal:T,variableListForImage:S,discountCode:L,setDiscountCode:E}),ne&&N&&t(p,{zIndex:200,startupScreen:re?m.RearrangeProducts:m.Collections,rearrangeEnabled:!0,storeId:N.storeId,selectedItems:(e=>{if(e.length>0){const t={};for(const l of e){const e=null==l?void 0:l.collectionId,o=l.productId,n=l.variantId;e in t||(t[e]={products:{},name:"",image:"",isSmartCollection:!1}),o in t[e].products||(t[e].products[o]={variants:{},name:(null==l?void 0:l.productName)||"",image:(null==l?void 0:l.productImage)||""}),t[e].products[o].variants[n]={name:(null==l?void 0:l.name)||"",price:"",image:(null==l?void 0:l.image)||"",quantity:l.quantity||0,displayOrder:l.displayOrder}}return t}return{}})(null!=H?H:[]),collectionFetcher:N.fetchCollections,productFetcher:N.fetchProducts,onAdd:(e,t)=>{var l,o,n,i,r,d;ae(!1);const s=[];delete e.isCustom;for(const t of Object.keys(e)){const a=e[t].products;if(void 0!==a&&Object.keys(a).length)for(const e of Object.keys(a)){const c=a[e].variants;if(void 0!==c&&Object.keys(c).length)for(const u of Object.keys(c)){const{name:p,image:m,quantity:v,displayOrder:h}=c[u],g={name:p,image:null!==(o=null!=m?m:null===(l=a[e])||void 0===l?void 0:l.image)&&void 0!==o?o:"",quantity:v,variantId:u,productId:e,displayOrder:h,collectionId:t,productName:null!==(i=null===(n=a[e])||void 0===n?void 0:n.name)&&void 0!==i?i:"",productImage:null!==(d=null===(r=a[e])||void 0===r?void 0:r.image)&&void 0!==d?d:""};s.push(g)}}}const c=s.sort(((e,t)=>e.displayOrder-t.displayOrder)),u=s.map((e=>e.image)),p=a(Object.assign({},O));p&&(u.forEach(((e,t)=>{var l;p.components[1].cards[t].components[0].example.header_handle=e?[e]:[null!==(l=null==Q?void 0:Q[t])&&void 0!==l?l:""]})),null==q||q(p)),null==J||J(c),ie(!1)},searchInCollectionFetcher:N.searchInCollection,searchFetcher:N.searchProducts,visible:ne,onClose:()=>{ie(!1)},exactLimit:null!=G?G:1})]}))};export{k as default};
@@ -9,7 +9,7 @@ import e from"styled-components";import{Caption as r}from"../../TypographyStyle.
9
9
  border: 2px solid
10
10
  ${e=>e.hasError?`${o.content.negative}`:e.showBorder?`${o.stroke.brand}`:`${o.stroke.primary}`};
11
11
  border: ${e=>e.showDashedBorder&&`2px dashed ${o.content.brand}`};
12
- height: 100%;
12
+ height: ${e=>e.isWhatsappCarousel?"100%":"auto"};
13
13
  display: flex;
14
14
  flex-direction: column;
15
15
  :hover {
@@ -36,14 +36,14 @@ import e from"styled-components";import{Caption as r}from"../../TypographyStyle.
36
36
  min-height: 152px;
37
37
  margin-bottom: 4px;
38
38
  margin: 0px 8px;
39
- `,p=e.div`
39
+ `,a=e.div`
40
40
  padding: 12px;
41
41
  display: flex;
42
42
  flex-direction: row;
43
43
  justify-content: center;
44
44
  align-items: center;
45
45
  border-top: 1px solid ${o.stroke.primary};
46
- `,a=e.div`
46
+ `,p=e.div`
47
47
  display: flex;
48
48
  flex-direction: row;
49
49
  justify-content: space-between;
@@ -66,4 +66,4 @@ import e from"styled-components";import{Caption as r}from"../../TypographyStyle.
66
66
  position: absolute;
67
67
  top: 16px;
68
68
  right: 16px;
69
- `;export{p as ChatBtnContainer,t as Container,d as FooterText,a as FooterWrapper,s as MediaContainer,i as TimeStamp};
69
+ `;export{a as ChatBtnContainer,t as Container,d as FooterText,p as FooterWrapper,s as MediaContainer,i as TimeStamp};
@@ -1,4 +1,4 @@
1
- import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import o from"styled-components";import{useTemplateModalContext as s}from"../../template-context-mapper/context/templateModalContext.js";import{BACKGROUND_PREVIEW_IMAGE as a}from"../../template-context-mapper/utils/constants.js";import{TitleRegular as i}from"../../TypographyStyle.js";import{COLORS as p}from"../../../constants/Theme.js";import{getPreviewPropLen as n}from"../utils/getPreviewPropLen.js";import m from"./ChatHeader.js";import{ChatUIV2 as c}from"./ChatUiV2.js";const h=o.div`
1
+ import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import o from"styled-components";import{useTemplateModalContext as s}from"../../template-context-mapper/context/templateModalContext.js";import{BACKGROUND_PREVIEW_IMAGE as a}from"../../template-context-mapper/utils/constants.js";import{TitleRegular as i}from"../../TypographyStyle.js";import{COLORS as p}from"../../../constants/Theme.js";import{getPreviewPropLen as n}from"../utils/getPreviewPropLen.js";import m from"./ChatHeader.js";import{ChatUIV2 as c}from"./ChatUiV2.js";const l=o.div`
2
2
  background-image: ${e=>e.isWhatsappCarousel?"none":`url(${a})`};
3
3
  border-radius: 4px;
4
4
  background-repeat: no-repeat;
@@ -6,6 +6,6 @@ import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import o from"st
6
6
  background-size: cover;
7
7
  position: relative;
8
8
  height: ${e=>e.isWhatsappCarousel?"100%":"auto"};
9
- `,l=o(i)`
9
+ `,d=o(i)`
10
10
  color: ${p.content.primary};
11
- `,d=o=>{const{hideDeviceContainerInPreview:a}=s();return 3===n(o)?e(t,{children:o.zeroStateComponent}):a?e(c,Object.assign({showHeader:o.showHeader},o)):e(t,{children:r(h,Object.assign({style:o.containerStyle,showHeader:o.showHeader,isWhatsappCarousel:o.isWhatsappCarousel},{children:[o.showHeader&&e(m,{}),r("div",Object.assign({style:{padding:"small"===o.size?"12px 32px 12px 12px":`16px ${o.isWhatsappCarousel?"0px":"56px"} ${o.isWhatsappCarousel?"2px":"16px"} 16px`,height:o.isWhatsappCarousel?"100%":"auto"}},{children:[!o.hidePreviewText&&e("div",Object.assign({style:{marginBottom:16}},{children:e(l,{children:"Preview"})})),e(c,Object.assign({showHeader:o.showHeader},o))]}))]}))})};export{d as WhatsappLikePreviewV2};
11
+ `,h=o=>{const{hideDeviceContainerInPreview:a}=s();return 3===n(o)?e(t,{children:o.zeroStateComponent}):a?e(c,Object.assign({showHeader:o.showHeader},o)):e(t,{children:r(l,Object.assign({style:o.containerStyle,showHeader:o.showHeader,isWhatsappCarousel:o.isWhatsappCarousel},{children:[o.showHeader&&e(m,{}),r("div",Object.assign({style:{padding:"small"===o.size?"12px 32px 12px 12px":`16px ${o.isWhatsappCarousel?"0px":"56px"} ${o.isWhatsappCarousel?"2px":"16px"} 16px`,height:"100%",overflowY:"auto"}},{children:[!o.hidePreviewText&&e("div",Object.assign({style:{marginBottom:16}},{children:e(d,{children:"Preview"})})),e(c,Object.assign({showHeader:o.showHeader},o))]}))]}))})};export{h as WhatsappLikePreviewV2};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bikdotai/bik-component-library",
3
- "version": "0.0.682-beta.pp-2",
3
+ "version": "0.0.683-0",
4
4
  "description": "Bik Component Library",
5
5
  "repository": {
6
6
  "type": "git",