ugcinc-render 1.8.169 → 1.8.170

package/dist/index.js

@@ -5254,6 +5254,7 @@ var import_react10 = require("react");
 var import_remotion10 = require("remotion");
 
 // src/compositions/IMessageDmComposition/convertPropsToElements.ts
+var SENDER_IMAGE_INPUT_ID_PREFIX = "sender-image-";
 var MESSAGE_DEFAULTS2 = {
   // Message area bounds
   messageAreaTop: 450,
@@ -5553,9 +5554,9 @@ function generateMessageElements2(props, calculatedMessages) {
         width: cm.imageWidth,
         height: cm.imageHeight,
         zIndex: 5 + i,
-        url: cm.message.imageUrl,
+        inputId: `${SENDER_IMAGE_INPUT_ID_PREFIX}${cm.message.id}`,
         borderRadius: senderImageBorderRadius,
-        objectFit: "cover"
+        fit: "cover"
       });
     }
     const radii = getCornerRadii2(cm, bubbleRadiusNormal, bubbleRadiusGrouped);
@@ -5591,14 +5592,26 @@ function generateMessageElements2(props, calculatedMessages) {
   }
   return elements;
 }
+function buildImageUrls2(props) {
+  const imageUrls = {};
+  const messages = props.messages ?? [];
+  for (const message of messages) {
+    if (message.imageUrl && message.sender === "user") {
+      imageUrls[`${SENDER_IMAGE_INPUT_ID_PREFIX}${message.id}`] = message.imageUrl;
+    }
+  }
+  return imageUrls;
+}
 function convertPropsToElements2(props) {
   const width = props.width ?? 1206;
   const height = props.height ?? 2622;
   const calculatedMessages = calculateMessagePositions2(props);
   const messageElements = generateMessageElements2(props, calculatedMessages);
   messageElements.sort((a, b) => (a.zIndex ?? 0) - (b.zIndex ?? 0));
+  const imageUrls = buildImageUrls2(props);
   return {
     elements: messageElements,
+    imageUrls,
     width,
     height
   };
@@ -5786,7 +5799,7 @@ var IMessageDmComposition = (props) => {
   }), [props]);
   const conversionResult = (0, import_react10.useMemo)(() => {
     if (!fontsLoaded) {
-      return { elements: [], width: mergedProps.width ?? 1206, height: mergedProps.height ?? 2622 };
+      return { elements: [], imageUrls: {}, width: mergedProps.width ?? 1206, height: mergedProps.height ?? 2622 };
     }
     return convertPropsToElements2(mergedProps);
   }, [mergedProps, fontsLoaded]);
@@ -6077,6 +6090,7 @@ var IMessageDmComposition = (props) => {
             width,
             height,
             elements: conversionResult.elements,
+            imageUrls: conversionResult.imageUrls,
             backgroundColor: "transparent"
           }
         )

package/dist/index.mjs

@@ -4300,6 +4300,7 @@ import { useEffect as useEffect4, useMemo as useMemo8, useState as useState4 } f
 import { Img as Img5, staticFile as staticFile3, delayRender as delayRender3, continueRender as continueRender3 } from "remotion";
 
 // src/compositions/IMessageDmComposition/convertPropsToElements.ts
+var SENDER_IMAGE_INPUT_ID_PREFIX = "sender-image-";
 var MESSAGE_DEFAULTS2 = {
   // Message area bounds
   messageAreaTop: 450,
@@ -4599,9 +4600,9 @@ function generateMessageElements2(props, calculatedMessages) {
         width: cm.imageWidth,
         height: cm.imageHeight,
         zIndex: 5 + i,
-        url: cm.message.imageUrl,
+        inputId: `${SENDER_IMAGE_INPUT_ID_PREFIX}${cm.message.id}`,
         borderRadius: senderImageBorderRadius,
-        objectFit: "cover"
+        fit: "cover"
       });
     }
     const radii = getCornerRadii2(cm, bubbleRadiusNormal, bubbleRadiusGrouped);
@@ -4637,14 +4638,26 @@ function generateMessageElements2(props, calculatedMessages) {
   }
   return elements;
 }
+function buildImageUrls2(props) {
+  const imageUrls = {};
+  const messages = props.messages ?? [];
+  for (const message of messages) {
+    if (message.imageUrl && message.sender === "user") {
+      imageUrls[`${SENDER_IMAGE_INPUT_ID_PREFIX}${message.id}`] = message.imageUrl;
+    }
+  }
+  return imageUrls;
+}
 function convertPropsToElements2(props) {
   const width = props.width ?? 1206;
   const height = props.height ?? 2622;
   const calculatedMessages = calculateMessagePositions2(props);
   const messageElements = generateMessageElements2(props, calculatedMessages);
   messageElements.sort((a, b) => (a.zIndex ?? 0) - (b.zIndex ?? 0));
+  const imageUrls = buildImageUrls2(props);
   return {
     elements: messageElements,
+    imageUrls,
     width,
     height
   };
@@ -4832,7 +4845,7 @@ var IMessageDmComposition = (props) => {
   }), [props]);
   const conversionResult = useMemo8(() => {
     if (!fontsLoaded) {
-      return { elements: [], width: mergedProps.width ?? 1206, height: mergedProps.height ?? 2622 };
+      return { elements: [], imageUrls: {}, width: mergedProps.width ?? 1206, height: mergedProps.height ?? 2622 };
     }
     return convertPropsToElements2(mergedProps);
   }, [mergedProps, fontsLoaded]);
@@ -5123,6 +5136,7 @@ var IMessageDmComposition = (props) => {
             width,
             height,
             elements: conversionResult.elements,
+            imageUrls: conversionResult.imageUrls,
             backgroundColor: "transparent"
           }
         )

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ugcinc-render",
-  "version": "1.8.169",
+  "version": "1.8.170",
   "description": "Unified rendering package for UGC Inc - shared types, components, and compositions for pixel-perfect client/server rendering",
   "main": "dist/index.js",
   "module": "dist/index.mjs",