ugcinc 4.5.68 → 4.5.70

package/dist/render/components/TextElement.js

@@ -45,6 +45,7 @@ const react_1 = __importStar(require("react"));
 const defaults_1 = require("../utils/defaults");
 const fonts_1 = require("../utils/fonts");
 const text_1 = require("../utils/text");
+const emoji_1 = require("../utils/emoji");
 /**
  * Calculate the actual width for auto-width text AND the line breaks.
  * Uses DOM-based measurement to ensure the same fonts are used as CSS rendering.
@@ -161,6 +162,18 @@ function calculateAutoWidthAndLines({ text, maxWidth, paddingLeft, paddingRight,
     const calculatedWidth = Math.min(widestLineWidth + paddingLeft + paddingRight, maxWidth);
     return { width: calculatedWidth, lines };
 }
+/**
+ * Replace emoji characters with spaces for the stroke layer.
+ * Spaces have zero alpha for the emoji glyphs, so feMorphology won't dilate them.
+ * Returns a plain string — no DOM changes, preserving identical vertical metrics.
+ */
+function getStrokeText(text) {
+    if (!(0, emoji_1.hasEmoji)(text))
+        return text;
+    return (0, emoji_1.splitTextAndEmojis)(text)
+        .map(part => part.type === 'emoji' ? ' ' : part.content)
+        .join('');
+}
 /**
  * TextElement renders text with full styling support including:
  * - Font family, size, weight, color
@@ -366,6 +379,7 @@ function TextElement({ segment, scale = 1 }) {
     const strokeFilterSvg = hasStroke ? ((0, jsx_runtime_1.jsx)("svg", { style: { position: 'absolute', width: 0, height: 0, overflow: 'hidden' }, "aria-hidden": "true", children: (0, jsx_runtime_1.jsx)("defs", { children: (0, jsx_runtime_1.jsxs)("filter", { id: filterId, x: `-${strokePadPct}%`, y: `-${strokePadPct}%`, width: `${100 + 2 * strokePadPct}%`, height: `${100 + 2 * strokePadPct}%`, children: [(0, jsx_runtime_1.jsx)("feMorphology", { in: "SourceAlpha", operator: "dilate", radius: strokeWidth, result: "dilated" }), (0, jsx_runtime_1.jsx)("feFlood", { floodColor: strokeColor, result: "color" }), (0, jsx_runtime_1.jsx)("feComposite", { in: "color", in2: "dilated", operator: "in" })] }) }) })) : null;
     if (autoWidth) {
         const textContent = calculatedLines.map((line, index) => ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [line, index < calculatedLines.length - 1 && (0, jsx_runtime_1.jsx)("br", {})] }, index)));
+        const strokeContent = calculatedLines.map((line, index) => ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [getStrokeText(line), index < calculatedLines.length - 1 && (0, jsx_runtime_1.jsx)("br", {})] }, index)));
         if (backgroundColor) {
             return ((0, jsx_runtime_1.jsx)("div", { style: positioningContainerStyle, children: (0, jsx_runtime_1.jsxs)("div", { style: {
                         width: calculatedWidth,
@@ -373,10 +387,10 @@ function TextElement({ segment, scale = 1 }) {
                         backgroundColor: (0, text_1.hexToRgba)(backgroundColor, backgroundOpacity),
                         borderRadius: borderRadiusStyle,
                         ...(hasStroke && { position: 'relative' }),
-                    }, children: [strokeFilterSvg, strokeTextStyle && (0, jsx_runtime_1.jsx)("div", { style: strokeTextStyle, "aria-hidden": "true", children: textContent }), (0, jsx_runtime_1.jsx)("div", { style: textStyle, children: textContent })] }) }));
+                    }, children: [strokeFilterSvg, strokeTextStyle && (0, jsx_runtime_1.jsx)("div", { style: strokeTextStyle, "aria-hidden": "true", children: strokeContent }), (0, jsx_runtime_1.jsx)("div", { style: textStyle, children: textContent })] }) }));
         }
-        return ((0, jsx_runtime_1.jsx)("div", { style: positioningContainerStyle, children: (0, jsx_runtime_1.jsxs)("div", { style: { width: calculatedWidth, maxWidth: width, ...(hasStroke && { position: 'relative' }) }, children: [strokeFilterSvg, strokeTextStyle && (0, jsx_runtime_1.jsx)("div", { style: strokeTextStyle, "aria-hidden": "true", children: textContent }), (0, jsx_runtime_1.jsx)("div", { style: textStyle, children: textContent })] }) }));
+        return ((0, jsx_runtime_1.jsx)("div", { style: positioningContainerStyle, children: (0, jsx_runtime_1.jsxs)("div", { style: { width: calculatedWidth, maxWidth: width, ...(hasStroke && { position: 'relative' }) }, children: [strokeFilterSvg, strokeTextStyle && (0, jsx_runtime_1.jsx)("div", { style: strokeTextStyle, "aria-hidden": "true", children: strokeContent }), (0, jsx_runtime_1.jsx)("div", { style: textStyle, children: textContent })] }) }));
     }
-    return ((0, jsx_runtime_1.jsx)("div", { style: positioningContainerStyle, children: (0, jsx_runtime_1.jsxs)("div", { style: { ...backgroundBoxStyle, ...(hasStroke && { position: 'relative' }) }, children: [strokeFilterSvg, strokeTextStyle && (0, jsx_runtime_1.jsx)("div", { style: strokeTextStyle, "aria-hidden": "true", children: segment.text }), (0, jsx_runtime_1.jsx)("div", { style: textStyle, children: segment.text })] }) }));
+    return ((0, jsx_runtime_1.jsx)("div", { style: positioningContainerStyle, children: (0, jsx_runtime_1.jsxs)("div", { style: { ...backgroundBoxStyle, ...(hasStroke && { position: 'relative' }) }, children: [strokeFilterSvg, strokeTextStyle && (0, jsx_runtime_1.jsx)("div", { style: strokeTextStyle, "aria-hidden": "true", children: getStrokeText(segment.text) }), (0, jsx_runtime_1.jsx)("div", { style: textStyle, children: segment.text })] }) }));
 }
 exports.default = TextElement;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ugcinc",
-  "version": "4.5.68",
+  "version": "4.5.70",
   "description": "TypeScript/JavaScript client for the UGC Inc API",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",