@versa_ai/vmml-editor 1.0.23 → 1.0.25

package/.turbo/turbo-build.log

@@ -1,5 +1,5 @@
 
-> @versa_ai/vmml-editor@1.0.23 build D:\code\work\vmml-player\packages\editor
+> @versa_ai/vmml-editor@1.0.25 build D:\code\work\vmml-player\packages\editor
 > tsup
 
 CLI Building entry: src/index.tsx
@@ -124,12 +124,12 @@ More info and automated migrator: https://sass-lang.com/d/slash-div [35
 
 
 
-ESM dist\index.mjs     113.36 KB
-ESM dist\index.mjs.map 217.80 KB
-ESM ⚡️ Build success in 820ms
-CJS dist\index.js     115.00 KB
-CJS dist\index.js.map 218.10 KB
-CJS ⚡️ Build success in 821ms
-DTS ⚡️ Build success in 2291ms
+ESM dist\index.mjs     113.59 KB
+ESM dist\index.mjs.map 218.26 KB
+ESM ⚡️ Build success in 3284ms
+CJS dist\index.js     115.23 KB
+CJS dist\index.js.map 218.55 KB
+CJS ⚡️ Build success in 3284ms
+DTS ⚡️ Build success in 5029ms
 DTS dist\index.d.ts  158.00 B
 DTS dist\index.d.mts 158.00 B

package/dist/index.js

@@ -1226,6 +1226,7 @@ var EditorCanvas = react.forwardRef(
       });
       if (editRenderTime.current === time) {
         canvas.add(...objects).renderAll();
+        checkObjectInPoint();
       }
     };
     const createImageFromClip = (clip, fc2) => {
@@ -1320,12 +1321,13 @@ var EditorCanvas = react.forwardRef(
         }
         const { width, height } = vmml.template.dimension;
         const fontSize = vmmlUtils.getFontSize(width, height);
-        const { textContent, backgroundColor, textColor, posParam, fontAssetUrl, alignType, strokeColor, strokeWidth } = clip.textClip;
+        const { textContent, backgroundColor, textColor, posParam, fontAssetUrl, alignType, strokeColor, strokeWidth, letterSpacing } = clip.textClip;
         const scaleX = posParam.scaleX * fontSize / 22 / widthScaleRef.current;
         const scaleY = posParam.scaleY * fontSize / 22 / heightScaleRef.current;
         const strokeW = strokeWidth * 26 * 1.5 / fontSize;
+        const letterSpace = letterSpacing * 22 / fontSize;
         const left = canvasSize.width * posParam.centerX;
-        const top = canvasSize.height * posParam.centerY;
+        const top = canvasSize.height * posParam.centerY - 2;
         const bgColor = backgroundColor ? vmmlUtils.argbToRgba(backgroundColor) : "transparent";
         const stColor = strokeColor ? vmmlUtils.argbToRgba(strokeColor) : "transparent";
         const isAiError = textContent === "\u8BF7\u8F93\u5165\u6587\u6848" && textColor === "#00000000";
@@ -1336,7 +1338,7 @@ var EditorCanvas = react.forwardRef(
           colorName: "custom",
           textAlign: alignType === 1 ? "center" : alignType === 2 ? "right" : "left"
         };
-        const textImgData = await createTextImg({ textContent, bgColor, stColor, strokeW, textColor: textFill, fontAssetUrl, textBasicInfo });
+        const textImgData = await createTextImg({ textContent, bgColor, stColor, strokeW, textColor: textFill, fontAssetUrl, textBasicInfo, letterSpacing: letterSpace });
         const fontJSON = localStorage.getItem("VMML_PLAYER_FONTSMAP");
         let fontMap = {};
         try {
@@ -1440,7 +1442,7 @@ var EditorCanvas = react.forwardRef(
         return null;
       }
     };
-    const createTextImg = async ({ textContent, bgColor, textColor, stColor, strokeW, fontAssetUrl = null, textBasicInfo }) => {
+    const createTextImg = async ({ textContent, bgColor, textColor, stColor, strokeW, fontAssetUrl = null, textBasicInfo, letterSpacing }) => {
       const fontBase64 = await loadFont(fontAssetUrl);
       const container = document.createElement("div");
       container.style.backgroundColor = bgColor;
@@ -1458,6 +1460,7 @@ var EditorCanvas = react.forwardRef(
         p.style.whiteSpace = "nowrap";
         p.style.margin = "0";
         p.style.padding = "0";
+        if (letterSpacing) p.style.letterSpacing = `${letterSpacing}px`;
         p.style.zIndex = "2";
         const fill = document.createElement("span");
         fill.textContent = line || " ";
@@ -2702,7 +2705,7 @@ var EditorFn = ({
     if (editableArray.length && (vmmlState == null ? void 0 : vmmlState.template)) {
       initCanEditClips(vmmlState.template.tracks);
     }
-  }, [editableArray, refreshEdit]);
+  }, [editableArray, refreshEdit, vmmlState]);
   react.useEffect(() => {
     var _a2;
     if (propVmml) {