@versa_ai/vmml-editor 1.0.22 → 1.0.24

package/dist/index.mjs

@@ -1224,6 +1224,7 @@ var EditorCanvas = forwardRef(
       });
       if (editRenderTime.current === time) {
         canvas.add(...objects).renderAll();
+        checkObjectInPoint();
       }
     };
     const createImageFromClip = (clip, fc2) => {
@@ -1405,9 +1406,10 @@ var EditorCanvas = forwardRef(
       if (lower.includes(".ttf")) return "truetype";
       return null;
     };
-    const embedFontInSVG = async (svgString, url) => {
+    const embedFontInSVG = async (svgString, url, fontBase64) => {
       if (url) {
-        const res = await urlToBlob({ url });
+        let res = fontBase64;
+        if (!res) await urlToBlob({ url });
         const format = detectFontFormat(url);
         const fontFamilyName = getFontFamilyName(url);
         const srcValue = format ? `url('${res}') format('${format}')` : `url('${res}')`;
@@ -1423,7 +1425,22 @@ var EditorCanvas = forwardRef(
       }
       return svgString;
     };
+    const loadFont = async (url) => {
+      if (!url) return null;
+      try {
+        const base64 = await urlToBlob({ url });
+        const fontFamilyName = getFontFamilyName(url);
+        const format = detectFontFormat(url);
+        const fontFace = new FontFace(fontFamilyName, `url(${base64})${format ? ` format('${format}')` : ""}`);
+        await fontFace.load();
+        document.fonts.add(fontFace);
+        return base64;
+      } catch (e) {
+        return null;
+      }
+    };
     const createTextImg = async ({ textContent, bgColor, textColor, stColor, strokeW, fontAssetUrl = null, textBasicInfo }) => {
+      const fontBase64 = await loadFont(fontAssetUrl);
       const container = document.createElement("div");
       container.style.backgroundColor = bgColor;
       container.style.boxSizing = "content-box";
@@ -1465,7 +1482,7 @@ var EditorCanvas = forwardRef(
       const { width, height } = container == null ? void 0 : container.getBoundingClientRect();
       const dataurl = await toSvg(container);
       document.body.removeChild(container);
-      const base64Image = await embedFontInSVG(dataurl, fontAssetUrl);
+      const base64Image = await embedFontInSVG(dataurl, fontAssetUrl, fontBase64);
       return { base64Image, height, width };
     };
     const createText = async ({ textContent, bgColor, textColor, position, textBasicInfo, id }, fc2) => {
@@ -2684,7 +2701,7 @@ var EditorFn = ({
     if (editableArray.length && (vmmlState == null ? void 0 : vmmlState.template)) {
       initCanEditClips(vmmlState.template.tracks);
     }
-  }, [editableArray, refreshEdit]);
+  }, [editableArray, refreshEdit, vmmlState]);
   useEffect(() => {
     var _a2;
     if (propVmml) {