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

package/dist/cjs/components/carousel-preview/CarouselPreview.d.ts

@@ -11,4 +11,5 @@ export declare const CarouselPreview: React.ForwardRefExoticComponent<{
     template: WhatsAppTemplate | EmailTemplateType | SMSTemplateType | WhatsAppCarouselTemplate | null;
     showSampleValues?: boolean | undefined;
     isPreview?: boolean | undefined;
+    removeBottomBorder?: boolean | undefined;
 } & React.RefAttributes<HTMLDivElement>>;

package/dist/cjs/components/carousel-preview/CarouselPreview.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/chevronLeft.svg.js"),n=require("../../assets/icons/chevronRight.svg.js"),l=require("pure-react-carousel"),i=require("react"),r=require("./CarouselPreview.style.js"),s=require("./CarouselPreviewCard.js"),o=require("../../constants/Theme.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const d=a(i).default.forwardRef(((i,a)=>{let{channel:d,template:u,showSampleValues:c,isPreview:h}=i;var v,g,p,j,x,m;const f=null===(v=null==u?void 0:u.components)||void 0===v?void 0:v[1].cards;let b="500px";const w=null!==(p=null===(g=null==u?void 0:u.components)||void 0===g?void 0:g[0].text)&&void 0!==p?p:"";return w.length>100&&w.length<300?b="530px":w.length>300&&w.length<600?b="560px":w.length>600&&w.length<900?b="590px":w.length>900&&w.length<1200&&(b="620px"),e.jsxs(r.Container,{children:[e.jsx(s.default,{channel:d,template:u,carouselCardIndex:-1,isPreview:h,width:"77%"}),!!(null==f?void 0:f.length)&&e.jsx(l.CarouselProvider,Object.assign({naturalSlideWidth:100,naturalSlideHeight:125,totalSlides:null!==(j=null==f?void 0:f.length)&&void 0!==j?j:1,orientation:"horizontal",visibleSlides:1.3,dragEnabled:!0,touchEnabled:!0},{children:e.jsxs(r.CarouselContainer,Object.assign({height:b},{children:[!h&&e.jsx(l.ButtonBack,Object.assign({className:"left_button"},{children:e.jsx(t.default,{height:10,width:10,color:o.COLORS.content.primary})})),e.jsx(l.Slider,Object.assign({className:"slider"},{children:null===(m=null===(x=null==u?void 0:u.components)||void 0===x?void 0:x[1].cards)||void 0===m?void 0:m.map(((t,n)=>{var i,r;const o={components:t.components,mapping:null===(r=null===(i=null==u?void 0:u.mapping)||void 0===i?void 0:i.cards)||void 0===r?void 0:r[n]};return e.jsx(l.Slide,Object.assign({index:n},{children:e.jsx(s.default,{channel:d,template:o,carouselCardIndex:n,isPreview:h,width:"100%"},n)}),n)}))})),!h&&e.jsx(l.ButtonNext,Object.assign({className:"right_button"},{children:e.jsx(n.default,{height:10,width:10,color:o.COLORS.content.primary})}))]}))}))]})}));exports.CarouselPreview=d;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/chevronLeft.svg.js"),n=require("../../assets/icons/chevronRight.svg.js"),r=require("pure-react-carousel"),l=require("react"),i=require("./CarouselPreview.style.js"),s=require("./CarouselPreviewCard.js"),o=require("../../constants/Theme.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const d=a(l).default.forwardRef(((l,a)=>{let{channel:d,template:u,showSampleValues:c,isPreview:h,removeBottomBorder:v}=l;var g,j,p,x,m,b;const f=null===(g=null==u?void 0:u.components)||void 0===g?void 0:g[1].cards;let w="500px";const C=null!==(p=null===(j=null==u?void 0:u.components)||void 0===j?void 0:j[0].text)&&void 0!==p?p:"";return C.length>100&&C.length<300?w="530px":C.length>300&&C.length<600?w="560px":C.length>600&&C.length<900?w="590px":C.length>900&&C.length<1200&&(w="620px"),e.jsxs(i.Container,Object.assign({removeBottomBorder:v},{children:[e.jsx(s.default,{channel:d,currentTemplate:u,carouselCardIndex:-1,isPreview:h,width:"77%"}),!!(null==f?void 0:f.length)&&e.jsx(r.CarouselProvider,Object.assign({naturalSlideWidth:100,naturalSlideHeight:125,totalSlides:null!==(x=null==f?void 0:f.length)&&void 0!==x?x:1,orientation:"horizontal",visibleSlides:1.3,dragEnabled:!0,touchEnabled:!0},{children:e.jsxs(i.CarouselContainer,Object.assign({height:w},{children:[!h&&e.jsx(r.ButtonBack,Object.assign({className:"left_button"},{children:e.jsx(t.default,{height:10,width:10,color:o.COLORS.content.primary})})),e.jsx(r.Slider,Object.assign({className:"slider"},{children:null===(b=null===(m=null==u?void 0:u.components)||void 0===m?void 0:m[1].cards)||void 0===b?void 0:b.map(((t,n)=>{var l,i;const o={components:t.components,mapping:null===(i=null===(l=null==u?void 0:u.mapping)||void 0===l?void 0:l.cards)||void 0===i?void 0:i[n]};return e.jsx(r.Slide,Object.assign({index:n},{children:e.jsx(s.default,{channel:d,currentTemplate:o,carouselCardIndex:n,isPreview:h,width:"100%"},n)}),n)}))})),!h&&e.jsx(r.ButtonNext,Object.assign({className:"right_button"},{children:e.jsx(n.default,{height:10,width:10,color:o.COLORS.content.primary})}))]}))}))]}))}));exports.CarouselPreview=d;

package/dist/cjs/components/carousel-preview/CarouselPreview.style.d.ts

@@ -1,5 +1,6 @@
 export declare const Container: import("styled-components").StyledComponent<"div", any, {
     showHeader?: boolean | undefined;
+    removeBottomBorder?: boolean | undefined;
 }, never>;
 export declare const CarouselContainer: import("styled-components").StyledComponent<"div", any, {
     height: string;

package/dist/cjs/components/carousel-preview/CarouselPreview.style.js

@@ -2,7 +2,7 @@
 	background-image: url('https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F341dba50-e84e-4457-b5b5-d9d8a0b95a73?alt=media&token=6fd32f23-8bb2-4980-bbee-bef39b38fd9f');
 	border-color: ${t.COLORS.stroke.primary};
 	border-top-style: solid;
-	border-bottom-style: solid;
+	border-bottom-style: ${e=>e.removeBottomBorder?"unset":"solid"};
 	border-top-width: 1px;
 	border-bottom-width: 1px;
 	background-repeat: no-repeat;

package/dist/cjs/components/carousel-preview/CarouselPreviewCard.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { CHANNEL_TYPE } from "../template-preview/models/Channels";
 declare const CarouselPreviewCard: React.ForwardRefExoticComponent<{
     channel: CHANNEL_TYPE;
-    template: any;
+    currentTemplate: any;
     showSampleValues?: boolean | undefined;
     carouselCardIndex?: number | undefined;
     isPreview?: boolean | undefined;

package/dist/cjs/components/carousel-preview/CarouselPreviewCard.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("../template-context-mapper/context/templateModalContext.js"),a=require("../template-preview/TemplatePreview.js");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../template-preview/WhatsApp/WhatsAppLikePreviewV2.js"),require("../../constants/Theme.js"),require("../curtain/CurtainHelper.js"),require("../template-preview/models/TemplateMeta.js"),require("../template-preview/models/WhatsAppTemplate.js");const i=s(t).default.forwardRef((t=>{let{channel:s,template:i,showSampleValues:p,carouselCardIndex:l,isPreview:u,width:n}=t;const{cardWidth:o}=r.useTemplateModalContext();return e.jsx("div",Object.assign({style:{width:n||o}},{children:e.jsx(a.TemplatePreview,{showSampleValues:p,template:i,channel:s,size:"small",hideHeader:!0,carouselCardIndex:l,isWhatsappCarousel:!0,isPreview:u})}))}));exports.default=i;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("../template-context-mapper/context/templateModalContext.js"),a=require("../template-preview/TemplatePreview.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../template-preview/WhatsApp/WhatsAppLikePreviewV2.js"),require("../../constants/Theme.js"),require("../curtain/CurtainHelper.js"),require("../template-preview/models/TemplateMeta.js"),require("../template-preview/models/WhatsAppTemplate.js");const l=i(t).default.forwardRef((t=>{let{channel:i,currentTemplate:l,showSampleValues:s,carouselCardIndex:p,isPreview:n,width:u}=t;var o,d,m;const{cardWidth:c,template:v}=r.useTemplateModalContext(),h=(null!==(m=null===(d=null===(o=null==v?void 0:v.components)||void 0===o?void 0:o[1].cards)||void 0===d?void 0:d.length)&&void 0!==m?m:0)-1===p?12:0;return e.jsx("div",Object.assign({style:{width:u||c}},{children:e.jsx(a.TemplatePreview,{showSampleValues:s,template:l,channel:i,size:"small",hideHeader:!0,carouselCardIndex:p,isWhatsappCarousel:!0,isPreview:n,whatsAppSpecificMeta:{templateContainerStyles:{marginRight:h}}})}))}));exports.default=l;

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

@@ -1,10 +1,10 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../../constants/Theme.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=r(e);const o=i.default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../../constants/Theme.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=r(e);const i=o.default.div`
 	display: flex;
 	align-items: center;
 	gap: 12px;
 	/* justify-content: center; */
 	flex: 1;
-`,n=i.default.div`
+`,n=o.default.div`
 	width: 56px;
 	height: 56px;
 	display: flex;
@@ -16,7 +16,7 @@
 	border: 1px solid ${t.COLORS.stroke.primary};
 	box-sizing: content-box;
 	cursor: ${e=>e.error?"pointer":"default"};
-`,d=i.default.div`
+`,d=o.default.div`
 	padding: 8px;
 	flex-direction: row;
 	display: flex;
@@ -25,7 +25,8 @@
 	border: 1px solid ${t.COLORS.stroke.primary};
 	border-radius: 4px;
 	margin-left: 8px;
-`,a=i.default.div`
+`,a=o.default.div`
 	padding-bottom: 0px;
 	min-width: 285px;
-`;exports.Container=d,exports.EditTemplateMediaContainer=a,exports.ImageContainer=n,exports.RightComponent=o;
+	margin-bottom: 16px;
+`;exports.Container=d,exports.EditTemplateMediaContainer=a,exports.ImageContainer=n,exports.RightComponent=i;

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../assets/icons/PlusIcon.js"),r=require("lodash"),a=require("react"),l=require("../../add-variableV2/AddVariableV2SideModal.js");require("../../../_virtual/_tslib.js"),require("../../add-variableV2/AddVariableV2.styled.js");var i=require("../../button/Button.js");require("../../icon-button/IconButton.js"),require("../../input/Input.js"),require("../../tooltips/Tooltip.js");var o=require("../../../constants/Theme.js");require("../../modals/modal.styled.js"),require("../../switch/Switch.js");var s=require("../../TypographyStyle.js"),n=require("../../product-picker-v2/modal.js"),d=require("../context/templateModalContext.js"),c=require("./EditWhatsAppTemplateV2.js"),u=require("./ProductBox.js");require("../../template-preview/TemplatePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js"),require("../../curtain/CurtainHelper.js"),require("../../template-preview/models/TemplateMeta.js");var p=require("../../template-preview/models/WhatsAppTemplate.js");exports.default=m=>{let{template:h,whatsappSpecificPickerMeta:g,showVariableModal:v,variableList:j,variableListForImage:x,discountCode:y,setDiscountCode:b}=m;var f,C;const{selectedCarouselIndex:O,setTemplate:I,pickerConf:q,isProductCarouselType:w,pod:P,cardCount:S,carouselProducts:T,setCarouselProducts:L,isError:k,cardImages:B,disableEditVariable:V,onDeleteSelectedProducts:A}=d.useTemplateModalContext(),[E,M]=a.useState(-1==O?"First Message (Step 1/2)":"Product Carousel (Step 2/2)"),[R,F]=a.useState(!1),[D,W]=a.useState(!1),[_,N]=a.useState(!1);a.useEffect((()=>{M(-1==O?"First Message (Step 1/2)":"Product Carousel (Step 2/2)")}),[O]);return e.jsxs("div",{children:[e.jsx(s.TitleMedium,Object.assign({style:{marginLeft:10,marginBottom:24}},{children:E})),w&&(null!==(f=null==T?void 0:T.length)&&void 0!==f?f:0)>0&&null!=O&&O>=0&&e.jsxs("div",Object.assign({style:{display:"flex",rowGap:16,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"}},{children:[e.jsx(u.ProductBox,{editItem:()=>{1===(null==T?void 0:T.length)&&"variable"===T[0].name?N(!0):F(!R)},cardBody:1===(null==T?void 0:T.length)&&"variable"===T[0].name?`${T[0].productName}`:`${null==T?void 0:T.length} Products Selected`,hideIcon:1===(null==T?void 0:T.length)&&"variable"===T[0].name,deleteItem:()=>{var e;if(1===(null==T?void 0:T.length)&&"variable"===T[0].name)return void(null==L||L([]));const t=r.cloneDeep(Object.assign({},h));console.log("cardImages selectedTemplate: ",t),t&&(console.log("cardImages: ",B),B&&B.length>0?null==B||B.forEach(((e,r)=>{var a;t.components[1].cards[r].components[0].example.header_handle=[null!==(a=B[r])&&void 0!==a?a:""]})):null===(e=null==t?void 0:t.components[1].cards)||void 0===e||e.forEach(((e,r)=>{t.components[1].cards[r].components[0].example.header_handle=[""]})),null==I||I(t),console.log("cardImages22 selectedTemplate: ",t)),null==L||L([]),null==A||A()}}),T&&(null==T?void 0:T.length)>0&&"variable"!=T[0].name&&e.jsx(i.Button,{disabled:(null!==(C=null==T?void 0:T.length)&&void 0!==C?C:0)<=1,style:{alignSelf:"flex-end"},onClick:()=>{W(!0),F(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]})),!V&&w&&0===(null==T?void 0:T.length)&&null!=O&&O>=0&&e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{marginLeft:12}},{children:[e.jsx(s.TitleRegular,{children:"Product(s)"}),e.jsx(s.BodySecondary,{children:`Select ${null!=S?S:1} products`})]})),e.jsxs("div",Object.assign({style:{marginTop:16,marginBottom:16,marginLeft:12,marginRight:12,flexDirection:"column",display:"flex",alignItems:"center"}},{children:[e.jsx(i.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12,border:k?`2px dashed ${o.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s)",buttonType:k?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsx("div",Object.assign({style:{display:"flex",width:18,height:18}},{children:e.jsx(t.default,{width:18,height:18,color:o.COLORS.content.secondary})})),onClick:e=>{F(!0)}}),P===p.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(s.BodyCaption,Object.assign({style:{color:"#616161",overflow:"unset"}},{children:"OR"})),e.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginLeft:8}})]})),e.jsx(i.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",marginTop:12,width:"100%",border:k?`2px dashed ${o.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s) Variable",buttonType:k?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsx("div",Object.assign({style:{display:"flex"}},{children:e.jsx(t.default,{width:18,height:18,color:o.COLORS.content.secondary})})),onClick:e=>{N(!0)}})]})]}))]}),e.jsx(c.default,{whatsappSpecificPickerMeta:g,template:h,onTemplateChange:e=>{null==I||I(e)},showVariableModal:v,variableList:j,variableListForImage:x,discountCode:y,setDiscountCode:b}),R&&q&&e.jsx(n.ProductPickerModal,{zIndex:200,startupScreen:D?n.ScreenName.RearrangeProducts:n.ScreenName.Collections,rearrangeEnabled:!0,storeId:q.storeId,selectedItems:(e=>{if(e.length>0){const t={};for(const r of e){const e=null==r?void 0:r.collectionId,a=r.productId,l=r.variantId;e in t||(t[e]={products:{},name:"",image:"",isSmartCollection:!1}),a in t[e].products||(t[e].products[a]={variants:{},name:(null==r?void 0:r.productName)||"",image:(null==r?void 0:r.productImage)||""}),t[e].products[a].variants[l]={name:(null==r?void 0:r.name)||"",price:"",image:(null==r?void 0:r.image)||"",quantity:r.quantity||0,displayOrder:r.displayOrder}}return t}return{}})(null!=T?T:[]),collectionFetcher:q.fetchCollections,productFetcher:q.fetchProducts,onAdd:(e,t)=>{var a;W(!1);const l=[];delete e.isCustom;for(const t of Object.keys(e)){const r=e[t].products;if(void 0!==r&&Object.keys(r).length)for(const e of Object.keys(r)){const i=r[e].variants;if(void 0!==i&&Object.keys(i).length)for(const o of Object.keys(i)){const{name:s,image:n,quantity:d,displayOrder:c}=i[o],u={name:s,image:null!==(a=null!=n?n:r[e].image)&&void 0!==a?a:"",quantity:d,variantId:o,productId:e,displayOrder:c,collectionId:t,productName:r[e].name,productImage:r[e].image};l.push(u)}}}const i=l.sort(((e,t)=>e.displayOrder-t.displayOrder)),o=l.map((e=>e.image)),s=r.cloneDeep(Object.assign({},h));s&&(o.forEach(((e,t)=>{var r;s.components[1].cards[t].components[0].example.header_handle=e?[e]:[null!==(r=null==B?void 0:B[t])&&void 0!==r?r:""]})),null==I||I(s)),null==L||L(i),F(!1)},searchInCollectionFetcher:q.searchInCollection,searchFetcher:q.searchProducts,visible:R,onClose:()=>{F(!1)},exactLimit:null!=S?S:1}),_&&e.jsx(l.AddVariableV2SideModal,{zIndex:2e3,data:null!=j?j:[],showVariable:_,setShowVariable:N,placeholder:"Add a variable",customTrigger:e=>{null==L||L([{name:"variable",productName:e.actualValue}])}})]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../assets/icons/arrow_back.svg.js"),r=require("../../../assets/icons/PlusIcon.js"),l=require("lodash"),a=require("react"),i=require("../../add-variableV2/AddVariableV2SideModal.js");require("../../../_virtual/_tslib.js"),require("../../add-variableV2/AddVariableV2.styled.js");var s=require("../../button/Button.js"),o=require("../../icon-button/IconButton.js");require("../../input/Input.js"),require("../../tooltips/Tooltip.js");var n=require("../../../constants/Theme.js");require("../../modals/modal.styled.js"),require("../../switch/Switch.js");var d=require("../../TypographyStyle.js"),c=require("../../product-picker-v2/modal.js"),u=require("../Badge/index.js"),p=require("../context/templateModalContext.js"),m=require("./EditWhatsAppTemplateV2.js"),h=require("./ProductBox.js");require("../../template-preview/TemplatePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js"),require("../../curtain/CurtainHelper.js"),require("../../template-preview/models/TemplateMeta.js");var g=require("../../template-preview/models/WhatsAppTemplate.js");exports.default=v=>{let{template:j,whatsappSpecificPickerMeta:x,showVariableModal:y,variableList:b,variableListForImage:f,discountCode:C,setDiscountCode:I}=v;var O,q;const{selectedCarouselIndex:w,setTemplate:P,pickerConf:S,isProductCarouselType:T,pod:B,cardCount:k,carouselProducts:L,setCarouselProducts:V,isError:A,cardImages:E,disableEditVariable:M,onDeleteSelectedProducts:R,setSelectedCarouselIndex:D}=p.useTemplateModalContext(),[F,W]=a.useState(-1==w?"First Message (Step 1/2)":"Product Carousel (Step 2/2)"),[_,N]=a.useState(!1),[$,z]=a.useState(!1),[G,H]=a.useState(!1);a.useEffect((()=>{W(-1==w?"First Message (Step 1/2)":"Product Carousel (Step 2/2)")}),[w]);return e.jsxs("div",{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center",marginBottom:24}},{children:[null!=w&&w>=0&&e.jsx(o.IconButton,{Icon:t.default,onClick:()=>{null==D||D(-1)}}),e.jsx(d.TitleMedium,Object.assign({style:{marginLeft:10}},{children:F}))]})),T&&(null!==(O=null==L?void 0:L.length)&&void 0!==O?O:0)>0&&null!=w&&w>=0&&e.jsxs("div",Object.assign({style:{display:"flex",rowGap:16,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"}},{children:[e.jsx(h.ProductBox,{editItem:()=>{1===(null==L?void 0:L.length)&&"variable"===L[0].name?H(!0):N(!_)},cardBody:1===(null==L?void 0:L.length)&&"variable"===L[0].name?`${L[0].productName}`:`${null==L?void 0:L.length} Products Selected`,hideIcon:1===(null==L?void 0:L.length)&&"variable"===L[0].name,deleteItem:()=>{var e;if(1===(null==L?void 0:L.length)&&"variable"===L[0].name)return void(null==V||V([]));const t=l.cloneDeep(Object.assign({},j));console.log("cardImages selectedTemplate: ",t),t&&(console.log("cardImages: ",E),E&&E.length>0?null==E||E.forEach(((e,r)=>{var l;t.components[1].cards[r].components[0].example.header_handle=[null!==(l=E[r])&&void 0!==l?l:""]})):null===(e=null==t?void 0:t.components[1].cards)||void 0===e||e.forEach(((e,r)=>{t.components[1].cards[r].components[0].example.header_handle=[""]})),null==P||P(t),console.log("cardImages22 selectedTemplate: ",t)),null==V||V([]),null==R||R()}}),L&&(null==L?void 0:L.length)>0&&"variable"!=L[0].name&&e.jsx(s.Button,{disabled:(null!==(q=null==L?void 0:L.length)&&void 0!==q?q:0)<=1,style:{alignSelf:"flex-end"},onClick:()=>{z(!0),N(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]})),!M&&T&&0===(null==L?void 0:L.length)&&null!=w&&w>=0&&e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{marginLeft:12}},{children:[e.jsx(d.TitleRegular,{children:"Product(s)"}),e.jsx(d.BodySecondary,{children:`Select ${null!=k?k:1} products`})]})),e.jsxs("div",Object.assign({style:{marginTop:16,marginBottom:16,marginLeft:12,marginRight:12,flexDirection:"column",display:"flex",alignItems:"center"}},{children:[e.jsx(s.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12,border:A?`2px dashed ${n.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s)",buttonType:A?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsx("div",Object.assign({style:{display:"flex",width:18,height:18}},{children:e.jsx(r.default,{width:18,height:18,color:n.COLORS.content.secondary})})),onClick:e=>{N(!0)}}),B===g.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(d.BodyCaption,Object.assign({style:{color:"#616161",overflow:"unset"}},{children:"OR"})),e.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginLeft:8}})]})),e.jsx(s.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",marginTop:12,width:"100%",border:A?`2px dashed ${n.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s) Variable",buttonType:A?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsx("div",Object.assign({style:{display:"flex"}},{children:e.jsx(r.default,{width:18,height:18,color:n.COLORS.content.secondary})})),onClick:e=>{H(!0)}})]}),A&&e.jsx(u.Badge,{errorText:"Please add products"})]}))]}),e.jsx(m.default,{whatsappSpecificPickerMeta:x,template:j,onTemplateChange:e=>{null==P||P(e)},showVariableModal:y,variableList:b,variableListForImage:f,discountCode:C,setDiscountCode:I}),_&&S&&e.jsx(c.ProductPickerModal,{zIndex:200,startupScreen:$?c.ScreenName.RearrangeProducts:c.ScreenName.Collections,rearrangeEnabled:!0,storeId:S.storeId,selectedItems:(e=>{if(e.length>0){const t={};for(const r of e){const e=null==r?void 0:r.collectionId,l=r.productId,a=r.variantId;e in t||(t[e]={products:{},name:"",image:"",isSmartCollection:!1}),l in t[e].products||(t[e].products[l]={variants:{},name:(null==r?void 0:r.productName)||"",image:(null==r?void 0:r.productImage)||""}),t[e].products[l].variants[a]={name:(null==r?void 0:r.name)||"",price:"",image:(null==r?void 0:r.image)||"",quantity:r.quantity||0,displayOrder:r.displayOrder}}return t}return{}})(null!=L?L:[]),collectionFetcher:S.fetchCollections,productFetcher:S.fetchProducts,onAdd:(e,t)=>{var r;z(!1);const a=[];delete e.isCustom;for(const t of Object.keys(e)){const l=e[t].products;if(void 0!==l&&Object.keys(l).length)for(const e of Object.keys(l)){const i=l[e].variants;if(void 0!==i&&Object.keys(i).length)for(const s of Object.keys(i)){const{name:o,image:n,quantity:d,displayOrder:c}=i[s],u={name:o,image:null!==(r=null!=n?n:l[e].image)&&void 0!==r?r:"",quantity:d,variantId:s,productId:e,displayOrder:c,collectionId:t,productName:l[e].name,productImage:l[e].image};a.push(u)}}}const i=a.sort(((e,t)=>e.displayOrder-t.displayOrder)),s=a.map((e=>e.image)),o=l.cloneDeep(Object.assign({},j));o&&(s.forEach(((e,t)=>{var r;o.components[1].cards[t].components[0].example.header_handle=e?[e]:[null!==(r=null==E?void 0:E[t])&&void 0!==r?r:""]})),null==P||P(o)),null==V||V(i),N(!1)},searchInCollectionFetcher:S.searchInCollection,searchFetcher:S.searchProducts,visible:_,onClose:()=>{N(!1)},exactLimit:null!=k?k:1}),G&&e.jsx(i.AddVariableV2SideModal,{zIndex:2e3,data:null!=b?b:[],showVariable:G,setShowVariable:H,placeholder:"Add a variable",customTrigger:e=>{null==V||V([{name:"variable",productName:e.actualValue}])}})]})};

package/dist/esm/components/carousel-preview/CarouselPreview.d.ts

@@ -11,4 +11,5 @@ export declare const CarouselPreview: React.ForwardRefExoticComponent<{
     template: WhatsAppTemplate | EmailTemplateType | SMSTemplateType | WhatsAppCarouselTemplate | null;
     showSampleValues?: boolean | undefined;
     isPreview?: boolean | undefined;
+    removeBottomBorder?: boolean | undefined;
 } & React.RefAttributes<HTMLDivElement>>;

package/dist/esm/components/carousel-preview/CarouselPreview.js

@@ -1 +1 @@
-import{jsxs as e,jsx as n}from"react/jsx-runtime";import t from"../../assets/icons/chevronLeft.svg.js";import l from"../../assets/icons/chevronRight.svg.js";import{CarouselProvider as i,ButtonBack as o,Slider as r,Slide as s,ButtonNext as a}from"pure-react-carousel";import d from"react";import{Container as c,CarouselContainer as h}from"./CarouselPreview.style.js";import m from"./CarouselPreviewCard.js";import{COLORS as v}from"../../constants/Theme.js";const p=d.forwardRef(((d,p)=>{let{channel:u,template:g,showSampleValues:f,isPreview:j}=d;var b,w,x,O,C,P;const S=null===(b=null==g?void 0:g.components)||void 0===b?void 0:b[1].cards;let y="500px";const N=null!==(x=null===(w=null==g?void 0:g.components)||void 0===w?void 0:w[0].text)&&void 0!==x?x:"";return N.length>100&&N.length<300?y="530px":N.length>300&&N.length<600?y="560px":N.length>600&&N.length<900?y="590px":N.length>900&&N.length<1200&&(y="620px"),e(c,{children:[n(m,{channel:u,template:g,carouselCardIndex:-1,isPreview:j,width:"77%"}),!!(null==S?void 0:S.length)&&n(i,Object.assign({naturalSlideWidth:100,naturalSlideHeight:125,totalSlides:null!==(O=null==S?void 0:S.length)&&void 0!==O?O:1,orientation:"horizontal",visibleSlides:1.3,dragEnabled:!0,touchEnabled:!0},{children:e(h,Object.assign({height:y},{children:[!j&&n(o,Object.assign({className:"left_button"},{children:n(t,{height:10,width:10,color:v.content.primary})})),n(r,Object.assign({className:"slider"},{children:null===(P=null===(C=null==g?void 0:g.components)||void 0===C?void 0:C[1].cards)||void 0===P?void 0:P.map(((e,t)=>{var l,i;const o={components:e.components,mapping:null===(i=null===(l=null==g?void 0:g.mapping)||void 0===l?void 0:l.cards)||void 0===i?void 0:i[t]};return n(s,Object.assign({index:t},{children:n(m,{channel:u,template:o,carouselCardIndex:t,isPreview:j,width:"100%"},t)}),t)}))})),!j&&n(a,Object.assign({className:"right_button"},{children:n(l,{height:10,width:10,color:v.content.primary})}))]}))}))]})}));export{p as CarouselPreview};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import n from"../../assets/icons/chevronLeft.svg.js";import o from"../../assets/icons/chevronRight.svg.js";import{CarouselProvider as i,ButtonBack as l,Slider as r,Slide as s,ButtonNext as a}from"pure-react-carousel";import d from"react";import{Container as c,CarouselContainer as h}from"./CarouselPreview.style.js";import m from"./CarouselPreviewCard.js";import{COLORS as v}from"../../constants/Theme.js";const p=d.forwardRef(((d,p)=>{let{channel:u,template:g,showSampleValues:j,isPreview:b,removeBottomBorder:f}=d;var w,x,O,C,P,S;const B=null===(w=null==g?void 0:g.components)||void 0===w?void 0:w[1].cards;let y="500px";const N=null!==(O=null===(x=null==g?void 0:g.components)||void 0===x?void 0:x[0].text)&&void 0!==O?O:"";return N.length>100&&N.length<300?y="530px":N.length>300&&N.length<600?y="560px":N.length>600&&N.length<900?y="590px":N.length>900&&N.length<1200&&(y="620px"),e(c,Object.assign({removeBottomBorder:f},{children:[t(m,{channel:u,currentTemplate:g,carouselCardIndex:-1,isPreview:b,width:"77%"}),!!(null==B?void 0:B.length)&&t(i,Object.assign({naturalSlideWidth:100,naturalSlideHeight:125,totalSlides:null!==(C=null==B?void 0:B.length)&&void 0!==C?C:1,orientation:"horizontal",visibleSlides:1.3,dragEnabled:!0,touchEnabled:!0},{children:e(h,Object.assign({height:y},{children:[!b&&t(l,Object.assign({className:"left_button"},{children:t(n,{height:10,width:10,color:v.content.primary})})),t(r,Object.assign({className:"slider"},{children:null===(S=null===(P=null==g?void 0:g.components)||void 0===P?void 0:P[1].cards)||void 0===S?void 0:S.map(((e,n)=>{var o,i;const l={components:e.components,mapping:null===(i=null===(o=null==g?void 0:g.mapping)||void 0===o?void 0:o.cards)||void 0===i?void 0:i[n]};return t(s,Object.assign({index:n},{children:t(m,{channel:u,currentTemplate:l,carouselCardIndex:n,isPreview:b,width:"100%"},n)}),n)}))})),!b&&t(a,Object.assign({className:"right_button"},{children:t(o,{height:10,width:10,color:v.content.primary})}))]}))}))]}))}));export{p as CarouselPreview};

package/dist/esm/components/carousel-preview/CarouselPreview.style.d.ts

@@ -1,5 +1,6 @@
 export declare const Container: import("styled-components").StyledComponent<"div", any, {
     showHeader?: boolean | undefined;
+    removeBottomBorder?: boolean | undefined;
 }, never>;
 export declare const CarouselContainer: import("styled-components").StyledComponent<"div", any, {
     height: string;

package/dist/esm/components/carousel-preview/CarouselPreview.style.js

@@ -2,7 +2,7 @@ import e from"styled-components";import{COLORS as o}from"../../constants/Theme.j
 	background-image: url('https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F341dba50-e84e-4457-b5b5-d9d8a0b95a73?alt=media&token=6fd32f23-8bb2-4980-bbee-bef39b38fd9f');
 	border-color: ${o.stroke.primary};
 	border-top-style: solid;
-	border-bottom-style: solid;
+	border-bottom-style: ${e=>e.removeBottomBorder?"unset":"solid"};
 	border-top-width: 1px;
 	border-bottom-width: 1px;
 	background-repeat: no-repeat;
@@ -11,7 +11,7 @@ import e from"styled-components";import{COLORS as o}from"../../constants/Theme.j
 	position: relative;
 	height: 500px;
 	overflow-y: auto;
-`,i=e.div`
+`,r=e.div`
 	flex-direction: row;
 	display: flex;
 	align-items: center;
@@ -49,4 +49,4 @@ import e from"styled-components";import{COLORS as o}from"../../constants/Theme.j
 		width: 100%;
 		height: ${e=>e.height};
 	}
-`;export{i as CarouselContainer,t as Container};
+`;export{r as CarouselContainer,t as Container};

package/dist/esm/components/carousel-preview/CarouselPreviewCard.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { CHANNEL_TYPE } from "../template-preview/models/Channels";
 declare const CarouselPreviewCard: React.ForwardRefExoticComponent<{
     channel: CHANNEL_TYPE;
-    template: any;
+    currentTemplate: any;
     showSampleValues?: boolean | undefined;
     carouselCardIndex?: number | undefined;
     isPreview?: boolean | undefined;

package/dist/esm/components/carousel-preview/CarouselPreviewCard.js

@@ -1 +1 @@
-import{jsx as e}from"react/jsx-runtime";import t from"react";import{useTemplateModalContext as a}from"../template-context-mapper/context/templateModalContext.js";import{TemplatePreview as p}from"../template-preview/TemplatePreview.js";import"../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import"../../constants/Theme.js";import"../curtain/CurtainHelper.js";import"../template-preview/models/TemplateMeta.js";import"../template-preview/models/WhatsAppTemplate.js";const r=t.forwardRef((t=>{let{channel:r,template:s,showSampleValues:i,carouselCardIndex:m,isPreview:l,width:o}=t;const{cardWidth:n}=a();return e("div",Object.assign({style:{width:o||n}},{children:e(p,{showSampleValues:i,template:s,channel:r,size:"small",hideHeader:!0,carouselCardIndex:m,isWhatsappCarousel:!0,isPreview:l})}))}));export{r as default};
+import{jsx as e}from"react/jsx-runtime";import t from"react";import{useTemplateModalContext as a}from"../template-context-mapper/context/templateModalContext.js";import{TemplatePreview as p}from"../template-preview/TemplatePreview.js";import"../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import"../../constants/Theme.js";import"../curtain/CurtainHelper.js";import"../template-preview/models/TemplateMeta.js";import"../template-preview/models/WhatsAppTemplate.js";const r=t.forwardRef((t=>{let{channel:r,currentTemplate:i,showSampleValues:l,carouselCardIndex:s,isPreview:o,width:m}=t;var n,d,c;const{cardWidth:h,template:v}=a(),w=(null!==(c=null===(d=null===(n=null==v?void 0:v.components)||void 0===n?void 0:n[1].cards)||void 0===d?void 0:d.length)&&void 0!==c?c:0)-1===s?12:0;return e("div",Object.assign({style:{width:m||h}},{children:e(p,{showSampleValues:l,template:i,channel:r,size:"small",hideHeader:!0,carouselCardIndex:s,isWhatsappCarousel:!0,isPreview:o,whatsAppSpecificMeta:{templateContainerStyles:{marginRight:w}}})}))}));export{r as default};

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

@@ -4,7 +4,7 @@ import e from"styled-components";import{COLORS as r}from"../../../constants/Them
 	gap: 12px;
 	/* justify-content: center; */
 	flex: 1;
-`,i=e.div`
+`,o=e.div`
 	width: 56px;
 	height: 56px;
 	display: flex;
@@ -16,7 +16,7 @@ import e from"styled-components";import{COLORS as r}from"../../../constants/Them
 	border: 1px solid ${r.stroke.primary};
 	box-sizing: content-box;
 	cursor: ${e=>e.error?"pointer":"default"};
-`,o=e.div`
+`,i=e.div`
 	padding: 8px;
 	flex-direction: row;
 	display: flex;
@@ -28,4 +28,5 @@ import e from"styled-components";import{COLORS as r}from"../../../constants/Them
 `,n=e.div`
 	padding-bottom: 0px;
 	min-width: 285px;
-`;export{o as Container,n as EditTemplateMediaContainer,i as ImageContainer,t as RightComponent};
+	margin-bottom: 16px;
+`;export{i as Container,n as EditTemplateMediaContainer,o as ImageContainer,t as RightComponent};

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

@@ -1 +1 @@
-import{jsxs as e,jsx as t,Fragment as o}from"react/jsx-runtime";import l from"../../../assets/icons/PlusIcon.js";import{cloneDeep as i}from"lodash";import{useState as a,useEffect as r}from"react";import{AddVariableV2SideModal as n}from"../../add-variableV2/AddVariableV2SideModal.js";import"../../../_virtual/_tslib.js";import"../../add-variableV2/AddVariableV2.styled.js";import{Button as s}from"../../button/Button.js";import"../../icon-button/IconButton.js";import"../../input/Input.js";import"../../tooltips/Tooltip.js";import{COLORS as d}from"../../../constants/Theme.js";import"../../modals/modal.styled.js";import"../../switch/Switch.js";import{TitleMedium as c,TitleRegular as m,BodySecondary as p,BodyCaption as u}from"../../TypographyStyle.js";import{ProductPickerModal as h,ScreenName as g}from"../../product-picker-v2/modal.js";import{useTemplateModalContext as v}from"../context/templateModalContext.js";import f from"./EditWhatsAppTemplateV2.js";import{ProductBox as b}from"./ProductBox.js";import"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import"../../curtain/CurtainHelper.js";import"../../template-preview/models/TemplateMeta.js";import{POD as y}from"../../template-preview/models/WhatsAppTemplate.js";const j=j=>{let{template:I,whatsappSpecificPickerMeta:x,showVariableModal:w,variableList:C,variableListForImage:O,discountCode:P,setDiscountCode:T}=j;var k,S;const{selectedCarouselIndex:V,setTemplate:L,pickerConf:A,isProductCarouselType:E,pod:B,cardCount:M,carouselProducts:F,setCarouselProducts:W,isError:D,cardImages:R,disableEditVariable:$,onDeleteSelectedProducts:_}=v(),[q,z]=a(-1==V?"First Message (Step 1/2)":"Product Carousel (Step 2/2)"),[N,G]=a(!1),[H,J]=a(!1),[K,Q]=a(!1);r((()=>{z(-1==V?"First Message (Step 1/2)":"Product Carousel (Step 2/2)")}),[V]);return e("div",{children:[t(c,Object.assign({style:{marginLeft:10,marginBottom:24}},{children:q})),E&&(null!==(k=null==F?void 0:F.length)&&void 0!==k?k:0)>0&&null!=V&&V>=0&&e("div",Object.assign({style:{display:"flex",rowGap:16,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"}},{children:[t(b,{editItem:()=>{1===(null==F?void 0:F.length)&&"variable"===F[0].name?Q(!0):G(!N)},cardBody:1===(null==F?void 0:F.length)&&"variable"===F[0].name?`${F[0].productName}`:`${null==F?void 0:F.length} Products Selected`,hideIcon:1===(null==F?void 0:F.length)&&"variable"===F[0].name,deleteItem:()=>{var e;if(1===(null==F?void 0:F.length)&&"variable"===F[0].name)return void(null==W||W([]));const t=i(Object.assign({},I));console.log("cardImages selectedTemplate: ",t),t&&(console.log("cardImages: ",R),R&&R.length>0?null==R||R.forEach(((e,o)=>{var l;t.components[1].cards[o].components[0].example.header_handle=[null!==(l=R[o])&&void 0!==l?l:""]})):null===(e=null==t?void 0:t.components[1].cards)||void 0===e||e.forEach(((e,o)=>{t.components[1].cards[o].components[0].example.header_handle=[""]})),null==L||L(t),console.log("cardImages22 selectedTemplate: ",t)),null==W||W([]),null==_||_()}}),F&&(null==F?void 0:F.length)>0&&"variable"!=F[0].name&&t(s,{disabled:(null!==(S=null==F?void 0:F.length)&&void 0!==S?S:0)<=1,style:{alignSelf:"flex-end"},onClick:()=>{J(!0),G(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]})),!$&&E&&0===(null==F?void 0:F.length)&&null!=V&&V>=0&&e(o,{children:[e("div",Object.assign({style:{marginLeft:12}},{children:[t(m,{children:"Product(s)"}),t(p,{children:`Select ${null!=M?M:1} products`})]})),e("div",Object.assign({style:{marginTop:16,marginBottom:16,marginLeft:12,marginRight:12,flexDirection:"column",display:"flex",alignItems:"center"}},{children:[t(s,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12,border:D?`2px dashed ${d.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s)",buttonType:D?"tertiaryGray":"dashBold",LeadingIcon:()=>t("div",Object.assign({style:{display:"flex",width:18,height:18}},{children:t(l,{width:18,height:18,color:d.content.secondary})})),onClick:e=>{G(!0)}}),B===y.CHATBOT&&e(o,{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(u,Object.assign({style:{color:"#616161",overflow:"unset"}},{children:"OR"})),t("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginLeft:8}})]})),t(s,{matchParentWidth:!0,style:{flex:1,display:"flex",marginTop:12,width:"100%",border:D?`2px dashed ${d.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s) Variable",buttonType:D?"tertiaryGray":"dashBold",LeadingIcon:()=>t("div",Object.assign({style:{display:"flex"}},{children:t(l,{width:18,height:18,color:d.content.secondary})})),onClick:e=>{Q(!0)}})]})]}))]}),t(f,{whatsappSpecificPickerMeta:x,template:I,onTemplateChange:e=>{null==L||L(e)},showVariableModal:w,variableList:C,variableListForImage:O,discountCode:P,setDiscountCode:T}),N&&A&&t(h,{zIndex:200,startupScreen:H?g.RearrangeProducts:g.Collections,rearrangeEnabled:!0,storeId:A.storeId,selectedItems:(e=>{if(e.length>0){const t={};for(const o of e){const e=null==o?void 0:o.collectionId,l=o.productId,i=o.variantId;e in t||(t[e]={products:{},name:"",image:"",isSmartCollection:!1}),l in t[e].products||(t[e].products[l]={variants:{},name:(null==o?void 0:o.productName)||"",image:(null==o?void 0:o.productImage)||""}),t[e].products[l].variants[i]={name:(null==o?void 0:o.name)||"",price:"",image:(null==o?void 0:o.image)||"",quantity:o.quantity||0,displayOrder:o.displayOrder}}return t}return{}})(null!=F?F:[]),collectionFetcher:A.fetchCollections,productFetcher:A.fetchProducts,onAdd:(e,t)=>{var o;J(!1);const l=[];delete e.isCustom;for(const t of Object.keys(e)){const i=e[t].products;if(void 0!==i&&Object.keys(i).length)for(const e of Object.keys(i)){const a=i[e].variants;if(void 0!==a&&Object.keys(a).length)for(const r of Object.keys(a)){const{name:n,image:s,quantity:d,displayOrder:c}=a[r],m={name:n,image:null!==(o=null!=s?s:i[e].image)&&void 0!==o?o:"",quantity:d,variantId:r,productId:e,displayOrder:c,collectionId:t,productName:i[e].name,productImage:i[e].image};l.push(m)}}}const a=l.sort(((e,t)=>e.displayOrder-t.displayOrder)),r=l.map((e=>e.image)),n=i(Object.assign({},I));n&&(r.forEach(((e,t)=>{var o;n.components[1].cards[t].components[0].example.header_handle=e?[e]:[null!==(o=null==R?void 0:R[t])&&void 0!==o?o:""]})),null==L||L(n)),null==W||W(a),G(!1)},searchInCollectionFetcher:A.searchInCollection,searchFetcher:A.searchProducts,visible:N,onClose:()=>{G(!1)},exactLimit:null!=M?M:1}),K&&t(n,{zIndex:2e3,data:null!=C?C:[],showVariable:K,setShowVariable:Q,placeholder:"Add a variable",customTrigger:e=>{null==W||W([{name:"variable",productName:e.actualValue}])}})]})};export{j as default};
+import{jsxs as e,jsx as t,Fragment as o}from"react/jsx-runtime";import l from"../../../assets/icons/arrow_back.svg.js";import i from"../../../assets/icons/PlusIcon.js";import{cloneDeep as r}from"lodash";import{useState as a,useEffect as n}from"react";import{AddVariableV2SideModal as s}from"../../add-variableV2/AddVariableV2SideModal.js";import"../../../_virtual/_tslib.js";import"../../add-variableV2/AddVariableV2.styled.js";import{Button as d}from"../../button/Button.js";import{IconButton as c}from"../../icon-button/IconButton.js";import"../../input/Input.js";import"../../tooltips/Tooltip.js";import{COLORS as m}from"../../../constants/Theme.js";import"../../modals/modal.styled.js";import"../../switch/Switch.js";import{TitleMedium as p,TitleRegular as u,BodySecondary as h,BodyCaption as g}from"../../TypographyStyle.js";import{ProductPickerModal as v,ScreenName as f}from"../../product-picker-v2/modal.js";import{Badge as b}from"../Badge/index.js";import{useTemplateModalContext as y}from"../context/templateModalContext.js";import j from"./EditWhatsAppTemplateV2.js";import{ProductBox as x}from"./ProductBox.js";import"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import"../../curtain/CurtainHelper.js";import"../../template-preview/models/TemplateMeta.js";import{POD as I}from"../../template-preview/models/WhatsAppTemplate.js";const w=w=>{let{template:C,whatsappSpecificPickerMeta:O,showVariableModal:P,variableList:T,variableListForImage:k,discountCode:S,setDiscountCode:V}=w;var L,A;const{selectedCarouselIndex:E,setTemplate:B,pickerConf:M,isProductCarouselType:F,pod:W,cardCount:D,carouselProducts:R,setCarouselProducts:_,isError:$,cardImages:q,disableEditVariable:z,onDeleteSelectedProducts:N,setSelectedCarouselIndex:G}=y(),[H,J]=a(-1==E?"First Message (Step 1/2)":"Product Carousel (Step 2/2)"),[K,Q]=a(!1),[U,X]=a(!1),[Y,Z]=a(!1);n((()=>{J(-1==E?"First Message (Step 1/2)":"Product Carousel (Step 2/2)")}),[E]);return e("div",{children:[e("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center",marginBottom:24}},{children:[null!=E&&E>=0&&t(c,{Icon:l,onClick:()=>{null==G||G(-1)}}),t(p,Object.assign({style:{marginLeft:10}},{children:H}))]})),F&&(null!==(L=null==R?void 0:R.length)&&void 0!==L?L:0)>0&&null!=E&&E>=0&&e("div",Object.assign({style:{display:"flex",rowGap:16,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"}},{children:[t(x,{editItem:()=>{1===(null==R?void 0:R.length)&&"variable"===R[0].name?Z(!0):Q(!K)},cardBody:1===(null==R?void 0:R.length)&&"variable"===R[0].name?`${R[0].productName}`:`${null==R?void 0:R.length} Products Selected`,hideIcon:1===(null==R?void 0:R.length)&&"variable"===R[0].name,deleteItem:()=>{var e;if(1===(null==R?void 0:R.length)&&"variable"===R[0].name)return void(null==_||_([]));const t=r(Object.assign({},C));console.log("cardImages selectedTemplate: ",t),t&&(console.log("cardImages: ",q),q&&q.length>0?null==q||q.forEach(((e,o)=>{var l;t.components[1].cards[o].components[0].example.header_handle=[null!==(l=q[o])&&void 0!==l?l:""]})):null===(e=null==t?void 0:t.components[1].cards)||void 0===e||e.forEach(((e,o)=>{t.components[1].cards[o].components[0].example.header_handle=[""]})),null==B||B(t),console.log("cardImages22 selectedTemplate: ",t)),null==_||_([]),null==N||N()}}),R&&(null==R?void 0:R.length)>0&&"variable"!=R[0].name&&t(d,{disabled:(null!==(A=null==R?void 0:R.length)&&void 0!==A?A:0)<=1,style:{alignSelf:"flex-end"},onClick:()=>{X(!0),Q(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]})),!z&&F&&0===(null==R?void 0:R.length)&&null!=E&&E>=0&&e(o,{children:[e("div",Object.assign({style:{marginLeft:12}},{children:[t(u,{children:"Product(s)"}),t(h,{children:`Select ${null!=D?D:1} products`})]})),e("div",Object.assign({style:{marginTop:16,marginBottom:16,marginLeft:12,marginRight:12,flexDirection:"column",display:"flex",alignItems:"center"}},{children:[t(d,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12,border:$?`2px dashed ${m.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s)",buttonType:$?"tertiaryGray":"dashBold",LeadingIcon:()=>t("div",Object.assign({style:{display:"flex",width:18,height:18}},{children:t(i,{width:18,height:18,color:m.content.secondary})})),onClick:e=>{Q(!0)}}),W===I.CHATBOT&&e(o,{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(g,Object.assign({style:{color:"#616161",overflow:"unset"}},{children:"OR"})),t("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginLeft:8}})]})),t(d,{matchParentWidth:!0,style:{flex:1,display:"flex",marginTop:12,width:"100%",border:$?`2px dashed ${m.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s) Variable",buttonType:$?"tertiaryGray":"dashBold",LeadingIcon:()=>t("div",Object.assign({style:{display:"flex"}},{children:t(i,{width:18,height:18,color:m.content.secondary})})),onClick:e=>{Z(!0)}})]}),$&&t(b,{errorText:"Please add products"})]}))]}),t(j,{whatsappSpecificPickerMeta:O,template:C,onTemplateChange:e=>{null==B||B(e)},showVariableModal:P,variableList:T,variableListForImage:k,discountCode:S,setDiscountCode:V}),K&&M&&t(v,{zIndex:200,startupScreen:U?f.RearrangeProducts:f.Collections,rearrangeEnabled:!0,storeId:M.storeId,selectedItems:(e=>{if(e.length>0){const t={};for(const o of e){const e=null==o?void 0:o.collectionId,l=o.productId,i=o.variantId;e in t||(t[e]={products:{},name:"",image:"",isSmartCollection:!1}),l in t[e].products||(t[e].products[l]={variants:{},name:(null==o?void 0:o.productName)||"",image:(null==o?void 0:o.productImage)||""}),t[e].products[l].variants[i]={name:(null==o?void 0:o.name)||"",price:"",image:(null==o?void 0:o.image)||"",quantity:o.quantity||0,displayOrder:o.displayOrder}}return t}return{}})(null!=R?R:[]),collectionFetcher:M.fetchCollections,productFetcher:M.fetchProducts,onAdd:(e,t)=>{var o;X(!1);const l=[];delete e.isCustom;for(const t of Object.keys(e)){const i=e[t].products;if(void 0!==i&&Object.keys(i).length)for(const e of Object.keys(i)){const r=i[e].variants;if(void 0!==r&&Object.keys(r).length)for(const a of Object.keys(r)){const{name:n,image:s,quantity:d,displayOrder:c}=r[a],m={name:n,image:null!==(o=null!=s?s:i[e].image)&&void 0!==o?o:"",quantity:d,variantId:a,productId:e,displayOrder:c,collectionId:t,productName:i[e].name,productImage:i[e].image};l.push(m)}}}const i=l.sort(((e,t)=>e.displayOrder-t.displayOrder)),a=l.map((e=>e.image)),n=r(Object.assign({},C));n&&(a.forEach(((e,t)=>{var o;n.components[1].cards[t].components[0].example.header_handle=e?[e]:[null!==(o=null==q?void 0:q[t])&&void 0!==o?o:""]})),null==B||B(n)),null==_||_(i),Q(!1)},searchInCollectionFetcher:M.searchInCollection,searchFetcher:M.searchProducts,visible:K,onClose:()=>{Q(!1)},exactLimit:null!=D?D:1}),Y&&t(s,{zIndex:2e3,data:null!=T?T:[],showVariable:Y,setShowVariable:Z,placeholder:"Add a variable",customTrigger:e=>{null==_||_([{name:"variable",productName:e.actualValue}])}})]})};export{w as default};

package/package.json

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