ugcinc-render 1.5.15 → 1.5.17

package/dist/index.d.mts

@@ -955,9 +955,14 @@ declare function VideoElement({ segment, src, startFrame, durationInFrames, scal
  * Font utilities for the rendering system
  */
 
+/**
+ * Apple Color Emoji font name - used as fallback for emoji characters
+ */
+declare const APPLE_EMOJI_FONT = "\"Apple Color Emoji\"";
 /**
  * Font family CSS strings for each font type
  * These match the fonts registered in the rendering system
+ * Apple Color Emoji is added as a fallback for consistent emoji rendering
  */
 declare const FONT_FAMILIES: Record<FontType, string>;
 /**
@@ -984,6 +989,9 @@ declare const FONT_URLS: {
     apple: {
         regular: string;
     };
+    emoji: {
+        apple: string;
+    };
 };
 /**
  * Preload fonts for rendering
@@ -994,6 +1002,10 @@ declare function preloadFonts(): Promise<void>;
  * Check if fonts are loaded
  */
 declare function areFontsLoaded(): boolean;
+/**
+ * Debug utility to log current font status
+ */
+declare function debugFontStatus(): void;
 
 /**
  * Fit calculation utilities for media positioning
@@ -1290,34 +1302,6 @@ declare function generateSegmentId(): string;
  */
 declare function generateOverlayId(): string;
 
-/**
- * Emoji utilities for rendering Apple-style emojis consistently
- * across all platforms using CDN-hosted emoji images.
- */
-/**
- * Convert an emoji character to its unified unicode codepoint format
- * Example: "😀" -> "1f600", "👨‍👩‍👧" -> "1f468-200d-1f469-200d-1f467"
- */
-declare function emojiToUnified(emoji: string): string;
-/**
- * Get the Apple emoji CDN URL for a given emoji character
- */
-declare function getAppleEmojiUrl(emoji: string): string;
-/**
- * Check if a string contains any emoji characters
- */
-declare function hasEmoji(text: string): boolean;
-/**
- * Split text into segments of text and emojis
- * Returns an array of segments with type 'text' or 'emoji'
- */
-interface TextSegmentPart {
-    type: 'text' | 'emoji';
-    content: string;
-    imageUrl?: string;
-}
-declare function splitTextAndEmojis(text: string): TextSegmentPart[];
-
 /**
  * Hook exports for ugcinc-render
  *
@@ -1377,4 +1361,4 @@ declare function useResolvedPositions(elements: ImageEditorElement[], textValues
 
 declare const RenderRoot: React.FC;
 
-export { type AudioSegment, type BaseEditorConfig, type BaseSegment, type BorderRadiusConfig, type Channel, type CropAxisConfig, type CropBoundary, type CropBounds, DIMENSION_PRESETS, type DimensionPreset, type DimensionPresetKey, type DynamicCropConfig, type EditorConfig, type EditorSegment, FONT_FAMILIES, FONT_URLS, type FitDimensions, type FitMode, type FontType, type FontWeight, type HorizontalAnchor, type HorizontalSelfAnchor, type Hyphenation, IMAGE_DEFAULTS, ImageEditorComposition, type ImageEditorCompositionProps, type ImageEditorConfig, type ImageEditorElement, type ImageEditorNodeConfig, ImageElement, type ImageElementProps, type ImageSegment, type PictureSegment, type PositionResolutionError, type PositionResolutionResult, type RelativePositionConfigX, type RelativePositionConfigY, RenderRoot, type Segment, type SegmentTimelinePosition, type SegmentType, type StaticSegment, TEXT_DEFAULTS, type TextAlignment, type TextDirection, TextElement, type TextElementProps, type TextOverflow, type TextSegment, type TextSegmentPart, type TextWrap, type TimeMode, type TimeValue, VIDEO_DEFAULTS, VISUAL_DEFAULTS, type VerticalAlignment, type VerticalAnchor, type VerticalSelfAnchor, type VideoEditorAudioSegment, type VideoEditorBaseSegment, type VideoEditorChannel, VideoEditorComposition, type VideoEditorCompositionProps, type VideoEditorConfig, type VideoEditorImageSegment, type VideoEditorNodeConfig, type VideoEditorSegment, type VideoEditorTextSegment, type VideoEditorVideoSegment, type VideoEditorVisualSegment, VideoElement, type VideoElementProps, type VideoSegment, type VisualSegment, type VisualSegmentUnion, type WordBreak, applyImageDefaults, applyTextDefaults, applyVideoDefaults, areFontsLoaded, buildFontString, calculateAutoWidthDimensions, calculateCropBounds, calculateEstimatedDuration, calculateFitDimensions, calculateLineWidth, calculateTimelineContentEnd, canSetAsReference, defaultOffset, emojiToUnified, formatTime, generateOverlayId, generateSegmentId, getAppleEmojiUrl, getBaseSegments, getBorderRadii, getDependentElements, getFontFamily, getOverlays, getReferenceElementX, getReferenceElementY, getSegmentTimelinePosition, hasEmoji, hexToRgba, isDynamicCropEnabled, isSegmentVisibleAtTime, parseHexColor, parseTime, preloadFonts, resolveElementPositions, splitTextAndEmojis, useFontsLoaded, useImageLoader, useImagePreloader, useResolvedPositions, wrapText };
+export { APPLE_EMOJI_FONT, type AudioSegment, type BaseEditorConfig, type BaseSegment, type BorderRadiusConfig, type Channel, type CropAxisConfig, type CropBoundary, type CropBounds, DIMENSION_PRESETS, type DimensionPreset, type DimensionPresetKey, type DynamicCropConfig, type EditorConfig, type EditorSegment, FONT_FAMILIES, FONT_URLS, type FitDimensions, type FitMode, type FontType, type FontWeight, type HorizontalAnchor, type HorizontalSelfAnchor, type Hyphenation, IMAGE_DEFAULTS, ImageEditorComposition, type ImageEditorCompositionProps, type ImageEditorConfig, type ImageEditorElement, type ImageEditorNodeConfig, ImageElement, type ImageElementProps, type ImageSegment, type PictureSegment, type PositionResolutionError, type PositionResolutionResult, type RelativePositionConfigX, type RelativePositionConfigY, RenderRoot, type Segment, type SegmentTimelinePosition, type SegmentType, type StaticSegment, TEXT_DEFAULTS, type TextAlignment, type TextDirection, TextElement, type TextElementProps, type TextOverflow, type TextSegment, type TextWrap, type TimeMode, type TimeValue, VIDEO_DEFAULTS, VISUAL_DEFAULTS, type VerticalAlignment, type VerticalAnchor, type VerticalSelfAnchor, type VideoEditorAudioSegment, type VideoEditorBaseSegment, type VideoEditorChannel, VideoEditorComposition, type VideoEditorCompositionProps, type VideoEditorConfig, type VideoEditorImageSegment, type VideoEditorNodeConfig, type VideoEditorSegment, type VideoEditorTextSegment, type VideoEditorVideoSegment, type VideoEditorVisualSegment, VideoElement, type VideoElementProps, type VideoSegment, type VisualSegment, type VisualSegmentUnion, type WordBreak, applyImageDefaults, applyTextDefaults, applyVideoDefaults, areFontsLoaded, buildFontString, calculateAutoWidthDimensions, calculateCropBounds, calculateEstimatedDuration, calculateFitDimensions, calculateLineWidth, calculateTimelineContentEnd, canSetAsReference, debugFontStatus, defaultOffset, formatTime, generateOverlayId, generateSegmentId, getBaseSegments, getBorderRadii, getDependentElements, getFontFamily, getOverlays, getReferenceElementX, getReferenceElementY, getSegmentTimelinePosition, hexToRgba, isDynamicCropEnabled, isSegmentVisibleAtTime, parseHexColor, parseTime, preloadFonts, resolveElementPositions, useFontsLoaded, useImageLoader, useImagePreloader, useResolvedPositions, wrapText };

package/dist/index.d.ts

@@ -955,9 +955,14 @@ declare function VideoElement({ segment, src, startFrame, durationInFrames, scal
  * Font utilities for the rendering system
  */
 
+/**
+ * Apple Color Emoji font name - used as fallback for emoji characters
+ */
+declare const APPLE_EMOJI_FONT = "\"Apple Color Emoji\"";
 /**
  * Font family CSS strings for each font type
  * These match the fonts registered in the rendering system
+ * Apple Color Emoji is added as a fallback for consistent emoji rendering
  */
 declare const FONT_FAMILIES: Record<FontType, string>;
 /**
@@ -984,6 +989,9 @@ declare const FONT_URLS: {
     apple: {
         regular: string;
     };
+    emoji: {
+        apple: string;
+    };
 };
 /**
  * Preload fonts for rendering
@@ -994,6 +1002,10 @@ declare function preloadFonts(): Promise<void>;
  * Check if fonts are loaded
  */
 declare function areFontsLoaded(): boolean;
+/**
+ * Debug utility to log current font status
+ */
+declare function debugFontStatus(): void;
 
 /**
  * Fit calculation utilities for media positioning
@@ -1290,34 +1302,6 @@ declare function generateSegmentId(): string;
  */
 declare function generateOverlayId(): string;
 
-/**
- * Emoji utilities for rendering Apple-style emojis consistently
- * across all platforms using CDN-hosted emoji images.
- */
-/**
- * Convert an emoji character to its unified unicode codepoint format
- * Example: "😀" -> "1f600", "👨‍👩‍👧" -> "1f468-200d-1f469-200d-1f467"
- */
-declare function emojiToUnified(emoji: string): string;
-/**
- * Get the Apple emoji CDN URL for a given emoji character
- */
-declare function getAppleEmojiUrl(emoji: string): string;
-/**
- * Check if a string contains any emoji characters
- */
-declare function hasEmoji(text: string): boolean;
-/**
- * Split text into segments of text and emojis
- * Returns an array of segments with type 'text' or 'emoji'
- */
-interface TextSegmentPart {
-    type: 'text' | 'emoji';
-    content: string;
-    imageUrl?: string;
-}
-declare function splitTextAndEmojis(text: string): TextSegmentPart[];
-
 /**
  * Hook exports for ugcinc-render
  *
@@ -1377,4 +1361,4 @@ declare function useResolvedPositions(elements: ImageEditorElement[], textValues
 
 declare const RenderRoot: React.FC;
 
-export { type AudioSegment, type BaseEditorConfig, type BaseSegment, type BorderRadiusConfig, type Channel, type CropAxisConfig, type CropBoundary, type CropBounds, DIMENSION_PRESETS, type DimensionPreset, type DimensionPresetKey, type DynamicCropConfig, type EditorConfig, type EditorSegment, FONT_FAMILIES, FONT_URLS, type FitDimensions, type FitMode, type FontType, type FontWeight, type HorizontalAnchor, type HorizontalSelfAnchor, type Hyphenation, IMAGE_DEFAULTS, ImageEditorComposition, type ImageEditorCompositionProps, type ImageEditorConfig, type ImageEditorElement, type ImageEditorNodeConfig, ImageElement, type ImageElementProps, type ImageSegment, type PictureSegment, type PositionResolutionError, type PositionResolutionResult, type RelativePositionConfigX, type RelativePositionConfigY, RenderRoot, type Segment, type SegmentTimelinePosition, type SegmentType, type StaticSegment, TEXT_DEFAULTS, type TextAlignment, type TextDirection, TextElement, type TextElementProps, type TextOverflow, type TextSegment, type TextSegmentPart, type TextWrap, type TimeMode, type TimeValue, VIDEO_DEFAULTS, VISUAL_DEFAULTS, type VerticalAlignment, type VerticalAnchor, type VerticalSelfAnchor, type VideoEditorAudioSegment, type VideoEditorBaseSegment, type VideoEditorChannel, VideoEditorComposition, type VideoEditorCompositionProps, type VideoEditorConfig, type VideoEditorImageSegment, type VideoEditorNodeConfig, type VideoEditorSegment, type VideoEditorTextSegment, type VideoEditorVideoSegment, type VideoEditorVisualSegment, VideoElement, type VideoElementProps, type VideoSegment, type VisualSegment, type VisualSegmentUnion, type WordBreak, applyImageDefaults, applyTextDefaults, applyVideoDefaults, areFontsLoaded, buildFontString, calculateAutoWidthDimensions, calculateCropBounds, calculateEstimatedDuration, calculateFitDimensions, calculateLineWidth, calculateTimelineContentEnd, canSetAsReference, defaultOffset, emojiToUnified, formatTime, generateOverlayId, generateSegmentId, getAppleEmojiUrl, getBaseSegments, getBorderRadii, getDependentElements, getFontFamily, getOverlays, getReferenceElementX, getReferenceElementY, getSegmentTimelinePosition, hasEmoji, hexToRgba, isDynamicCropEnabled, isSegmentVisibleAtTime, parseHexColor, parseTime, preloadFonts, resolveElementPositions, splitTextAndEmojis, useFontsLoaded, useImageLoader, useImagePreloader, useResolvedPositions, wrapText };
+export { APPLE_EMOJI_FONT, type AudioSegment, type BaseEditorConfig, type BaseSegment, type BorderRadiusConfig, type Channel, type CropAxisConfig, type CropBoundary, type CropBounds, DIMENSION_PRESETS, type DimensionPreset, type DimensionPresetKey, type DynamicCropConfig, type EditorConfig, type EditorSegment, FONT_FAMILIES, FONT_URLS, type FitDimensions, type FitMode, type FontType, type FontWeight, type HorizontalAnchor, type HorizontalSelfAnchor, type Hyphenation, IMAGE_DEFAULTS, ImageEditorComposition, type ImageEditorCompositionProps, type ImageEditorConfig, type ImageEditorElement, type ImageEditorNodeConfig, ImageElement, type ImageElementProps, type ImageSegment, type PictureSegment, type PositionResolutionError, type PositionResolutionResult, type RelativePositionConfigX, type RelativePositionConfigY, RenderRoot, type Segment, type SegmentTimelinePosition, type SegmentType, type StaticSegment, TEXT_DEFAULTS, type TextAlignment, type TextDirection, TextElement, type TextElementProps, type TextOverflow, type TextSegment, type TextWrap, type TimeMode, type TimeValue, VIDEO_DEFAULTS, VISUAL_DEFAULTS, type VerticalAlignment, type VerticalAnchor, type VerticalSelfAnchor, type VideoEditorAudioSegment, type VideoEditorBaseSegment, type VideoEditorChannel, VideoEditorComposition, type VideoEditorCompositionProps, type VideoEditorConfig, type VideoEditorImageSegment, type VideoEditorNodeConfig, type VideoEditorSegment, type VideoEditorTextSegment, type VideoEditorVideoSegment, type VideoEditorVisualSegment, VideoElement, type VideoElementProps, type VideoSegment, type VisualSegment, type VisualSegmentUnion, type WordBreak, applyImageDefaults, applyTextDefaults, applyVideoDefaults, areFontsLoaded, buildFontString, calculateAutoWidthDimensions, calculateCropBounds, calculateEstimatedDuration, calculateFitDimensions, calculateLineWidth, calculateTimelineContentEnd, canSetAsReference, debugFontStatus, defaultOffset, formatTime, generateOverlayId, generateSegmentId, getBaseSegments, getBorderRadii, getDependentElements, getFontFamily, getOverlays, getReferenceElementX, getReferenceElementY, getSegmentTimelinePosition, hexToRgba, isDynamicCropEnabled, isSegmentVisibleAtTime, parseHexColor, parseTime, preloadFonts, resolveElementPositions, useFontsLoaded, useImageLoader, useImagePreloader, useResolvedPositions, wrapText };

package/dist/index.js

@@ -30,6 +30,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
+  APPLE_EMOJI_FONT: () => APPLE_EMOJI_FONT,
   DIMENSION_PRESETS: () => DIMENSION_PRESETS,
   FONT_FAMILIES: () => FONT_FAMILIES,
   FONT_URLS: () => FONT_URLS,
@@ -55,12 +56,11 @@ __export(index_exports, {
   calculateLineWidth: () => calculateLineWidth,
   calculateTimelineContentEnd: () => calculateTimelineContentEnd,
   canSetAsReference: () => canSetAsReference,
+  debugFontStatus: () => debugFontStatus,
   defaultOffset: () => defaultOffset,
-  emojiToUnified: () => emojiToUnified,
   formatTime: () => formatTime,
   generateOverlayId: () => generateOverlayId,
   generateSegmentId: () => generateSegmentId,
-  getAppleEmojiUrl: () => getAppleEmojiUrl,
   getBaseSegments: () => getBaseSegments,
   getBorderRadii: () => getBorderRadii,
   getDependentElements: () => getDependentElements,
@@ -69,7 +69,6 @@ __export(index_exports, {
   getReferenceElementX: () => getReferenceElementX,
   getReferenceElementY: () => getReferenceElementY,
   getSegmentTimelinePosition: () => getSegmentTimelinePosition,
-  hasEmoji: () => hasEmoji,
   hexToRgba: () => hexToRgba,
   isDynamicCropEnabled: () => isDynamicCropEnabled,
   isSegmentVisibleAtTime: () => isSegmentVisibleAtTime,
@@ -77,7 +76,6 @@ __export(index_exports, {
   parseTime: () => parseTime,
   preloadFonts: () => preloadFonts,
   resolveElementPositions: () => resolveElementPositions,
-  splitTextAndEmojis: () => splitTextAndEmojis,
   useFontsLoaded: () => useFontsLoaded,
   useImageLoader: () => useImageLoader,
   useImagePreloader: () => useImagePreloader,
@@ -163,10 +161,11 @@ function applyVideoDefaults(segment) {
 }
 
 // src/utils/fonts.ts
+var APPLE_EMOJI_FONT = '"Apple Color Emoji"';
 var FONT_FAMILIES = {
-  tiktok: '"TikTok Sans", sans-serif',
-  apple: '"SF Pro", "SF Pro Display", -apple-system, BlinkMacSystemFont, sans-serif',
-  arial: "Arial, sans-serif"
+  tiktok: `"TikTok Sans", ${APPLE_EMOJI_FONT}, sans-serif`,
+  apple: `"SF Pro", "SF Pro Display", -apple-system, BlinkMacSystemFont, ${APPLE_EMOJI_FONT}, sans-serif`,
+  arial: `Arial, ${APPLE_EMOJI_FONT}, sans-serif`
 };
 function getFontFamily(fontType) {
   return FONT_FAMILIES[fontType] ?? FONT_FAMILIES.arial;
@@ -186,40 +185,123 @@ var FONT_URLS = {
   },
   apple: {
     regular: "/SF-Pro.ttf"
+  },
+  emoji: {
+    apple: "/AppleColorEmoji.ttf"
   }
 };
 async function preloadFonts() {
+  console.log("[ugcinc-render/fonts] preloadFonts() called");
   if (typeof document !== "undefined") {
-    const fontPromises = [];
-    const tiktokRegular = new FontFace(
-      "TikTok Sans",
-      `url(${FONT_URLS.tiktok.regular})`,
-      { weight: "normal" }
-    );
-    fontPromises.push(tiktokRegular.load());
-    const tiktokBold = new FontFace(
-      "TikTok Sans",
-      `url(${FONT_URLS.tiktok.bold})`,
-      { weight: "bold" }
-    );
-    fontPromises.push(tiktokBold.load());
-    const sfPro = new FontFace(
-      "SF Pro",
-      `url(${FONT_URLS.apple.regular})`,
-      { weight: "normal" }
-    );
-    fontPromises.push(sfPro.load());
-    const loadedFonts = await Promise.all(fontPromises);
-    loadedFonts.forEach((font) => {
-      document.fonts.add(font);
+    console.log("[ugcinc-render/fonts] Browser environment detected, loading fonts...");
+    const fontResults = [];
+    try {
+      const tiktokRegular = new FontFace(
+        "TikTok Sans",
+        `url(${FONT_URLS.tiktok.regular})`,
+        { weight: "normal" }
+      );
+      console.log(`[ugcinc-render/fonts] Loading TikTok Sans Regular from: ${FONT_URLS.tiktok.regular}`);
+      await tiktokRegular.load();
+      document.fonts.add(tiktokRegular);
+      fontResults.push({ name: "TikTok Sans Regular", status: "success" });
+    } catch (err) {
+      const errorMsg = err instanceof Error ? err.message : String(err);
+      console.error(`[ugcinc-render/fonts] Failed to load TikTok Sans Regular:`, errorMsg);
+      fontResults.push({ name: "TikTok Sans Regular", status: "error", error: errorMsg });
+    }
+    try {
+      const tiktokBold = new FontFace(
+        "TikTok Sans",
+        `url(${FONT_URLS.tiktok.bold})`,
+        { weight: "bold" }
+      );
+      console.log(`[ugcinc-render/fonts] Loading TikTok Sans Bold from: ${FONT_URLS.tiktok.bold}`);
+      await tiktokBold.load();
+      document.fonts.add(tiktokBold);
+      fontResults.push({ name: "TikTok Sans Bold", status: "success" });
+    } catch (err) {
+      const errorMsg = err instanceof Error ? err.message : String(err);
+      console.error(`[ugcinc-render/fonts] Failed to load TikTok Sans Bold:`, errorMsg);
+      fontResults.push({ name: "TikTok Sans Bold", status: "error", error: errorMsg });
+    }
+    try {
+      const sfPro = new FontFace(
+        "SF Pro",
+        `url(${FONT_URLS.apple.regular})`,
+        { weight: "normal" }
+      );
+      console.log(`[ugcinc-render/fonts] Loading SF Pro from: ${FONT_URLS.apple.regular}`);
+      await sfPro.load();
+      document.fonts.add(sfPro);
+      fontResults.push({ name: "SF Pro", status: "success" });
+    } catch (err) {
+      const errorMsg = err instanceof Error ? err.message : String(err);
+      console.error(`[ugcinc-render/fonts] Failed to load SF Pro:`, errorMsg);
+      fontResults.push({ name: "SF Pro", status: "error", error: errorMsg });
+    }
+    try {
+      const appleEmoji = new FontFace(
+        "Apple Color Emoji",
+        `url(${FONT_URLS.emoji.apple})`,
+        { weight: "normal" }
+      );
+      console.log(`[ugcinc-render/fonts] Loading Apple Color Emoji from: ${FONT_URLS.emoji.apple}`);
+      await appleEmoji.load();
+      document.fonts.add(appleEmoji);
+      fontResults.push({ name: "Apple Color Emoji", status: "success" });
+    } catch (err) {
+      const errorMsg = err instanceof Error ? err.message : String(err);
+      console.error(`[ugcinc-render/fonts] Failed to load Apple Color Emoji:`, errorMsg);
+      fontResults.push({ name: "Apple Color Emoji", status: "error", error: errorMsg });
+    }
+    console.log("[ugcinc-render/fonts] Font loading complete. Results:", fontResults);
+    const availableFonts = [];
+    document.fonts.forEach((font) => {
+      availableFonts.push(`${font.family} (${font.weight}, ${font.status})`);
     });
+    console.log("[ugcinc-render/fonts] Available fonts in document:", availableFonts);
+  } else {
+    console.log("[ugcinc-render/fonts] Not in browser environment, skipping font loading");
   }
 }
 function areFontsLoaded() {
   if (typeof document === "undefined") {
+    console.log("[ugcinc-render/fonts] areFontsLoaded: Not in browser environment");
     return false;
   }
-  return document.fonts.check('normal 16px "TikTok Sans"') && document.fonts.check('bold 16px "TikTok Sans"') && document.fonts.check('normal 16px "SF Pro"');
+  const tiktokRegular = document.fonts.check('normal 16px "TikTok Sans"');
+  const tiktokBold = document.fonts.check('bold 16px "TikTok Sans"');
+  const sfPro = document.fonts.check('normal 16px "SF Pro"');
+  const appleEmoji = document.fonts.check('normal 16px "Apple Color Emoji"');
+  console.log("[ugcinc-render/fonts] areFontsLoaded check:", {
+    tiktokRegular,
+    tiktokBold,
+    sfPro,
+    appleEmoji
+  });
+  return tiktokRegular && tiktokBold && sfPro && appleEmoji;
+}
+function debugFontStatus() {
+  console.log("[ugcinc-render/fonts] === FONT DEBUG STATUS ===");
+  if (typeof document === "undefined") {
+    console.log("[ugcinc-render/fonts] Not in browser environment");
+    return;
+  }
+  console.log("[ugcinc-render/fonts] Font checks:");
+  console.log("  - TikTok Sans (normal):", document.fonts.check('normal 16px "TikTok Sans"'));
+  console.log("  - TikTok Sans (bold):", document.fonts.check('bold 16px "TikTok Sans"'));
+  console.log("  - SF Pro:", document.fonts.check('normal 16px "SF Pro"'));
+  console.log("  - Apple Color Emoji:", document.fonts.check('normal 16px "Apple Color Emoji"'));
+  console.log("[ugcinc-render/fonts] All fonts in document.fonts:");
+  document.fonts.forEach((font) => {
+    console.log(`  - ${font.family}: weight=${font.weight}, style=${font.style}, status=${font.status}`);
+  });
+  console.log("[ugcinc-render/fonts] Font family stacks:");
+  console.log("  - tiktok:", FONT_FAMILIES.tiktok);
+  console.log("  - apple:", FONT_FAMILIES.apple);
+  console.log("  - arial:", FONT_FAMILIES.arial);
+  console.log("[ugcinc-render/fonts] === END FONT DEBUG ===");
 }
 
 // src/utils/text.ts
@@ -306,66 +388,6 @@ function hexToRgba(hex, opacity = 100) {
   return `rgba(${r}, ${g}, ${b}, ${opacity / 100})`;
 }
 
-// src/utils/emoji.ts
-var APPLE_EMOJI_CDN_BASE = "https://cdn.jsdelivr.net/npm/emoji-datasource-apple/img/apple/64/";
-function emojiToUnified(emoji) {
-  const codePoints = [];
-  for (const codePoint of emoji) {
-    const hex = codePoint.codePointAt(0)?.toString(16);
-    if (hex) {
-      codePoints.push(hex);
-    }
-  }
-  return codePoints.join("-");
-}
-function getAppleEmojiUrl(emoji) {
-  const unified = emojiToUnified(emoji);
-  return `${APPLE_EMOJI_CDN_BASE}${unified}.png`;
-}
-var EMOJI_REGEX = /(?:\p{Emoji_Presentation}|\p{Emoji}\uFE0F)(?:\p{Emoji_Modifier}|\uFE0F|\u200D(?:\p{Emoji_Presentation}|\p{Emoji}\uFE0F)(?:\p{Emoji_Modifier})?)*|\p{Regional_Indicator}{2}/gu;
-function hasEmoji(text) {
-  return EMOJI_REGEX.test(text);
-}
-function splitTextAndEmojis(text) {
-  const segments = [];
-  let lastIndex = 0;
-  EMOJI_REGEX.lastIndex = 0;
-  let match;
-  while ((match = EMOJI_REGEX.exec(text)) !== null) {
-    if (match.index > lastIndex) {
-      segments.push({
-        type: "text",
-        content: text.slice(lastIndex, match.index)
-      });
-    }
-    segments.push({
-      type: "emoji",
-      content: match[0],
-      imageUrl: getAppleEmojiUrl(match[0])
-    });
-    lastIndex = match.index + match[0].length;
-  }
-  if (lastIndex < text.length) {
-    segments.push({
-      type: "text",
-      content: text.slice(lastIndex)
-    });
-  }
-  return segments;
-}
-function countEmojis(text) {
-  EMOJI_REGEX.lastIndex = 0;
-  const matches = text.match(EMOJI_REGEX);
-  return matches ? matches.length : 0;
-}
-function getEmojiWidth(fontSize) {
-  return fontSize * 1.2;
-}
-function stripEmojis(text) {
-  EMOJI_REGEX.lastIndex = 0;
-  return text.replace(EMOJI_REGEX, "");
-}
-
 // src/components/TextElement.tsx
 var import_jsx_runtime = require("react/jsx-runtime");
 function calculateAutoWidthAndLines({
@@ -398,17 +420,9 @@ function calculateAutoWidthAndLines({
     white-space: nowrap;
   `;
   document.body.appendChild(measureSpan);
-  const emojiWidth = getEmojiWidth(fontSize);
-  const measureTextWithEmojis = (textToMeasure) => {
-    const emojiCount = countEmojis(textToMeasure);
-    if (emojiCount === 0) {
-      measureSpan.textContent = textToMeasure;
-      return measureSpan.getBoundingClientRect().width;
-    }
-    const textWithoutEmojis = stripEmojis(textToMeasure);
-    measureSpan.textContent = textWithoutEmojis;
-    const textWidth = measureSpan.getBoundingClientRect().width;
-    return textWidth + emojiCount * emojiWidth;
+  const measureText = (textToMeasure) => {
+    measureSpan.textContent = textToMeasure;
+    return measureSpan.getBoundingClientRect().width;
   };
   measureSpan.textContent = "M";
   const charWidth = measureSpan.getBoundingClientRect().width;
@@ -432,12 +446,12 @@ function calculateAutoWidthAndLines({
       continue;
     }
     const testLine = currentLine + word;
-    const testWidth = measureTextWithEmojis(testLine);
+    const testWidth = measureText(testLine);
     const WRAP_TOLERANCE = 0.5;
     if (testWidth > availableWidth + WRAP_TOLERANCE && currentLine.trim()) {
       lines.push(currentLine.trimEnd());
       currentLine = word;
-      const wordWidth = measureTextWithEmojis(word);
+      const wordWidth = measureText(word);
       if (wordWidth > availableWidth) {
         let remainingWord = word;
         while (remainingWord) {
@@ -471,7 +485,7 @@ function calculateAutoWidthAndLines({
   }
   let widestLineWidth = 0;
   for (const line of lines) {
-    const lineWidth = measureTextWithEmojis(line);
+    const lineWidth = measureText(line);
     widestLineWidth = Math.max(widestLineWidth, lineWidth);
   }
   document.body.removeChild(measureSpan);
@@ -479,6 +493,15 @@ function calculateAutoWidthAndLines({
   return { width: calculatedWidth, lines };
 }
 function TextElement({ segment, scale = 1 }) {
+  import_react.default.useEffect(() => {
+    const fontFamily2 = getFontFamily(segment.fontType ?? TEXT_DEFAULTS.fontType);
+    console.log("[ugcinc-render/TextElement] Rendering with:", {
+      text: segment.text?.substring(0, 50) + (segment.text?.length > 50 ? "..." : ""),
+      fontType: segment.fontType ?? TEXT_DEFAULTS.fontType,
+      fontFamily: fontFamily2,
+      hasEmojis: /[\u{1F300}-\u{1F9FF}]/u.test(segment.text || "")
+    });
+  }, [segment.text, segment.fontType]);
   const fontType = segment.fontType ?? TEXT_DEFAULTS.fontType;
   const fontSize = (segment.fontSize ?? TEXT_DEFAULTS.fontSize) * scale;
   const fontWeight = segment.fontWeight ?? TEXT_DEFAULTS.fontWeight;
@@ -678,35 +701,9 @@ function TextElement({ segment, scale = 1 }) {
     autoWidth,
     verticalAlign
   ]);
-  const renderTextWithEmojis = (text) => {
-    if (!hasEmoji(text)) {
-      return text;
-    }
-    const segments = splitTextAndEmojis(text);
-    return segments.map((segment2, i) => {
-      if (segment2.type === "emoji" && segment2.imageUrl) {
-        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-          "img",
-          {
-            src: segment2.imageUrl,
-            alt: segment2.content,
-            style: {
-              height: "1.2em",
-              width: "1.2em",
-              verticalAlign: "-0.25em",
-              display: "inline"
-            },
-            draggable: false
-          },
-          i
-        );
-      }
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.default.Fragment, { children: segment2.content }, i);
-    });
-  };
   if (autoWidth) {
     const textContent = calculatedLines.map((line, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react.default.Fragment, { children: [
-      renderTextWithEmojis(line),
+      line,
       index < calculatedLines.length - 1 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("br", {})
     ] }, index));
     if (backgroundColor) {
@@ -725,7 +722,7 @@ function TextElement({ segment, scale = 1 }) {
     }
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: positioningContainerStyle, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { width: calculatedWidth, maxWidth: width }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: textStyle, children: textContent }) }) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: positioningContainerStyle, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: backgroundBoxStyle, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: textStyle, children: renderTextWithEmojis(segment.text) }) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: positioningContainerStyle, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: backgroundBoxStyle, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: textStyle, children: segment.text }) }) });
 }
 
 // src/components/ImageElement.tsx
@@ -2019,6 +2016,7 @@ var RenderRoot = () => {
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  APPLE_EMOJI_FONT,
   DIMENSION_PRESETS,
   FONT_FAMILIES,
   FONT_URLS,
@@ -2044,12 +2042,11 @@ var RenderRoot = () => {
   calculateLineWidth,
   calculateTimelineContentEnd,
   canSetAsReference,
+  debugFontStatus,
   defaultOffset,
-  emojiToUnified,
   formatTime,
   generateOverlayId,
   generateSegmentId,
-  getAppleEmojiUrl,
   getBaseSegments,
   getBorderRadii,
   getDependentElements,
@@ -2058,7 +2055,6 @@ var RenderRoot = () => {
   getReferenceElementX,
   getReferenceElementY,
   getSegmentTimelinePosition,
-  hasEmoji,
   hexToRgba,
   isDynamicCropEnabled,
   isSegmentVisibleAtTime,
@@ -2066,7 +2062,6 @@ var RenderRoot = () => {
   parseTime,
   preloadFonts,
   resolveElementPositions,
-  splitTextAndEmojis,
   useFontsLoaded,
   useImageLoader,
   useImagePreloader,

package/dist/index.mjs

@@ -75,10 +75,11 @@ function applyVideoDefaults(segment) {
 }
 
 // src/utils/fonts.ts
+var APPLE_EMOJI_FONT = '"Apple Color Emoji"';
 var FONT_FAMILIES = {
-  tiktok: '"TikTok Sans", sans-serif',
-  apple: '"SF Pro", "SF Pro Display", -apple-system, BlinkMacSystemFont, sans-serif',
-  arial: "Arial, sans-serif"
+  tiktok: `"TikTok Sans", ${APPLE_EMOJI_FONT}, sans-serif`,
+  apple: `"SF Pro", "SF Pro Display", -apple-system, BlinkMacSystemFont, ${APPLE_EMOJI_FONT}, sans-serif`,
+  arial: `Arial, ${APPLE_EMOJI_FONT}, sans-serif`
 };
 function getFontFamily(fontType) {
   return FONT_FAMILIES[fontType] ?? FONT_FAMILIES.arial;
@@ -98,40 +99,123 @@ var FONT_URLS = {
   },
   apple: {
     regular: "/SF-Pro.ttf"
+  },
+  emoji: {
+    apple: "/AppleColorEmoji.ttf"
   }
 };
 async function preloadFonts() {
+  console.log("[ugcinc-render/fonts] preloadFonts() called");
   if (typeof document !== "undefined") {
-    const fontPromises = [];
-    const tiktokRegular = new FontFace(
-      "TikTok Sans",
-      `url(${FONT_URLS.tiktok.regular})`,
-      { weight: "normal" }
-    );
-    fontPromises.push(tiktokRegular.load());
-    const tiktokBold = new FontFace(
-      "TikTok Sans",
-      `url(${FONT_URLS.tiktok.bold})`,
-      { weight: "bold" }
-    );
-    fontPromises.push(tiktokBold.load());
-    const sfPro = new FontFace(
-      "SF Pro",
-      `url(${FONT_URLS.apple.regular})`,
-      { weight: "normal" }
-    );
-    fontPromises.push(sfPro.load());
-    const loadedFonts = await Promise.all(fontPromises);
-    loadedFonts.forEach((font) => {
-      document.fonts.add(font);
+    console.log("[ugcinc-render/fonts] Browser environment detected, loading fonts...");
+    const fontResults = [];
+    try {
+      const tiktokRegular = new FontFace(
+        "TikTok Sans",
+        `url(${FONT_URLS.tiktok.regular})`,
+        { weight: "normal" }
+      );
+      console.log(`[ugcinc-render/fonts] Loading TikTok Sans Regular from: ${FONT_URLS.tiktok.regular}`);
+      await tiktokRegular.load();
+      document.fonts.add(tiktokRegular);
+      fontResults.push({ name: "TikTok Sans Regular", status: "success" });
+    } catch (err) {
+      const errorMsg = err instanceof Error ? err.message : String(err);
+      console.error(`[ugcinc-render/fonts] Failed to load TikTok Sans Regular:`, errorMsg);
+      fontResults.push({ name: "TikTok Sans Regular", status: "error", error: errorMsg });
+    }
+    try {
+      const tiktokBold = new FontFace(
+        "TikTok Sans",
+        `url(${FONT_URLS.tiktok.bold})`,
+        { weight: "bold" }
+      );
+      console.log(`[ugcinc-render/fonts] Loading TikTok Sans Bold from: ${FONT_URLS.tiktok.bold}`);
+      await tiktokBold.load();
+      document.fonts.add(tiktokBold);
+      fontResults.push({ name: "TikTok Sans Bold", status: "success" });
+    } catch (err) {
+      const errorMsg = err instanceof Error ? err.message : String(err);
+      console.error(`[ugcinc-render/fonts] Failed to load TikTok Sans Bold:`, errorMsg);
+      fontResults.push({ name: "TikTok Sans Bold", status: "error", error: errorMsg });
+    }
+    try {
+      const sfPro = new FontFace(
+        "SF Pro",
+        `url(${FONT_URLS.apple.regular})`,
+        { weight: "normal" }
+      );
+      console.log(`[ugcinc-render/fonts] Loading SF Pro from: ${FONT_URLS.apple.regular}`);
+      await sfPro.load();
+      document.fonts.add(sfPro);
+      fontResults.push({ name: "SF Pro", status: "success" });
+    } catch (err) {
+      const errorMsg = err instanceof Error ? err.message : String(err);
+      console.error(`[ugcinc-render/fonts] Failed to load SF Pro:`, errorMsg);
+      fontResults.push({ name: "SF Pro", status: "error", error: errorMsg });
+    }
+    try {
+      const appleEmoji = new FontFace(
+        "Apple Color Emoji",
+        `url(${FONT_URLS.emoji.apple})`,
+        { weight: "normal" }
+      );
+      console.log(`[ugcinc-render/fonts] Loading Apple Color Emoji from: ${FONT_URLS.emoji.apple}`);
+      await appleEmoji.load();
+      document.fonts.add(appleEmoji);
+      fontResults.push({ name: "Apple Color Emoji", status: "success" });
+    } catch (err) {
+      const errorMsg = err instanceof Error ? err.message : String(err);
+      console.error(`[ugcinc-render/fonts] Failed to load Apple Color Emoji:`, errorMsg);
+      fontResults.push({ name: "Apple Color Emoji", status: "error", error: errorMsg });
+    }
+    console.log("[ugcinc-render/fonts] Font loading complete. Results:", fontResults);
+    const availableFonts = [];
+    document.fonts.forEach((font) => {
+      availableFonts.push(`${font.family} (${font.weight}, ${font.status})`);
     });
+    console.log("[ugcinc-render/fonts] Available fonts in document:", availableFonts);
+  } else {
+    console.log("[ugcinc-render/fonts] Not in browser environment, skipping font loading");
   }
 }
 function areFontsLoaded() {
   if (typeof document === "undefined") {
+    console.log("[ugcinc-render/fonts] areFontsLoaded: Not in browser environment");
     return false;
   }
-  return document.fonts.check('normal 16px "TikTok Sans"') && document.fonts.check('bold 16px "TikTok Sans"') && document.fonts.check('normal 16px "SF Pro"');
+  const tiktokRegular = document.fonts.check('normal 16px "TikTok Sans"');
+  const tiktokBold = document.fonts.check('bold 16px "TikTok Sans"');
+  const sfPro = document.fonts.check('normal 16px "SF Pro"');
+  const appleEmoji = document.fonts.check('normal 16px "Apple Color Emoji"');
+  console.log("[ugcinc-render/fonts] areFontsLoaded check:", {
+    tiktokRegular,
+    tiktokBold,
+    sfPro,
+    appleEmoji
+  });
+  return tiktokRegular && tiktokBold && sfPro && appleEmoji;
+}
+function debugFontStatus() {
+  console.log("[ugcinc-render/fonts] === FONT DEBUG STATUS ===");
+  if (typeof document === "undefined") {
+    console.log("[ugcinc-render/fonts] Not in browser environment");
+    return;
+  }
+  console.log("[ugcinc-render/fonts] Font checks:");
+  console.log("  - TikTok Sans (normal):", document.fonts.check('normal 16px "TikTok Sans"'));
+  console.log("  - TikTok Sans (bold):", document.fonts.check('bold 16px "TikTok Sans"'));
+  console.log("  - SF Pro:", document.fonts.check('normal 16px "SF Pro"'));
+  console.log("  - Apple Color Emoji:", document.fonts.check('normal 16px "Apple Color Emoji"'));
+  console.log("[ugcinc-render/fonts] All fonts in document.fonts:");
+  document.fonts.forEach((font) => {
+    console.log(`  - ${font.family}: weight=${font.weight}, style=${font.style}, status=${font.status}`);
+  });
+  console.log("[ugcinc-render/fonts] Font family stacks:");
+  console.log("  - tiktok:", FONT_FAMILIES.tiktok);
+  console.log("  - apple:", FONT_FAMILIES.apple);
+  console.log("  - arial:", FONT_FAMILIES.arial);
+  console.log("[ugcinc-render/fonts] === END FONT DEBUG ===");
 }
 
 // src/utils/text.ts
@@ -218,66 +302,6 @@ function hexToRgba(hex, opacity = 100) {
   return `rgba(${r}, ${g}, ${b}, ${opacity / 100})`;
 }
 
-// src/utils/emoji.ts
-var APPLE_EMOJI_CDN_BASE = "https://cdn.jsdelivr.net/npm/emoji-datasource-apple/img/apple/64/";
-function emojiToUnified(emoji) {
-  const codePoints = [];
-  for (const codePoint of emoji) {
-    const hex = codePoint.codePointAt(0)?.toString(16);
-    if (hex) {
-      codePoints.push(hex);
-    }
-  }
-  return codePoints.join("-");
-}
-function getAppleEmojiUrl(emoji) {
-  const unified = emojiToUnified(emoji);
-  return `${APPLE_EMOJI_CDN_BASE}${unified}.png`;
-}
-var EMOJI_REGEX = /(?:\p{Emoji_Presentation}|\p{Emoji}\uFE0F)(?:\p{Emoji_Modifier}|\uFE0F|\u200D(?:\p{Emoji_Presentation}|\p{Emoji}\uFE0F)(?:\p{Emoji_Modifier})?)*|\p{Regional_Indicator}{2}/gu;
-function hasEmoji(text) {
-  return EMOJI_REGEX.test(text);
-}
-function splitTextAndEmojis(text) {
-  const segments = [];
-  let lastIndex = 0;
-  EMOJI_REGEX.lastIndex = 0;
-  let match;
-  while ((match = EMOJI_REGEX.exec(text)) !== null) {
-    if (match.index > lastIndex) {
-      segments.push({
-        type: "text",
-        content: text.slice(lastIndex, match.index)
-      });
-    }
-    segments.push({
-      type: "emoji",
-      content: match[0],
-      imageUrl: getAppleEmojiUrl(match[0])
-    });
-    lastIndex = match.index + match[0].length;
-  }
-  if (lastIndex < text.length) {
-    segments.push({
-      type: "text",
-      content: text.slice(lastIndex)
-    });
-  }
-  return segments;
-}
-function countEmojis(text) {
-  EMOJI_REGEX.lastIndex = 0;
-  const matches = text.match(EMOJI_REGEX);
-  return matches ? matches.length : 0;
-}
-function getEmojiWidth(fontSize) {
-  return fontSize * 1.2;
-}
-function stripEmojis(text) {
-  EMOJI_REGEX.lastIndex = 0;
-  return text.replace(EMOJI_REGEX, "");
-}
-
 // src/components/TextElement.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
 function calculateAutoWidthAndLines({
@@ -310,17 +334,9 @@ function calculateAutoWidthAndLines({
     white-space: nowrap;
   `;
   document.body.appendChild(measureSpan);
-  const emojiWidth = getEmojiWidth(fontSize);
-  const measureTextWithEmojis = (textToMeasure) => {
-    const emojiCount = countEmojis(textToMeasure);
-    if (emojiCount === 0) {
-      measureSpan.textContent = textToMeasure;
-      return measureSpan.getBoundingClientRect().width;
-    }
-    const textWithoutEmojis = stripEmojis(textToMeasure);
-    measureSpan.textContent = textWithoutEmojis;
-    const textWidth = measureSpan.getBoundingClientRect().width;
-    return textWidth + emojiCount * emojiWidth;
+  const measureText = (textToMeasure) => {
+    measureSpan.textContent = textToMeasure;
+    return measureSpan.getBoundingClientRect().width;
   };
   measureSpan.textContent = "M";
   const charWidth = measureSpan.getBoundingClientRect().width;
@@ -344,12 +360,12 @@ function calculateAutoWidthAndLines({
       continue;
     }
     const testLine = currentLine + word;
-    const testWidth = measureTextWithEmojis(testLine);
+    const testWidth = measureText(testLine);
     const WRAP_TOLERANCE = 0.5;
     if (testWidth > availableWidth + WRAP_TOLERANCE && currentLine.trim()) {
       lines.push(currentLine.trimEnd());
       currentLine = word;
-      const wordWidth = measureTextWithEmojis(word);
+      const wordWidth = measureText(word);
       if (wordWidth > availableWidth) {
         let remainingWord = word;
         while (remainingWord) {
@@ -383,7 +399,7 @@ function calculateAutoWidthAndLines({
   }
   let widestLineWidth = 0;
   for (const line of lines) {
-    const lineWidth = measureTextWithEmojis(line);
+    const lineWidth = measureText(line);
     widestLineWidth = Math.max(widestLineWidth, lineWidth);
   }
   document.body.removeChild(measureSpan);
@@ -391,6 +407,15 @@ function calculateAutoWidthAndLines({
   return { width: calculatedWidth, lines };
 }
 function TextElement({ segment, scale = 1 }) {
+  React.useEffect(() => {
+    const fontFamily2 = getFontFamily(segment.fontType ?? TEXT_DEFAULTS.fontType);
+    console.log("[ugcinc-render/TextElement] Rendering with:", {
+      text: segment.text?.substring(0, 50) + (segment.text?.length > 50 ? "..." : ""),
+      fontType: segment.fontType ?? TEXT_DEFAULTS.fontType,
+      fontFamily: fontFamily2,
+      hasEmojis: /[\u{1F300}-\u{1F9FF}]/u.test(segment.text || "")
+    });
+  }, [segment.text, segment.fontType]);
   const fontType = segment.fontType ?? TEXT_DEFAULTS.fontType;
   const fontSize = (segment.fontSize ?? TEXT_DEFAULTS.fontSize) * scale;
   const fontWeight = segment.fontWeight ?? TEXT_DEFAULTS.fontWeight;
@@ -590,35 +615,9 @@ function TextElement({ segment, scale = 1 }) {
     autoWidth,
     verticalAlign
   ]);
-  const renderTextWithEmojis = (text) => {
-    if (!hasEmoji(text)) {
-      return text;
-    }
-    const segments = splitTextAndEmojis(text);
-    return segments.map((segment2, i) => {
-      if (segment2.type === "emoji" && segment2.imageUrl) {
-        return /* @__PURE__ */ jsx(
-          "img",
-          {
-            src: segment2.imageUrl,
-            alt: segment2.content,
-            style: {
-              height: "1.2em",
-              width: "1.2em",
-              verticalAlign: "-0.25em",
-              display: "inline"
-            },
-            draggable: false
-          },
-          i
-        );
-      }
-      return /* @__PURE__ */ jsx(React.Fragment, { children: segment2.content }, i);
-    });
-  };
   if (autoWidth) {
     const textContent = calculatedLines.map((line, index) => /* @__PURE__ */ jsxs(React.Fragment, { children: [
-      renderTextWithEmojis(line),
+      line,
       index < calculatedLines.length - 1 && /* @__PURE__ */ jsx("br", {})
     ] }, index));
     if (backgroundColor) {
@@ -637,7 +636,7 @@ function TextElement({ segment, scale = 1 }) {
     }
     return /* @__PURE__ */ jsx("div", { style: positioningContainerStyle, children: /* @__PURE__ */ jsx("div", { style: { width: calculatedWidth, maxWidth: width }, children: /* @__PURE__ */ jsx("div", { style: textStyle, children: textContent }) }) });
   }
-  return /* @__PURE__ */ jsx("div", { style: positioningContainerStyle, children: /* @__PURE__ */ jsx("div", { style: backgroundBoxStyle, children: /* @__PURE__ */ jsx("div", { style: textStyle, children: renderTextWithEmojis(segment.text) }) }) });
+  return /* @__PURE__ */ jsx("div", { style: positioningContainerStyle, children: /* @__PURE__ */ jsx("div", { style: backgroundBoxStyle, children: /* @__PURE__ */ jsx("div", { style: textStyle, children: segment.text }) }) });
 }
 
 // src/components/ImageElement.tsx
@@ -1930,6 +1929,7 @@ var RenderRoot = () => {
   ] });
 };
 export {
+  APPLE_EMOJI_FONT,
   DIMENSION_PRESETS,
   FONT_FAMILIES,
   FONT_URLS,
@@ -1955,12 +1955,11 @@ export {
   calculateLineWidth,
   calculateTimelineContentEnd,
   canSetAsReference,
+  debugFontStatus,
   defaultOffset,
-  emojiToUnified,
   formatTime,
   generateOverlayId,
   generateSegmentId,
-  getAppleEmojiUrl,
   getBaseSegments,
   getBorderRadii,
   getDependentElements,
@@ -1969,7 +1968,6 @@ export {
   getReferenceElementX,
   getReferenceElementY,
   getSegmentTimelinePosition,
-  hasEmoji,
   hexToRgba,
   isDynamicCropEnabled,
   isSegmentVisibleAtTime,
@@ -1977,7 +1975,6 @@ export {
   parseTime,
   preloadFonts,
   resolveElementPositions,
-  splitTextAndEmojis,
   useFontsLoaded,
   useImageLoader,
   useImagePreloader,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ugcinc-render",
-  "version": "1.5.15",
+  "version": "1.5.17",
   "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",