@ikas/popup-renderer
Advanced tools
Comparing version 1.0.0 to 1.0.1
import React from "react"; | ||
import { ElementType } from "../../models/modal/step"; | ||
import { Popup } from "popup-renderer/models"; | ||
type Props = { | ||
element: ElementType; | ||
popup: Popup; | ||
isPreviewMode: boolean; | ||
}; | ||
declare const FormElementRenderer: React.FC<Props>; | ||
export default FormElementRenderer; |
@@ -1,1 +0,1 @@ | ||
import e from"react";import'./../../../ext/mobx-react-lite/es/index.js';import{getHorizontalAlignment as t}from"../../helpers/index.js";import{FormItemTypeEnum as n}from"../../models/modal/step/elements/form/index.js";import r from"../button-element-renderer/index.js";import o from"./input-item-view/index.js";import{CheckboxItemView as i}from"./checkbox-item-view/index.js";import{observer as a}from'./../../../ext/mobx-react-lite/es/observer.js';var l=a((function(a){var l=a.element,c=l.rows.slice().sort((function(e,t){return e.order-t.order})),m=l.formSettings,s=l.buttonSettings,d=l.bgColor,u={display:"flex",flexDirection:"column",alignItems:"center",justifyContent:t(l.horizontalAlignment),gap:"".concat(m.gapBetweenItems,"px"),padding:"".concat(l.verticalPadding,"px ").concat(l.horizontalPadding,"px"),backgroundColor:d,width:"100%"},p={display:"flex",flexDirection:"row",width:"100%",gap:"".concat(m.gapBetweenItems,"px")},f={flex:1,display:"flex",alignItems:"flex-end"},x={width:"".concat(s.width,"%"),minWidth:"fit-content"};return e.createElement("div",{style:u},c.map((function(t,r){return e.createElement("div",{style:p,key:r},t.columns.slice().sort((function(e,t){return e.order-t.order})).map((function(t,r){return e.createElement("div",{style:f,key:r},function(t){switch(t.type){case n.CUSTOMER_BIRTHDAY:case n.CUSTOMER_EMAIL:case n.CUSTOMER_GENDER:case n.CUSTOMER_PHONE:case n.CUSTOMER_NAME:case n.CUSTOMER_SURNAME:var r=t.formItem;return e.createElement(o,{formInputSettings:m.formInputSettings,inputLabel:r.inputLabel,isRequired:r.required,onValueChange:function(e){return r.value=e},placeholder:r.placeholder,updateCurrentInfo:r.updateCurrentInfo,value:r.value||""});case n.CHECKBOX_FORM_ITEM:return e.createElement(i,{checkboxItem:t.formItem})}}(t))})))})),e.createElement("div",{style:x,onClick:function(){}},e.createElement(r,{element:s})," "))}));export{l as default}; | ||
import e from"react";import'./../../../ext/mobx-react-lite/es/index.js';import{getHorizontalAlignment as t}from"../../helpers/index.js";import{FormItemTypeEnum as n}from"../../models/modal/step/elements/form/index.js";import r from"../button-element-renderer/index.js";import o from"./input-item-view/index.js";import{CheckboxItemView as i}from"./checkbox-item-view/index.js";import{observer as l}from'./../../../ext/mobx-react-lite/es/observer.js';var a=l((function(l){var a=l.element,m=l.popup,s=l.isPreviewMode,c=a,d=c.rows.slice().sort((function(e,t){return e.order-t.order})),u=c.formSettings,p=c.buttonSettings,f=c.bgColor,x={display:"flex",flexDirection:"column",alignItems:"center",justifyContent:t(c.horizontalAlignment),gap:"".concat(u.gapBetweenItems,"px"),padding:"".concat(c.verticalPadding,"px ").concat(c.horizontalPadding,"px"),backgroundColor:f,width:"100%"},E={display:"flex",flexDirection:"row",width:"100%",gap:"".concat(u.gapBetweenItems,"px")},g={flex:1,display:"flex",alignItems:"flex-end"},v={width:"".concat(p.width,"%"),minWidth:"fit-content"};return e.createElement("div",{style:x},d.map((function(t,r){return e.createElement("div",{style:E,key:r},t.columns.slice().sort((function(e,t){return e.order-t.order})).map((function(t,r){return e.createElement("div",{style:g,key:r},function(t){switch(t.type){case n.CUSTOMER_BIRTHDAY:case n.CUSTOMER_EMAIL:case n.CUSTOMER_GENDER:case n.CUSTOMER_PHONE:case n.CUSTOMER_NAME:case n.CUSTOMER_SURNAME:var r=t.formItem;return e.createElement(o,{formInputSettings:u.formInputSettings,inputLabel:r.inputLabel,isRequired:r.required,onValueChange:function(e){return s?null:r.value=e},placeholder:r.placeholder,updateCurrentInfo:r.updateCurrentInfo,value:r.value||""});case n.CHECKBOX_FORM_ITEM:return e.createElement(i,{checkboxItem:t.formItem})}}(t))})))})),e.createElement("div",{style:v,onClick:function(){var e;-1!==(e=m.modal.steps.findIndex((function(e){return e.id===m.modal.selectedStep.id})))&&e<m.modal.steps.length&&(m.modal.selectedStep=m.modal.steps[e+1])}},e.createElement(r,{element:p})," "))}));export{a as default}; |
@@ -1,1 +0,1 @@ | ||
import e from"react";import'./../../ext/mobx-react-lite/es/index.js';import{PopupTypeEnum as t,PopupPositonEnum as o}from"../models/modal/index.js";import i from"../assets/x-close.js";import{CloseButtonPositionTypeEnum as r,CloseIconTypeEnum as n,CloseButtonDisplayTypeEnum as l}from"../models/modal/close-settings/index.js";import{PopupElementTypeEnum as s,ComponentVerticalAlignmentEnum as d}from"../models/modal/step/elements/base/index.js";import a from"./text-element-renderer/index.js";import c from"./button-element-renderer/index.js";import m from"./space-element-renderer/index.js";import p from"./divider-element-renderer/index.js";import u from"./social-element-renderer/index.js";import f from"./image-element-renderer/index.js";import x from"./image-column-element-renderer/index.js";import P from"./product-list-renderer/index.js";import E from"./form-element-renderer/index.js";import{ImageColumnPositionEnum as v}from"../models/modal/step/elements/image-column/index.js";import{observer as g}from'./../../ext/mobx-react-lite/es/observer.js';var T=g((function(g){var T,b,y,O,_=g.popup,I=g.dynamicData,h=g.dashboardComponents,C=g.previewMode,M=g.onModalClose,R=_.modal,A=R.teaser,S=!!R.selectedStep.isTeaser,w=R.selectedStep.elements.find((function(e){return e.type===s.IMAGE_COLUMN})),D=S?A.backgroundSettings:R.backgroundSettings,k=S?A.windowSettings:R.windowSettings,N=S?A.closeSettings:R.closeSettings,j=D.allowScrollingWhenPopupOpen,L=!(!_.isPreviewMode&&!C)||R.isVisible;document.body.style.overflow=L&&!j?"hidden":"auto";var U=D.overlay,B=D.border,W="center",F="center";switch(S?t.POPUP:R.type){case t.POPUP:var H=S?A.position:R.position;H===o.POPUP_TOP_LEFT?(W="flex-start",F="flex-start"):H===o.POPUP_TOP_CENTER?(W="center",F="flex-start"):H===o.POPUP_TOP_RIGHT?(W="flex-end",F="flex-start"):H===o.POPUP_MIDDLE_LEFT?(W="flex-start",F="center"):H===o.POPUP_MIDDLE_CENTER?(W="center",F="center"):H===o.POPUP_MIDDLE_RIGHT?(W="flex-end",F="center"):H===o.POPUP_BOTTOM_LEFT?(W="flex-start",F="flex-end"):H===o.POPUP_BOTTOM_CENTER?(W="center",F="flex-end"):H===o.POPUP_BOTTOM_RIGHT&&(W="flex-end",F="flex-end");break;case t.DRAWER:R.position===o.DRAWER_LEFT?(W="flex-start",F="center"):R.position===o.DRAWER_RIGHT&&(W="flex-end",F="center");break;case t.NOTIFICATION_BAR:R.position===o.NOTIFICATION_BAR_UP?(W="center",F="flex-start"):R.position===o.NOTIFICATION_BAR_DOWN&&(W="center",F="flex-end")}var V={position:"fixed",display:"flex",justifyContent:W,alignItems:F,top:0,left:0,right:0,bottom:0,zIndex:1e3,overflow:"hidden",padding:"".concat(k.outerVerticalPadding,"px ").concat(k.outerHorizontalPadding,"px"),opacity:L?1:0,visibility:L?"visible":"hidden",transition:"opacity 0.3s ease, visibility 0.3s ease"},G={position:"fixed",top:0,left:0,right:0,bottom:0,zIndex:1001,backgroundColor:U?U.bgColor:"",opacity:U?(U.bgOpacity||100)/100:void 0},z={position:"relative",zIndex:1002,display:"flex",flexDirection:w?w.imagePosition===v.LEFT_ALIGN?"row-reverse":"row":"column",backgroundColor:D.bgColor,border:B?"".concat(B.borderWidth,"px ").concat(B.borderStyle," ").concat(B.borderColor):"",borderRadius:"".concat(k.borderRadius,"px"),width:k.takeFullWidth?"100%":void 0,maxWidth:"100%",maxHeight:"100%",height:k.takeFullHeight?"100%":k.maxHeight,boxShadow:D.shadow?"0 0 10px ".concat(D.shadow.color):"",opacity:L?1:0,visibility:L?"visible":"hidden",transition:"opacity 0.3s ease, visibility 0.3s ease"},K="";switch(null==w?void 0:w.verticalAlignment){case d.BOTTOM:K="flex-end";break;case d.MIDDLE:K="center";break;case d.TOP:K="flex-start"}var X={width:k.takeFullWidth?"100%":k.maxWidth,maxWidth:"100%",overflow:"auto",display:"flex",flexDirection:"column",alignItems:K,borderRadius:"".concat(k.borderRadius,"px")},Y={position:N.closeButtonPositionType===r.TAKE_SPACE?"relative":"absolute",float:N.closeButtonPositionType===r.TAKE_SPACE?"right":"none",top:8,right:8,zIndex:1003},q={position:"sticky",padding:"6px",marginLeft:N.closeButtonPositionType===r.TAKE_SPACE?"14px":void 0,display:"flex",justifyContent:"center",alignItems:"center",border:(null===(T=N.iconSettings)||void 0===T?void 0:T.type)===n.WITH_BORDER?"1px solid ".concat(null===(b=N.iconSettings)||void 0===b?void 0:b.color):"",borderRadius:"50%",backgroundColor:null===(y=N.iconSettings)||void 0===y?void 0:y.backgroundColor},J={color:null===(O=N.iconSettings)||void 0===O?void 0:O.color,cursor:"pointer"},Q=function(t){var o=t.type,i=h&&h[o]&&h[o].length?h[o][0]:null,r=i&&_.marketingPopupViewModel?e.createElement(i,{element:t,marketingPopupViewModel:_.marketingPopupViewModel}):void 0;switch(o){case s.TEXT:return e.createElement(a,{element:t});case s.IMAGE:return e.createElement(f,{element:t,popup:_,editModeChildren:r});case s.IMAGE_COLUMN:return e.createElement(x,{element:t,popup:_,editModeChildren:r});case s.BUTTON:return e.createElement(c,{element:t});case s.DIVIDER:return e.createElement(p,{element:t});case s.FORM:return e.createElement(E,{element:t});case s.PRODUCT_LIST:return e.createElement(P,{element:t,products:I.products[t.id],popup:_,editModeChildren:r});case s.SOCIAL_MEDIA:return e.createElement(u,{element:t,popup:_,editModeChildren:r});case s.SPACE:return e.createElement(m,{element:t})}},Z=function(){_.isPreviewMode||R.isVisible&&(R.isVisible=!1,M&&M())};return e.createElement("div",{className:"ikas-popup-default-styles",id:"ikas-popup-container",style:V},e.createElement("div",{style:z,onClick:function(e){S&&(R.selectedStep=R.steps[0])}},N.closeButtonDisplayType!==l.ALWAYS_HIDDEN&&e.createElement("div",{style:Y,onClick:function(){return Z()}},e.createElement("div",{style:q,className:N.closeButtonDisplayType===l.VISIBLE_ON_HOVER?"visible-on-hover":""},e.createElement(i,{style:J}))),e.createElement("div",{style:X},R.selectedStep.elements.filter((function(e){return e.type!==s.IMAGE_COLUMN})).slice().sort((function(e,t){return e.order-t.order})).map((function(e){return Q(e)}))),w&&Q(w)),e.createElement("div",{style:G,onClick:function(){return Z()}}))}));export{T as default}; | ||
import e from"react";import'./../../ext/mobx-react-lite/es/index.js';import{PopupTypeEnum as t,PopupPositonEnum as o}from"../models/modal/index.js";import i from"../assets/x-close.js";import{CloseButtonPositionTypeEnum as n,CloseIconTypeEnum as r,CloseButtonDisplayTypeEnum as l}from"../models/modal/close-settings/index.js";import{PopupElementTypeEnum as s,ComponentVerticalAlignmentEnum as d}from"../models/modal/step/elements/base/index.js";import a from"./text-element-renderer/index.js";import c from"./button-element-renderer/index.js";import m from"./space-element-renderer/index.js";import p from"./divider-element-renderer/index.js";import u from"./social-element-renderer/index.js";import f from"./image-element-renderer/index.js";import x from"./image-column-element-renderer/index.js";import P from"./product-list-renderer/index.js";import E from"./form-element-renderer/index.js";import{ImageColumnPositionEnum as v}from"../models/modal/step/elements/image-column/index.js";import{observer as T}from'./../../ext/mobx-react-lite/es/observer.js';var b=T((function(T){var b,g,y,O,_=T.popup,I=T.dynamicData,h=T.dashboardComponents,C=T.previewMode,M=T.onModalClose,R=_.modal,A=R.teaser,S=!!R.selectedStep.isTeaser,w=R.selectedStep.elements.find((function(e){return e.type===s.IMAGE_COLUMN})),D=S?A.backgroundSettings:R.backgroundSettings,k=S?A.windowSettings:R.windowSettings,j=S?A.closeSettings:R.closeSettings,N=D.allowScrollingWhenPopupOpen,L=_.isPreviewMode||C,U=!!L||R.isVisible;document.body.style.overflow=U&&!N?"hidden":"auto";var B=D.overlay,W=D.border,F="center",H="center";switch(S?t.POPUP:R.type){case t.POPUP:var V=S?A.position:R.position;V===o.POPUP_TOP_LEFT?(F="flex-start",H="flex-start"):V===o.POPUP_TOP_CENTER?(F="center",H="flex-start"):V===o.POPUP_TOP_RIGHT?(F="flex-end",H="flex-start"):V===o.POPUP_MIDDLE_LEFT?(F="flex-start",H="center"):V===o.POPUP_MIDDLE_CENTER?(F="center",H="center"):V===o.POPUP_MIDDLE_RIGHT?(F="flex-end",H="center"):V===o.POPUP_BOTTOM_LEFT?(F="flex-start",H="flex-end"):V===o.POPUP_BOTTOM_CENTER?(F="center",H="flex-end"):V===o.POPUP_BOTTOM_RIGHT&&(F="flex-end",H="flex-end");break;case t.DRAWER:R.position===o.DRAWER_LEFT?(F="flex-start",H="center"):R.position===o.DRAWER_RIGHT&&(F="flex-end",H="center");break;case t.NOTIFICATION_BAR:R.position===o.NOTIFICATION_BAR_UP?(F="center",H="flex-start"):R.position===o.NOTIFICATION_BAR_DOWN&&(F="center",H="flex-end")}var G={position:"fixed",display:"flex",justifyContent:F,alignItems:H,top:0,left:0,right:0,bottom:0,zIndex:99999999999,overflow:"hidden",padding:"".concat(k.outerVerticalPadding,"px ").concat(k.outerHorizontalPadding,"px"),opacity:U?1:0,visibility:U?"visible":"hidden",transition:"opacity 0.3s ease, visibility 0.3s ease"},z={position:"fixed",top:0,left:0,right:0,bottom:0,zIndex:999999999999,backgroundColor:B?B.bgColor:"",opacity:B?(B.bgOpacity||100)/100:void 0},K={position:"relative",zIndex:9999999999999,display:"flex",flexDirection:w?w.imagePosition===v.LEFT_ALIGN?"row-reverse":"row":"column",backgroundColor:D.bgColor,border:W?"".concat(W.borderWidth,"px ").concat(W.borderStyle," ").concat(W.borderColor):"",borderRadius:"".concat(k.borderRadius,"px"),width:k.takeFullWidth?"100%":void 0,maxWidth:"100%",maxHeight:"100%",height:k.takeFullHeight?"100%":k.maxHeight,boxShadow:D.shadow?"0 0 10px ".concat(D.shadow.color):"",opacity:U?1:0,visibility:U?"visible":"hidden",transition:"opacity 0.3s ease, visibility 0.3s ease"},X="";switch(null==w?void 0:w.verticalAlignment){case d.BOTTOM:X="flex-end";break;case d.MIDDLE:X="center";break;case d.TOP:X="flex-start"}var Y={width:k.takeFullWidth?"100%":k.maxWidth,maxWidth:"100%",overflow:"auto",display:"flex",flexDirection:"column",justifyContent:X,borderRadius:"".concat(k.borderRadius,"px")},q={position:j.closeButtonPositionType===n.TAKE_SPACE?"relative":"absolute",float:j.closeButtonPositionType===n.TAKE_SPACE?"right":"none",top:8,right:8,zIndex:99999999999999},J={position:"sticky",padding:"6px",marginLeft:j.closeButtonPositionType===n.TAKE_SPACE?"14px":void 0,display:"flex",justifyContent:"center",alignItems:"center",border:(null===(b=j.iconSettings)||void 0===b?void 0:b.type)===r.WITH_BORDER?"1px solid ".concat(null===(g=j.iconSettings)||void 0===g?void 0:g.color):"",borderRadius:"50%",backgroundColor:null===(y=j.iconSettings)||void 0===y?void 0:y.backgroundColor},Q={color:null===(O=j.iconSettings)||void 0===O?void 0:O.color,cursor:"pointer"},Z=function(t){var o=t.type,i=h&&h[o]&&h[o].length?h[o][0]:null,n=i&&_.marketingPopupViewModel?e.createElement(i,{element:t,marketingPopupViewModel:_.marketingPopupViewModel}):void 0;switch(o){case s.TEXT:return e.createElement(a,{element:t});case s.IMAGE:return e.createElement(f,{element:t,popup:_,editModeChildren:n});case s.IMAGE_COLUMN:return e.createElement(x,{element:t,popup:_,editModeChildren:n});case s.BUTTON:return e.createElement(c,{element:t});case s.DIVIDER:return e.createElement(p,{element:t});case s.FORM:return e.createElement(E,{element:t,popup:_,isPreviewMode:!!L});case s.PRODUCT_LIST:return e.createElement(P,{element:t,products:I.products[t.id],popup:_,editModeChildren:n});case s.SOCIAL_MEDIA:return e.createElement(u,{element:t,popup:_,editModeChildren:n});case s.SPACE:return e.createElement(m,{element:t})}},$=function(){L||R.isVisible&&(R.isVisible=!1,M&&M())};return e.createElement("div",{className:"ikas-popup-default-styles",id:"ikas-popup-container",style:G},e.createElement("div",{style:K,onClick:function(e){S&&(R.selectedStep=R.steps[0])}},j.closeButtonDisplayType!==l.ALWAYS_HIDDEN&&e.createElement("div",{style:q,onClick:function(){return $()}},e.createElement("div",{style:J,className:j.closeButtonDisplayType===l.VISIBLE_ON_HOVER?"visible-on-hover":""},e.createElement(i,{style:Q}))),e.createElement("div",{style:Y},R.selectedStep.elements.filter((function(e){return e.type!==s.IMAGE_COLUMN})).slice().sort((function(e,t){return e.order-t.order})).map((function(e){return Z(e)}))),w&&Z(w)),e.createElement("div",{style:z,onClick:function(){return $()}}))}));export{b as default}; |
{ | ||
"name": "@ikas/popup-renderer", | ||
"version": "1.0.0", | ||
"version": "1.0.1", | ||
"description": "", | ||
@@ -5,0 +5,0 @@ "author": "ucy", |
105101
1211