easy-email-pro-theme 1.32.0 → 1.33.0

package/lib/index.js

@@ -1640,13 +1640,15 @@ function useFontFamily() {
     if (addFonts) {
       const options2 = addFonts.map((item2) => ({
         value: item2.name,
-        label: item2.name
+        label: item2.name,
+        href: item2.href
       }));
       fonts.unshift(...options2);
     }
     return fonts.map((item2) => ({
       value: item2.value,
-      label: /* @__PURE__ */ React__default.createElement("span", { style: { fontFamily: item2.value } }, item2.label)
+      label: /* @__PURE__ */ React__default.createElement("span", { style: { fontFamily: item2.value } }, item2.label),
+      href: item2.href
     }));
   }, [addFonts, propsFontList]);
   return {
@@ -7326,7 +7328,7 @@ function SortableTree(_g) {
           onRemove: removable ? () => handleRemove(props) : void 0
         }
       );
-    }), createPortal(
+    }), /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, createPortal(
       /* @__PURE__ */ React__default.createElement(
         DragOverlay,
         {
@@ -7353,7 +7355,7 @@ function SortableTree(_g) {
         ) : null
       ),
       document.body
-    ))
+    )))
   );
   function handleDragStart({ active: { id: activeId2 } }) {
     setActiveId(activeId2);
@@ -26340,6 +26342,18 @@ const italicAdapter = {
     return "italic";
   }
 };
+const arrayStringAdapter = {
+  formatter(val) {
+    if (!isString$1(val))
+      return [];
+    return val.split(",").map((item2) => item2.trim());
+  },
+  normalize(val) {
+    if (!Array.isArray(val))
+      return void 0;
+    return val.join(",");
+  }
+};
 const transparentIcon = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAABAElEQVRIie2WwW7CMBBEZ8NKOJd8CPRABVVJ+fxUUEgQPbT9kBziFAWbU4FkjXCBICExtxk9Z7KxZYWSJLFoiJmbEYwxMMaI/JC1dv+oQmvE8QTWWvDo5VUs/FwtHSUWvmxTwUniQhHRdUuIyJm3Oslf6dVLmtMQEfhjNhVgFEUiq6oCvmye5zXPSnUF1Os/iSxLF/BlZ9P3mm9tTw4/231uvKuo9RIA4MHzUITHrgpfNgxDFFrv/E0meZT8S/zz/SXCsvyVIDP82U7dr9cSGsdvIsvSBXzZm10rj5KzJf99AGTpXGRB4H4fF6uUgi7LfYnrCLq18eSAqtpAddXObwEoMVtvVloS0QAAAABJRU5ErkJggg==";
 const transparentColor$1 = "rgba(0,0,0,0)";
 function ColorPicker$1(props) {
@@ -36195,16 +36209,48 @@ function Border(props) {
   }, [isEnabledBorder, label, name, path2]);
 }
 function FontFamily$1(props) {
+  const { values: values2, setFieldValue } = useEditorContext();
   const { fontList } = useFontFamily();
+  const onChange = useEventCallback((val) => {
+    const webFontList = val.split(",").map((item2) => {
+      const match2 = fontList.find(
+        (font) => font.value === item2 && !!font.href
+      );
+      if (!match2)
+        return null;
+      return {
+        name: match2.value,
+        label: match2.label,
+        href: match2.href
+      };
+    }).filter(Boolean);
+    if (webFontList.length > 0) {
+      const fonts = cloneDeep(values2.content.data.fonts || []);
+      webFontList.forEach((item2) => {
+        if (!fonts.find((font) => font.name === item2.name)) {
+          fonts.push({
+            name: item2.name,
+            href: item2.href
+          });
+        }
+      });
+      setFieldValue([0], "data.fonts", fonts);
+    }
+  });
   return useMemo$1(
     () => /* @__PURE__ */ React__default.createElement(
       AttributeField.SelectField,
-      __spreadValues({
+      __spreadProps(__spreadValues({
         label: t("Font family"),
         options: fontList
-      }, props)
+      }, props), {
+        mode: "multiple",
+        allowCreate: true,
+        onChange,
+        formItem: __spreadValues(__spreadValues({}, arrayStringAdapter), props.formItem)
+      })
     ),
-    [fontList, props]
+    [fontList, onChange, props]
   );
 }
 function FontSize$1(props) {