@ikas/popup-renderer 1.0.138 → 1.0.140

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 e from"react";import{observer as t}from"mobx-react";var r=t((function(t){var r=t.checkboxItem;e.useEffect((function(){r.showInCheckedStatus?r.isChecked=!0:r.isChecked=!1}),[r.showInCheckedStatus]);var c=r.requiredToBeChecked;return e.createElement("div",{style:{width:"100%",display:"flex",gap:6,flexDirection:"column"}},e.createElement("div",{style:{width:"100%",display:"flex",gap:8,flexDirection:"row",alignItems:"center"}},e.createElement("input",{style:{width:"16px",height:"16px",cursor:"pointer"},type:"checkbox",checked:r.isChecked,onChange:function(){r.isChecked=!r.isChecked,c&&c.hasError&&r.isChecked&&(c.hasError=!1)}}),e.createElement("div",{style:{display:"flex",alignItems:"center",gap:4}},e.createElement("div",{dangerouslySetInnerHTML:{__html:r.text}}),!!c&&e.createElement("span",null,"*"))),!!c&&c.hasError&&e.createElement("div",{style:{color:"red",fontSize:"12px"}},c.validationErrorMessage))}));export{r as CheckboxItemView};
1
+ import e from"react";import{observer as r}from"mobx-react";var t=r((function(r){var t=r.checkboxItem;e.useEffect((function(){t.showInCheckedStatus?t.isChecked=!0:t.isChecked=!1}),[t.showInCheckedStatus]);var c=t.requiredToBeChecked;return e.createElement("div",{style:{width:"100%",display:"flex",gap:6,flexDirection:"column"}},e.createElement("div",{style:{width:"100%",display:"flex",gap:8,flexDirection:"row",alignItems:"baseline",wordBreak:"break-word"}},e.createElement("input",{style:{width:"16px",height:"16px",cursor:"pointer"},type:"checkbox",checked:t.isChecked,onChange:function(){t.isChecked=!t.isChecked,c&&c.hasError&&t.isChecked&&(c.hasError=!1)}}),e.createElement("div",{dangerouslySetInnerHTML:{__html:e.useCallback((function(){var e=/<pre[^>]*>([\s\S]*?)<\/pre>/.exec(t.text);return e?e[1]:t.text}),[])}})),!!c&&c.hasError&&e.createElement("div",{style:{color:"red",fontSize:"12px"}},c.validationErrorMessage))}));export{t as CheckboxItemView};
@@ -2,9 +2,11 @@ import React from "react";
2
2
  import { DashboardComponents, Popup, PopupProductDictionary } from "../models";
3
3
  import { PopupRendererSaveCustomerInput } from "popup-renderer/models/modal/step/elements/form";
4
4
  import "../style.css";
5
+ import { PopupProduct } from "popup-renderer/models/modal/step/elements/product";
5
6
  export type SFProps = {
6
7
  isCustomerLoggedIn: boolean;
7
8
  currentCountryCode?: string;
9
+ addProductToCart: (popupProduct: PopupProduct) => void;
8
10
  onModalClose: () => void;
9
11
  onCustomerSave: (customer: PopupRendererSaveCustomerInput) => Promise<void>;
10
12
  };
@@ -1 +1 @@
1
- import e from"react";import{observer as t}from"mobx-react";import{PopupTypeEnum as o,PopupPositonEnum as i}from"../models/modal/index.js";import n from"../assets/x-close.js";import{CloseButtonPositionTypeEnum as r,CloseIconTypeEnum as l,CloseButtonDisplayTypeEnum as s}from"../models/modal/close-settings/index.js";import{PopupElementTypeEnum as d,ComponentVerticalAlignmentEnum as a}from"../models/modal/step/elements/base/index.js";import c from"./text-element-renderer/index.js";import m from"./button-element-renderer/index.js";import p from"./space-element-renderer/index.js";import u from"./divider-element-renderer/index.js";import f from"./social-element-renderer/index.js";import P from"./image-element-renderer/index.js";import x from"./image-column-element-renderer/index.js";import E from"./product-list-renderer/index.js";import v from"./form-element-renderer/index.js";import{ImageColumnPositionEnum as g,MobileImageColumnPositionEnum as T}from"../models/modal/step/elements/image-column/index.js";var b=t((function(t){var b,y,O,I,_=t.popup,h=t.dynamicData,C=t.dashboardComponents,M=t.previewMode,w=t.sfProps,A=t.isMobile,D=_.modal,R=D.teaser,S=!!D.selectedStep.isTeaser,k=D.selectedStep.elements.find((function(e){return e.type===d.IMAGE_COLUMN})),N=S?R.backgroundSettings:D.backgroundSettings,L=S?R.windowSettings:D.windowSettings,j=S?R.closeSettings:D.closeSettings,U=N.allowScrollingWhenPopupOpen,B=_.isPreviewMode||M,H=!!B||D.isVisible;document.body.style.overflow=H&&!U?"hidden":"auto";var W=N.overlay,F=N.border,V="center",G="center";switch(S?o.POPUP:D.type){case o.POPUP:var z=S?R.position:D.position;z===i.POPUP_TOP_LEFT?(V="flex-start",G="flex-start"):z===i.POPUP_TOP_CENTER?(V="center",G="flex-start"):z===i.POPUP_TOP_RIGHT?(V="flex-end",G="flex-start"):z===i.POPUP_MIDDLE_LEFT?(V="flex-start",G="center"):z===i.POPUP_MIDDLE_CENTER?(V="center",G="center"):z===i.POPUP_MIDDLE_RIGHT?(V="flex-end",G="center"):z===i.POPUP_BOTTOM_LEFT?(V="flex-start",G="flex-end"):z===i.POPUP_BOTTOM_CENTER?(V="center",G="flex-end"):z===i.POPUP_BOTTOM_RIGHT&&(V="flex-end",G="flex-end");break;case o.DRAWER:D.position===i.DRAWER_LEFT?(V="flex-start",G="center"):D.position===i.DRAWER_RIGHT&&(V="flex-end",G="center");break;case o.NOTIFICATION_BAR:D.position===i.NOTIFICATION_BAR_UP?(V="center",G="flex-start"):D.position===i.NOTIFICATION_BAR_DOWN&&(V="center",G="flex-end")}var K={position:"fixed",display:"flex",justifyContent:V,alignItems:G,top:0,left:0,right:0,bottom:0,zIndex:9995,overflow:"hidden",padding:"".concat(L.outerVerticalPadding,"px ").concat(L.outerHorizontalPadding,"px"),opacity:H?1:0,visibility:H?"visible":"hidden",transition:"opacity 0.3s ease, visibility 0.3s ease"},X={position:"fixed",top:0,left:0,right:0,bottom:0,zIndex:9996,backgroundColor:W?W.bgColor:"",opacity:W?(W.bgOpacity||100)/100:void 0},Y={position:"relative",zIndex:9997,backgroundColor:N.bgColor,border:F?"".concat(F.borderWidth,"px ").concat(F.borderStyle," ").concat(F.borderColor):"",borderRadius:"".concat(L.borderRadius,"px"),maxWidth:"100%",maxHeight:"100%",width:L.takeFullWidth?"100%":void 0,minHeight:L.minHeight,height:L.takeFullHeight?"100%":void 0,boxShadow:N.shadow?"0 0 10px ".concat(N.shadow.color):"",overflow:"hidden",opacity:H?1:0,visibility:H?"visible":"hidden",transition:"opacity 0.3s ease, visibility 0.3s ease"},q="";switch(null==k?void 0:k.verticalAlignment){case a.BOTTOM:q="flex-end";break;case a.MIDDLE:q="center";break;case a.TOP:q="flex-start"}var J=k?k.imagePosition===g.LEFT_ALIGN?"row-reverse":"row":"",Q=k?k.mobilePosition===T.TOP?"column-reverse":"column":"",Z={display:"flex",flexDirection:k?A?Q:J:"column"},$={width:L.takeFullWidth?"100%":L.maxWidth,maxWidth:"100%",overflow:"auto",display:"flex",flexDirection:"column",justifyContent:q,padding:"".concat(L.innerVerticalPadding,"px ").concat(L.innerHorizontalPadding,"px")},ee={position:j.closeButtonPositionType===r.TAKE_SPACE?"relative":"absolute",float:j.closeButtonPositionType===r.TAKE_SPACE?"right":"none",top:8,right:8,zIndex:9998},te={position:"sticky",padding:"6px",marginLeft:j.closeButtonPositionType===r.TAKE_SPACE?"14px":void 0,display:"flex",justifyContent:"center",alignItems:"center",border:(null===(b=j.iconSettings)||void 0===b?void 0:b.type)===l.WITH_BORDER?"1px solid ".concat(null===(y=j.iconSettings)||void 0===y?void 0:y.color):"",borderRadius:"50%",backgroundColor:null===(O=j.iconSettings)||void 0===O?void 0:O.backgroundColor},oe={color:null===(I=j.iconSettings)||void 0===I?void 0:I.color,cursor:"pointer"},ie=function(t){var o=t.type,i=C&&C[o]&&C[o].length?C[o][0]:null,n=i&&_.marketingPopupViewModel?e.createElement(i,{element:t,marketingPopupViewModel:_.marketingPopupViewModel}):void 0;switch(o){case d.TEXT:return e.createElement(c,{element:t});case d.IMAGE:return e.createElement(P,{element:t,popup:_,editModeChildren:n});case d.IMAGE_COLUMN:return A&&k.mobilePosition===T.HIDE?null:e.createElement(x,{element:t,popup:_,editModeChildren:n});case d.BUTTON:return e.createElement(m,{element:t});case d.DIVIDER:return e.createElement(u,{element:t});case d.FORM:return e.createElement(v,{element:t,popup:_,isPreviewMode:!!B,sfProps:w});case d.PRODUCT_LIST:return e.createElement(E,{element:t,products:h.products[t.id],popup:_,editModeChildren:n,isPreviewMode:!!B});case d.SOCIAL_MEDIA:return e.createElement(f,{element:t,popup:_,editModeChildren:n});case d.SPACE:return e.createElement(p,{element:t})}},ne=function(){B||D.isVisible&&(D.isVisible=!1,w&&w.onModalClose())};return e.createElement("div",{className:"ikas-popup-default-styles",id:"ikas-popup-container",style:K},e.createElement("div",{style:Y},j.closeButtonDisplayType!==s.ALWAYS_HIDDEN&&e.createElement("div",{style:ee,onClick:function(){return ne()}},e.createElement("div",{style:te,className:j.closeButtonDisplayType===s.VISIBLE_ON_HOVER?"visible-on-hover":""},e.createElement(n,{style:oe}))),e.createElement("div",{style:Z,onClick:function(e){S&&(D.selectedStep=D.steps[0])}},e.createElement("div",{style:$},D.selectedStep.elements.filter((function(e){return e.type!==d.IMAGE_COLUMN})).slice().sort((function(e,t){return e.order-t.order})).map((function(e){return ie(e)}))),k&&ie(k))),e.createElement("div",{style:X,onClick:function(){return ne()}}))}));export{b as default};
1
+ import e from"react";import{observer as t}from"mobx-react";import{PopupTypeEnum as o,PopupPositonEnum as i}from"../models/modal/index.js";import n from"../assets/x-close.js";import{CloseButtonPositionTypeEnum as r,CloseIconTypeEnum as l,CloseButtonDisplayTypeEnum as s}from"../models/modal/close-settings/index.js";import{PopupElementTypeEnum as d,ComponentVerticalAlignmentEnum as a}from"../models/modal/step/elements/base/index.js";import c from"./text-element-renderer/index.js";import p from"./button-element-renderer/index.js";import m from"./space-element-renderer/index.js";import u from"./divider-element-renderer/index.js";import f from"./social-element-renderer/index.js";import P from"./image-element-renderer/index.js";import x from"./image-column-element-renderer/index.js";import E from"./product-list-renderer/index.js";import v from"./form-element-renderer/index.js";import{ImageColumnPositionEnum as g,MobileImageColumnPositionEnum as T}from"../models/modal/step/elements/image-column/index.js";var b=t((function(t){var b,y,O,I,_=t.popup,h=t.dynamicData,C=t.dashboardComponents,M=t.previewMode,w=t.sfProps,A=t.isMobile,D=_.modal,R=D.teaser,S=!!D.selectedStep.isTeaser,k=D.selectedStep.elements.find((function(e){return e.type===d.IMAGE_COLUMN})),N=S?R.backgroundSettings:D.backgroundSettings,L=S?R.windowSettings:D.windowSettings,j=S?R.closeSettings:D.closeSettings,U=N.allowScrollingWhenPopupOpen,B=_.isPreviewMode||M,H=!!B||D.isVisible;document.body.style.overflow=H&&!U?"hidden":"auto";var W=N.overlay,F=N.border,V="center",G="center";switch(S?o.POPUP:D.type){case o.POPUP:var z=S?R.position:D.position;z===i.POPUP_TOP_LEFT?(V="flex-start",G="flex-start"):z===i.POPUP_TOP_CENTER?(V="center",G="flex-start"):z===i.POPUP_TOP_RIGHT?(V="flex-end",G="flex-start"):z===i.POPUP_MIDDLE_LEFT?(V="flex-start",G="center"):z===i.POPUP_MIDDLE_CENTER?(V="center",G="center"):z===i.POPUP_MIDDLE_RIGHT?(V="flex-end",G="center"):z===i.POPUP_BOTTOM_LEFT?(V="flex-start",G="flex-end"):z===i.POPUP_BOTTOM_CENTER?(V="center",G="flex-end"):z===i.POPUP_BOTTOM_RIGHT&&(V="flex-end",G="flex-end");break;case o.DRAWER:D.position===i.DRAWER_LEFT?(V="flex-start",G="center"):D.position===i.DRAWER_RIGHT&&(V="flex-end",G="center");break;case o.NOTIFICATION_BAR:D.position===i.NOTIFICATION_BAR_UP?(V="center",G="flex-start"):D.position===i.NOTIFICATION_BAR_DOWN&&(V="center",G="flex-end")}var K={position:"fixed",display:"flex",justifyContent:V,alignItems:G,top:0,left:0,right:0,bottom:0,zIndex:9995,overflow:"hidden",padding:"".concat(L.outerVerticalPadding,"px ").concat(L.outerHorizontalPadding,"px"),opacity:H?1:0,visibility:H?"visible":"hidden",transition:"opacity 0.3s ease, visibility 0.3s ease"},X={position:"fixed",top:0,left:0,right:0,bottom:0,zIndex:9996,backgroundColor:W?W.bgColor:"",opacity:W?(W.bgOpacity||100)/100:void 0},Y={position:"relative",zIndex:9997,backgroundColor:N.bgColor,border:F?"".concat(F.borderWidth,"px ").concat(F.borderStyle," ").concat(F.borderColor):"",borderRadius:"".concat(L.borderRadius,"px"),maxWidth:"100%",maxHeight:"100%",width:L.takeFullWidth?"100%":void 0,minHeight:L.minHeight,height:L.takeFullHeight?"100%":void 0,boxShadow:N.shadow?"0 0 10px ".concat(N.shadow.color):"",overflow:"auto",opacity:H?1:0,visibility:H?"visible":"hidden",transition:"opacity 0.3s ease, visibility 0.3s ease"},q="";switch(null==k?void 0:k.verticalAlignment){case a.BOTTOM:q="flex-end";break;case a.MIDDLE:q="center";break;case a.TOP:q="flex-start"}var J=k?k.imagePosition===g.LEFT_ALIGN?"row-reverse":"row":"",Q=k?k.mobilePosition===T.TOP?"column-reverse":"column":"",Z={display:"flex",flexDirection:k?A?Q:J:"column"},$={width:L.takeFullWidth?"100%":L.maxWidth,maxWidth:"100%",overflow:"auto",display:"flex",flexDirection:"column",justifyContent:q,padding:"".concat(L.innerVerticalPadding,"px ").concat(L.innerHorizontalPadding,"px")},ee={position:j.closeButtonPositionType===r.TAKE_SPACE?"relative":"absolute",float:j.closeButtonPositionType===r.TAKE_SPACE?"right":"none",top:8,right:8,zIndex:9998},te={position:"sticky",padding:"6px",marginLeft:j.closeButtonPositionType===r.TAKE_SPACE?"14px":void 0,display:"flex",justifyContent:"center",alignItems:"center",border:(null===(b=j.iconSettings)||void 0===b?void 0:b.type)===l.WITH_BORDER?"1px solid ".concat(null===(y=j.iconSettings)||void 0===y?void 0:y.color):"",borderRadius:"50%",backgroundColor:null===(O=j.iconSettings)||void 0===O?void 0:O.backgroundColor},oe={color:null===(I=j.iconSettings)||void 0===I?void 0:I.color,cursor:"pointer"},ie=function(t){var o=t.type,i=C&&C[o]&&C[o].length?C[o][0]:null,n=i&&_.marketingPopupViewModel?e.createElement(i,{element:t,marketingPopupViewModel:_.marketingPopupViewModel}):void 0;switch(o){case d.TEXT:return e.createElement(c,{element:t});case d.IMAGE:return e.createElement(P,{element:t,popup:_,editModeChildren:n});case d.IMAGE_COLUMN:return A&&k.mobilePosition===T.HIDE?null:e.createElement(x,{element:t,popup:_,editModeChildren:n});case d.BUTTON:return e.createElement(p,{element:t});case d.DIVIDER:return e.createElement(u,{element:t});case d.FORM:return e.createElement(v,{element:t,popup:_,isPreviewMode:!!B,sfProps:w});case d.PRODUCT_LIST:return e.createElement(E,{element:t,products:h.products[t.id],popup:_,editModeChildren:n,isPreviewMode:!!B,sfProps:w});case d.SOCIAL_MEDIA:return e.createElement(f,{element:t,popup:_,editModeChildren:n});case d.SPACE:return e.createElement(m,{element:t})}},ne=function(){B||D.isVisible&&(D.isVisible=!1,w&&w.onModalClose())};return e.createElement("div",{className:"ikas-popup-default-styles",id:"ikas-popup-container",style:K},e.createElement("div",{style:Y},j.closeButtonDisplayType!==s.ALWAYS_HIDDEN&&e.createElement("div",{style:ee,onClick:function(){return ne()}},e.createElement("div",{style:te,className:j.closeButtonDisplayType===s.VISIBLE_ON_HOVER?"visible-on-hover":""},e.createElement(n,{style:oe}))),e.createElement("div",{style:Z,onClick:function(e){S&&(D.selectedStep=D.steps[0])}},e.createElement("div",{style:$},D.selectedStep.elements.filter((function(e){return e.type!==d.IMAGE_COLUMN})).slice().sort((function(e,t){return e.order-t.order})).map((function(e){return ie(e)}))),k&&ie(k))),e.createElement("div",{style:X,onClick:function(){return ne()}}))}));export{b as default};
@@ -2,12 +2,14 @@ import React from "react";
2
2
  import { ElementType } from "../../models/modal/step";
3
3
  import { PopupProduct } from "../../models/modal/step/elements/product";
4
4
  import { Popup } from "../../models";
5
+ import { SFProps } from "..";
5
6
  type Props = {
6
7
  element: ElementType;
7
8
  products: PopupProduct[];
8
9
  editModeChildren?: React.ReactElement;
9
10
  popup: Popup;
10
11
  isPreviewMode: boolean;
12
+ sfProps?: SFProps;
11
13
  };
12
14
  declare const ProductListElementRenderer: React.FC<Props>;
13
15
  export default ProductListElementRenderer;
@@ -1 +1 @@
1
- import{__spreadArray as t,__assign as e}from'./../../../ext/tslib/tslib.es6.mjs.js';import o from"react";import{observer as n}from"mobx-react";import{getHorizontalAlignment as i,injectFontScript as l}from"../../helpers/index.js";import{ProductListTypeEnum as r,ProductListLayoutEnum as d}from"../../models/modal/step/elements/product/index.js";import a from"../button-element-renderer/index.js";import{Navigation as c,Scrollbar as u}from"swiper/modules";import{Swiper as s,SwiperSlide as v}from"swiper/react";import m from"../../assets/left-arrow.js";import g from"../../assets/right-arrow.js";var p=n((function(n){var p,f=n.element,b=n.products,h=n.popup,x=n.editModeChildren,y=n.isPreviewMode,E=o.useState(null),C=E[0],w=E[1],P=o.useState(!1),S=P[0],R=P[1],z=o.useState(!1),W=z[0],I=z[1],j=f,k=[];if(b&&(k=j.listType===r.SPECIFIC?(null===(p=j.variantPairs)||void 0===p?void 0:p.length)?b.slice().sort((function(t,e){return j.variantPairs.findIndex((function(e){return e.variantId===t.variantId}))-j.variantPairs.findIndex((function(t){return t.variantId===e.variantId}))})):[]:t([],b,!0)),k.length>j.maxProductsToShow&&(k.length=j.maxProductsToShow),!(k&&k.length||!h.isPreviewMode)&&x)return x;if(!k||!k.length)return null;j.gapBetweenProductElements;var F=j.productDetailSettings.image,D=j.productDetailSettings.button,A=j.buttonSettings,N=j.productDetailSettings.discountRatio,B=j.productDetailSettings.finalPrice,M=j.productDetailSettings.originalPrice,L=j.productDetailSettings.name,O=i(j.horizontalAlignment),T=1;j.layout===d.ONE_COLUMN?T=1:j.layout===d.TWO_COLUMN?T=2:j.layout===d.THREE_COLUMN&&(T=3);var U={padding:"".concat(j.outerVerticalPadding,"px ").concat(j.outerHorizontalPadding,"px"),backgroundColor:j.productBgColor,width:"100%",height:"max-content"},_={display:"flex",flexDirection:"column",justifyContent:"space-between",alignItems:"center",height:"100%"},H={display:"flex",justifyContent:O,alignItems:"center",width:"100%",backgroundColor:null==F?void 0:F.bgColor,borderRadius:(null==F?void 0:F.borderRadius)?"".concat(F.borderRadius,"px"):void 0},V={width:"".concat(null==F?void 0:F.maxWidth,"%"),objectFit:"contain",borderRadius:(null==F?void 0:F.borderRadius)?"".concat(F.borderRadius,"px"):void 0},$={display:"flex",flexDirection:"column",width:"100%"},q={display:"flex",flexDirection:"column"},G={backgroundColor:null==L?void 0:L.bgColor,color:null==L?void 0:L.color,fontFamily:L?l(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},J={backgroundColor:null==N?void 0:N.bgColor,color:null==N?void 0:N.color,fontFamily:N?l(N.fontFamily):void 0,fontSize:null==N?void 0:N.fontSize,fontWeight:null==N?void 0:N.fontWeight,padding:"".concat(null==N?void 0:N.verticalPadding,"px ").concat(null==N?void 0:N.horizontalPadding,"px"),width:"100%",textAlign:null==N?void 0:N.horizontalAlignment,border:"".concat(null==N?void 0:N.borderWidth,"px ").concat(null==N?void 0:N.borderStyle," ").concat(null==N?void 0:N.borderColor),borderRadius:null==N?void 0:N.borderRadius},K={textDecoration:"line-through",backgroundColor:null==M?void 0:M.bgColor,color:null==M?void 0:M.color,fontFamily:M?l(M.fontFamily):void 0,fontSize:null==M?void 0:M.fontSize,fontWeight:null==M?void 0:M.fontWeight,padding:"".concat(null==M?void 0:M.verticalPadding,"px ").concat(null==M?void 0:M.horizontalPadding,"px"),width:"100%",textAlign:null==M?void 0:M.horizontalAlignment,border:"".concat(null==M?void 0:M.borderWidth,"px ").concat(null==M?void 0:M.borderStyle," ").concat(null==M?void 0:M.borderColor),borderRadius:null==M?void 0:M.borderRadius},Q={backgroundColor:null==B?void 0:B.bgColor,color:null==B?void 0:B.color,fontFamily:B?l(B.fontFamily):void 0,fontSize:null==B?void 0:B.fontSize,fontWeight:null==B?void 0:B.fontWeight,padding:"".concat(null==B?void 0:B.verticalPadding,"px ").concat(null==B?void 0:B.horizontalPadding,"px"),width:"100%",textAlign:null==B?void 0:B.horizontalAlignment,border:"".concat(null==B?void 0:B.borderWidth,"px ").concat(null==B?void 0:B.borderStyle," ").concat(null==B?void 0:B.borderColor),borderRadius:null==B?void 0:B.borderRadius},X={width:"".concat(A.width,"%"),minWidth:"fit-content"},Y=e({display:"flex",justifyContent:"center",width:"100%",gap:"10px"},1===T?{position:"absolute",top:0,left:0,right:0,bottom:0,alignItems:"center",justifyContent:"space-between",zIndex:10}:void 0),Z={padding:10,display:"flex",justifyContent:"center",alignItems:"center",borderRadius:"100%",border:"1px solid #EEF2F6",cursor:"pointer"};return o.createElement("div",{style:U},o.createElement(s,{onSwiper:w,modules:[c,u],spaceBetween:j.gapBetweenProducts,slidesPerView:T,navigation:{nextEl:".custom-next-button",prevEl:".custom-prev-button"},scrollbar:void 0},k.map((function(t,e){return o.createElement(v,{style:{height:"auto"},key:t.variantId},o.createElement("div",{style:_,onClick:function(){return function(t){if(!y&&t.url){var e=document.createElement("a");e.href=t.url,e.target="_blank",e.click()}}(t)}},o.createElement("div",{style:$},!!F&&t.imageURL&&o.createElement("div",{style:H},o.createElement("img",{src:t.imageURL||void 0,alt:t.name||void 0,style:V})),(!!L||!!N)&&o.createElement("div",{style:q},!!L&&o.createElement("div",{style:G},t.name),!!N&&!!t.discountPrice&&o.createElement("div",{style:J},t.$discountRatio)),(!!M||!!B)&&o.createElement("div",null,!!M&&!!t.discountPrice&&o.createElement("div",{style:K},t.price),!!B&&o.createElement("div",{style:Q},t.discountPrice||t.price))),!!D&&o.createElement("div",{style:X}," ",o.createElement(a,{element:A})," ")))})),o.createElement("div",{style:Y},o.createElement("div",{className:"custom-prev-button",style:e(e({},Z),S?{opacity:.5,cursor:"not-allowed"}:{}),onClick:function(){C&&(C.slidePrev(),I(C.isEnd),R(C.isBeginning))}},o.createElement(m,null)),o.createElement("div",{className:"custom-next-button",style:e(e({},Z),W?{opacity:.5,cursor:"not-allowed"}:{}),onClick:function(){C&&(C.slideNext(),I(C.isEnd),R(C.isBeginning))}},o.createElement(g,null)))))}));export{p as default};
1
+ import{__spreadArray as t,__assign as e}from'./../../../ext/tslib/tslib.es6.mjs.js';import o from"react";import{observer as i}from"mobx-react";import{getHorizontalAlignment as n,injectFontScript as l}from"../../helpers/index.js";import{ProductListTypeEnum as r,ProductListLayoutEnum as d}from"../../models/modal/step/elements/product/index.js";import a from"../button-element-renderer/index.js";import{Navigation as c,Scrollbar as u}from"swiper/modules";import{Swiper as s,SwiperSlide as v}from"swiper/react";import m from"../../assets/left-arrow.js";import g from"../../assets/right-arrow.js";import{ProductActionTypeEnum as p}from"../../models/modal/step/elements/product/detail-settings/index.js";var f=i((function(i){var f,b=i.element,h=i.products,x=i.popup,y=i.editModeChildren,C=i.isPreviewMode,E=i.sfProps,P=o.useState(null),w=P[0],S=P[1],R=o.useState(!1),z=R[0],W=R[1],j=o.useState(!1),I=j[0],D=j[1],k=b,F=[];if(h&&(F=k.listType===r.SPECIFIC?(null===(f=k.variantPairs)||void 0===f?void 0:f.length)?h.slice().sort((function(t,e){return k.variantPairs.findIndex((function(e){return e.variantId===t.variantId}))-k.variantPairs.findIndex((function(t){return t.variantId===e.variantId}))})):[]:t([],h,!0)),F.length>k.maxProductsToShow&&(F.length=k.maxProductsToShow),!(F&&F.length||!x.isPreviewMode)&&y)return y;if(!F||!F.length)return null;k.gapBetweenProductElements;var A=k.productDetailSettings.image,T=k.productDetailSettings.button,N=k.buttonSettings,_=k.productDetailSettings.discountRatio,B=k.productDetailSettings.finalPrice,M=k.productDetailSettings.originalPrice,O=k.productDetailSettings.name,L=n(k.horizontalAlignment),U=1;k.layout===d.ONE_COLUMN?U=1:k.layout===d.TWO_COLUMN?U=2:k.layout===d.THREE_COLUMN&&(U=3);var H={padding:"".concat(k.outerVerticalPadding,"px ").concat(k.outerHorizontalPadding,"px"),backgroundColor:k.productBgColor,width:"100%",height:"max-content"},V={display:"flex",flexDirection:"column",justifyContent:"space-between",alignItems:"center",height:"100%"},$={display:"flex",justifyContent:L,alignItems:"center",width:"100%",backgroundColor:null==A?void 0:A.bgColor,borderRadius:(null==A?void 0:A.borderRadius)?"".concat(A.borderRadius,"px"):void 0},q={width:"".concat(null==A?void 0:A.maxWidth,"%"),objectFit:"contain",borderRadius:(null==A?void 0:A.borderRadius)?"".concat(A.borderRadius,"px"):void 0},G={display:"flex",flexDirection:"column",width:"100%"},J={display:"flex",flexDirection:"column"},K={backgroundColor:null==O?void 0:O.bgColor,color:null==O?void 0:O.color,fontFamily:O?l(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},Q={backgroundColor:null==_?void 0:_.bgColor,color:null==_?void 0:_.color,fontFamily:_?l(_.fontFamily):void 0,fontSize:null==_?void 0:_.fontSize,fontWeight:null==_?void 0:_.fontWeight,padding:"".concat(null==_?void 0:_.verticalPadding,"px ").concat(null==_?void 0:_.horizontalPadding,"px"),width:"100%",textAlign:null==_?void 0:_.horizontalAlignment,border:"".concat(null==_?void 0:_.borderWidth,"px ").concat(null==_?void 0:_.borderStyle," ").concat(null==_?void 0:_.borderColor),borderRadius:null==_?void 0:_.borderRadius},X={textDecoration:"line-through",backgroundColor:null==M?void 0:M.bgColor,color:null==M?void 0:M.color,fontFamily:M?l(M.fontFamily):void 0,fontSize:null==M?void 0:M.fontSize,fontWeight:null==M?void 0:M.fontWeight,padding:"".concat(null==M?void 0:M.verticalPadding,"px ").concat(null==M?void 0:M.horizontalPadding,"px"),width:"100%",textAlign:null==M?void 0:M.horizontalAlignment,border:"".concat(null==M?void 0:M.borderWidth,"px ").concat(null==M?void 0:M.borderStyle," ").concat(null==M?void 0:M.borderColor),borderRadius:null==M?void 0:M.borderRadius},Y={backgroundColor:null==B?void 0:B.bgColor,color:null==B?void 0:B.color,fontFamily:B?l(B.fontFamily):void 0,fontSize:null==B?void 0:B.fontSize,fontWeight:null==B?void 0:B.fontWeight,padding:"".concat(null==B?void 0:B.verticalPadding,"px ").concat(null==B?void 0:B.horizontalPadding,"px"),width:"100%",textAlign:null==B?void 0:B.horizontalAlignment,border:"".concat(null==B?void 0:B.borderWidth,"px ").concat(null==B?void 0:B.borderStyle," ").concat(null==B?void 0:B.borderColor),borderRadius:null==B?void 0:B.borderRadius},Z={width:"".concat(N.width,"%"),minWidth:"fit-content"},tt=e({display:"flex",justifyContent:"center",width:"100%",gap:"10px"},1===U?{position:"absolute",top:0,left:0,right:0,bottom:0,alignItems:"center",justifyContent:"space-between",zIndex:10}:void 0),et={padding:10,display:"flex",justifyContent:"center",alignItems:"center",borderRadius:"100%",border:"1px solid #EEF2F6",cursor:"pointer"};return o.createElement("div",{style:H},o.createElement(s,{onSwiper:S,modules:[c,u],spaceBetween:k.gapBetweenProducts,slidesPerView:U,navigation:{nextEl:".custom-next-button",prevEl:".custom-prev-button"},scrollbar:void 0},F.map((function(t,e){return o.createElement(v,{style:{height:"auto"},key:t.variantId},o.createElement("div",{style:V,onClick:function(){return function(t){var e;if(!C&&t.url)if((null===(e=k.productDetailSettings.button)||void 0===e?void 0:e.action)===p.ADD_TO_CART&&E)E.addProductToCart(t);else{var o=document.createElement("a");o.href=t.url,o.target="_blank",o.click()}}(t)}},o.createElement("div",{style:G},!!A&&t.imageURL&&o.createElement("div",{style:$},o.createElement("img",{src:t.imageURL||void 0,alt:t.name||void 0,style:q})),(!!O||!!_)&&o.createElement("div",{style:J},!!O&&o.createElement("div",{style:K},t.name),!!_&&!!t.discountPrice&&o.createElement("div",{style:Q},t.$discountRatio)),(!!M||!!B)&&o.createElement("div",null,!!M&&!!t.discountPrice&&o.createElement("div",{style:X},t.price),!!B&&o.createElement("div",{style:Y},t.discountPrice||t.price))),!!T&&o.createElement("div",{style:Z}," ",o.createElement(a,{element:N})," ")))})),o.createElement("div",{style:tt},o.createElement("div",{className:"custom-prev-button",style:e(e({},et),z?{opacity:.5,cursor:"not-allowed"}:{}),onClick:function(){w&&(w.slidePrev(),D(w.isEnd),W(w.isBeginning))}},o.createElement(m,null)),o.createElement("div",{className:"custom-next-button",style:e(e({},et),I?{opacity:.5,cursor:"not-allowed"}:{}),onClick:function(){w&&(w.slideNext(),D(w.isEnd),W(w.isBeginning))}},o.createElement(g,null)))))}));export{f as default};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ikas/popup-renderer",
3
- "version": "1.0.138",
3
+ "version": "1.0.140",
4
4
  "description": "",
5
5
  "author": "ucy",
6
6
  "license": "ISC",