@remotion/web-renderer 4.0.452 → 4.0.454

package/dist/esm/index.mjs

@@ -3434,6 +3434,30 @@ function skipToNextNonDescendant(treeWalker) {
 }
 
 // src/get-biggest-bounding-client-rect.ts
+var getTextOverflowForLineHeight = (computedStyle) => {
+  const { lineHeight } = computedStyle;
+  const fontSize = parseFloat(computedStyle.fontSize);
+  if (!fontSize || isNaN(fontSize)) {
+    return { top: 0, bottom: 0 };
+  }
+  let lineHeightValue;
+  if (lineHeight === "normal") {
+    return { top: 0, bottom: 0 };
+  }
+  if (lineHeight.endsWith("px")) {
+    lineHeightValue = parseFloat(lineHeight) / fontSize;
+  } else {
+    lineHeightValue = parseFloat(lineHeight);
+    if (lineHeight.endsWith("%")) {
+      lineHeightValue /= 100;
+    }
+  }
+  if (isNaN(lineHeightValue) || lineHeightValue >= 1) {
+    return { top: 0, bottom: 0 };
+  }
+  const overflow = (1 - lineHeightValue) * fontSize;
+  return { top: overflow, bottom: overflow };
+};
 var getBiggestBoundingClientRect = (element) => {
   const treeWalker = document.createTreeWalker(element, NodeFilter.SHOW_ELEMENT);
   let mostLeft = Infinity;
@@ -3445,6 +3469,7 @@ var getBiggestBoundingClientRect = (element) => {
     const outlineWidth = parseOutlineWidth(computedStyle.outlineWidth);
     const outlineOffset = parseOutlineOffset(computedStyle.outlineOffset);
     const rect = treeWalker.currentNode.getBoundingClientRect();
+    const textOverflow = getTextOverflowForLineHeight(computedStyle);
     const shadows = parseBoxShadow(computedStyle.boxShadow);
     let shadowLeft = 0;
     let shadowRight = 0;
@@ -3459,9 +3484,9 @@ var getBiggestBoundingClientRect = (element) => {
       }
     }
     mostLeft = Math.min(mostLeft, rect.left - outlineOffset - outlineWidth - shadowLeft);
-    mostTop = Math.min(mostTop, rect.top - outlineOffset - outlineWidth - shadowTop);
+    mostTop = Math.min(mostTop, rect.top - outlineOffset - outlineWidth - shadowTop - textOverflow.top);
     mostRight = Math.max(mostRight, rect.right + outlineOffset + outlineWidth + shadowRight);
-    mostBottom = Math.max(mostBottom, rect.bottom + outlineOffset + outlineWidth + shadowBottom);
+    mostBottom = Math.max(mostBottom, rect.bottom + outlineOffset + outlineWidth + shadowBottom + textOverflow.bottom);
     if (computedStyle.overflow === "hidden") {
       if (!skipToNextNonDescendant(treeWalker)) {
         break;

package/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/web-renderer"
 	},
 	"name": "@remotion/web-renderer",
-	"version": "4.0.452",
+	"version": "4.0.454",
 	"main": "dist/index.js",
 	"type": "module",
 	"scripts": {
@@ -19,22 +19,22 @@
 	"author": "Remotion <jonny@remotion.dev>",
 	"license": "UNLICENSED",
 	"dependencies": {
-		"@mediabunny/mp3-encoder": "1.39.2",
-		"@mediabunny/aac-encoder": "1.39.2",
-		"@mediabunny/flac-encoder": "1.39.2",
-		"@remotion/licensing": "4.0.452",
-		"remotion": "4.0.452",
-		"mediabunny": "1.39.2"
+		"@mediabunny/mp3-encoder": "1.42.0",
+		"@mediabunny/aac-encoder": "1.42.0",
+		"@mediabunny/flac-encoder": "1.42.0",
+		"@remotion/licensing": "4.0.454",
+		"remotion": "4.0.454",
+		"mediabunny": "1.42.0"
 	},
 	"devDependencies": {
 		"@react-three/fiber": "9.2.0",
-		"@remotion/eslint-config-internal": "4.0.452",
-		"@remotion/paths": "4.0.452",
-		"@remotion/player": "4.0.452",
-		"@remotion/media": "4.0.452",
-		"@remotion/shapes": "4.0.452",
-		"@remotion/three": "4.0.452",
-		"@remotion/transitions": "4.0.452",
+		"@remotion/eslint-config-internal": "4.0.454",
+		"@remotion/paths": "4.0.454",
+		"@remotion/player": "4.0.454",
+		"@remotion/media": "4.0.454",
+		"@remotion/shapes": "4.0.454",
+		"@remotion/three": "4.0.454",
+		"@remotion/transitions": "4.0.454",
 		"@types/three": "0.170.0",
 		"@typescript/native-preview": "7.0.0-dev.20260217.1",
 		"@vitejs/plugin-react": "4.3.4",

package/dist/drawing/handle-filter.d.ts

@@ -1 +0,0 @@
-export declare const getPrecomposeRectForFilter: (element: HTMLElement | SVGElement) => DOMRect;