@ikas/popup-renderer 1.0.164 → 1.0.165
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1 +1 @@
|
|
|
1
|
-
import{__spreadArray as t,__assign as e,__awaiter as o,__generator as n}from'./../../../ext/tslib/tslib.es6.mjs.js';import i from"react";import{observer as l}from"mobx-react";import{getHorizontalAlignment as r,injectFontScript as d}from"../../helpers/index.js";import{ProductListTypeEnum as a,ProductListLayoutEnum as c}from"../../models/modal/step/elements/product/index.js";import u from"../button-element-renderer/index.js";import{Navigation as s,Scrollbar as v}from"swiper/modules";import{Swiper as m,SwiperSlide as
|
|
1
|
+
import{__spreadArray as t,__assign as e,__awaiter as o,__generator as n}from'./../../../ext/tslib/tslib.es6.mjs.js';import i from"react";import{observer as l}from"mobx-react";import{getHorizontalAlignment as r,injectFontScript as d}from"../../helpers/index.js";import{ProductListTypeEnum as a,ProductListLayoutEnum as c}from"../../models/modal/step/elements/product/index.js";import u from"../button-element-renderer/index.js";import{Navigation as s,Scrollbar as v}from"swiper/modules";import{Swiper as m,SwiperSlide as p}from"swiper/react";import g from"../../assets/left-arrow.js";import f from"../../assets/right-arrow.js";import{ProductActionTypeEnum as b}from"../../models/modal/step/elements/product/detail-settings/index.js";var x=l((function(l){var x,h=l.element,y=l.products,E=l.popup,P=l.editModeChildren,C=l.isPreviewMode,w=l.sfProps,S=l.onClose,R=i.useState(null),z=R[0],D=R[1],W=i.useState(!1),I=W[0],j=W[1],k=i.useState(!1),F=k[0],A=k[1],T=h,_=[];if(y&&(_=T.listType===a.SPECIFIC?(null===(x=T.variantPairs)||void 0===x?void 0:x.length)?y.slice().sort((function(t,e){return T.variantPairs.findIndex((function(e){return e.variantId===t.variantId}))-T.variantPairs.findIndex((function(t){return t.variantId===e.variantId}))})):[]:t([],y,!0)),_.length>T.maxProductsToShow&&(_.length=T.maxProductsToShow),!(_&&_.length||!E.isPreviewMode)&&P)return P;if(!_||!_.length)return null;T.gapBetweenProductElements;var N=T.productDetailSettings.image,B=T.productDetailSettings.button,M=T.buttonSettings,O=T.productDetailSettings.discountRatio,U=T.productDetailSettings.finalPrice,H=T.productDetailSettings.originalPrice,L=T.productDetailSettings.name,V=r(T.horizontalAlignment),$=1;T.layout===c.ONE_COLUMN?$=1:T.layout===c.TWO_COLUMN?$=2:T.layout===c.THREE_COLUMN&&($=3);var q={padding:"".concat(T.outerVerticalPadding,"px ").concat(T.outerHorizontalPadding,"px"),backgroundColor:T.productBgColor,width:"100%",height:"max-content"},G={display:"flex",flexDirection:"column",justifyContent:"space-between",alignItems:"center",height:"100%"},J={display:"flex",justifyContent:V,alignItems:"center",width:"100%",backgroundColor:null==N?void 0:N.bgColor,borderRadius:(null==N?void 0:N.borderRadius)?"".concat(N.borderRadius,"px"):void 0},K={width:"".concat(null==N?void 0:N.maxWidth,"%"),objectFit:"contain",borderRadius:(null==N?void 0:N.borderRadius)?"".concat(N.borderRadius,"px"):void 0},Q={display:"flex",flexDirection:"column",width:"100%"},X={display:"flex",flexDirection:"column"},Y={backgroundColor:null==L?void 0:L.bgColor,color:null==L?void 0:L.color,fontFamily:L?d(L.fontFamily):void 0,fontSize:null==L?void 0:L.fontSize,fontWeight:null==L?void 0:L.fontWeight,padding:"".concat(null==L?void 0:L.verticalPadding,"px ").concat(null==L?void 0:L.horizontalPadding,"px"),width:"100%",textAlign:null==L?void 0:L.horizontalAlignment,border:"".concat(null==L?void 0:L.borderWidth,"px ").concat(null==L?void 0:L.borderStyle," ").concat(null==L?void 0:L.borderColor),borderRadius:null==L?void 0:L.borderRadius},Z={backgroundColor:null==O?void 0:O.bgColor,color:null==O?void 0:O.color,fontFamily:O?d(O.fontFamily):void 0,fontSize:null==O?void 0:O.fontSize,fontWeight:null==O?void 0:O.fontWeight,padding:"".concat(null==O?void 0:O.verticalPadding,"px ").concat(null==O?void 0:O.horizontalPadding,"px"),width:"100%",textAlign:null==O?void 0:O.horizontalAlignment,border:"".concat(null==O?void 0:O.borderWidth,"px ").concat(null==O?void 0:O.borderStyle," ").concat(null==O?void 0:O.borderColor),borderRadius:null==O?void 0:O.borderRadius},tt={textDecoration:"line-through",backgroundColor:null==H?void 0:H.bgColor,color:null==H?void 0:H.color,fontFamily:H?d(H.fontFamily):void 0,fontSize:null==H?void 0:H.fontSize,fontWeight:null==H?void 0:H.fontWeight,padding:"".concat(null==H?void 0:H.verticalPadding,"px ").concat(null==H?void 0:H.horizontalPadding,"px"),width:"100%",textAlign:null==H?void 0:H.horizontalAlignment,border:"".concat(null==H?void 0:H.borderWidth,"px ").concat(null==H?void 0:H.borderStyle," ").concat(null==H?void 0:H.borderColor),borderRadius:null==H?void 0:H.borderRadius},et={backgroundColor:null==U?void 0:U.bgColor,color:null==U?void 0:U.color,fontFamily:U?d(U.fontFamily):void 0,fontSize:null==U?void 0:U.fontSize,fontWeight:null==U?void 0:U.fontWeight,padding:"".concat(null==U?void 0:U.verticalPadding,"px ").concat(null==U?void 0:U.horizontalPadding,"px"),width:"100%",textAlign:null==U?void 0:U.horizontalAlignment,border:"".concat(null==U?void 0:U.borderWidth,"px ").concat(null==U?void 0:U.borderStyle," ").concat(null==U?void 0:U.borderColor),borderRadius:null==U?void 0:U.borderRadius},ot={width:"".concat(M.width,"%"),minWidth:"fit-content"},nt=e({display:"flex",justifyContent:"center",width:"100%",gap:"10px"},1===$?{position:"absolute",top:"calc(50% - 25px)",alignItems:"center",justifyContent:"space-between",zIndex:10}:void 0),it={padding:10,display:"flex",justifyContent:"center",alignItems:"center",borderRadius:"100%",border:"1px solid #EEF2F6",cursor:"pointer"},lt=i.useCallback((function(t){return t.$discountRatio?T.productDetailSettings.discountRatioText?"".concat(t.$discountRatio," ").concat(T.productDetailSettings.discountRatioText):t.$discountRatio:null}),[]);return i.createElement("div",{style:q},i.createElement(m,{onSwiper:D,modules:[s,v],spaceBetween:T.gapBetweenProducts,slidesPerView:$,navigation:{nextEl:".custom-next-button",prevEl:".custom-prev-button"},scrollbar:void 0},_.map((function(t,e){return i.createElement(p,{style:{height:"auto"},key:t.variantId},i.createElement("div",{style:G,onClick:function(){return function(t){return o(void 0,void 0,void 0,(function(){var e,o;return n(this,(function(n){switch(n.label){case 0:return C||!t.url?[3,4]:(null===(o=T.productDetailSettings.button)||void 0===o?void 0:o.action)===b.ADD_TO_CART&&w?[4,w.addProductToCart(t)]:[3,2];case 1:return n.sent()&&((e=document.createElement("a")).href="".concat(E.storeUrl,"/cart"),e.target="_self",e.click()),[3,3];case 2:(e=document.createElement("a")).href=t.url,e.target="_self",e.click(),n.label=3;case 3:S(!0),n.label=4;case 4:return[2]}}))}))}(t)}},i.createElement("div",{style:Q},!!N&&t.imageURL&&i.createElement("div",{style:J},i.createElement("img",{src:t.imageURL||void 0,alt:t.name||void 0,style:K})),!!L&&i.createElement("div",{style:X},!!L&&i.createElement("div",{style:Y},t.name)),(!!H||!!U||!!O)&&i.createElement("div",{style:{display:"flex",flexDirection:"column",gap:2}},!!O&&!!t.discountPrice&&i.createElement("div",{style:{padding:"".concat(O.outerVerticalPadding,"px ").concat(O.outerHorizontalPadding,"px"),width:"fit-content"}},i.createElement("div",{style:Z},lt(t))),i.createElement("div",{style:{display:"flex",alignItems:"center",gap:4,flexWrap:"wrap",overflow:"hidden"}},!!H&&!!t.discountPrice&&i.createElement("div",{style:{padding:"".concat(H.outerVerticalPadding,"px ").concat(H.outerHorizontalPadding,"px")}},i.createElement("div",{style:tt},t.price)),!!U&&i.createElement("div",{style:{padding:"".concat(U.outerVerticalPadding,"px ").concat(U.outerHorizontalPadding,"px")}},i.createElement("div",{style:et},t.discountPrice||t.price))))),!!B&&i.createElement("div",{style:ot}," ",i.createElement(u,{element:M})," ")))})),_.length>1&&i.createElement("div",{style:nt},i.createElement("div",{className:"custom-prev-button",style:e(e({},it),I?{opacity:.5,cursor:"not-allowed"}:{}),onClick:function(){z&&(z.slidePrev(),A(z.isEnd),j(z.isBeginning))}},i.createElement(g,null)),i.createElement("div",{className:"custom-next-button",style:e(e({},it),F?{opacity:.5,cursor:"not-allowed"}:{}),onClick:function(){z&&(z.slideNext(),A(z.isEnd),j(z.isBeginning))}},i.createElement(f,null)))))}));export{x as default};
|
|
@@ -4,6 +4,7 @@ export declare class ProductDetailSettings {
|
|
|
4
4
|
image: ProductImageSettings | null;
|
|
5
5
|
name: TextElement | null;
|
|
6
6
|
discountRatio: TextElement | null;
|
|
7
|
+
discountRatioText: string | null;
|
|
7
8
|
originalPrice: TextElement | null;
|
|
8
9
|
finalPrice: TextElement | null;
|
|
9
10
|
button: ProductButtonSettings | null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{makeObservable as i,observable as
|
|
1
|
+
import{makeObservable as i,observable as t}from"mobx";import{TextElement as o}from"../../text/index.js";import{IkasPopupRendererFontFamily as n}from"../../base/index.js";import{Popup as a}from"../../../../../index.js";var e,r=function(n){void 0===n&&(n={}),this.image=n.image?new l(n.image):new l({}),this.name=n.name?new o(n.name):new o({horizontalPadding:0,verticalPadding:6}),this.discountRatio=n.discountRatio?new o(n.discountRatio):null,this.originalPrice=n.originalPrice?new o(n.originalPrice):new o({horizontalPadding:0,verticalPadding:2,fontSize:14,color:"#697586"}),this.finalPrice=n.finalPrice?new o(n.finalPrice):new o({horizontalPadding:0,verticalPadding:2}),this.button=n.button?new s(n.button):new s({}),this.discountRatioText=n.discountRatioText||null,i(this,{image:t,name:t,discountRatio:t,originalPrice:t,finalPrice:t,button:t,discountRatioText:t})},l=function(o){var n,a;this.bgColor=o.bgColor||"",this.maxWidth=null!==(n=o.maxWidth)&&void 0!==n?n:100,this.borderRadius=null!==(a=o.borderRadius)&&void 0!==a?a:0,i(this,{bgColor:t,maxWidth:t,borderRadius:t})},d=function(o){var a;void 0===o&&(o={}),this.color=o.color||"#000000",this.bgColor=o.bgColor||"",this.fontFamily=new n(o.fontFamily),this.fontSize=null!==(a=o.fontSize)&&void 0!==a?a:24,i(this,{color:t,bgColor:t,fontFamily:t,fontSize:t})};!function(i){i.ADD_TO_CART="ADD_TO_CART",i.NAVIGATE_TO_PRODUCT_DETAIL="NAVIGATE_TO_PRODUCT_DETAIL"}(e||(e={}));var s=function(o){void 0===o&&(o={}),this.text=o.text||a.t("popup:initialClassTranslations.productButtonText"),this.action=o.action||e.ADD_TO_CART,i(this,{text:t,action:t})};export{e as ProductActionTypeEnum,s as ProductButtonSettings,r as ProductDetailSettings,d as ProductDiscountRatioSettings,l as ProductImageSettings};
|