easy-email-pro-theme 1.46.0 → 1.47.0

package/lib/index.js

@@ -58,7 +58,7 @@ import { classnames, useEditorState, useEditorProps, useRefState, isDOMElement,
 import { useSlate, ReactEditor, useSlateStatic, useSelected } from "slate-react";
 import * as React$2 from "react";
 import React__default, { useRef, useState, useEffect, useCallback, useMemo, createContext, useContext, useLayoutEffect, memo, useReducer, cloneElement, forwardRef, Suspense, Component, createElement } from "react";
-import { NodeUtils, BlockManager, ElementType, EditorCore, t, ElementCategory, classnames as classnames$1, StandardType, PluginManager, EditorAuth, HtmlNodeAdapter, ConditionOperator, ConditionOperatorSymbol, EmailRenderProvider, components } from "easy-email-pro-core";
+import { NodeUtils, BlockManager, ElementType, EditorCore, t, ElementCategory, classnames as classnames$1, StandardType, PluginManager, EditorAuth, HtmlNodeAdapter, ConditionOperator, ConditionOperatorSymbol, EmailRenderProvider, components, I18nManager } from "easy-email-pro-core";
 import { Editor, Range, Node, Transforms, Path, Text as Text$2, createEditor } from "slate";
 import { createPortal, unstable_batchedUpdates } from "react-dom";
 import { cloneDeep, get, isEqual, set, omit as omit$2, merge as merge$1, debounce as debounce$2, isUndefined as isUndefined$1, uniqueId, isString as isString$1, isFunction as isFunction$4, isNumber as isNumber$1, upperFirst, sum, flatMap } from "lodash";
@@ -8358,25 +8358,33 @@ const PreviewEmail = ({
 }) => {
   const [html, setHtml] = useState("");
   const mjmlString = useMemo(() => {
-    let content = values.content;
-    if (widgetMode) {
-      content = __spreadProps(__spreadValues({}, content), {
-        children: [
-          __spreadProps(__spreadValues({}, values.widgetElement), {
-            children: values.content.children
-          })
-        ]
+    try {
+      let content = values.content;
+      if (widgetMode) {
+        content = __spreadProps(__spreadValues({}, content), {
+          children: [
+            __spreadProps(__spreadValues({}, values.widgetElement), {
+              children: values.content.children
+            })
+          ]
+        });
+      }
+      return EditorCore.toMJML({
+        element: content,
+        mode: "production",
+        universalElements: universalElementSetting,
+        mergetagsData: cloneDeep(mergetagsData),
+        attributesVariables: pageDataVariables,
+        headerElement,
+        footerElement
       });
+    } catch (error2) {
+      console.error(error2);
+      setHtml(
+        `<div style="color:red;margin:auto;max-width:600px;font-size:24px;">${String(error2)}</div>`
+      );
+      return "";
     }
-    return EditorCore.toMJML({
-      element: content,
-      mode: "production",
-      universalElements: universalElementSetting,
-      mergetagsData: cloneDeep(mergetagsData),
-      attributesVariables: pageDataVariables,
-      headerElement,
-      footerElement
-    });
   }, [
     values.content,
     values.widgetElement,
@@ -8395,6 +8403,8 @@ const PreviewEmail = ({
   }, [values.content, values.widgetElement, widgetMode]);
   useEffect(() => {
     try {
+      if (!mjmlString)
+        return;
       const skeletonHtml = mjml(mjmlString, {
         fonts: {}
       }).html;
@@ -28590,6 +28600,12 @@ const generateLogic = (option) => {
     if (condition.operator === ConditionOperator.FALSY) {
       return condition.left + " == nil" || condition.left + " == false";
     }
+    if (condition.operator === ConditionOperator.EMPTY) {
+      return condition.left + " == empty";
+    }
+    if (condition.operator === ConditionOperator.NOT_EMPTY) {
+      return condition.left + " not empty";
+    }
     return /* @__PURE__ */ React__default.createElement(React__default.Fragment, { key: index2 }, index2 !== 0 && /* @__PURE__ */ React__default.createElement("span", null, " ", symbol2.toLocaleUpperCase(), " "), /* @__PURE__ */ React__default.createElement(Tag, { color: "arcoblue" }, condition.left + " " + condition.operator + " " + condition.right));
   };
   return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, groups.map((item2, index2) => {
@@ -28871,6 +28887,46 @@ const options$4 = [
     tootip: "Less than or equal",
     label: "<=",
     value: ConditionOperator.LESS_OR_EQUAL
+  },
+  {
+    tootip: "Empty",
+    label: "empty",
+    value: ConditionOperator.EMPTY
+  },
+  {
+    tootip: "Not empty",
+    label: "Not empty",
+    value: ConditionOperator.NOT_EMPTY
+  },
+  {
+    tootip: "Contains",
+    label: "Contains",
+    value: ConditionOperator.CONTAINS
+  },
+  {
+    tootip: "Not contains",
+    label: "Not contains",
+    value: ConditionOperator.NOT_CONTAINS
+  },
+  {
+    tootip: "Starts with",
+    label: "Starts with",
+    value: ConditionOperator.STARTS_WITH
+  },
+  {
+    tootip: "Ends with",
+    label: "Ends with",
+    value: ConditionOperator.ENDS_WITH
+  },
+  {
+    tootip: "In",
+    label: "In",
+    value: ConditionOperator.IN
+  },
+  {
+    tootip: "Not in",
+    label: "Not in",
+    value: ConditionOperator.NOT_IN
   }
 ];
 Object.values(ConditionOperator).map((item2) => ({
@@ -28885,7 +28941,7 @@ function ConditionItem({
 }) {
   const name = `${path2}.${gIndex}.groups.${ggIndex}`;
   const value = Form.useWatch(name);
-  const hideRight = value.operator === ConditionOperator.TRUTHY || value.operator === ConditionOperator.FALSY;
+  const hideRight = value.operator === ConditionOperator.TRUTHY || value.operator === ConditionOperator.FALSY || value.operator === ConditionOperator.EMPTY || value.operator === ConditionOperator.NOT_EMPTY;
   return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(Grid.Row, { align: "end" }, /* @__PURE__ */ React__default.createElement(Grid.Col, { span: 9 }, /* @__PURE__ */ React__default.createElement(
     AttributeField.MergeTagSelectInputField,
     {
@@ -28914,10 +28970,13 @@ function ConditionItem({
     {
       label: t("Operator"),
       field: `${name}.operator`,
-      layout: "vertical"
+      layout: "vertical",
+      style: {
+        minWidth: 150
+      }
     },
     /* @__PURE__ */ React__default.createElement(Select$1, { options: options$4 }, options$4.map((item2) => {
-      return /* @__PURE__ */ React__default.createElement(Select$1.Option, { key: item2.value, value: item2.value }, /* @__PURE__ */ React__default.createElement(Tooltip, { content: item2.tootip }, /* @__PURE__ */ React__default.createElement("div", null, item2.label)));
+      return /* @__PURE__ */ React__default.createElement(Select$1.Option, { key: item2.value, value: item2.value }, /* @__PURE__ */ React__default.createElement("div", null, item2.label));
     }))
   )), /* @__PURE__ */ React__default.createElement(Grid.Col, { span: 8, style: { paddingLeft: 5 } }, !hideRight && /* @__PURE__ */ React__default.createElement(
     Form.Item,
@@ -32063,7 +32122,7 @@ function FieldConfigItem(props) {
 function WidgetConfigPanel({
   containerHeight
 }) {
-  const { values, setFieldValue } = useEditorContext();
+  const { values, setFieldValue, getFieldValue } = useEditorContext();
   const widgetElement = values.widgetElement;
   if (!widgetElement) {
     throw new Error(`Invalid widgetElement`);
@@ -32097,6 +32156,11 @@ function WidgetConfigPanel({
     },
     [setFieldValue, widgetElement]
   );
+  const contentEditable = getFieldValue(
+    null,
+    `widgetElement.data.contentEditable`
+  );
+  console.log("contentEditable", contentEditable);
   return /* @__PURE__ */ React__default.createElement(AttributesPanelWrapper, null, /* @__PURE__ */ React__default.createElement(
     Tabs,
     {
@@ -32149,11 +32213,19 @@ function WidgetConfigPanel({
         AttributeField.SwitchField,
         {
           name: "widgetElement.data.contentEditable",
-          label: "Content editable",
+          label: /* @__PURE__ */ React__default.createElement(Space, null, t("Content editable"), /* @__PURE__ */ React__default.createElement(
+            Tooltip,
+            {
+              content: t(
+                `Once enabled, the widget's text and button blocks will be editable directly in the editor`
+              )
+            },
+            /* @__PURE__ */ React__default.createElement(IconQuestionCircle, { style: { fontSize: 16 } })
+          )),
           path: null,
           style: { position: "relative", top: 0 },
           formItem: {
-            layout: "horizontal",
+            layout: "inline",
             labelCol: {
               span: 10,
               style: {
@@ -32168,6 +32240,39 @@ function WidgetConfigPanel({
             }
           }
         }
+      ), !contentEditable && /* @__PURE__ */ React__default.createElement(
+        AttributeField.SwitchField,
+        {
+          name: "widgetElement.data.staticLogicEnabled",
+          label: /* @__PURE__ */ React__default.createElement(Space, null, t("Static logic enabled"), /* @__PURE__ */ React__default.createElement(
+            Tooltip,
+            {
+              content: t(
+                `If enabled, only the input value will be used as the data for dynamic rendering`
+              )
+            },
+            /* @__PURE__ */ React__default.createElement(IconQuestionCircle, { style: { fontSize: 16 } })
+          )),
+          path: null,
+          style: { position: "relative", top: 0, marginBottom: 0 },
+          formItem: {
+            style: {},
+            layout: "inline",
+            labelCol: {
+              span: 10,
+              style: {
+                textAlign: "left",
+                paddingBottom: 50
+              }
+            },
+            wrapperCol: {
+              span: 12,
+              style: {
+                textAlign: "left"
+              }
+            }
+          }
+        }
       )))
     ),
     /* @__PURE__ */ React__default.createElement(
@@ -36773,7 +36878,13 @@ const useCreateConfig$1 = (_k) => {
 };
 const Layout$1 = ({ children, footer, header }) => {
   const { inited, values } = useEditorContext();
-  const { showSidebar = true, widgetMode, height, compact } = useEditorProps();
+  const {
+    showSidebar = true,
+    widgetMode,
+    height,
+    compact,
+    localeData
+  } = useEditorProps();
   const { isLayerItemDragging, zoom, setZoom } = useEditorThemeState();
   const pageDataWidth = parseInt(values.content.attributes.width || "600") || 600;
   const editor = useSlate();
@@ -36886,6 +36997,9 @@ const Layout$1 = ({ children, footer, header }) => {
     widgetMode,
     zoom
   ]);
+  if (localeData) {
+    I18nManager.setLocaleData(localeData);
+  }
   if (!root2 || !inited)
     return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, layoutContent);
   return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, layoutContent, /* @__PURE__ */ React__default.createElement(SharedComponents.HoveringToolbar, null), /* @__PURE__ */ React__default.createElement(SharedComponents.Controller, null), /* @__PURE__ */ React__default.createElement(SharedComponents.Hotkeys, null), /* @__PURE__ */ React__default.createElement(AutoDeselectElement$1, null), /* @__PURE__ */ React__default.createElement("style", null, styleText$g));

package/package.json

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