ugcinc-render 1.8.218 → 1.8.219

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/index.js +7 -29
  2. package/dist/index.mjs +7 -29
  3. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -945,17 +945,7 @@ function TextElement({ segment, scale = 1 }) {
945
945
  minHeight: 0
946
946
  },
947
947
  ...strokeWidth > 0 && strokeColor && {
948
- textShadow: `
949
- -${strokeWidth}px -${strokeWidth}px 0 ${strokeColor},
950
- ${strokeWidth}px -${strokeWidth}px 0 ${strokeColor},
951
- -${strokeWidth}px ${strokeWidth}px 0 ${strokeColor},
952
- ${strokeWidth}px ${strokeWidth}px 0 ${strokeColor},
953
- 0 -${strokeWidth}px 0 ${strokeColor},
954
- 0 ${strokeWidth}px 0 ${strokeColor},
955
- -${strokeWidth}px 0 0 ${strokeColor},
956
- ${strokeWidth}px 0 0 ${strokeColor}
957
- `,
958
- WebkitTextStroke: `${strokeWidth}px ${strokeColor}`,
948
+ WebkitTextStroke: `${strokeWidth * 2}px ${strokeColor}`,
959
949
  paintOrder: "stroke fill"
960
950
  }
961
951
  }), [
@@ -2373,28 +2363,12 @@ function CaptionOverlay({ captions, style, previewTimeMs }) {
2373
2363
  borderRadius: scaledBorderRadius
2374
2364
  };
2375
2365
  const numericFontWeight = style.fontWeight === "black" ? 900 : style.fontWeight === "bold" ? 700 : 400;
2376
- const buildStrokeShadow = () => {
2377
- if (scaledStrokeWidth <= 0) return "none";
2378
- const sw = scaledStrokeWidth;
2379
- const sc = style.strokeColor;
2380
- return `
2381
- -${sw}px -${sw}px 0 ${sc},
2382
- ${sw}px -${sw}px 0 ${sc},
2383
- -${sw}px ${sw}px 0 ${sc},
2384
- ${sw}px ${sw}px 0 ${sc},
2385
- 0 -${sw}px 0 ${sc},
2386
- 0 ${sw}px 0 ${sc},
2387
- -${sw}px 0 0 ${sc},
2388
- ${sw}px 0 0 ${sc}
2389
- `;
2390
- };
2391
2366
  const textContainerStyles = {
2392
2367
  fontFamily: `"${style.fontName}", sans-serif`,
2393
2368
  fontSize: scaledFontSize,
2394
2369
  fontWeight: numericFontWeight,
2395
2370
  lineHeight: 1.2,
2396
- wordBreak: "break-word",
2397
- textShadow: buildStrokeShadow()
2371
+ wordBreak: "break-word"
2398
2372
  };
2399
2373
  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { style: containerStyles, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { style: textContainerStyles, children: currentPage.words.map((word, index) => {
2400
2374
  const isActive = currentMs >= word.startMs && currentMs <= word.endMs;
@@ -2423,7 +2397,11 @@ function CaptionOverlay({ captions, style, previewTimeMs }) {
2423
2397
  color,
2424
2398
  display: "inline-block",
2425
2399
  transform: `scale(${scale})`,
2426
- transformOrigin: "center center"
2400
+ transformOrigin: "center center",
2401
+ ...scaledStrokeWidth > 0 && {
2402
+ WebkitTextStroke: `${scaledStrokeWidth * 2}px ${style.strokeColor}`,
2403
+ paintOrder: "stroke fill"
2404
+ }
2427
2405
  },
2428
2406
  children: word.word
2429
2407
  }
package/dist/index.mjs CHANGED
@@ -508,17 +508,7 @@ function TextElement({ segment, scale = 1 }) {
508
508
  minHeight: 0
509
509
  },
510
510
  ...strokeWidth > 0 && strokeColor && {
511
- textShadow: `
512
- -${strokeWidth}px -${strokeWidth}px 0 ${strokeColor},
513
- ${strokeWidth}px -${strokeWidth}px 0 ${strokeColor},
514
- -${strokeWidth}px ${strokeWidth}px 0 ${strokeColor},
515
- ${strokeWidth}px ${strokeWidth}px 0 ${strokeColor},
516
- 0 -${strokeWidth}px 0 ${strokeColor},
517
- 0 ${strokeWidth}px 0 ${strokeColor},
518
- -${strokeWidth}px 0 0 ${strokeColor},
519
- ${strokeWidth}px 0 0 ${strokeColor}
520
- `,
521
- WebkitTextStroke: `${strokeWidth}px ${strokeColor}`,
511
+ WebkitTextStroke: `${strokeWidth * 2}px ${strokeColor}`,
522
512
  paintOrder: "stroke fill"
523
513
  }
524
514
  }), [
@@ -1418,28 +1408,12 @@ function CaptionOverlay({ captions, style, previewTimeMs }) {
1418
1408
  borderRadius: scaledBorderRadius
1419
1409
  };
1420
1410
  const numericFontWeight = style.fontWeight === "black" ? 900 : style.fontWeight === "bold" ? 700 : 400;
1421
- const buildStrokeShadow = () => {
1422
- if (scaledStrokeWidth <= 0) return "none";
1423
- const sw = scaledStrokeWidth;
1424
- const sc = style.strokeColor;
1425
- return `
1426
- -${sw}px -${sw}px 0 ${sc},
1427
- ${sw}px -${sw}px 0 ${sc},
1428
- -${sw}px ${sw}px 0 ${sc},
1429
- ${sw}px ${sw}px 0 ${sc},
1430
- 0 -${sw}px 0 ${sc},
1431
- 0 ${sw}px 0 ${sc},
1432
- -${sw}px 0 0 ${sc},
1433
- ${sw}px 0 0 ${sc}
1434
- `;
1435
- };
1436
1411
  const textContainerStyles = {
1437
1412
  fontFamily: `"${style.fontName}", sans-serif`,
1438
1413
  fontSize: scaledFontSize,
1439
1414
  fontWeight: numericFontWeight,
1440
1415
  lineHeight: 1.2,
1441
- wordBreak: "break-word",
1442
- textShadow: buildStrokeShadow()
1416
+ wordBreak: "break-word"
1443
1417
  };
1444
1418
  return /* @__PURE__ */ jsx6("div", { style: containerStyles, children: /* @__PURE__ */ jsx6("div", { style: textContainerStyles, children: currentPage.words.map((word, index) => {
1445
1419
  const isActive = currentMs >= word.startMs && currentMs <= word.endMs;
@@ -1468,7 +1442,11 @@ function CaptionOverlay({ captions, style, previewTimeMs }) {
1468
1442
  color,
1469
1443
  display: "inline-block",
1470
1444
  transform: `scale(${scale})`,
1471
- transformOrigin: "center center"
1445
+ transformOrigin: "center center",
1446
+ ...scaledStrokeWidth > 0 && {
1447
+ WebkitTextStroke: `${scaledStrokeWidth * 2}px ${style.strokeColor}`,
1448
+ paintOrder: "stroke fill"
1449
+ }
1472
1450
  },
1473
1451
  children: word.word
1474
1452
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ugcinc-render",
3
- "version": "1.8.218",
3
+ "version": "1.8.219",
4
4
  "description": "Unified rendering package for UGC Inc - shared types, components, and compositions for pixel-perfect client/server rendering",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",