@bikdotai/bik-component-library 0.0.509-beta.carousel-4 → 0.0.509-beta.carousel-7
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.
- package/dist/cjs/components/carousel-preview/CarouselPreview.js +10 -1
- package/dist/cjs/components/icon-button/IconButton.js +1 -1
- package/dist/cjs/components/icon-button/model.d.ts +5 -0
- package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2.js +1 -1
- package/dist/cjs/components/template-preview/WhatsApp/ChatUI.style.js +11 -11
- package/dist/esm/components/carousel-preview/CarouselPreview.js +10 -1
- package/dist/esm/components/icon-button/IconButton.js +1 -1
- package/dist/esm/components/icon-button/model.d.ts +5 -0
- package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2.js +1 -1
- package/dist/esm/components/template-preview/WhatsApp/ChatUI.style.js +5 -5
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/chevronLeft.svg.js"),
|
|
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("react"),s=require("react-slick"),r=require("styled-components"),o=require("./CarouselPreview.style.js"),i=require("./CarouselPreviewCard.js"),a=require("../../constants/Theme.js"),d=require("../template-context-mapper/context/templateModalContext.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=c(l),x=c(s),p=c(r);const h=u.default.forwardRef(((t,n)=>{let{channel:l,template:s,showSampleValues:r,isPreview:a,removeBottomBorder:c}=t;var u,p,h;const g=null===(u=null==s?void 0:s.components)||void 0===u?void 0:u[1].cards,{sliderRef:j,selectedCarouselIndex:C,cardCount:w,setIsCarouselHovered:b}=d.useTemplateModalContext();return e.jsxs(o.Container,Object.assign({removeBottomBorder:c},{children:[e.jsx(i.default,{channel:l,currentTemplate:s,carouselCardIndex:-1,isPreview:a,width:"77%"}),!!(null==g?void 0:g.length)&&e.jsx(f,Object.assign({cardCount:null!=w?w:0,selectedCarouselIndex:null!=C?C:-1,onMouseEnter:()=>null==b?void 0:b(!0),onMouseLeave:()=>null==b?void 0:b(!1)},{children:e.jsx(x.default,Object.assign({ref:j,swipeToSlide:!0,swipe:!0,infinite:!1,focusOnSelect:!0,centerMode:!0,arrows:!0,adaptiveHeight:!0,nextArrow:e.jsx(v,{}),prevArrow:e.jsx(m,{})},{children:null===(h=null===(p=null==s?void 0:s.components)||void 0===p?void 0:p[1].cards)||void 0===h?void 0:h.map(((t,n)=>{var r,o;const d={components:t.components,mapping:null===(o=null===(r=null==s?void 0:s.mapping)||void 0===r?void 0:r.cards)||void 0===o?void 0:o[n]};return e.jsx(i.default,{channel:l,currentTemplate:d,carouselCardIndex:n,isPreview:a,width:"100%"},n)}))}))}))]}))})),v=t=>{const{className:l,style:s,onClick:r}=t,{selectedCarouselIndex:o,setSelectedCarouselIndex:i,cardCount:c}=d.useTemplateModalContext();return e.jsx("div",Object.assign({className:l,style:Object.assign(Object.assign({},s),{display:r&&(null!=o?o:-1)>-1?"flex":"none",content:"none"}),onClick:e=>{console.log("onClick",o,c),null==r||r(e),(null!=o?o:-1)>=(null!=c?c:-1)-1||null==i||i((null!=o?o:-1)+1)}},{children:e.jsx(n.default,{height:10,width:10,color:a.COLORS.content.primary})}))},m=n=>{const{className:l,style:s,onClick:r}=n,{selectedCarouselIndex:o,setSelectedCarouselIndex:i}=d.useTemplateModalContext();return e.jsx("div",Object.assign({className:l,style:Object.assign(Object.assign({},s),{display:r&&(null!=o?o:-1)>-1?"flex":"none",content:"none"}),onClick:e=>{null==r||r(e),(null!=o?o:-1)<1||null==i||i((null!=o?o:-1)-1)}},{children:e.jsx(t.default,{height:10,width:10,color:a.COLORS.content.primary})}))},f=p.default.div`
|
|
2
2
|
width: 100%;
|
|
3
3
|
/* ${e=>e.selectedCarouselIndex<e.cardCount-1?"width: calc(100% - 48px);":"width: 100%;"} */
|
|
4
4
|
/* margin: auto; */
|
|
@@ -24,6 +24,10 @@
|
|
|
24
24
|
background-color: white;
|
|
25
25
|
box-shadow: 0px 1.5px 6px 0px #0000001f;
|
|
26
26
|
/* height: 100%; */
|
|
27
|
+
|
|
28
|
+
:hover {
|
|
29
|
+
background: white;
|
|
30
|
+
}
|
|
27
31
|
}
|
|
28
32
|
|
|
29
33
|
.slick-prev {
|
|
@@ -39,6 +43,10 @@
|
|
|
39
43
|
background-color: white;
|
|
40
44
|
box-shadow: 0px 1.5px 6px 0px #0000001f;
|
|
41
45
|
|
|
46
|
+
:hover {
|
|
47
|
+
background: white;
|
|
48
|
+
}
|
|
49
|
+
|
|
42
50
|
/* height: 100%; */
|
|
43
51
|
}
|
|
44
52
|
|
|
@@ -48,6 +56,7 @@
|
|
|
48
56
|
|
|
49
57
|
.slick-slide > div {
|
|
50
58
|
height: 100%;
|
|
59
|
+
padding-bottom: 16px;
|
|
51
60
|
}
|
|
52
61
|
|
|
53
62
|
.slick-track {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),r=require("react"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),r=require("react"),i=require("./IconButton.styled.js"),o=require("./theme.js");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=s(r);const n=r.forwardRef(((r,s)=>{var{id:n,iconButtonType:l="default",Icon:c,height:u=20,width:a=20,bordered:y,disabled:b,isSelected:h,style:f,svgStyle:j}=r,p=e.__rest(r,["id","iconButtonType","Icon","height","width","bordered","disabled","isSelected","style","svgStyle"]);const g=o.getIconColor(l,b,h);return t.jsx(i.IconButton,Object.assign({id:n,ref:s,style:f,iconButtonType:l,bordered:y,disabled:b,isSelected:h},p,{children:d.default.createElement(c,{height:u,width:a,color:g,style:Object.assign({display:"block"},null!=j?j:{})})}))}));n.displayName="IconButton",exports.IconButton=n;
|
|
@@ -10,6 +10,11 @@ export interface IconButtonProps extends React.ButtonHTMLAttributes<HTMLButtonEl
|
|
|
10
10
|
* @default default undefined
|
|
11
11
|
*/
|
|
12
12
|
style?: React.CSSProperties;
|
|
13
|
+
/**
|
|
14
|
+
* Custom styles which can be added to the svg
|
|
15
|
+
* @default default undefined
|
|
16
|
+
*/
|
|
17
|
+
svgStyle?: React.CSSProperties;
|
|
13
18
|
/**
|
|
14
19
|
* Custom height for the svg icon
|
|
15
20
|
* @default default 20
|
package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2.js
CHANGED
|
@@ -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/chevronLeft.svg.js"),i=require("../../../assets/icons/chevronRight.svg.js"),r=require("../../../assets/icons/PlusIcon.js"),n=require("lodash"),o=require("react"),a=require("../../add-variableV2/AddVariableV2SideModal.js");require("../../../_virtual/_tslib.js"),require("../../add-variableV2/AddVariableV2.styled.js");var s=require("../../button/Button.js"),d=require("../../icon-button/IconButton.js");require("../../input/Input.js"),require("../../tooltips/Tooltip.js");var c=require("../../../constants/Theme.js");require("../../modals/modal.styled.js"),require("../../switch/Switch.js");var u=require("../../TypographyStyle.js"),p=require("../../product-picker-v2/modal.js"),v=require("../Badge/index.js"),h=require("../context/templateModalContext.js"),m=require("./EditWhatsAppTemplateV2.js"),g=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 j=require("../../template-preview/models/WhatsAppTemplate.js");exports.default=x=>{let{template:y,whatsappSpecificPickerMeta:b,showVariableModal:f,variableList:C,variableListForImage:O,discountCode:I,setDiscountCode:
|
|
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/chevronLeft.svg.js"),i=require("../../../assets/icons/chevronRight.svg.js"),r=require("../../../assets/icons/PlusIcon.js"),n=require("lodash"),o=require("react"),a=require("../../add-variableV2/AddVariableV2SideModal.js");require("../../../_virtual/_tslib.js"),require("../../add-variableV2/AddVariableV2.styled.js");var s=require("../../button/Button.js"),d=require("../../icon-button/IconButton.js");require("../../input/Input.js"),require("../../tooltips/Tooltip.js");var c=require("../../../constants/Theme.js");require("../../modals/modal.styled.js"),require("../../switch/Switch.js");var u=require("../../TypographyStyle.js"),p=require("../../product-picker-v2/modal.js"),v=require("../Badge/index.js"),h=require("../context/templateModalContext.js"),m=require("./EditWhatsAppTemplateV2.js"),g=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 j=require("../../template-preview/models/WhatsAppTemplate.js");exports.default=x=>{let{template:y,whatsappSpecificPickerMeta:b,showVariableModal:f,variableList:C,variableListForImage:O,discountCode:I,setDiscountCode:S}=x;var q,w,P,k,T,L,B,R;const{selectedCarouselIndex:V,setTemplate:A,pickerConf:E,isProductCarouselType:M,pod:D,cardCount:F,carouselProducts:W,setCarouselProducts:_,isError:N,cardImages:$,disableEditVariable:z,onDeleteSelectedProducts:G,setSelectedCarouselIndex:H,sliderRef:J}=h.useTemplateModalContext(),[K,Q]=o.useState(-1==V?"First Message (Step 1/2)":M?"Product Carousel "+((null===(w=null===(q=null==y?void 0:y.mapping)||void 0===q?void 0:q.body)||void 0===w?void 0:w.length)?"":"(Step 2/2"):"Carousel Cards "+((null===(k=null===(P=null==y?void 0:y.mapping)||void 0===P?void 0:P.body)||void 0===k?void 0:k.length)?"":"(Step 2/2)")),[U,X]=o.useState(!1),[Y,Z]=o.useState(!1),[ee,te]=o.useState(!1),le=V===(null!=F?F:-1)-1,ie=(null!=V?V:-1)<1;o.useEffect((()=>{Q(-1==V?"First Message (Step 1/2)":M?"Product Carousel (Step 2/2)":"Carousel Cards (Step 2/2)")}),[V]);return 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:[null!=V&&V>=0&&(null===(L=null===(T=null==y?void 0:y.mapping)||void 0===T?void 0:T.body)||void 0===L?void 0:L.length)&&e.jsx(d.IconButton,{Icon:t.default,onClick:()=>{null==H||H(-1)}}),e.jsx(u.TitleMedium,Object.assign({style:{marginLeft:10}},{children:K}))]})),M&&(null!==(B=null==W?void 0:W.length)&&void 0!==B?B:0)>0&&null!=V&&V>=0&&e.jsxs("div",Object.assign({style:{display:"flex",rowGap:8,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"}},{children:[e.jsx(g.ProductBox,{editItem:()=>{1===(null==W?void 0:W.length)&&"variable"===W[0].name?te(!0):X(!U)},cardBody:1===(null==W?void 0:W.length)&&"variable"===W[0].name?`${W[0].productName}`:`${null==W?void 0:W.length} Products Selected`,hideIcon:1===(null==W?void 0:W.length)&&"variable"===W[0].name,deleteItem:()=>{var e;if(1===(null==W?void 0:W.length)&&"variable"===W[0].name)return void(null==_||_([]));const t=n.cloneDeep(Object.assign({},y));t&&($&&$.length>0?null==$||$.forEach(((e,l)=>{var i;t.components[1].cards[l].components[0].example.header_handle=[null!==(i=$[l])&&void 0!==i?i:"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==A||A(t)),null==_||_([]),null==G||G()}}),W&&(null==W?void 0:W.length)>0&&"variable"!=W[0].name&&e.jsx(s.Button,{disabled:(null!==(R=null==W?void 0:W.length)&&void 0!==R?R:0)<=1,style:{alignSelf:"flex-end"},onClick:()=>{Z(!0),X(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]})),!z&&M&&0===(null==W?void 0:W.length)&&null!=V&&V>=0&&e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{marginLeft:12}},{children:[e.jsx(u.TitleRegular,{children:"Product(s)"}),e.jsx(u.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(s.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12,border:N?`2px dashed ${c.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(r.default,{width:18,height:18,color:c.COLORS.content.secondary})})),onClick:e=>{X(!0)}}),D===j.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(u.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:N?`2px dashed ${c.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(r.default,{width:18,height:18,color:c.COLORS.content.secondary})})),onClick:e=>{te(!0)}})]})]})),N&&e.jsx("div",Object.assign({style:{marginLeft:10,marginBottom:16}},{children:e.jsx(v.Badge,{padding:"8px",errorText:"Please add products"})}))]}),!M&&(null!=V?V:-1)>-1&&e.jsxs("div",Object.assign({style:{display:"flex",background:c.COLORS.surface.hovered,alignItems:"center"}},{children:[e.jsx(d.IconButton,{Icon:l.default,disabled:ie,width:8,height:14,svgStyle:ie?{}:{color:c.COLORS.content.secondary},onClick:()=>{var e;null===(e=null==J?void 0:J.current)||void 0===e||e.slickPrev(),(null!=V?V:-1)<1||null==H||H((e=>e-1))}}),e.jsx(u.TitleRegular,Object.assign({style:{flex:1,display:"flex",justifyContent:"center"},color:c.COLORS.content.secondary},{children:`Card ${(null!=V?V:0)+1}/${F}`})),e.jsx(d.IconButton,{Icon:i.default,width:8,height:14,disabled:le,svgStyle:le?{}:{color:c.COLORS.content.secondary},onClick:()=>{var e;null===(e=null==J?void 0:J.current)||void 0===e||e.slickNext(),(null!=V?V:-1)>=(null!=F?F:-1)-1||null==H||H((e=>e+1))}})]})),e.jsx(m.default,{whatsappSpecificPickerMeta:b,template:y,onTemplateChange:e=>{null==A||A(e)},showVariableModal:f,variableList:C,variableListForImage:O,discountCode:I,setDiscountCode:S}),U&&E&&e.jsx(p.ProductPickerModal,{zIndex:200,startupScreen:Y?p.ScreenName.RearrangeProducts:p.ScreenName.Collections,rearrangeEnabled:!0,storeId:E.storeId,selectedItems:(e=>{if(e.length>0){const t={};for(const l of e){const e=null==l?void 0:l.collectionId,i=l.productId,r=l.variantId;e in t||(t[e]={products:{},name:"",image:"",isSmartCollection:!1}),i in t[e].products||(t[e].products[i]={variants:{},name:(null==l?void 0:l.productName)||"",image:(null==l?void 0:l.productImage)||""}),t[e].products[i].variants[r]={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!=W?W:[]),collectionFetcher:E.fetchCollections,productFetcher:E.fetchProducts,onAdd:(e,t)=>{var l,i,r,o,a,s;Z(!1);const d=[];delete e.isCustom;for(const t of Object.keys(e)){const n=e[t].products;if(void 0!==n&&Object.keys(n).length)for(const e of Object.keys(n)){const c=n[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!==(i=null!=v?v:null===(l=n[e])||void 0===l?void 0:l.image)&&void 0!==i?i:"",quantity:h,variantId:u,productId:e,displayOrder:m,collectionId:t,productName:null!==(o=null===(r=n[e])||void 0===r?void 0:r.name)&&void 0!==o?o:"",productImage:null!==(s=null===(a=n[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=n.cloneDeep(Object.assign({},y));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==A||A(p)),null==_||_(c),X(!1)},searchInCollectionFetcher:E.searchInCollection,searchFetcher:E.searchProducts,visible:U,onClose:()=>{X(!1)},exactLimit:null!=F?F:1}),ee&&e.jsx(a.AddVariableV2SideModal,{zIndex:2e3,data:null!=C?C:[],showVariable:ee,setShowVariable:te,placeholder:"Add a variable",customTrigger:e=>{null==_||_([{name:"variable",productName:e.actualValue}])}})]}))};
|
|
@@ -1,25 +1,25 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),
|
|
2
|
-
background: ${
|
|
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`
|
|
2
|
+
background: ${r.COLORS.surface.standard};
|
|
3
3
|
border-top-left-radius: ${e=>e.isCarouselCard?"12px":"0px"};
|
|
4
4
|
border-top-right-radius: 12px;
|
|
5
5
|
border-bottom-right-radius: 12px;
|
|
6
6
|
border-bottom-left-radius: 12px;
|
|
7
7
|
position: relative;
|
|
8
8
|
padding: 8px 0px;
|
|
9
|
-
border:
|
|
10
|
-
${e=>e.hasError?`${
|
|
11
|
-
border: ${e=>e.showDashedBorder&&`2px dashed ${
|
|
9
|
+
border: 2px solid
|
|
10
|
+
${e=>e.hasError?`${r.COLORS.content.negative}`:e.showBorder?`${r.COLORS.stroke.brand}`:`${r.COLORS.stroke.primary}`};
|
|
11
|
+
border: ${e=>e.showDashedBorder&&`2px dashed ${r.COLORS.content.brand}`};
|
|
12
12
|
height: 100%;
|
|
13
13
|
display: flex;
|
|
14
14
|
flex-direction: column;
|
|
15
15
|
:hover {
|
|
16
|
-
border:
|
|
16
|
+
border: 1px
|
|
17
17
|
${e=>e.isPreview?"unset":e.isWhatsappCarousel?e.hasError?"dashed":e.showBorder?"solid":"dashed":"solid"}
|
|
18
|
-
${
|
|
18
|
+
${r.COLORS.stroke.brand};
|
|
19
19
|
box-shadow: 4px 4px 12px rgba(0, 0, 0, 0.25);
|
|
20
20
|
}
|
|
21
|
-
`,a=i.default(
|
|
22
|
-
color: ${
|
|
21
|
+
`,a=i.default(t.Caption)`
|
|
22
|
+
color: ${r.COLORS.content.secondary};
|
|
23
23
|
max-width: 80px;
|
|
24
24
|
text-overflow: ellipsis;
|
|
25
25
|
white-space: nowrap;
|
|
@@ -42,7 +42,7 @@
|
|
|
42
42
|
flex-direction: row;
|
|
43
43
|
justify-content: center;
|
|
44
44
|
align-items: center;
|
|
45
|
-
border-top: 1px solid ${
|
|
45
|
+
border-top: 1px solid ${r.COLORS.stroke.primary};
|
|
46
46
|
`,x=i.default.div`
|
|
47
47
|
display: flex;
|
|
48
48
|
flex-direction: row;
|
|
@@ -59,7 +59,7 @@
|
|
|
59
59
|
display: flex;
|
|
60
60
|
flex-direction: row;
|
|
61
61
|
justify-content: start;
|
|
62
|
-
background: ${
|
|
62
|
+
background: ${r.COLORS.surface.hovered};
|
|
63
63
|
border-bottom-right-radius: 8px;
|
|
64
64
|
border-bottom-left-radius: 8px;
|
|
65
65
|
`,i.default.div`
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{jsxs as e,jsx as n}from"react/jsx-runtime";import
|
|
1
|
+
import{jsxs as e,jsx as n}from"react/jsx-runtime";import o from"../../assets/icons/chevronLeft.svg.js";import t from"../../assets/icons/chevronRight.svg.js";import l from"react";import r from"react-slick";import i from"styled-components";import{Container as s}from"./CarouselPreview.style.js";import c from"./CarouselPreviewCard.js";import{COLORS as d}from"../../constants/Theme.js";import{useTemplateModalContext as a}from"../template-context-mapper/context/templateModalContext.js";const u=l.forwardRef(((o,t)=>{let{channel:l,template:i,showSampleValues:d,isPreview:u,removeBottomBorder:x}=o;var v,g,f;const w=null===(v=null==i?void 0:i.components)||void 0===v?void 0:v[1].cards,{sliderRef:C,selectedCarouselIndex:b,cardCount:k,setIsCarouselHovered:j}=a();return e(s,Object.assign({removeBottomBorder:x},{children:[n(c,{channel:l,currentTemplate:i,carouselCardIndex:-1,isPreview:u,width:"77%"}),!!(null==w?void 0:w.length)&&n(h,Object.assign({cardCount:null!=k?k:0,selectedCarouselIndex:null!=b?b:-1,onMouseEnter:()=>null==j?void 0:j(!0),onMouseLeave:()=>null==j?void 0:j(!1)},{children:n(r,Object.assign({ref:C,swipeToSlide:!0,swipe:!0,infinite:!1,focusOnSelect:!0,centerMode:!0,arrows:!0,adaptiveHeight:!0,nextArrow:n(p,{}),prevArrow:n(m,{})},{children:null===(f=null===(g=null==i?void 0:i.components)||void 0===g?void 0:g[1].cards)||void 0===f?void 0:f.map(((e,o)=>{var t,r;const s={components:e.components,mapping:null===(r=null===(t=null==i?void 0:i.mapping)||void 0===t?void 0:t.cards)||void 0===r?void 0:r[o]};return n(c,{channel:l,currentTemplate:s,carouselCardIndex:o,isPreview:u,width:"100%"},o)}))}))}))]}))})),p=e=>{const{className:o,style:l,onClick:r}=e,{selectedCarouselIndex:i,setSelectedCarouselIndex:s,cardCount:c}=a();return n("div",Object.assign({className:o,style:Object.assign(Object.assign({},l),{display:r&&(null!=i?i:-1)>-1?"flex":"none",content:"none"}),onClick:e=>{console.log("onClick",i,c),null==r||r(e),(null!=i?i:-1)>=(null!=c?c:-1)-1||null==s||s((null!=i?i:-1)+1)}},{children:n(t,{height:10,width:10,color:d.content.primary})}))},m=e=>{const{className:t,style:l,onClick:r}=e,{selectedCarouselIndex:i,setSelectedCarouselIndex:s}=a();return n("div",Object.assign({className:t,style:Object.assign(Object.assign({},l),{display:r&&(null!=i?i:-1)>-1?"flex":"none",content:"none"}),onClick:e=>{null==r||r(e),(null!=i?i:-1)<1||null==s||s((null!=i?i:-1)-1)}},{children:n(o,{height:10,width:10,color:d.content.primary})}))},h=i.div`
|
|
2
2
|
width: 100%;
|
|
3
3
|
/* ${e=>e.selectedCarouselIndex<e.cardCount-1?"width: calc(100% - 48px);":"width: 100%;"} */
|
|
4
4
|
/* margin: auto; */
|
|
@@ -24,6 +24,10 @@ import{jsxs as e,jsx as n}from"react/jsx-runtime";import t from"../../assets/ico
|
|
|
24
24
|
background-color: white;
|
|
25
25
|
box-shadow: 0px 1.5px 6px 0px #0000001f;
|
|
26
26
|
/* height: 100%; */
|
|
27
|
+
|
|
28
|
+
:hover {
|
|
29
|
+
background: white;
|
|
30
|
+
}
|
|
27
31
|
}
|
|
28
32
|
|
|
29
33
|
.slick-prev {
|
|
@@ -39,6 +43,10 @@ import{jsxs as e,jsx as n}from"react/jsx-runtime";import t from"../../assets/ico
|
|
|
39
43
|
background-color: white;
|
|
40
44
|
box-shadow: 0px 1.5px 6px 0px #0000001f;
|
|
41
45
|
|
|
46
|
+
:hover {
|
|
47
|
+
background: white;
|
|
48
|
+
}
|
|
49
|
+
|
|
42
50
|
/* height: 100%; */
|
|
43
51
|
}
|
|
44
52
|
|
|
@@ -48,6 +56,7 @@ import{jsxs as e,jsx as n}from"react/jsx-runtime";import t from"../../assets/ico
|
|
|
48
56
|
|
|
49
57
|
.slick-slide > div {
|
|
50
58
|
height: 100%;
|
|
59
|
+
padding-bottom: 16px;
|
|
51
60
|
}
|
|
52
61
|
|
|
53
62
|
.slick-track {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{__rest as e}from"../../_virtual/_tslib.js";import{jsx as t}from"react/jsx-runtime";import o,{forwardRef as i}from"react";import{IconButton as r}from"./IconButton.styled.js";import{getIconColor as
|
|
1
|
+
import{__rest as e}from"../../_virtual/_tslib.js";import{jsx as t}from"react/jsx-runtime";import o,{forwardRef as i}from"react";import{IconButton as r}from"./IconButton.styled.js";import{getIconColor as s}from"./theme.js";const d=i(((i,d)=>{var{id:l,iconButtonType:n="default",Icon:c,height:a=20,width:m=20,bordered:y,disabled:h,isSelected:p,style:u,svgStyle:b}=i,f=e(i,["id","iconButtonType","Icon","height","width","bordered","disabled","isSelected","style","svgStyle"]);const g=s(n,h,p);return t(r,Object.assign({id:l,ref:d,style:u,iconButtonType:n,bordered:y,disabled:h,isSelected:p},f,{children:o.createElement(c,{height:a,width:m,color:g,style:Object.assign({display:"block"},null!=b?b:{})})}))}));d.displayName="IconButton";export{d as IconButton};
|
|
@@ -10,6 +10,11 @@ export interface IconButtonProps extends React.ButtonHTMLAttributes<HTMLButtonEl
|
|
|
10
10
|
* @default default undefined
|
|
11
11
|
*/
|
|
12
12
|
style?: React.CSSProperties;
|
|
13
|
+
/**
|
|
14
|
+
* Custom styles which can be added to the svg
|
|
15
|
+
* @default default undefined
|
|
16
|
+
*/
|
|
17
|
+
svgStyle?: React.CSSProperties;
|
|
13
18
|
/**
|
|
14
19
|
* Custom height for the svg icon
|
|
15
20
|
* @default default 20
|
package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2.js
CHANGED
|
@@ -1 +1 @@
|
|
|
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 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{AddVariableV2SideModal as c}from"../../add-variableV2/AddVariableV2SideModal.js";import"../../../_virtual/_tslib.js";import"../../add-variableV2/AddVariableV2.styled.js";import{Button as u}from"../../button/Button.js";import{IconButton as p}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 h,TitleRegular as v,BodySecondary as g,BodyCaption as f}from"../../TypographyStyle.js";import{ProductPickerModal as y,ScreenName as b}from"../../product-picker-v2/modal.js";import{Badge as j}from"../Badge/index.js";import{useTemplateModalContext as x}from"../context/templateModalContext.js";import C from"./EditWhatsAppTemplateV2.js";import{ProductBox as I}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 w}from"../../template-preview/models/WhatsAppTemplate.js";const O=O=>{let{template:k,whatsappSpecificPickerMeta:P,showVariableModal:T,variableList:S,variableListForImage:L,discountCode:V,setDiscountCode:A}=O;var E,B,M,D,F,R,W,$;const{selectedCarouselIndex:q,setTemplate:_,pickerConf:N,isProductCarouselType:z,pod:G,cardCount:H,carouselProducts:J,setCarouselProducts:K,isError:Q,cardImages:U,disableEditVariable:X,onDeleteSelectedProducts:Y,setSelectedCarouselIndex:Z,sliderRef:ee}=x(),[te,le]=d(-1==q?"First Message (Step 1/2)":z?"Product Carousel "+((null===(B=null===(E=null==k?void 0:k.mapping)||void 0===E?void 0:E.body)||void 0===B?void 0:B.length)?"":"(Step 2/2"):"Carousel Cards "+((null===(D=null===(M=null==k?void 0:k.mapping)||void 0===M?void 0:M.body)||void 0===D?void 0:D.length)?"":"(Step 2/2)")),[oe,ie]=d(!1),[ne,re]=d(!1),[ae,de]=d(!1);s((()=>{le(-1==q?"First Message (Step 1/2)":z?"Product Carousel (Step 2/2)":"Carousel Cards (Step 2/2)")}),[q]);return e("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"16px"}},{children:[e("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center"}},{children:[null!=q&&q>=0&&(null===(R=null===(F=null==k?void 0:k.mapping)||void 0===F?void 0:F.body)||void 0===R?void 0:R.length)&&t(p,{Icon:o,onClick:()=>{null==Z||Z(-1)}}),t(h,Object.assign({style:{marginLeft:10}},{children:te}))]})),z&&(null!==(W=null==J?void 0:J.length)&&void 0!==W?W:0)>0&&null!=q&&q>=0&&e("div",Object.assign({style:{display:"flex",rowGap:8,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"}},{children:[t(I,{editItem:()=>{1===(null==J?void 0:J.length)&&"variable"===J[0].name?de(!0):ie(!oe)},cardBody:1===(null==J?void 0:J.length)&&"variable"===J[0].name?`${J[0].productName}`:`${null==J?void 0:J.length} Products Selected`,hideIcon:1===(null==J?void 0:J.length)&&"variable"===J[0].name,deleteItem:()=>{var e;if(1===(null==J?void 0:J.length)&&"variable"===J[0].name)return void(null==K||K([]));const t=a(Object.assign({},k));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==_||_(t)),null==K||K([]),null==Y||Y()}}),J&&(null==J?void 0:J.length)>0&&"variable"!=J[0].name&&t(u,{disabled:(null!==($=null==J?void 0:J.length)&&void 0!==$?$:0)<=1,style:{alignSelf:"flex-end"},onClick:()=>{re(!0),ie(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]})),!X&&z&&0===(null==J?void 0:J.length)&&null!=q&&q>=0&&e(l,{children:[e("div",Object.assign({style:{marginLeft:12}},{children:[t(v,{children:"Product(s)"}),t(g,{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(u,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12,border:Q?`2px dashed ${m.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:m.content.secondary})})),onClick:e=>{ie(!0)}}),G===w.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(f,Object.assign({style:{color:"#616161",overflow:"unset"}},{children:"OR"})),t("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginLeft:8}})]})),t(u,{matchParentWidth:!0,style:{flex:1,display:"flex",marginTop:12,width:"100%",border:Q?`2px dashed ${m.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:m.content.secondary})})),onClick:e=>{de(!0)}})]})]})),Q&&t("div",Object.assign({style:{marginLeft:10,marginBottom:16}},{children:t(j,{padding:"8px",errorText:"Please add products"})}))]}),!z&&(null!=q?q:-1)>-1&&e("div",Object.assign({style:{display:"flex",background:m.surface.hovered,alignItems:"center"}},{children:[
|
|
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 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{AddVariableV2SideModal as c}from"../../add-variableV2/AddVariableV2SideModal.js";import"../../../_virtual/_tslib.js";import"../../add-variableV2/AddVariableV2.styled.js";import{Button as u}from"../../button/Button.js";import{IconButton as p}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 h,TitleRegular as v,BodySecondary as g,BodyCaption as f}from"../../TypographyStyle.js";import{ProductPickerModal as y,ScreenName as b}from"../../product-picker-v2/modal.js";import{Badge as j}from"../Badge/index.js";import{useTemplateModalContext as x}from"../context/templateModalContext.js";import C from"./EditWhatsAppTemplateV2.js";import{ProductBox as I}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 w}from"../../template-preview/models/WhatsAppTemplate.js";const O=O=>{let{template:k,whatsappSpecificPickerMeta:P,showVariableModal:T,variableList:S,variableListForImage:L,discountCode:V,setDiscountCode:A}=O;var E,B,M,D,F,R,W,$;const{selectedCarouselIndex:q,setTemplate:_,pickerConf:N,isProductCarouselType:z,pod:G,cardCount:H,carouselProducts:J,setCarouselProducts:K,isError:Q,cardImages:U,disableEditVariable:X,onDeleteSelectedProducts:Y,setSelectedCarouselIndex:Z,sliderRef:ee}=x(),[te,le]=d(-1==q?"First Message (Step 1/2)":z?"Product Carousel "+((null===(B=null===(E=null==k?void 0:k.mapping)||void 0===E?void 0:E.body)||void 0===B?void 0:B.length)?"":"(Step 2/2"):"Carousel Cards "+((null===(D=null===(M=null==k?void 0:k.mapping)||void 0===M?void 0:M.body)||void 0===D?void 0:D.length)?"":"(Step 2/2)")),[oe,ie]=d(!1),[ne,re]=d(!1),[ae,de]=d(!1),se=q===(null!=H?H:-1)-1,ce=(null!=q?q:-1)<1;s((()=>{le(-1==q?"First Message (Step 1/2)":z?"Product Carousel (Step 2/2)":"Carousel Cards (Step 2/2)")}),[q]);return e("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"16px"}},{children:[e("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center"}},{children:[null!=q&&q>=0&&(null===(R=null===(F=null==k?void 0:k.mapping)||void 0===F?void 0:F.body)||void 0===R?void 0:R.length)&&t(p,{Icon:o,onClick:()=>{null==Z||Z(-1)}}),t(h,Object.assign({style:{marginLeft:10}},{children:te}))]})),z&&(null!==(W=null==J?void 0:J.length)&&void 0!==W?W:0)>0&&null!=q&&q>=0&&e("div",Object.assign({style:{display:"flex",rowGap:8,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"}},{children:[t(I,{editItem:()=>{1===(null==J?void 0:J.length)&&"variable"===J[0].name?de(!0):ie(!oe)},cardBody:1===(null==J?void 0:J.length)&&"variable"===J[0].name?`${J[0].productName}`:`${null==J?void 0:J.length} Products Selected`,hideIcon:1===(null==J?void 0:J.length)&&"variable"===J[0].name,deleteItem:()=>{var e;if(1===(null==J?void 0:J.length)&&"variable"===J[0].name)return void(null==K||K([]));const t=a(Object.assign({},k));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==_||_(t)),null==K||K([]),null==Y||Y()}}),J&&(null==J?void 0:J.length)>0&&"variable"!=J[0].name&&t(u,{disabled:(null!==($=null==J?void 0:J.length)&&void 0!==$?$:0)<=1,style:{alignSelf:"flex-end"},onClick:()=>{re(!0),ie(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]})),!X&&z&&0===(null==J?void 0:J.length)&&null!=q&&q>=0&&e(l,{children:[e("div",Object.assign({style:{marginLeft:12}},{children:[t(v,{children:"Product(s)"}),t(g,{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(u,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12,border:Q?`2px dashed ${m.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:m.content.secondary})})),onClick:e=>{ie(!0)}}),G===w.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(f,Object.assign({style:{color:"#616161",overflow:"unset"}},{children:"OR"})),t("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginLeft:8}})]})),t(u,{matchParentWidth:!0,style:{flex:1,display:"flex",marginTop:12,width:"100%",border:Q?`2px dashed ${m.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:m.content.secondary})})),onClick:e=>{de(!0)}})]})]})),Q&&t("div",Object.assign({style:{marginLeft:10,marginBottom:16}},{children:t(j,{padding:"8px",errorText:"Please add products"})}))]}),!z&&(null!=q?q:-1)>-1&&e("div",Object.assign({style:{display:"flex",background:m.surface.hovered,alignItems:"center"}},{children:[t(p,{Icon:i,disabled:ce,width:8,height:14,svgStyle:ce?{}:{color:m.content.secondary},onClick:()=>{var e;null===(e=null==ee?void 0:ee.current)||void 0===e||e.slickPrev(),(null!=q?q:-1)<1||null==Z||Z((e=>e-1))}}),t(v,Object.assign({style:{flex:1,display:"flex",justifyContent:"center"},color:m.content.secondary},{children:`Card ${(null!=q?q:0)+1}/${H}`})),t(p,{Icon:n,width:8,height:14,disabled:se,svgStyle:se?{}:{color:m.content.secondary},onClick:()=>{var e;null===(e=null==ee?void 0:ee.current)||void 0===e||e.slickNext(),(null!=q?q:-1)>=(null!=H?H:-1)-1||null==Z||Z((e=>e+1))}})]})),t(C,{whatsappSpecificPickerMeta:P,template:k,onTemplateChange:e=>{null==_||_(e)},showVariableModal:T,variableList:S,variableListForImage:L,discountCode:V,setDiscountCode:A}),oe&&N&&t(y,{zIndex:200,startupScreen:ne?b.RearrangeProducts:b.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!=J?J:[]),collectionFetcher:N.fetchCollections,productFetcher:N.fetchProducts,onAdd:(e,t)=>{var l,o,i,n,r,d;re(!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:h,displayOrder:v}=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:h,variantId:u,productId:e,displayOrder:v,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({},k));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==_||_(p)),null==K||K(c),ie(!1)},searchInCollectionFetcher:N.searchInCollection,searchFetcher:N.searchProducts,visible:oe,onClose:()=>{ie(!1)},exactLimit:null!=H?H:1}),ae&&t(c,{zIndex:2e3,data:null!=S?S:[],showVariable:ae,setShowVariable:de,placeholder:"Add a variable",customTrigger:e=>{null==K||K([{name:"variable",productName:e.actualValue}])}})]}))};export{O as default};
|
|
@@ -6,14 +6,14 @@ import r from"styled-components";import{Caption as e}from"../../TypographyStyle.
|
|
|
6
6
|
border-bottom-left-radius: 12px;
|
|
7
7
|
position: relative;
|
|
8
8
|
padding: 8px 0px;
|
|
9
|
-
border:
|
|
9
|
+
border: 2px solid
|
|
10
10
|
${r=>r.hasError?`${o.content.negative}`:r.showBorder?`${o.stroke.brand}`:`${o.stroke.primary}`};
|
|
11
11
|
border: ${r=>r.showDashedBorder&&`2px dashed ${o.content.brand}`};
|
|
12
12
|
height: 100%;
|
|
13
13
|
display: flex;
|
|
14
14
|
flex-direction: column;
|
|
15
15
|
:hover {
|
|
16
|
-
border:
|
|
16
|
+
border: 1px
|
|
17
17
|
${r=>r.isPreview?"unset":r.isWhatsappCarousel?r.hasError?"dashed":r.showBorder?"solid":"dashed":"solid"}
|
|
18
18
|
${o.stroke.brand};
|
|
19
19
|
box-shadow: 4px 4px 12px rgba(0, 0, 0, 0.25);
|
|
@@ -36,14 +36,14 @@ import r from"styled-components";import{Caption as e}from"../../TypographyStyle.
|
|
|
36
36
|
min-height: 152px;
|
|
37
37
|
margin-bottom: 4px;
|
|
38
38
|
margin: 0px 8px;
|
|
39
|
-
`,
|
|
39
|
+
`,p=r.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
|
-
`,
|
|
46
|
+
`,a=r.div`
|
|
47
47
|
display: flex;
|
|
48
48
|
flex-direction: row;
|
|
49
49
|
justify-content: space-between;
|
|
@@ -66,4 +66,4 @@ import r from"styled-components";import{Caption as e}from"../../TypographyStyle.
|
|
|
66
66
|
position: absolute;
|
|
67
67
|
top: 16px;
|
|
68
68
|
right: 16px;
|
|
69
|
-
`;export{
|
|
69
|
+
`;export{p as ChatBtnContainer,t as Container,d as FooterText,a as FooterWrapper,s as MediaContainer,i as TimeStamp};
|