@ikas/popup-renderer 1.0.3 → 1.0.4
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/build/ext/tslib/tslib.es6.mjs.js +1 -1
- package/build/popup-renderer/components/form-element-renderer/index.d.ts +2 -0
- package/build/popup-renderer/components/form-element-renderer/index.js +1 -1
- package/build/popup-renderer/components/index.d.ts +13 -1
- package/build/popup-renderer/components/index.js +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
var t=function(r
|
|
1
|
+
var t=function(n,r){return t=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,n){t.__proto__=n}||function(t,n){for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])},t(n,r)};function n(n,r){if("function"!=typeof r&&null!==r)throw new TypeError("Class extends value "+String(r)+" is not a constructor or null");function e(){this.constructor=n}t(n,r),n.prototype=null===r?Object.create(r):(e.prototype=r.prototype,new e)}var r=function(){return r=Object.assign||function(t){for(var n,r=1,e=arguments.length;r<e;r++)for(var o in n=arguments[r])Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o]);return t},r.apply(this,arguments)};function e(t,n,r,e){return new(r||(r=Promise))((function(o,c){function a(t){try{l(e.next(t))}catch(t){c(t)}}function u(t){try{l(e.throw(t))}catch(t){c(t)}}function l(t){var n;t.done?o(t.value):(n=t.value,n instanceof r?n:new r((function(t){t(n)}))).then(a,u)}l((e=e.apply(t,n||[])).next())}))}function o(t,n){var r,e,o,c,a={label:0,sent:function(){if(1&o[0])throw o[1];return o[1]},trys:[],ops:[]};return c={next:u(0),throw:u(1),return:u(2)},"function"==typeof Symbol&&(c[Symbol.iterator]=function(){return this}),c;function u(u){return function(l){return function(u){if(r)throw new TypeError("Generator is already executing.");for(;c&&(c=0,u[0]&&(a=0)),a;)try{if(r=1,e&&(o=2&u[0]?e.return:u[0]?e.throw||((o=e.return)&&o.call(e),0):e.next)&&!(o=o.call(e,u[1])).done)return o;switch(e=0,o&&(u=[2&u[0],o.value]),u[0]){case 0:case 1:o=u;break;case 4:return a.label++,{value:u[1],done:!1};case 5:a.label++,e=u[1],u=[0];continue;case 7:u=a.ops.pop(),a.trys.pop();continue;default:if(!(o=a.trys,(o=o.length>0&&o[o.length-1])||6!==u[0]&&2!==u[0])){a=0;continue}if(3===u[0]&&(!o||u[1]>o[0]&&u[1]<o[3])){a.label=u[1];break}if(6===u[0]&&a.label<o[1]){a.label=o[1],o=u;break}if(o&&a.label<o[2]){a.label=o[2],a.ops.push(u);break}o[2]&&a.ops.pop(),a.trys.pop();continue}u=n.call(t,a)}catch(t){u=[6,t],e=0}finally{r=o=0}if(5&u[0])throw u[1];return{value:u[0]?u[1]:void 0,done:!0}}([u,l])}}}function c(t,n,r){if(r||2===arguments.length)for(var e,o=0,c=n.length;o<c;o++)!e&&o in n||(e||(e=Array.prototype.slice.call(n,0,o)),e[o]=n[o]);return t.concat(e||Array.prototype.slice.call(n))}"function"==typeof SuppressedError&&SuppressedError;export{r as __assign,e as __awaiter,n as __extends,o as __generator,c as __spreadArray};
|
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { ElementType } from "../../models/modal/step";
|
|
3
3
|
import { Popup } from "popup-renderer/models";
|
|
4
|
+
import { SFProps } from "..";
|
|
4
5
|
type Props = {
|
|
5
6
|
element: ElementType;
|
|
6
7
|
popup: Popup;
|
|
7
8
|
isPreviewMode: boolean;
|
|
9
|
+
sfProps?: SFProps;
|
|
8
10
|
};
|
|
9
11
|
declare const FormElementRenderer: React.FC<Props>;
|
|
10
12
|
export default FormElementRenderer;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import e from"react";import'./../../../ext/mobx-react-lite/es/index.js';import{getHorizontalAlignment as
|
|
1
|
+
import{__awaiter as e,__generator as t}from'./../../../ext/tslib/tslib.es6.mjs.js';import r from"react";import'./../../../ext/mobx-react-lite/es/index.js';import{getHorizontalAlignment as n}from"../../helpers/index.js";import{FormItemTypeEnum as o}from"../../models/modal/step/elements/form/index.js";import a from"../button-element-renderer/index.js";import i from"./input-item-view/index.js";import{CheckboxItemView as s}from"./checkbox-item-view/index.js";import{observer as c}from'./../../../ext/mobx-react-lite/es/observer.js';var l=c((function(c){var l=c.element,m=c.popup,u=c.isPreviewMode,d=c.sfProps,f=r.useState(!1);f[0];var E=f[1],p=l,C=p.rows.slice().sort((function(e,t){return e.order-t.order})),M=p.formSettings,h=p.buttonSettings,R=p.bgColor,v={display:"flex",flexDirection:"column",alignItems:"center",justifyContent:n(p.horizontalAlignment),gap:"".concat(M.gapBetweenItems,"px"),padding:"".concat(p.verticalPadding,"px ").concat(p.horizontalPadding,"px"),backgroundColor:R,width:"100%"},I={display:"flex",flexDirection:"row",width:"100%",gap:"".concat(M.gapBetweenItems,"px")},O={flex:1,display:"flex",alignItems:"flex-end"},S=function(){return e(void 0,void 0,void 0,(function(){var e,r,n,a,i,s,c,l;return t(this,(function(t){switch(t.label){case 0:return e=m.modal.steps.findIndex((function(e){return e.id===m.modal.selectedStep.id})),u||!d?[3,2]:(E(!0),function(){var e=!1;return p.rows.forEach((function(t){t.columns.forEach((function(t){switch(t.type){case o.CUSTOMER_BIRTHDAY:case o.CUSTOMER_EMAIL:case o.CUSTOMER_GENDER:case o.CUSTOMER_PHONE:case o.CUSTOMER_NAME:case o.CUSTOMER_SURNAME:case o.CHECKBOX_FORM_ITEM:var r=t.formItem;r.required&&!r.value&&(r.required.hasError=!0,e=!0);break;case o.CHECKBOX_FORM_ITEM:var n=t.formItem;n.requiredToBeChecked&&!n.isChecked&&(n.requiredToBeChecked.hasError=!0,e=!0)}}))})),e}()?(E(!1),[2]):(r="",n="",a=null,i=null,s=null,c=null,l=!1,p.rows.forEach((function(e){e.columns.forEach((function(e){switch(e.type){case o.CUSTOMER_BIRTHDAY:s=e.formItem.value;break;case o.CUSTOMER_EMAIL:a=e.formItem.value;break;case o.CUSTOMER_GENDER:c=e.formItem.value;break;case o.CUSTOMER_PHONE:i=e.formItem.value;break;case o.CUSTOMER_NAME:r=e.formItem.value||"";break;case o.CUSTOMER_SURNAME:n=e.formItem.value||"";break;case o.CHECKBOX_FORM_ITEM:l=e.formItem.isChecked}}))})),[4,d.onCustomerSave({firstName:r,lastName:n,email:a,phone:i,birthday:s,gender:c,hasPermission:l})]));case 1:t.sent(),E(!1),t.label=2;case 2:return-1!==e&&e<m.modal.steps.length&&(m.modal.selectedStep=m.modal.steps[e+1]),[2]}}))}))},_={width:"".concat(h.width,"%"),minWidth:"fit-content"};return r.createElement("div",{style:v},C.map((function(e,t){return r.createElement("div",{style:I,key:t},e.columns.slice().sort((function(e,t){return e.order-t.order})).map((function(e,t){return r.createElement("div",{style:O,key:t},function(e){switch(e.type){case o.CUSTOMER_BIRTHDAY:case o.CUSTOMER_EMAIL:case o.CUSTOMER_GENDER:case o.CUSTOMER_PHONE:case o.CUSTOMER_NAME:case o.CUSTOMER_SURNAME:var t=e.formItem;return r.createElement(i,{formInputSettings:M.formInputSettings,inputLabel:t.inputLabel,isRequired:t.required,onValueChange:function(e){return u?null:t.value=e},placeholder:t.placeholder,updateCurrentInfo:t.updateCurrentInfo,value:t.value||""});case o.CHECKBOX_FORM_ITEM:return r.createElement(s,{checkboxItem:e.formItem})}}(e))})))})),r.createElement("div",{style:_,onClick:function(){return S()}},r.createElement(a,{element:h})," "))}));export{l as default};
|
|
@@ -1,12 +1,24 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { DashboardComponents, Popup, PopupProductDictionary } from "../models";
|
|
3
3
|
import "../style.css";
|
|
4
|
+
export type SFProps = {
|
|
5
|
+
onModalClose: () => void;
|
|
6
|
+
onCustomerSave: (customer: {
|
|
7
|
+
firstName: string;
|
|
8
|
+
lastName: string;
|
|
9
|
+
email?: string | null;
|
|
10
|
+
phone?: string | null;
|
|
11
|
+
birthday?: string | null;
|
|
12
|
+
gender?: string | null;
|
|
13
|
+
hasPermission?: boolean | null;
|
|
14
|
+
}) => Promise<void>;
|
|
15
|
+
};
|
|
4
16
|
type Props = {
|
|
5
17
|
popup: Popup;
|
|
6
18
|
dynamicData: DynamicData;
|
|
7
19
|
dashboardComponents?: DashboardComponents;
|
|
8
20
|
previewMode?: boolean;
|
|
9
|
-
|
|
21
|
+
sfProps?: SFProps;
|
|
10
22
|
};
|
|
11
23
|
export type DynamicData = {
|
|
12
24
|
products: PopupProductDictionary;
|
|
@@ -1 +1 @@
|
|
|
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
|
|
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 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.sfProps,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:9995,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:9996,backgroundColor:B?B.bgColor:"",opacity:B?(B.bgOpacity||100)/100:void 0},K={position:"relative",zIndex:9997,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===r.TAKE_SPACE?"relative":"absolute",float:j.closeButtonPositionType===r.TAKE_SPACE?"right":"none",top:8,right:8,zIndex:9998},J={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)===n.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,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,popup:_,isPreviewMode:!!L});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})}},$=function(){L||R.isVisible&&(R.isVisible=!1,M&&M.onModalClose())};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};
|