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

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,10 +1,10 @@
1
- "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`
1
+ "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`
2
2
  display: flex;
3
3
  align-items: center;
4
4
  gap: 12px;
5
5
  /* justify-content: center; */
6
6
  flex: 1;
7
- `,n=i.default.div`
7
+ `,n=o.default.div`
8
8
  width: 56px;
9
9
  height: 56px;
10
10
  display: flex;
@@ -16,7 +16,7 @@
16
16
  border: 1px solid ${t.COLORS.stroke.primary};
17
17
  box-sizing: content-box;
18
18
  cursor: ${e=>e.error?"pointer":"default"};
19
- `,d=i.default.div`
19
+ `,d=o.default.div`
20
20
  padding: 8px;
21
21
  flex-direction: row;
22
22
  display: flex;
@@ -25,7 +25,8 @@
25
25
  border: 1px solid ${t.COLORS.stroke.primary};
26
26
  border-radius: 4px;
27
27
  margin-left: 8px;
28
- `,a=i.default.div`
28
+ `,a=o.default.div`
29
29
  padding-bottom: 0px;
30
30
  min-width: 285px;
31
- `;exports.Container=d,exports.EditTemplateMediaContainer=a,exports.ImageContainer=n,exports.RightComponent=o;
31
+ margin-bottom: 16px;
32
+ `;exports.Container=d,exports.EditTemplateMediaContainer=a,exports.ImageContainer=n,exports.RightComponent=i;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../assets/icons/arrow_back.svg.js"),l=require("../../../assets/icons/PlusIcon.js"),r=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("../context/templateModalContext.js"),p=require("./EditWhatsAppTemplateV2.js"),m=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 h=require("../../template-preview/models/WhatsAppTemplate.js");exports.default=g=>{let{template:v,whatsappSpecificPickerMeta:j,showVariableModal:x,variableList:y,variableListForImage:b,discountCode:f,setDiscountCode:C}=g;var I,O;const{selectedCarouselIndex:q,setTemplate:w,pickerConf:S,isProductCarouselType:P,pod:T,cardCount:k,carouselProducts:B,setCarouselProducts:L,isError:V,cardImages:A,disableEditVariable:E,onDeleteSelectedProducts:M,setSelectedCarouselIndex:R}=u.useTemplateModalContext(),[D,F]=a.useState(-1==q?"First Message (Step 1/2)":"Product Carousel (Step 2/2)"),[W,_]=a.useState(!1),[N,$]=a.useState(!1),[z,G]=a.useState(!1);a.useEffect((()=>{F(-1==q?"First Message (Step 1/2)":"Product Carousel (Step 2/2)")}),[q]);return e.jsxs("div",{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center",marginBottom:24}},{children:[null!=q&&q>=0&&e.jsx(o.IconButton,{Icon:t.default,onClick:()=>{null==R||R(-1)}}),e.jsx(d.TitleMedium,Object.assign({style:{marginLeft:10}},{children:D}))]})),P&&(null!==(I=null==B?void 0:B.length)&&void 0!==I?I:0)>0&&null!=q&&q>=0&&e.jsxs("div",Object.assign({style:{display:"flex",rowGap:16,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"}},{children:[e.jsx(m.ProductBox,{editItem:()=>{1===(null==B?void 0:B.length)&&"variable"===B[0].name?G(!0):_(!W)},cardBody:1===(null==B?void 0:B.length)&&"variable"===B[0].name?`${B[0].productName}`:`${null==B?void 0:B.length} Products Selected`,hideIcon:1===(null==B?void 0:B.length)&&"variable"===B[0].name,deleteItem:()=>{var e;if(1===(null==B?void 0:B.length)&&"variable"===B[0].name)return void(null==L||L([]));const t=r.cloneDeep(Object.assign({},v));console.log("cardImages selectedTemplate: ",t),t&&(console.log("cardImages: ",A),A&&A.length>0?null==A||A.forEach(((e,l)=>{var r;t.components[1].cards[l].components[0].example.header_handle=[null!==(r=A[l])&&void 0!==r?r:""]})):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=[""]})),null==w||w(t),console.log("cardImages22 selectedTemplate: ",t)),null==L||L([]),null==M||M()}}),B&&(null==B?void 0:B.length)>0&&"variable"!=B[0].name&&e.jsx(s.Button,{disabled:(null!==(O=null==B?void 0:B.length)&&void 0!==O?O:0)<=1,style:{alignSelf:"flex-end"},onClick:()=>{$(!0),_(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]})),!E&&P&&0===(null==B?void 0:B.length)&&null!=q&&q>=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:V?`2px dashed ${n.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s)",buttonType:V?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsx("div",Object.assign({style:{display:"flex",width:18,height:18}},{children:e.jsx(l.default,{width:18,height:18,color:n.COLORS.content.secondary})})),onClick:e=>{_(!0)}}),T===h.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:V?`2px dashed ${n.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s) Variable",buttonType:V?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsx("div",Object.assign({style:{display:"flex"}},{children:e.jsx(l.default,{width:18,height:18,color:n.COLORS.content.secondary})})),onClick:e=>{G(!0)}})]})]}))]}),e.jsx(p.default,{whatsappSpecificPickerMeta:j,template:v,onTemplateChange:e=>{null==w||w(e)},showVariableModal:x,variableList:y,variableListForImage:b,discountCode:f,setDiscountCode:C}),W&&S&&e.jsx(c.ProductPickerModal,{zIndex:200,startupScreen:N?c.ScreenName.RearrangeProducts:c.ScreenName.Collections,rearrangeEnabled:!0,storeId:S.storeId,selectedItems:(e=>{if(e.length>0){const t={};for(const l of e){const e=null==l?void 0:l.collectionId,r=l.productId,a=l.variantId;e in t||(t[e]={products:{},name:"",image:"",isSmartCollection:!1}),r in t[e].products||(t[e].products[r]={variants:{},name:(null==l?void 0:l.productName)||"",image:(null==l?void 0:l.productImage)||""}),t[e].products[r].variants[a]={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!=B?B:[]),collectionFetcher:S.fetchCollections,productFetcher:S.fetchProducts,onAdd:(e,t)=>{var l;$(!1);const a=[];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 s of Object.keys(i)){const{name:o,image:n,quantity:d,displayOrder:c}=i[s],u={name:o,image:null!==(l=null!=n?n:r[e].image)&&void 0!==l?l:"",quantity:d,variantId:s,productId:e,displayOrder:c,collectionId:t,productName:r[e].name,productImage:r[e].image};a.push(u)}}}const i=a.sort(((e,t)=>e.displayOrder-t.displayOrder)),s=a.map((e=>e.image)),o=r.cloneDeep(Object.assign({},v));o&&(s.forEach(((e,t)=>{var l;o.components[1].cards[t].components[0].example.header_handle=e?[e]:[null!==(l=null==A?void 0:A[t])&&void 0!==l?l:""]})),null==w||w(o)),null==L||L(i),_(!1)},searchInCollectionFetcher:S.searchInCollection,searchFetcher:S.searchProducts,visible:W,onClose:()=>{_(!1)},exactLimit:null!=k?k:1}),z&&e.jsx(i.AddVariableV2SideModal,{zIndex:2e3,data:null!=y?y:[],showVariable:z,setShowVariable:G,placeholder:"Add a variable",customTrigger:e=>{null==L||L([{name:"variable",productName:e.actualValue}])}})]})};
1
+ "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}])}})]})};
@@ -4,7 +4,7 @@ import e from"styled-components";import{COLORS as r}from"../../../constants/Them
4
4
  gap: 12px;
5
5
  /* justify-content: center; */
6
6
  flex: 1;
7
- `,i=e.div`
7
+ `,o=e.div`
8
8
  width: 56px;
9
9
  height: 56px;
10
10
  display: flex;
@@ -16,7 +16,7 @@ import e from"styled-components";import{COLORS as r}from"../../../constants/Them
16
16
  border: 1px solid ${r.stroke.primary};
17
17
  box-sizing: content-box;
18
18
  cursor: ${e=>e.error?"pointer":"default"};
19
- `,o=e.div`
19
+ `,i=e.div`
20
20
  padding: 8px;
21
21
  flex-direction: row;
22
22
  display: flex;
@@ -28,4 +28,5 @@ import e from"styled-components";import{COLORS as r}from"../../../constants/Them
28
28
  `,n=e.div`
29
29
  padding-bottom: 0px;
30
30
  min-width: 285px;
31
- `;export{o as Container,n as EditTemplateMediaContainer,i as ImageContainer,t as RightComponent};
31
+ margin-bottom: 16px;
32
+ `;export{i as Container,n as EditTemplateMediaContainer,o as ImageContainer,t as RightComponent};
@@ -1 +1 @@
1
- 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 a}from"lodash";import{useState as r,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{useTemplateModalContext as b}from"../context/templateModalContext.js";import y from"./EditWhatsAppTemplateV2.js";import{ProductBox as j}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 x=x=>{let{template:w,whatsappSpecificPickerMeta:C,showVariableModal:O,variableList:P,variableListForImage:T,discountCode:k,setDiscountCode:S}=x;var V,L;const{selectedCarouselIndex:A,setTemplate:E,pickerConf:B,isProductCarouselType:M,pod:F,cardCount:W,carouselProducts:D,setCarouselProducts:R,isError:_,cardImages:$,disableEditVariable:q,onDeleteSelectedProducts:z,setSelectedCarouselIndex:N}=b(),[G,H]=r(-1==A?"First Message (Step 1/2)":"Product Carousel (Step 2/2)"),[J,K]=r(!1),[Q,U]=r(!1),[X,Y]=r(!1);n((()=>{H(-1==A?"First Message (Step 1/2)":"Product Carousel (Step 2/2)")}),[A]);return e("div",{children:[e("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center",marginBottom:24}},{children:[null!=A&&A>=0&&t(c,{Icon:l,onClick:()=>{null==N||N(-1)}}),t(p,Object.assign({style:{marginLeft:10}},{children:G}))]})),M&&(null!==(V=null==D?void 0:D.length)&&void 0!==V?V:0)>0&&null!=A&&A>=0&&e("div",Object.assign({style:{display:"flex",rowGap:16,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"}},{children:[t(j,{editItem:()=>{1===(null==D?void 0:D.length)&&"variable"===D[0].name?Y(!0):K(!J)},cardBody:1===(null==D?void 0:D.length)&&"variable"===D[0].name?`${D[0].productName}`:`${null==D?void 0:D.length} Products Selected`,hideIcon:1===(null==D?void 0:D.length)&&"variable"===D[0].name,deleteItem:()=>{var e;if(1===(null==D?void 0:D.length)&&"variable"===D[0].name)return void(null==R||R([]));const t=a(Object.assign({},w));console.log("cardImages selectedTemplate: ",t),t&&(console.log("cardImages: ",$),$&&$.length>0?null==$||$.forEach(((e,o)=>{var l;t.components[1].cards[o].components[0].example.header_handle=[null!==(l=$[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==E||E(t),console.log("cardImages22 selectedTemplate: ",t)),null==R||R([]),null==z||z()}}),D&&(null==D?void 0:D.length)>0&&"variable"!=D[0].name&&t(d,{disabled:(null!==(L=null==D?void 0:D.length)&&void 0!==L?L:0)<=1,style:{alignSelf:"flex-end"},onClick:()=>{U(!0),K(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]})),!q&&M&&0===(null==D?void 0:D.length)&&null!=A&&A>=0&&e(o,{children:[e("div",Object.assign({style:{marginLeft:12}},{children:[t(u,{children:"Product(s)"}),t(h,{children:`Select ${null!=W?W: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=>{K(!0)}}),F===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=>{Y(!0)}})]})]}))]}),t(y,{whatsappSpecificPickerMeta:C,template:w,onTemplateChange:e=>{null==E||E(e)},showVariableModal:O,variableList:P,variableListForImage:T,discountCode:k,setDiscountCode:S}),J&&B&&t(v,{zIndex:200,startupScreen:Q?f.RearrangeProducts:f.Collections,rearrangeEnabled:!0,storeId:B.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!=D?D:[]),collectionFetcher:B.fetchCollections,productFetcher:B.fetchProducts,onAdd:(e,t)=>{var o;U(!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 i=l.sort(((e,t)=>e.displayOrder-t.displayOrder)),r=l.map((e=>e.image)),n=a(Object.assign({},w));n&&(r.forEach(((e,t)=>{var o;n.components[1].cards[t].components[0].example.header_handle=e?[e]:[null!==(o=null==$?void 0:$[t])&&void 0!==o?o:""]})),null==E||E(n)),null==R||R(i),K(!1)},searchInCollectionFetcher:B.searchInCollection,searchFetcher:B.searchProducts,visible:J,onClose:()=>{K(!1)},exactLimit:null!=W?W:1}),X&&t(s,{zIndex:2e3,data:null!=P?P:[],showVariable:X,setShowVariable:Y,placeholder:"Add a variable",customTrigger:e=>{null==R||R([{name:"variable",productName:e.actualValue}])}})]})};export{x as default};
1
+ 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 CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bikdotai/bik-component-library",
3
- "version": "0.0.466-beta.5",
3
+ "version": "0.0.466-beta.6",
4
4
  "description": "Bik Component Library",
5
5
  "repository": {
6
6
  "type": "git",