easy-email-extensions 3.1.54 → 3.1.60

package/lib/hooks/useFontFamily.d.ts

@@ -0,0 +1,6 @@
+export declare function useFontFamily(): {
+    fontList: {
+        value: string;
+        label: string;
+    }[];
+};

package/lib/index2.js

@@ -55,12 +55,12 @@ var __async = (__this, __arguments, generator) => {
 };
 import * as React from "react";
 import React__default, { Children, isValidElement, cloneElement, createContext, useContext, Component, useMemo, memo, forwardRef, useEffect, useRef, useLayoutEffect, useState, createRef, useImperativeHandle, PureComponent, useCallback, useReducer, Fragment, createElement, Suspense } from "react";
-import { IconFont, useEditorProps, Stack as Stack$6, getBlockNodeByIdx, useBlock, getEditNode, getEditContent, TextStyle, useFocusIdx, useEditorContext, getShadowRoot, FIXED_CONTAINER_ID, useFocusBlockLayout, scrollBlockEleIntoView, useHoverIdx, useDataTransfer, useRefState, getBlockNodeByChildEle, getDirectionPosition, DATA_ATTRIBUTE_DROP_CONTAINER, BlockAvatarWrapper, getEditorRoot, useActiveTab, ActiveTabKeys } from "easy-email-editor";
+import { IconFont, useEditorProps, Stack as Stack$6, getBlockNodeByIdx, useBlock, getEditNode, getEditContent, TextStyle, useEditorContext, useFocusIdx, getShadowRoot, FIXED_CONTAINER_ID, useFocusBlockLayout, scrollBlockEleIntoView, useHoverIdx, useDataTransfer, useRefState, getBlockNodeByChildEle, getDirectionPosition, DATA_ATTRIBUTE_DROP_CONTAINER, BlockAvatarWrapper, getEditorRoot, useActiveTab, ActiveTabKeys } from "easy-email-editor";
 import { BasicType, ImageManager, BlockManager, createBlockDataByType, getParentByIdx, getParentIdx, getValueByIdx, getIndexByIdx, getSiblingIdx, getNodeIdxFromClassName, getNodeIdxClassName, getPageIdx, getChildIdx, MjmlToJson, JsonToMjml, getNodeTypeFromClassName } from "easy-email-core";
 import ReactDOM, { findDOMNode, createPortal } from "react-dom";
 import { useField, Field, useForm as useForm$1, Form as Form$3, version as version$2, useFormState } from "react-final-form";
 var index$2 = "";
-const title = "_title_15b2l_1";
+const title = "_title_1f523_1";
 var styles$6 = {
   title
 };
@@ -38408,14 +38408,14 @@ function RadioGroup(props) {
     value: item2.value
   }, item2.label))));
 }
-const helperText = "_helperText_fadvl_1";
-const labelHidden = "_label-hidden_fadvl_9";
-const editTab = "_editTab_fadvl_20";
-const inputWithUnit = "_inputWithUnit_fadvl_27";
-const inputWithUnitSelectOption = "_inputWithUnitSelectOption_fadvl_35";
+const helperText = "_helperText_k05ys_1";
+const labelHidden = "_label-hidden_k05ys_9";
+const editTab = "_editTab_k05ys_20";
+const inputWithUnit = "_inputWithUnit_k05ys_27";
+const inputWithUnitSelectOption = "_inputWithUnitSelectOption_k05ys_35";
 var styles$3 = {
   helperText,
-  "label-hidden": "_label-hidden_fadvl_9",
+  "label-hidden": "_label-hidden_k05ys_9",
   labelHidden,
   editTab,
   inputWithUnit,
@@ -38947,8 +38947,27 @@ function FontSizeList(props) {
     key: item2.value
   }, item2.label))));
 }
+function useFontFamily() {
+  const { fontList: defaultFontList } = useEditorProps();
+  const { pageData: pageData2 } = useEditorContext();
+  const addFonts = pageData2.data.value.fonts;
+  const fontList2 = useMemo(() => {
+    const fonts = [];
+    if (defaultFontList) {
+      fonts.push(...defaultFontList);
+    }
+    if (addFonts) {
+      const options2 = addFonts.map((item2) => ({ value: item2.name, label: item2.name }));
+      fonts.unshift(...options2);
+    }
+    return fonts;
+  }, [addFonts, defaultFontList]);
+  return {
+    fontList: fontList2
+  };
+}
 function FontFamily$1(props) {
-  const { fontList: fontList2 = [] } = useEditorProps();
+  const { fontList: fontList2 } = useFontFamily();
   return /* @__PURE__ */ React__default.createElement("div", {
     style: {
       maxWidth: 150,
@@ -39140,13 +39159,11 @@ function AddFont() {
         }, /* @__PURE__ */ React__default.createElement(Stack$6.Item, {
           fill: true
         }, /* @__PURE__ */ React__default.createElement(TextField, {
-          inline: true,
           name: `${focusIdx2}.data.value.fonts.${index2}.name`,
           label: "Name"
         })), /* @__PURE__ */ React__default.createElement(Stack$6.Item, {
           fill: true
         }, /* @__PURE__ */ React__default.createElement(TextField, {
-          inline: true,
           name: `${focusIdx2}.data.value.fonts.${index2}.href`,
           label: "Href"
         })), /* @__PURE__ */ React__default.createElement(Button$4, {
@@ -39217,8 +39234,8 @@ function EyeIcon() {
   });
 }
 function FontFamily() {
-  const { fontList: fontList2 = [] } = useEditorProps();
   const { focusIdx: focusIdx2 } = useFocusIdx();
+  const { fontList: fontList2 } = useFontFamily();
   return useMemo(() => {
     return /* @__PURE__ */ React__default.createElement(AutoCompleteField, {
       style: { minWidth: 100, flex: 1 },
@@ -42062,7 +42079,12 @@ function BlockLayer(props) {
       style: { fontSize: 12, color: "#999" }
     }), /* @__PURE__ */ React__default.createElement("div", {
       title: lodash.exports.isString(title2) ? title2 : "",
-      style: { overflow: "hidden", whiteSpace: "nowrap", width: "5em" }
+      style: {
+        overflow: "hidden",
+        whiteSpace: "nowrap",
+        width: "5em",
+        textOverflow: "ellipsis"
+      }
     }, /* @__PURE__ */ React__default.createElement(TextStyle, {
       size: "smallest"
     }, title2))), /* @__PURE__ */ React__default.createElement("div", {