@ikas/popup-renderer 1.0.233 → 1.0.234

package/build/popup-renderer/assets/x-circle.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+type Props = {
+    className?: string;
+    style?: React.CSSProperties;
+};
+declare const XCircle: React.FC<Props>;
+export default XCircle;

package/build/popup-renderer/assets/x-circle.js

@@ -0,0 +1 @@
+import e from"react";var t=function(t){var r=t.className,l=t.style;return e.createElement("svg",{className:"icon "+(r||""),width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",style:l},e.createElement("g",{clipPath:"url(#clip0_x_circle)"},e.createElement("path",{d:"M10 6L6 10M6 6L10 10M14.6667 8C14.6667 11.6819 11.6819 14.6667 8 14.6667C4.3181 14.6667 1.33333 11.6819 1.33333 8C1.33333 4.3181 4.3181 1.33333 8 1.33333C11.6819 1.33333 14.6667 4.3181 14.6667 8Z",stroke:"currentColor",strokeWidth:"1.4",strokeLinecap:"round",strokeLinejoin:"round"})),e.createElement("defs",null,e.createElement("clipPath",{id:"clip0_x_circle"},e.createElement("rect",{width:"16",height:"16",fill:"white"}))))};export{t as default};

package/build/popup-renderer/components/index.js

@@ -1 +1 @@
-import e from"react";import{observer as t}from"mobx-react";import{PopupTypeEnum as o,PopupPositonEnum as n}from"../models/modal/index.js";import i 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 x from"./image-element-renderer/index.js";import P from"./image-column-element-renderer/index.js";import v from"./product-list-renderer/index.js";import E from"./form-element-renderer/index.js";import{ImageColumnPositionEnum as g,MobileImageColumnPositionEnum as b}from"../models/modal/step/elements/image-column/index.js";import{ButtonBorderStyle as y}from"../models/modal/background-settings/index.js";var T=t(function(t){var T,O,C,I,h,_,M,S,w,A=t.popup,D=t.dynamicData,R=t.dashboardComponents,k=t.previewMode,L=t.sfProps,N=t.isMobile,j=e.useState(!1),B=j[0],U=j[1],W=A.modal,H=W.teaser,F=!!W.selectedStep.isTeaser,V=W.selectedStep.elements.find(function(e){return e.type===d.IMAGE_COLUMN}),G=F?H.backgroundSettings:W.backgroundSettings,z=F?H.windowSettings:W.windowSettings,K=F?H.closeSettings:W.closeSettings,X=G.allowScrollingWhenPopupOpen,Y=A.isPreviewMode||k,q=!!Y||W.isVisible;e.useEffect(function(){return document.body.style.overflow=q&&!X?"hidden":"auto",function(){document.body.style.overflow="auto"}},[q,X]);var J=G.overlay,Q=G.border,Z="center",$="center";switch(F?o.POPUP:W.type){case o.POPUP:var ee=F?H.position:W.position;ee===n.POPUP_TOP_LEFT?(Z="flex-start",$="flex-start"):ee===n.POPUP_TOP_CENTER?(Z="center",$="flex-start"):ee===n.POPUP_TOP_RIGHT?(Z="flex-end",$="flex-start"):ee===n.POPUP_MIDDLE_LEFT?(Z="flex-start",$="center"):ee===n.POPUP_MIDDLE_CENTER?(Z="center",$="center"):ee===n.POPUP_MIDDLE_RIGHT?(Z="flex-end",$="center"):ee===n.POPUP_BOTTOM_LEFT?(Z="flex-start",$="flex-end"):ee===n.POPUP_BOTTOM_CENTER?(Z="center",$="flex-end"):ee===n.POPUP_BOTTOM_RIGHT&&(Z="flex-end",$="flex-end");break;case o.DRAWER:W.position===n.DRAWER_LEFT?(Z="flex-start",$="center"):W.position===n.DRAWER_RIGHT&&(Z="flex-end",$="center");break;case o.NOTIFICATION_BAR:W.position===n.NOTIFICATION_BAR_UP?(Z="center",$="flex-start"):W.position===n.NOTIFICATION_BAR_DOWN&&(Z="center",$="flex-end")}var te=e.useMemo(function(){return 2147483644},[]),oe=e.useMemo(function(){return te+1},[]),ne=e.useMemo(function(){return oe+1},[]),ie=e.useMemo(function(){return ne+1},[]),re={position:"fixed",display:"flex",justifyContent:Z,alignItems:$,top:0,left:0,right:0,bottom:0,zIndex:te,overflow:"hidden",padding:"".concat(z.outerVerticalPadding,"px ").concat(z.outerHorizontalPadding,"px"),opacity:q?1:0,visibility:q?"visible":"hidden",transition:"opacity 0.3s ease, visibility 0.3s ease"},le={position:"fixed",top:0,left:0,right:0,bottom:0,zIndex:oe,backgroundColor:J?J.bgColor:"",opacity:J?(J.bgOpacity||100)/100:void 0},se={position:"relative",zIndex:ne,backgroundColor:G.bgColor,border:Q?"".concat(Q.borderWidth,"px ").concat(Q.borderStyle," ").concat(Q.borderColor):"",borderRadius:"".concat(z.borderRadius,"px"),maxWidth:"100%",maxHeight:"100%",width:z.takeFullWidth?"100%":void 0,minHeight:z.minHeight,height:z.takeFullHeight?"100%":void 0,boxShadow:G.shadow?"0 0 10px ".concat(G.shadow.color):"",overflow:"auto",opacity:q?1:0,visibility:q?"visible":"hidden",transition:"opacity 0.3s ease, visibility 0.3s ease"},de="";switch(null==V?void 0:V.verticalAlignment){case a.BOTTOM:de="flex-end";break;case a.MIDDLE:de="center";break;case a.TOP:de="flex-start"}var ae=V?V.imagePosition===g.LEFT_ALIGN?"row-reverse":"row":"",ce=V?V.mobilePosition===b.TOP?"column-reverse":"column":"",me={display:"flex",flexDirection:V?N?ce:ae:"column",overflow:"hidden"},pe={width:z.takeFullWidth?"100%":z.maxWidth,maxWidth:"100%",overflow:"auto",display:"flex",flexDirection:"column",justifyContent:de,padding:"".concat(z.innerVerticalPadding,"px ").concat(z.innerHorizontalPadding,"px")},ue={position:K.closeButtonPositionType===r.TAKE_SPACE?"relative":"absolute",float:K.closeButtonPositionType===r.TAKE_SPACE?"right":"none",top:8,right:8,zIndex:ie},fe="".concat(null!==(O=null===(T=K.iconSettings)||void 0===T?void 0:T.borderRadius)&&void 0!==O?O:50,"px"),xe=null!==(I=null===(C=K.iconSettings)||void 0===C?void 0:C.borderWidth)&&void 0!==I?I:0,Pe=null===(h=K.iconSettings)||void 0===h?void 0:h.borderColor,ve=(null===(_=K.iconSettings)||void 0===_?void 0:_.borderStyle)||y.SOLID,Ee={position:"sticky",padding:"6px",marginLeft:K.closeButtonPositionType===r.TAKE_SPACE?"14px":void 0,display:"flex",justifyContent:"center",alignItems:"center",border:(null===(M=K.iconSettings)||void 0===M?void 0:M.type)===l.WITH_BORDER?"".concat(xe,"px ").concat(ve," ").concat(Pe):"",borderRadius:fe,backgroundColor:null===(S=K.iconSettings)||void 0===S?void 0:S.backgroundColor},ge={color:null===(w=K.iconSettings)||void 0===w?void 0:w.color,cursor:"pointer"},be=function(t){var o=t.type,n=R&&R[o]&&R[o].length?R[o][0]:null,i=n&&A.marketingPopupViewModel?e.createElement(n,{element:t,marketingPopupViewModel:A.marketingPopupViewModel}):void 0;switch(o){case d.TEXT:return e.createElement(c,{element:t});case d.IMAGE:return e.createElement(x,{element:t,popup:A,editModeChildren:i});case d.IMAGE_COLUMN:return N&&V.mobilePosition===b.HIDE?null:e.createElement(P,{element:t,popup:A,editModeChildren:i,isMobile:N});case d.BUTTON:return e.createElement(m,{element:t,onClose:ye,isStandaloneButtonComponent:!0});case d.DIVIDER:return e.createElement(u,{element:t});case d.FORM:return e.createElement(E,{element:t,popup:A,isPreviewMode:!!Y,sfProps:L,setIsCustomerSaved:U});case d.PRODUCT_LIST:return e.createElement(v,{element:t,products:D.products[t.id],popup:A,editModeChildren:i,isPreviewMode:!!Y,sfProps:L,onClose:ye});case d.SOCIAL_MEDIA:return e.createElement(f,{element:t,popup:A,editModeChildren:i});case d.SPACE:return e.createElement(p,{element:t})}},ye=function(e){if(!Y&&W.isVisible){var t=B||e;W.isVisible=!1,L&&L.onModalClose(t),U(!1)}};return e.createElement("div",{className:"ikas-popup-default-styles",id:"ikas-popup-container",style:re},e.createElement("div",{style:se},K.closeButtonDisplayType!==s.ALWAYS_HIDDEN&&e.createElement("div",{style:ue,onClick:function(){return ye()}},e.createElement("div",{style:Ee,className:K.closeButtonDisplayType===s.VISIBLE_ON_HOVER?"visible-on-hover":""},e.createElement(i,{style:ge}))),e.createElement("div",{style:me,onClick:function(e){F&&(W.selectedStep=W.steps[0])}},e.createElement("div",{style:pe},W.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 be(e)})),V&&be(V))),e.createElement("div",{style:le,onClick:function(){K.closeOnlyWithCloseButton||ye()}}))});export{T as default};
+import e from"react";import{observer as t}from"mobx-react";import{PopupTypeEnum as o,PopupPositonEnum as n}from"../models/modal/index.js";import i from"../assets/x-close.js";import r from"../assets/x-circle.js";import{CloseButtonPositionTypeEnum as l,CloseButtonDisplayTypeEnum as s,CloseIconTypeEnum as d}from"../models/modal/close-settings/index.js";import{PopupElementTypeEnum as a,ComponentVerticalAlignmentEnum as c}from"../models/modal/step/elements/base/index.js";import m from"./text-element-renderer/index.js";import p from"./button-element-renderer/index.js";import u from"./space-element-renderer/index.js";import f from"./divider-element-renderer/index.js";import v from"./social-element-renderer/index.js";import x from"./image-element-renderer/index.js";import P from"./image-column-element-renderer/index.js";import E from"./product-list-renderer/index.js";import g from"./form-element-renderer/index.js";import{ImageColumnPositionEnum as b,MobileImageColumnPositionEnum as y}from"../models/modal/step/elements/image-column/index.js";import{ButtonBorderStyle as T}from"../models/modal/background-settings/index.js";var O=t(function(t){var O,C,I,h,_,M,S,w,A,D,R=t.popup,k=t.dynamicData,j=t.dashboardComponents,L=t.previewMode,N=t.sfProps,B=t.isMobile,U=e.useState(!1),W=U[0],H=U[1],F=R.modal,V=F.teaser,G=!!F.selectedStep.isTeaser,z=F.selectedStep.elements.find(function(e){return e.type===a.IMAGE_COLUMN}),K=G?V.backgroundSettings:F.backgroundSettings,X=G?V.windowSettings:F.windowSettings,Y=G?V.closeSettings:F.closeSettings,q=K.allowScrollingWhenPopupOpen,J=R.isPreviewMode||L,Q=!!J||F.isVisible;e.useEffect(function(){return document.body.style.overflow=Q&&!q?"hidden":"auto",function(){document.body.style.overflow="auto"}},[Q,q]);var Z=K.overlay,$=K.border,ee="center",te="center";switch(G?o.POPUP:F.type){case o.POPUP:var oe=G?V.position:F.position;oe===n.POPUP_TOP_LEFT?(ee="flex-start",te="flex-start"):oe===n.POPUP_TOP_CENTER?(ee="center",te="flex-start"):oe===n.POPUP_TOP_RIGHT?(ee="flex-end",te="flex-start"):oe===n.POPUP_MIDDLE_LEFT?(ee="flex-start",te="center"):oe===n.POPUP_MIDDLE_CENTER?(ee="center",te="center"):oe===n.POPUP_MIDDLE_RIGHT?(ee="flex-end",te="center"):oe===n.POPUP_BOTTOM_LEFT?(ee="flex-start",te="flex-end"):oe===n.POPUP_BOTTOM_CENTER?(ee="center",te="flex-end"):oe===n.POPUP_BOTTOM_RIGHT&&(ee="flex-end",te="flex-end");break;case o.DRAWER:F.position===n.DRAWER_LEFT?(ee="flex-start",te="center"):F.position===n.DRAWER_RIGHT&&(ee="flex-end",te="center");break;case o.NOTIFICATION_BAR:F.position===n.NOTIFICATION_BAR_UP?(ee="center",te="flex-start"):F.position===n.NOTIFICATION_BAR_DOWN&&(ee="center",te="flex-end")}var ne=e.useMemo(function(){return 2147483644},[]),ie=e.useMemo(function(){return ne+1},[]),re=e.useMemo(function(){return ie+1},[]),le=e.useMemo(function(){return re+1},[]),se={position:"fixed",display:"flex",justifyContent:ee,alignItems:te,top:0,left:0,right:0,bottom:0,zIndex:ne,overflow:"hidden",padding:"".concat(X.outerVerticalPadding,"px ").concat(X.outerHorizontalPadding,"px"),opacity:Q?1:0,visibility:Q?"visible":"hidden",transition:"opacity 0.3s ease, visibility 0.3s ease"},de={position:"fixed",top:0,left:0,right:0,bottom:0,zIndex:ie,backgroundColor:Z?Z.bgColor:"",opacity:Z?(Z.bgOpacity||100)/100:void 0},ae={position:"relative",zIndex:re,backgroundColor:K.bgColor,border:$?"".concat($.borderWidth,"px ").concat($.borderStyle," ").concat($.borderColor):"",borderRadius:"".concat(X.borderRadius,"px"),maxWidth:"100%",maxHeight:"100%",width:X.takeFullWidth?"100%":void 0,minHeight:X.minHeight,height:X.takeFullHeight?"100%":void 0,boxShadow:K.shadow?"0 0 10px ".concat(K.shadow.color):"",overflow:"auto",opacity:Q?1:0,visibility:Q?"visible":"hidden",transition:"opacity 0.3s ease, visibility 0.3s ease"},ce="";switch(null==z?void 0:z.verticalAlignment){case c.BOTTOM:ce="flex-end";break;case c.MIDDLE:ce="center";break;case c.TOP:ce="flex-start"}var me=z?z.imagePosition===b.LEFT_ALIGN?"row-reverse":"row":"",pe=z?z.mobilePosition===y.TOP?"column-reverse":"column":"",ue={display:"flex",flexDirection:z?B?pe:me:"column",overflow:"hidden"},fe={width:X.takeFullWidth?"100%":X.maxWidth,maxWidth:"100%",overflow:"auto",display:"flex",flexDirection:"column",justifyContent:ce,padding:"".concat(X.innerVerticalPadding,"px ").concat(X.innerHorizontalPadding,"px")},ve={position:Y.closeButtonPositionType===l.TAKE_SPACE?"relative":"absolute",float:Y.closeButtonPositionType===l.TAKE_SPACE?"right":"none",top:8,right:8,zIndex:le},xe="".concat(null!==(C=null===(O=Y.iconSettings)||void 0===O?void 0:O.borderRadius)&&void 0!==C?C:50,"px"),Pe=null!==(h=null===(I=Y.iconSettings)||void 0===I?void 0:I.borderWidth)&&void 0!==h?h:0,Ee=(null===(_=Y.iconSettings)||void 0===_?void 0:_.borderColor)||(null===(M=Y.iconSettings)||void 0===M?void 0:M.color)||"",ge=(null===(S=Y.iconSettings)||void 0===S?void 0:S.borderStyle)||T.SOLID,be={position:"sticky",padding:"6px",marginLeft:Y.closeButtonPositionType===l.TAKE_SPACE?"14px":void 0,display:"flex",justifyContent:"center",alignItems:"center",border:Pe>0?"".concat(Pe,"px ").concat(ge," ").concat(Ee):"",borderRadius:xe,backgroundColor:null===(w=Y.iconSettings)||void 0===w?void 0:w.backgroundColor},ye={color:null===(A=Y.iconSettings)||void 0===A?void 0:A.color,cursor:"pointer"},Te=function(t){var o=t.type,n=j&&j[o]&&j[o].length?j[o][0]:null,i=n&&R.marketingPopupViewModel?e.createElement(n,{element:t,marketingPopupViewModel:R.marketingPopupViewModel}):void 0;switch(o){case a.TEXT:return e.createElement(m,{element:t});case a.IMAGE:return e.createElement(x,{element:t,popup:R,editModeChildren:i});case a.IMAGE_COLUMN:return B&&z.mobilePosition===y.HIDE?null:e.createElement(P,{element:t,popup:R,editModeChildren:i,isMobile:B});case a.BUTTON:return e.createElement(p,{element:t,onClose:Oe,isStandaloneButtonComponent:!0});case a.DIVIDER:return e.createElement(f,{element:t});case a.FORM:return e.createElement(g,{element:t,popup:R,isPreviewMode:!!J,sfProps:N,setIsCustomerSaved:H});case a.PRODUCT_LIST:return e.createElement(E,{element:t,products:k.products[t.id],popup:R,editModeChildren:i,isPreviewMode:!!J,sfProps:N,onClose:Oe});case a.SOCIAL_MEDIA:return e.createElement(v,{element:t,popup:R,editModeChildren:i});case a.SPACE:return e.createElement(u,{element:t})}},Oe=function(e){if(!J&&F.isVisible){var t=W||e;F.isVisible=!1,N&&N.onModalClose(t),H(!1)}};return e.createElement("div",{className:"ikas-popup-default-styles",id:"ikas-popup-container",style:se},e.createElement("div",{style:ae},Y.closeButtonDisplayType!==s.ALWAYS_HIDDEN&&e.createElement("div",{style:ve,onClick:function(){return Oe()}},e.createElement("div",{style:be,className:Y.closeButtonDisplayType===s.VISIBLE_ON_HOVER?"visible-on-hover":""},(null===(D=Y.iconSettings)||void 0===D?void 0:D.type)===d.WITH_BORDER?e.createElement(r,{style:ye}):e.createElement(i,{style:ye}))),e.createElement("div",{style:ue,onClick:function(e){G&&(F.selectedStep=F.steps[0])}},e.createElement("div",{style:fe},F.selectedStep.elements.filter(function(e){return e.type!==a.IMAGE_COLUMN}).slice().sort(function(e,t){return e.order-t.order}).map(function(e){return Te(e)})),z&&Te(z))),e.createElement("div",{style:de,onClick:function(){Y.closeOnlyWithCloseButton||Oe()}}))});export{O as default};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ikas/popup-renderer",
-  "version": "1.0.233",
+  "version": "1.0.234",
   "description": "",
   "author": "ucy",
   "license": "ISC",