easy-email-pro-theme 1.8.2 → 1.8.4

package/lib/index.js

@@ -422,7 +422,7 @@ const styleText$c = `@font-face {
 }
 
 `;
-const RetroStyleText = '[data-slate-block="page"] {\r\n  min-height: 300px;\r\n}\r\n\r\n\r\n[data-slate-hover="true"] {\r\n  z-index: 4;\r\n}\r\n\r\n\r\n[data-slate-focus="true"] {\r\n  z-index: 3;\r\n}\r\n\r\n\r\n[data-slate-selected="true"] {\r\n  z-index: 3;\r\n}\r\n\r\n\r\n[data-slate-hover="true"] .element-tools-container {\r\n  z-index: 4;\r\n}\r\n\r\n\r\n[data-slate-void="true"] [data-slate-node="element"][data-slate-block="button"]:hover,\r\n[data-slate-void="true"] [data-slate-node="element"][data-slate-block="text"]:hover {\r\n  outline: 2px solid var(--hover-color);\r\n}\r\n\r\n\r\n.text-mergetag {\r\n  outline: 1px solid rgb(78, 89, 105);\r\n  outline-offset: 1px;\r\n  padding: 0 2px;\r\n  border-radius: 2px;\r\n  cursor: pointer;\r\n  transition: all 0.1s linear;\r\n  border: none;\r\n  font-weight: inherit;\r\n  outline-color: #00a0ac;\r\n  color: inherit;\r\n  background-color: #ebf9fc;\r\n  max-width: 10em;\r\n  font-style: inherit;\r\n  text-decoration-line: inherit;\r\n  position: relative;\r\n}\r\n\r\n\r\nbody .element-tools-container {\n  outline: 2px solid var(--hover-color);\n  z-index: 1;\n}\r\n\r\n\r\nbody .element-tools-container .element-tools {\n  color: #fff;\n  background-color: var(--hover-color);\n}\r\n\r\n\r\nbody .element-tools-container .element-drag-button {\n  background-color: var(--hover-color);\n}\r\n\r\n\r\n[data-slate-dragover=true] {\n  z-index: 2;\n}\r\n\r\n\r\n[data-slate-dragover=true]::after {\n  content: "";\n  position: absolute;\n  pointer-events: none;\n  inset: 0px;\n  border-radius: 3px;\n  background: var(--drag-color);\n  z-index: 10;\n  left: 0;\n  height: 4px;\n  opacity: 1;\n}\r\n\r\n\r\n[data-slate-dragging=true] .element-tools-container {\n  opacity: 0;\n}\r\n\r\n\r\n[data-slate-dragover-direction=top][data-slate-dragover=true]::after {\n  top: 0px;\n}\r\n\r\n\r\n[data-slate-dragover-direction=bottom][data-slate-dragover=true]::after {\n  top: auto;\n  bottom: 0px;\n}\r\n\r\n\r\n[data-slate-dragover-direction=middle][data-slate-dragover=true] {\n  outline: 2px dashed var(--drag-color);\n  z-index: 2;\n}\r\n\r\n\r\n[data-slate-dragover-direction=middle][data-slate-dragover=true]::after {\n  content: "";\n  position: absolute;\n  pointer-events: none;\n  inset: 0px;\n  border-radius: 3px;\n  background: var(--drag-color);\n  z-index: 1;\n  left: 0;\n  height: 100%;\n  width: 100%;\n  filter: opacity(10%);\n}\r\n\r\n\r\n[data-slate-dragover-direction=middle][data-slate-dragover=true] [data-slate-type=placeholder] {\n  outline: none;\n}\r\n\r\n\r\n[data-slate-type=placeholder] {\n  min-height: 64px;\n  position: relative;\n  background-color: rgba(242, 244, 245, 0.64);\n  outline: rgb(43, 152, 211) dashed 1px;\n  outline-offset: -1px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 14px;\n  font-weight: 400;\n  line-height: 1.3;\n  color: rgb(48, 59, 67);\n  margin: 0 20px;\n}\r\n\r\n\r\n[data-slate-type=placeholder] .element-delete {\n  border-radius: 2px;\n  padding: 0px;\n  cursor: pointer;\n  height: 28px;\n  width: 28px;\n  background-color: rgb(223, 227, 230);\n  color: rgb(96, 106, 114);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  position: absolute;\n  left: 10px;\n  top: 10px;\n  opacity: 0.8;\n}\r\n\r\n\r\n[data-slate-type=placeholder] .element-delete:hover {\n  background-color: rgb(180, 187, 195);\n  opacity: 1;\n}\r\n\r\n\r\n[data-slate-type=placeholder] .element-delete svg {\n  width: 20px;\n  height: 20px;\n}\r\n\r\n\r\n[data-slate-universal-editing=true] {\n  z-index: 2;\n}\r\n\r\n\r\n.universal-element-mask {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  left: 0;\n  top: 0;\n  z-index: 10;\n}\r\n\r\n\r\n.unset-element-mask {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  left: 0;\n  top: 0;\n  z-index: 10;\n}\r\n\r\n\r\n[data-slate-universal-editing=true] .universal-element-mask {\n  display: none;\n}\r\n\r\n\r\n[data-slate-universal-editing=true] .universal-element-editing-mask {\n  z-index: 0;\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  inset: 0px;\n}\r\n\r\n\r\n[data-slate-universal-editing=true] .universal-element-editing-mask::before {\n  content: " ";\n  width: 10000px;\n  height: 10000px;\n  position: fixed;\n  left: 0;\n  top: 0;\n  transform: translate(-50%, -50%);\n}\r\n\r\n\r\n[data-slate-universal-editing=true] .universal-element-editing-mask::after {\n  position: absolute;\n  content: " ";\n  width: 100%;\n  height: 100%;\n  inset: 0px;\n  pointer-events: none;\n  outline: 9999px solid rgba(255, 255, 255, 0.6);\n}';
+const RetroStyleText = '[data-slate-block="page"] {\r\n  min-height: 300px;\r\n}\r\n\r\n\r\n[data-slate-hover="true"] {\r\n  z-index: 4;\r\n}\r\n\r\n\r\n[data-slate-focus="true"] {\r\n  z-index: 3;\r\n}\r\n\r\n\r\n[data-slate-selected="true"] {\r\n  z-index: 3;\r\n}\r\n\r\n\r\n[data-slate-hover="true"] .element-tools-container {\r\n  z-index: 4;\r\n}\r\n\r\n\r\n[data-slate-void="true"] [data-slate-node="element"][data-slate-block="button"]:hover,\r\n[data-slate-void="true"] [data-slate-node="element"][data-slate-block="text"]:hover {\r\n  outline: 2px solid var(--hover-color);\r\n}\r\n\r\n\r\n.text-mergetag {\r\n  outline: 1px solid rgb(78, 89, 105);\r\n  outline-offset: 1px;\r\n  padding: 0 2px;\r\n  border-radius: 2px;\r\n  cursor: pointer;\r\n  transition: all 0.1s linear;\r\n  border: none;\r\n  font-weight: inherit;\r\n  outline-color: #00a0ac;\r\n  color: inherit;\r\n  background-color: #ebf9fc;\r\n  max-width: 10em;\r\n  font-style: inherit;\r\n  text-decoration-line: inherit;\r\n  position: relative;\r\n}\r\n\r\n\r\nbody .element-tools-container {\n  outline: 2px solid var(--hover-color);\n  z-index: 1;\n}\r\n\r\n\r\nbody .element-tools-container .element-tools {\n  color: #fff;\n  background-color: var(--hover-color);\n}\r\n\r\n\r\nbody .element-tools-container .element-drag-button {\n  background-color: var(--hover-color);\n}\r\n\r\n\r\n[data-slate-dragover=true] {\n  z-index: 2;\n}\r\n\r\n\r\n[data-slate-dragover=true]::after {\n  content: "";\n  position: absolute;\n  pointer-events: none;\n  inset: 0px;\n  border-radius: 3px;\n  background: var(--drag-color);\n  z-index: 10;\n  left: 0;\n  height: 4px;\n  opacity: 1;\n}\r\n\r\n\r\n[data-slate-dragging=true] .element-tools-container {\n  opacity: 0;\n}\r\n\r\n\r\n[data-slate-dragover-direction=top][data-slate-dragover=true]::after {\n  top: 0px;\n}\r\n\r\n\r\n[data-slate-dragover-direction=bottom][data-slate-dragover=true]::after {\n  top: auto;\n  bottom: 0px;\n}\r\n\r\n\r\n[data-slate-dragover-direction=middle][data-slate-dragover=true] {\n  outline: 2px dashed var(--drag-color);\n  z-index: 2;\n}\r\n\r\n\r\n[data-slate-dragover-direction=middle][data-slate-dragover=true]::after {\n  content: "";\n  position: absolute;\n  pointer-events: none;\n  inset: 0px;\n  border-radius: 3px;\n  background: var(--drag-color);\n  z-index: 1;\n  left: 0;\n  height: 100%;\n  width: 100%;\n  filter: opacity(10%);\n}\r\n\r\n\r\n[data-slate-dragover-direction=middle][data-slate-dragover=true] [data-slate-type=placeholder] {\n  outline: none;\n}\r\n\r\n\r\n[data-slate-type=placeholder] {\n  min-height: 64px;\n  position: relative;\n  background-color: rgba(242, 244, 245, 0.64);\n  outline: rgb(43, 152, 211) dashed 1px;\n  outline-offset: -1px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 14px;\n  font-weight: 400;\n  line-height: 1.3;\n  color: rgb(48, 59, 67);\n  margin: 0 20px;\n}\r\n\r\n\r\n[data-slate-type=placeholder] .element-delete {\n  border-radius: 2px;\n  padding: 0px;\n  cursor: pointer;\n  height: 28px;\n  width: 28px;\n  background-color: rgb(223, 227, 230);\n  color: rgb(96, 106, 114);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  position: absolute;\n  left: 10px;\n  top: 10px;\n  opacity: 0.8;\n}\r\n\r\n\r\n[data-slate-type=placeholder] .element-delete:hover {\n  background-color: rgb(180, 187, 195);\n  opacity: 1;\n}\r\n\r\n\r\n[data-slate-type=placeholder] .element-delete svg {\n  width: 20px;\n  height: 20px;\n}\r\n\r\n\r\n[data-slate-universal-editing=true] {\n  z-index: 2;\n}\r\n\r\n\r\n.universal-element-mask {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  left: 0;\n  top: 0;\n  z-index: 10;\n}\r\n\r\n\r\n.unset-element-mask {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  left: 0;\n  top: 0;\n  z-index: 10;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\r\n\r\n\r\n[data-slate-universal-editing=true] .universal-element-mask {\n  display: none;\n}\r\n\r\n\r\n[data-slate-universal-editing=true] .universal-element-editing-mask {\n  z-index: 0;\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  inset: 0px;\n}\r\n\r\n\r\n[data-slate-universal-editing=true] .universal-element-editing-mask::before {\n  content: " ";\n  width: 10000px;\n  height: 10000px;\n  position: fixed;\n  left: 0;\n  top: 0;\n  transform: translate(-50%, -50%);\n}\r\n\r\n\r\n[data-slate-universal-editing=true] .universal-element-editing-mask::after {\n  position: absolute;\n  content: " ";\n  width: 100%;\n  height: 100%;\n  inset: 0px;\n  pointer-events: none;\n  outline: 9999px solid rgba(255, 255, 255, 0.6);\n}';
 const withTheme$1 = (editor) => {
   const { insertBreak, normalizeNode, deleteBackward } = editor;
   editor.insertBreak = (...args) => {
@@ -1021,19 +1021,19 @@ const EditorContextProvider = (props) => {
     );
   }, [attributesVariables, pageElement]);
   const adapterNonPageValues = useMemo$1(() => {
-    const map2 = {};
+    const map2 = __spreadValues({}, values2);
     const initData = initialValuesRef.current;
     Object.keys(initData).forEach((key2) => {
       if (key2 === "content")
         return;
-      map2[key2] = values2[key2];
+      map2[key2] = form.getFieldValue(key2);
     });
     if (isEqual$3(map2, lastAdapterNonPageValues.current)) {
       return lastAdapterNonPageValues.current;
     }
     lastAdapterNonPageValues.current = map2;
     return map2;
-  }, [values2]);
+  }, [values2, form]);
   const adapterValues = useMemo$1(() => {
     return __spreadProps(__spreadValues({}, adapterNonPageValues), { content: pageElement });
   }, [pageElement, adapterNonPageValues]);
@@ -1805,7 +1805,8 @@ const ElementPlaceholder$1 = ({ element, nodeElement, isSelected, isHover, path:
         onMouseDown: stopEvent,
         onPointerDown: stopEvent,
         onClick: stopEvent
-      }
+      },
+      renderContent
     ));
   } else if (isUniversalElement) {
     renderContent = /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("div", { className: "universal-element-mask" }), /* @__PURE__ */ React__default.createElement(
@@ -39143,13 +39144,18 @@ const typeOptions = [
 function FieldConfigItem(props) {
   const { getFieldValue } = useEditorContext();
   const keyField = getFieldValue(null, props.name);
+  const onHandleRemove = (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    props.onRemove();
+  };
   return /* @__PURE__ */ React__default.createElement(
     Collapse$1.Item,
     {
       style: { backgroundColor: "#fff" },
       name: props.name,
       header: props.label,
-      extra: /* @__PURE__ */ React__default.createElement(Button$1, { icon: /* @__PURE__ */ React__default.createElement(IconDelete, null), onClick: props.onRemove }),
+      extra: /* @__PURE__ */ React__default.createElement(Button$1, { icon: /* @__PURE__ */ React__default.createElement(IconDelete, null), onClick: onHandleRemove }),
       contentStyle: { width: "100%", padding: "20px 16px" }
     },
     /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, { span: 22, offset: 0 }, /* @__PURE__ */ React__default.createElement(Space, { direction: "vertical", style: { width: "100%" } }, /* @__PURE__ */ React__default.createElement(
@@ -39179,7 +39185,7 @@ function FieldConfigItem(props) {
         options: typeOptions,
         path: props.path
       }
-    ), keyField.type === FieldType.ENUM && /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, { span: 17, offset: 7 }, /* @__PURE__ */ React__default.createElement(AddItems, { name: props.name + ".options", path: props.path }))), /* @__PURE__ */ React__default.createElement(
+    ), keyField && keyField.type === FieldType.ENUM && /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, { span: 17, offset: 7 }, /* @__PURE__ */ React__default.createElement(AddItems, { name: props.name + ".options", path: props.path }))), /* @__PURE__ */ React__default.createElement(
       AttributeField.TextAreaField,
       {
         label: "Desc",
@@ -39232,7 +39238,7 @@ function WidgetConfigPanel({
         (_14, i) => index2 !== i
       );
       const max = cloneWidgetElement.data.config.length - 1;
-      setFieldValue(null, `widgetElement`, cloneDeep(cloneWidgetElement));
+      setFieldValue(null, `widgetElement`, cloneWidgetElement);
       setActiveTab([`widgetElement.data.config.${Math.min(index2, max)}`]);
     },
     [setFieldValue, widgetElement]

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "easy-email-pro-theme",
-  "version": "1.8.2",
+  "version": "1.8.4",
   "description": "",
   "files": [
     "lib"