Исправление парсинга emoji и составных emoji (skin tones)

app/components/TextParser/TextParser.tsx

@@ -42,6 +42,20 @@ export function TextParser(props: TextParserProps) {
     const theme = useMantineTheme();
     let entityCount = 0;
 
+    const UNICODE_EMOJI_SEQUENCE_REGEX =
+        /(?:\p{Regional_Indicator}{2}|[0-9#*]\uFE0F?\u20E3|\p{Extended_Pictographic}(?:\uFE0F|\uFE0E)?(?:\p{Emoji_Modifier})?(?:\u200D\p{Extended_Pictographic}(?:\uFE0F|\uFE0E)?(?:\p{Emoji_Modifier})?)*)/u;
+
+    const UNICODE_EMOJI_SEQUENCE_REGEX_GLOBAL = new RegExp(
+        UNICODE_EMOJI_SEQUENCE_REGEX.source,
+        "gu"
+    );
+
+    const toUnified = (value: string): string =>
+        Array.from(value)
+            .map((ch) => ch.codePointAt(0)?.toString(16))
+            .filter(Boolean)
+            .join("-");
+
     const formatRules : FormatRule[] = [
         {  
             pattern: [
@@ -120,18 +134,21 @@ export function TextParser(props: TextParserProps) {
             }
         },
         {
-            // unicode emojis
+            // unicode emojis (including composite sequences)
-            pattern: [/\p{Emoji_Presentation}/u],
+            pattern: [UNICODE_EMOJI_SEQUENCE_REGEX],
             render: (match: string) => {
-                let textWithoutEmojis = props.text.replace(/\p{Emoji_Presentation}/gu, '');
+                const textWithoutEmojis = props.text.replace(UNICODE_EMOJI_SEQUENCE_REGEX_GLOBAL, "");
-                if(textWithoutEmojis.length <= (props.oversizeIfTextSmallerThan ?? 0)) {
+                const unified = toUnified(match);
-                    return <Emoji size={40} unified={match.codePointAt(0)?.toString(16) || ''}></Emoji>;
+
+                if (textWithoutEmojis.length <= (props.oversizeIfTextSmallerThan ?? 0)) {
+                    return <Emoji size={40} unified={unified}></Emoji>;
                 }
-                return <Emoji unified={match.codePointAt(0)?.toString(16) || ''}></Emoji>;
+
+                return <Emoji unified={unified}></Emoji>;
             },
             flush: (match: string) => {
-                return <Emoji unified={match.codePointAt(0)?.toString(16) || ''}></Emoji>;
+                return <Emoji unified={toUnified(match)}></Emoji>;
-            }   
+            }
         },
         {
             // :emoji_code: