@planningcenter/chat-react-native 3.42.2-qa-821.0 → 3.42.2-qa-staging.3

package/build/components/conversation/message_reaction.js

@@ -1,7 +1,6 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { PlatformPressable } from '@react-navigation/elements';
 import colorFunction from 'color';
-import { useMemo } from 'react';
+import React, { useMemo } from 'react';
 import { StyleSheet } from 'react-native';
 import { Text } from '../../components/display';
 import { useInteractionGhostBackgroundColor, useTheme } from '../../hooks';
@@ -26,7 +25,10 @@ export function MessageReaction({ reaction, onLongPress, message, conversationId
         Haptic.impactLight();
         handleReactionToggle({ value: reaction.value, mine: !!reaction.mine });
     };
-    return (_jsxs(PlatformPressable, { style: styles.reaction, onLongPress: () => onLongPress(reaction), onPress: handlePress, android_ripple: { color: androidRippleColor, borderless: false, foreground: true }, children: [_jsx(Text, { style: styles.reactionEmoji, children: REACTION_EMOJIS[reaction.value] }), _jsx(Text, { style: styles.reactionText, children: reaction.count })] }, reaction.value));
+    return (<PlatformPressable key={reaction.value} style={styles.reaction} onLongPress={() => onLongPress(reaction)} onPress={handlePress} android_ripple={{ color: androidRippleColor, borderless: false, foreground: true }}>
+      <Text style={styles.reactionEmoji}>{REACTION_EMOJIS[reaction.value]}</Text>
+      <Text style={styles.reactionText}>{reaction.count}</Text>
+    </PlatformPressable>);
 }
 export const useReactionStyles = ({ mine }) => {
     const { colors } = useTheme();

package/build/components/conversation/message_reaction.js.map

@@ -1 +1 @@
-{"version":3,"file":"message_reaction.js","sourceRoot":"","sources":["../../../src/components/conversation/message_reaction.tsx"],"names":[],"mappings":"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","sourcesContent":["import { PlatformPressable } from '@react-navigation/elements'\nimport colorFunction from 'color'\nimport React, { useMemo } from 'react'\nimport { StyleSheet } from 'react-native'\nimport { Text } from '../../components/display'\nimport { useInteractionGhostBackgroundColor, useTheme } from '../../hooks'\nimport { useCreateAndroidRippleColor } from '../../hooks/use_create_android_ripple_color'\nimport { useMessageReactionToggle } from '../../hooks/use_message_reaction_toggle'\nimport { MessageResource } from '../../types'\nimport { ReactionCountResource } from '../../types/resources/reaction'\nimport { REACTION_EMOJIS } from '../../utils'\nimport { Haptic } from '../../utils/native_adapters'\n\nexport function MessageReaction({\n  reaction,\n  onLongPress,\n  message,\n  conversationId,\n}: {\n  reaction: ReactionCountResource\n  onLongPress: (_reaction: ReactionCountResource) => void\n  message: MessageResource\n  conversationId: number\n}) {\n  const styles = useReactionStyles(reaction)\n  const { handleReactionToggle } = useMessageReactionToggle({\n    conversation_id: conversationId,\n    message,\n  })\n\n  const { colors } = useTheme()\n  const baseRippleColor = reaction.mine ? colors.interaction : colors.fillColorNeutral060\n  const androidRippleColor = useCreateAndroidRippleColor({ color: baseRippleColor })\n\n  if (!reaction.count) return null\n  if (!REACTION_EMOJIS[reaction.value]) return null\n\n  const handlePress = () => {\n    Haptic.impactLight()\n    handleReactionToggle({ value: reaction.value, mine: !!reaction.mine })\n  }\n\n  return (\n    <PlatformPressable\n      key={reaction.value}\n      style={styles.reaction}\n      onLongPress={() => onLongPress(reaction)}\n      onPress={handlePress}\n      android_ripple={{ color: androidRippleColor, borderless: false, foreground: true }}\n    >\n      <Text style={styles.reactionEmoji}>{REACTION_EMOJIS[reaction.value]}</Text>\n      <Text style={styles.reactionText}>{reaction.count}</Text>\n    </PlatformPressable>\n  )\n}\n\nexport const useReactionStyles = ({ mine }: { mine: number }) => {\n  const { colors } = useTheme()\n  const activeBorderColor = useMemo(() => {\n    return colorFunction(colors.interaction)\n      .hsl()\n      .lightness(colors.name === 'dark' ? 20 : 80)\n      .string()\n  }, [colors.interaction, colors.name])\n  const activeBackgroundColor = useInteractionGhostBackgroundColor()\n\n  return StyleSheet.create({\n    reaction: {\n      borderWidth: 1,\n      borderColor: mine ? activeBorderColor : 'transparent',\n      backgroundColor: mine ? activeBackgroundColor : colors.fillColorNeutral060,\n      borderRadius: 16,\n      overflow: 'hidden',\n      paddingVertical: 4,\n      paddingHorizontal: 8,\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 2,\n    },\n    reactionEmoji: { fontSize: 12, paddingTop: 0 },\n    reactionText: { fontSize: 12, color: colors.textColorDefaultPrimary },\n  })\n}\n"]}
+{"version":3,"file":"message_reaction.js","sourceRoot":"","sources":["../../../src/components/conversation/message_reaction.tsx"],"names":[],"mappings":"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","sourcesContent":["import { PlatformPressable } from '@react-navigation/elements'\nimport colorFunction from 'color'\nimport React, { useMemo } from 'react'\nimport { StyleSheet } from 'react-native'\nimport { Text } from '../../components/display'\nimport { useInteractionGhostBackgroundColor, useTheme } from '../../hooks'\nimport { useCreateAndroidRippleColor } from '../../hooks/use_create_android_ripple_color'\nimport { useMessageReactionToggle } from '../../hooks/use_message_reaction_toggle'\nimport { MessageResource } from '../../types'\nimport { ReactionCountResource } from '../../types/resources/reaction'\nimport { REACTION_EMOJIS } from '../../utils'\nimport { Haptic } from '../../utils/native_adapters'\n\nexport function MessageReaction({\n  reaction,\n  onLongPress,\n  message,\n  conversationId,\n}: {\n  reaction: ReactionCountResource\n  onLongPress: (_reaction: ReactionCountResource) => void\n  message: MessageResource\n  conversationId: number\n}) {\n  const styles = useReactionStyles(reaction)\n  const { handleReactionToggle } = useMessageReactionToggle({\n    conversation_id: conversationId,\n    message,\n  })\n\n  const { colors } = useTheme()\n  const baseRippleColor = reaction.mine ? colors.interaction : colors.fillColorNeutral060\n  const androidRippleColor = useCreateAndroidRippleColor({ color: baseRippleColor })\n\n  if (!reaction.count) return null\n  if (!REACTION_EMOJIS[reaction.value]) return null\n\n  const handlePress = () => {\n    Haptic.impactLight()\n    handleReactionToggle({ value: reaction.value, mine: !!reaction.mine })\n  }\n\n  return (\n    <PlatformPressable\n      key={reaction.value}\n      style={styles.reaction}\n      onLongPress={() => onLongPress(reaction)}\n      onPress={handlePress}\n      android_ripple={{ color: androidRippleColor, borderless: false, foreground: true }}\n    >\n      <Text style={styles.reactionEmoji}>{REACTION_EMOJIS[reaction.value]}</Text>\n      <Text style={styles.reactionText}>{reaction.count}</Text>\n    </PlatformPressable>\n  )\n}\n\nexport const useReactionStyles = ({ mine }: { mine: number }) => {\n  const { colors } = useTheme()\n  const activeBorderColor = useMemo(() => {\n    return colorFunction(colors.interaction)\n      .hsl()\n      .lightness(colors.name === 'dark' ? 20 : 80)\n      .string()\n  }, [colors.interaction, colors.name])\n  const activeBackgroundColor = useInteractionGhostBackgroundColor()\n\n  return StyleSheet.create({\n    reaction: {\n      borderWidth: 1,\n      borderColor: mine ? activeBorderColor : 'transparent',\n      backgroundColor: mine ? activeBackgroundColor : colors.fillColorNeutral060,\n      borderRadius: 16,\n      overflow: 'hidden',\n      paddingVertical: 4,\n      paddingHorizontal: 8,\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 2,\n    },\n    reactionEmoji: { fontSize: 12, paddingTop: 0 },\n    reactionText: { fontSize: 12, color: colors.textColorDefaultPrimary },\n  })\n}\n"]}

package/build/components/conversation/message_read_receipts.d.ts

@@ -1,8 +1,9 @@
+import React from 'react';
 import { MessageResource } from '../../types';
 interface Props {
     message: MessageResource;
     latestReadMessageSortKey?: string;
 }
-export declare function MessageReadReceipts({ message, latestReadMessageSortKey }: Props): import("react/jsx-runtime").JSX.Element;
+export declare function MessageReadReceipts({ message, latestReadMessageSortKey }: Props): React.JSX.Element;
 export {};
 //# sourceMappingURL=message_read_receipts.d.ts.map

package/build/components/conversation/message_read_receipts.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"message_read_receipts.d.ts","sourceRoot":"","sources":["../../../src/components/conversation/message_read_receipts.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AAG7C,UAAU,KAAK;IACb,OAAO,EAAE,eAAe,CAAA;IACxB,wBAAwB,CAAC,EAAE,MAAM,CAAA;CAClC;AAED,wBAAgB,mBAAmB,CAAC,EAAE,OAAO,EAAE,wBAAwB,EAAE,EAAE,KAAK,2CAqB/E"}
+{"version":3,"file":"message_read_receipts.d.ts","sourceRoot":"","sources":["../../../src/components/conversation/message_read_receipts.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AAG7C,UAAU,KAAK;IACb,OAAO,EAAE,eAAe,CAAA;IACxB,wBAAwB,CAAC,EAAE,MAAM,CAAA;CAClC;AAED,wBAAgB,mBAAmB,CAAC,EAAE,OAAO,EAAE,wBAAwB,EAAE,EAAE,KAAK,qBAqB/E"}

package/build/components/conversation/message_read_receipts.js

@@ -1,13 +1,23 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
 import { StyleSheet, View } from 'react-native';
 import { useTheme } from '../../hooks';
 import { Icon, Text } from '../display';
 export function MessageReadReceipts({ message, latestReadMessageSortKey }) {
     const styles = useStyles();
     if (!latestReadMessageSortKey || message.id > latestReadMessageSortKey) {
-        return (_jsxs(View, { style: styles.badgeContainer, children: [_jsx(Icon, { name: "general.check", style: styles.icon }), _jsx(Text, { style: styles.badgeText, variant: "footnote", children: "Sent" })] }));
+        return (<View style={styles.badgeContainer}>
+        <Icon name="general.check" style={styles.icon}/>
+        <Text style={styles.badgeText} variant="footnote">
+          Sent
+        </Text>
+      </View>);
     }
-    return (_jsxs(View, { style: styles.badgeContainer, children: [_jsx(Icon, { name: "general.checkDouble", style: styles.icon }), _jsx(Text, { style: styles.badgeText, variant: "footnote", children: "Read" })] }));
+    return (<View style={styles.badgeContainer}>
+      <Icon name="general.checkDouble" style={styles.icon}/>
+      <Text style={styles.badgeText} variant="footnote">
+        Read
+      </Text>
+    </View>);
 }
 const useStyles = () => {
     const { colors } = useTheme();

package/build/components/conversation/message_read_receipts.js.map

@@ -1 +1 @@
-{"version":3,"file":"message_read_receipts.js","sourceRoot":"","sources":["../../../src/components/conversation/message_read_receipts.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AAEtC,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,YAAY,CAAA;AAOvC,MAAM,UAAU,mBAAmB,CAAC,EAAE,OAAO,EAAE,wBAAwB,EAAS;IAC9E,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAC1B,IAAI,CAAC,wBAAwB,IAAI,OAAO,CAAC,EAAE,GAAG,wBAAwB,EAAE,CAAC;QACvE,OAAO,CACL,MAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,cAAc,aAChC,KAAC,IAAI,IAAC,IAAI,EAAC,eAAe,EAAC,KAAK,EAAE,MAAM,CAAC,IAAI,GAAI,EACjD,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,SAAS,EAAE,OAAO,EAAC,UAAU,qBAE1C,IACF,CACR,CAAA;IACH,CAAC;IAED,OAAO,CACL,MAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,cAAc,aAChC,KAAC,IAAI,IAAC,IAAI,EAAC,qBAAqB,EAAC,KAAK,EAAE,MAAM,CAAC,IAAI,GAAI,EACvD,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,SAAS,EAAE,OAAO,EAAC,UAAU,qBAE1C,IACF,CACR,CAAA;AACH,CAAC;AAED,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,EAAE,MAAM,EAAE,GAAG,QAAQ,EAAE,CAAA;IAE7B,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,cAAc,EAAE;YACd,aAAa,EAAE,KAAK;YACpB,UAAU,EAAE,QAAQ;YACpB,GAAG,EAAE,CAAC;SACP;QACD,SAAS,EAAE;YACT,UAAU,EAAE,KAAK;SAClB;QACD,IAAI,EAAE;YACJ,KAAK,EAAE,MAAM,CAAC,yBAAyB;SACxC;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import React from 'react'\nimport { StyleSheet, View } from 'react-native'\nimport { useTheme } from '../../hooks'\nimport { MessageResource } from '../../types'\nimport { Icon, Text } from '../display'\n\ninterface Props {\n  message: MessageResource\n  latestReadMessageSortKey?: string\n}\n\nexport function MessageReadReceipts({ message, latestReadMessageSortKey }: Props) {\n  const styles = useStyles()\n  if (!latestReadMessageSortKey || message.id > latestReadMessageSortKey) {\n    return (\n      <View style={styles.badgeContainer}>\n        <Icon name=\"general.check\" style={styles.icon} />\n        <Text style={styles.badgeText} variant=\"footnote\">\n          Sent\n        </Text>\n      </View>\n    )\n  }\n\n  return (\n    <View style={styles.badgeContainer}>\n      <Icon name=\"general.checkDouble\" style={styles.icon} />\n      <Text style={styles.badgeText} variant=\"footnote\">\n        Read\n      </Text>\n    </View>\n  )\n}\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n\n  return StyleSheet.create({\n    badgeContainer: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 4,\n    },\n    badgeText: {\n      fontWeight: '600',\n    },\n    icon: {\n      color: colors.iconColorDefaultSecondary,\n    },\n  })\n}\n"]}
+{"version":3,"file":"message_read_receipts.js","sourceRoot":"","sources":["../../../src/components/conversation/message_read_receipts.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AAEtC,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,YAAY,CAAA;AAOvC,MAAM,UAAU,mBAAmB,CAAC,EAAE,OAAO,EAAE,wBAAwB,EAAS;IAC9E,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAC1B,IAAI,CAAC,wBAAwB,IAAI,OAAO,CAAC,EAAE,GAAG,wBAAwB,EAAE,CAAC;QACvE,OAAO,CACL,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,cAAc,CAAC,CACjC;QAAA,CAAC,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,EAC9C;QAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,OAAO,CAAC,UAAU,CAC/C;;QACF,EAAE,IAAI,CACR;MAAA,EAAE,IAAI,CAAC,CACR,CAAA;IACH,CAAC;IAED,OAAO,CACL,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,cAAc,CAAC,CACjC;MAAA,CAAC,IAAI,CAAC,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,EACpD;MAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,OAAO,CAAC,UAAU,CAC/C;;MACF,EAAE,IAAI,CACR;IAAA,EAAE,IAAI,CAAC,CACR,CAAA;AACH,CAAC;AAED,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,EAAE,MAAM,EAAE,GAAG,QAAQ,EAAE,CAAA;IAE7B,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,cAAc,EAAE;YACd,aAAa,EAAE,KAAK;YACpB,UAAU,EAAE,QAAQ;YACpB,GAAG,EAAE,CAAC;SACP;QACD,SAAS,EAAE;YACT,UAAU,EAAE,KAAK;SAClB;QACD,IAAI,EAAE;YACJ,KAAK,EAAE,MAAM,CAAC,yBAAyB;SACxC;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import React from 'react'\nimport { StyleSheet, View } from 'react-native'\nimport { useTheme } from '../../hooks'\nimport { MessageResource } from '../../types'\nimport { Icon, Text } from '../display'\n\ninterface Props {\n  message: MessageResource\n  latestReadMessageSortKey?: string\n}\n\nexport function MessageReadReceipts({ message, latestReadMessageSortKey }: Props) {\n  const styles = useStyles()\n  if (!latestReadMessageSortKey || message.id > latestReadMessageSortKey) {\n    return (\n      <View style={styles.badgeContainer}>\n        <Icon name=\"general.check\" style={styles.icon} />\n        <Text style={styles.badgeText} variant=\"footnote\">\n          Sent\n        </Text>\n      </View>\n    )\n  }\n\n  return (\n    <View style={styles.badgeContainer}>\n      <Icon name=\"general.checkDouble\" style={styles.icon} />\n      <Text style={styles.badgeText} variant=\"footnote\">\n        Read\n      </Text>\n    </View>\n  )\n}\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n\n  return StyleSheet.create({\n    badgeContainer: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 4,\n    },\n    badgeText: {\n      fontWeight: '600',\n    },\n    icon: {\n      color: colors.iconColorDefaultSecondary,\n    },\n  })\n}\n"]}

package/build/components/conversation/messages_disabled_banners.d.ts

@@ -1,9 +1,9 @@
 import type { ConversationDisabledReason } from '../../types';
-export declare const LeaderMessagesDisabledBanner: () => import("react/jsx-runtime").JSX.Element;
-export declare const MemberMessagesDisabledBanner: () => import("react/jsx-runtime").JSX.Element;
+export declare const LeaderMessagesDisabledBanner: () => import("react").JSX.Element;
+export declare const MemberMessagesDisabledBanner: () => import("react").JSX.Element;
 interface ConversationDisabledBannerProps {
     disabledReason?: ConversationDisabledReason;
 }
-export declare const ConversationDisabledBanner: ({ disabledReason }: ConversationDisabledBannerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ConversationDisabledBanner: ({ disabledReason }: ConversationDisabledBannerProps) => import("react").JSX.Element;
 export {};
 //# sourceMappingURL=messages_disabled_banners.d.ts.map

package/build/components/conversation/messages_disabled_banners.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"messages_disabled_banners.d.ts","sourceRoot":"","sources":["../../../src/components/conversation/messages_disabled_banners.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,aAAa,CAAA;AAI7D,eAAO,MAAM,4BAA4B,+CAIxC,CAAA;AAED,eAAO,MAAM,4BAA4B,+CASxC,CAAA;AASD,UAAU,+BAA+B;IACvC,cAAc,CAAC,EAAE,0BAA0B,CAAA;CAC5C;AAED,eAAO,MAAM,0BAA0B,GAAI,oBAAoB,+BAA+B,4CAM7F,CAAA"}
+{"version":3,"file":"messages_disabled_banners.d.ts","sourceRoot":"","sources":["../../../src/components/conversation/messages_disabled_banners.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,aAAa,CAAA;AAI7D,eAAO,MAAM,4BAA4B,mCAIxC,CAAA;AAED,eAAO,MAAM,4BAA4B,mCASxC,CAAA;AASD,UAAU,+BAA+B;IACvC,cAAc,CAAC,EAAE,0BAA0B,CAAA;CAC5C;AAED,eAAO,MAAM,0BAA0B,GAAI,oBAAoB,+BAA+B,gCAM7F,CAAA"}

package/build/components/conversation/messages_disabled_banners.js

@@ -1,15 +1,14 @@
-import { jsx as _jsx } from "react/jsx-runtime";
 import { StyleSheet, View } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { useTheme } from '../../hooks';
 import { ADULT_REQUIREMENT_BODY } from '../../utils';
 import { Text } from '../display';
 export const LeaderMessagesDisabledBanner = () => {
-    return (_jsx(MessagesDisabledBanner, { description: "Only leaders can send messages in this conversation." }));
+    return (<MessagesDisabledBanner description="Only leaders can send messages in this conversation."/>);
 };
 export const MemberMessagesDisabledBanner = () => {
     const styles = useStyles();
-    return (_jsx(MessagesDisabledBanner, { description: "Only leaders can send messages, but you can still add reactions.", style: styles.memberBanner }));
+    return (<MessagesDisabledBanner description="Only leaders can send messages, but you can still add reactions." style={styles.memberBanner}/>);
 };
 const DISABLED_REASON_TEXT = {
     safety_check: ADULT_REQUIREMENT_BODY,
@@ -19,11 +18,15 @@ const DEFAULT_DISABLED_TEXT = 'This conversation has been disabled.';
 export const ConversationDisabledBanner = ({ disabledReason }) => {
     const styles = useStyles();
     const description = (disabledReason && DISABLED_REASON_TEXT[disabledReason]) ?? DEFAULT_DISABLED_TEXT;
-    return _jsx(MessagesDisabledBanner, { description: description, style: styles.memberBanner });
+    return <MessagesDisabledBanner description={description} style={styles.memberBanner}/>;
 };
 const MessagesDisabledBanner = ({ description, style }) => {
     const styles = useStyles();
-    return (_jsx(View, { style: [styles.baseBanner, style], children: _jsx(Text, { style: styles.text, variant: "tertiary", children: description }) }));
+    return (<View style={[styles.baseBanner, style]}>
+      <Text style={styles.text} variant="tertiary">
+        {description}
+      </Text>
+    </View>);
 };
 const useStyles = () => {
     const { colors } = useTheme();

package/build/components/conversation/messages_disabled_banners.js.map

@@ -1 +1 @@
-{"version":3,"file":"messages_disabled_banners.js","sourceRoot":"","sources":["../../../src/components/conversation/messages_disabled_banners.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAkB,MAAM,cAAc,CAAA;AAC/D,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAClE,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AAEtC,OAAO,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAA;AACpD,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAA;AAEjC,MAAM,CAAC,MAAM,4BAA4B,GAAG,GAAG,EAAE;IAC/C,OAAO,CACL,KAAC,sBAAsB,IAAC,WAAW,EAAC,sDAAsD,GAAG,CAC9F,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,4BAA4B,GAAG,GAAG,EAAE;IAC/C,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAE1B,OAAO,CACL,KAAC,sBAAsB,IACrB,WAAW,EAAC,kEAAkE,EAC9E,KAAK,EAAE,MAAM,CAAC,YAAY,GAC1B,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,oBAAoB,GAA+C;IACvE,YAAY,EAAE,sBAAsB;IACpC,wBAAwB,EAAE,uEAAuE;CAClG,CAAA;AAED,MAAM,qBAAqB,GAAG,sCAAsC,CAAA;AAMpE,MAAM,CAAC,MAAM,0BAA0B,GAAG,CAAC,EAAE,cAAc,EAAmC,EAAE,EAAE;IAChG,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAC1B,MAAM,WAAW,GACf,CAAC,cAAc,IAAI,oBAAoB,CAAC,cAAc,CAAC,CAAC,IAAI,qBAAqB,CAAA;IAEnF,OAAO,KAAC,sBAAsB,IAAC,WAAW,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,CAAC,YAAY,GAAI,CAAA;AACzF,CAAC,CAAA;AAOD,MAAM,sBAAsB,GAAG,CAAC,EAAE,WAAW,EAAE,KAAK,EAA+B,EAAE,EAAE;IACrF,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAE1B,OAAO,CACL,KAAC,IAAI,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,UAAU,EAAE,KAAK,CAAC,YACrC,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,IAAI,EAAE,OAAO,EAAC,UAAU,YACzC,WAAW,GACP,GACF,CACR,CAAA;AACH,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,EAAE,MAAM,EAAE,GAAG,QAAQ,EAAE,CAAA;IAC7B,MAAM,EAAE,MAAM,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAEtC,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,UAAU,EAAE;YACV,iBAAiB,EAAE,EAAE;YACrB,eAAe,EAAE,CAAC;YAClB,eAAe,EAAE,MAAM,CAAC,+BAA+B;YACvD,cAAc,EAAE,CAAC;YACjB,cAAc,EAAE,MAAM,CAAC,sBAAsB;SAC9C;QACD,IAAI,EAAE;YACJ,SAAS,EAAE,QAAQ;SACpB;QACD,YAAY,EAAE;YACZ,UAAU,EAAE,EAAE;YACd,aAAa,EAAE,EAAE,GAAG,MAAM;YAC1B,YAAY,EAAE,CAAC,MAAM;SACtB;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import { StyleSheet, View, type ViewStyle } from 'react-native'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { useTheme } from '../../hooks'\nimport type { ConversationDisabledReason } from '../../types'\nimport { ADULT_REQUIREMENT_BODY } from '../../utils'\nimport { Text } from '../display'\n\nexport const LeaderMessagesDisabledBanner = () => {\n  return (\n    <MessagesDisabledBanner description=\"Only leaders can send messages in this conversation.\" />\n  )\n}\n\nexport const MemberMessagesDisabledBanner = () => {\n  const styles = useStyles()\n\n  return (\n    <MessagesDisabledBanner\n      description=\"Only leaders can send messages, but you can still add reactions.\"\n      style={styles.memberBanner}\n    />\n  )\n}\n\nconst DISABLED_REASON_TEXT: Record<ConversationDisabledReason, string> = {\n  safety_check: ADULT_REQUIREMENT_BODY,\n  direct_messages_disabled: 'Direct messages have been turned off by someone in this conversation.',\n}\n\nconst DEFAULT_DISABLED_TEXT = 'This conversation has been disabled.'\n\ninterface ConversationDisabledBannerProps {\n  disabledReason?: ConversationDisabledReason\n}\n\nexport const ConversationDisabledBanner = ({ disabledReason }: ConversationDisabledBannerProps) => {\n  const styles = useStyles()\n  const description =\n    (disabledReason && DISABLED_REASON_TEXT[disabledReason]) ?? DEFAULT_DISABLED_TEXT\n\n  return <MessagesDisabledBanner description={description} style={styles.memberBanner} />\n}\n\ninterface MessagesDisabledBannerProps {\n  description: string\n  style?: ViewStyle\n}\n\nconst MessagesDisabledBanner = ({ description, style }: MessagesDisabledBannerProps) => {\n  const styles = useStyles()\n\n  return (\n    <View style={[styles.baseBanner, style]}>\n      <Text style={styles.text} variant=\"tertiary\">\n        {description}\n      </Text>\n    </View>\n  )\n}\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n  const { bottom } = useSafeAreaInsets()\n\n  return StyleSheet.create({\n    baseBanner: {\n      paddingHorizontal: 16,\n      paddingVertical: 4,\n      backgroundColor: colors.statusNeutralComposedBackground,\n      borderTopWidth: 1,\n      borderTopColor: colors.borderColorDefaultBase,\n    },\n    text: {\n      textAlign: 'center',\n    },\n    memberBanner: {\n      paddingTop: 16,\n      paddingBottom: 16 + bottom,\n      marginBottom: -bottom,\n    },\n  })\n}\n"]}
+{"version":3,"file":"messages_disabled_banners.js","sourceRoot":"","sources":["../../../src/components/conversation/messages_disabled_banners.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAkB,MAAM,cAAc,CAAA;AAC/D,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAClE,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AAEtC,OAAO,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAA;AACpD,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAA;AAEjC,MAAM,CAAC,MAAM,4BAA4B,GAAG,GAAG,EAAE;IAC/C,OAAO,CACL,CAAC,sBAAsB,CAAC,WAAW,CAAC,sDAAsD,EAAG,CAC9F,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,4BAA4B,GAAG,GAAG,EAAE;IAC/C,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAE1B,OAAO,CACL,CAAC,sBAAsB,CACrB,WAAW,CAAC,kEAAkE,CAC9E,KAAK,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,EAC3B,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,oBAAoB,GAA+C;IACvE,YAAY,EAAE,sBAAsB;IACpC,wBAAwB,EAAE,uEAAuE;CAClG,CAAA;AAED,MAAM,qBAAqB,GAAG,sCAAsC,CAAA;AAMpE,MAAM,CAAC,MAAM,0BAA0B,GAAG,CAAC,EAAE,cAAc,EAAmC,EAAE,EAAE;IAChG,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAC1B,MAAM,WAAW,GACf,CAAC,cAAc,IAAI,oBAAoB,CAAC,cAAc,CAAC,CAAC,IAAI,qBAAqB,CAAA;IAEnF,OAAO,CAAC,sBAAsB,CAAC,WAAW,CAAC,CAAC,WAAW,CAAC,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,EAAG,CAAA;AACzF,CAAC,CAAA;AAOD,MAAM,sBAAsB,GAAG,CAAC,EAAE,WAAW,EAAE,KAAK,EAA+B,EAAE,EAAE;IACrF,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAE1B,OAAO,CACL,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC,CACtC;MAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,UAAU,CAC1C;QAAA,CAAC,WAAW,CACd;MAAA,EAAE,IAAI,CACR;IAAA,EAAE,IAAI,CAAC,CACR,CAAA;AACH,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,EAAE,MAAM,EAAE,GAAG,QAAQ,EAAE,CAAA;IAC7B,MAAM,EAAE,MAAM,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAEtC,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,UAAU,EAAE;YACV,iBAAiB,EAAE,EAAE;YACrB,eAAe,EAAE,CAAC;YAClB,eAAe,EAAE,MAAM,CAAC,+BAA+B;YACvD,cAAc,EAAE,CAAC;YACjB,cAAc,EAAE,MAAM,CAAC,sBAAsB;SAC9C;QACD,IAAI,EAAE;YACJ,SAAS,EAAE,QAAQ;SACpB;QACD,YAAY,EAAE;YACZ,UAAU,EAAE,EAAE;YACd,aAAa,EAAE,EAAE,GAAG,MAAM;YAC1B,YAAY,EAAE,CAAC,MAAM;SACtB;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import { StyleSheet, View, type ViewStyle } from 'react-native'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { useTheme } from '../../hooks'\nimport type { ConversationDisabledReason } from '../../types'\nimport { ADULT_REQUIREMENT_BODY } from '../../utils'\nimport { Text } from '../display'\n\nexport const LeaderMessagesDisabledBanner = () => {\n  return (\n    <MessagesDisabledBanner description=\"Only leaders can send messages in this conversation.\" />\n  )\n}\n\nexport const MemberMessagesDisabledBanner = () => {\n  const styles = useStyles()\n\n  return (\n    <MessagesDisabledBanner\n      description=\"Only leaders can send messages, but you can still add reactions.\"\n      style={styles.memberBanner}\n    />\n  )\n}\n\nconst DISABLED_REASON_TEXT: Record<ConversationDisabledReason, string> = {\n  safety_check: ADULT_REQUIREMENT_BODY,\n  direct_messages_disabled: 'Direct messages have been turned off by someone in this conversation.',\n}\n\nconst DEFAULT_DISABLED_TEXT = 'This conversation has been disabled.'\n\ninterface ConversationDisabledBannerProps {\n  disabledReason?: ConversationDisabledReason\n}\n\nexport const ConversationDisabledBanner = ({ disabledReason }: ConversationDisabledBannerProps) => {\n  const styles = useStyles()\n  const description =\n    (disabledReason && DISABLED_REASON_TEXT[disabledReason]) ?? DEFAULT_DISABLED_TEXT\n\n  return <MessagesDisabledBanner description={description} style={styles.memberBanner} />\n}\n\ninterface MessagesDisabledBannerProps {\n  description: string\n  style?: ViewStyle\n}\n\nconst MessagesDisabledBanner = ({ description, style }: MessagesDisabledBannerProps) => {\n  const styles = useStyles()\n\n  return (\n    <View style={[styles.baseBanner, style]}>\n      <Text style={styles.text} variant=\"tertiary\">\n        {description}\n      </Text>\n    </View>\n  )\n}\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n  const { bottom } = useSafeAreaInsets()\n\n  return StyleSheet.create({\n    baseBanner: {\n      paddingHorizontal: 16,\n      paddingVertical: 4,\n      backgroundColor: colors.statusNeutralComposedBackground,\n      borderTopWidth: 1,\n      borderTopColor: colors.borderColorDefaultBase,\n    },\n    text: {\n      textAlign: 'center',\n    },\n    memberBanner: {\n      paddingTop: 16,\n      paddingBottom: 16 + bottom,\n      marginBottom: -bottom,\n    },\n  })\n}\n"]}

package/build/components/conversation/reply_connectors.d.ts

@@ -4,7 +4,7 @@ interface ReplyConnectorProps {
     message: MessageResource;
     messageBubbleHeight: number;
 }
-export declare function TheirReplyConnector({ message, messageBubbleHeight }: ReplyConnectorProps): import("react/jsx-runtime").JSX.Element | null;
-export declare function MyReplyConnector({ message, messageBubbleHeight }: ReplyConnectorProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function TheirReplyConnector({ message, messageBubbleHeight }: ReplyConnectorProps): import("react").JSX.Element | null;
+export declare function MyReplyConnector({ message, messageBubbleHeight }: ReplyConnectorProps): import("react").JSX.Element | null;
 export {};
 //# sourceMappingURL=reply_connectors.d.ts.map

package/build/components/conversation/reply_connectors.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"reply_connectors.d.ts","sourceRoot":"","sources":["../../../src/components/conversation/reply_connectors.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AAS7C,eAAO,MAAM,wBAAwB,IAAI,CAAA;AAEzC,UAAU,mBAAmB;IAC3B,OAAO,EAAE,eAAe,CAAA;IACxB,mBAAmB,EAAE,MAAM,CAAA;CAC5B;AAED,wBAAgB,mBAAmB,CAAC,EAAE,OAAO,EAAE,mBAAmB,EAAE,EAAE,mBAAmB,kDAiCxF;AAED,wBAAgB,gBAAgB,CAAC,EAAE,OAAO,EAAE,mBAAmB,EAAE,EAAE,mBAAmB,kDA4CrF"}
+{"version":3,"file":"reply_connectors.d.ts","sourceRoot":"","sources":["../../../src/components/conversation/reply_connectors.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AAS7C,eAAO,MAAM,wBAAwB,IAAI,CAAA;AAEzC,UAAU,mBAAmB;IAC3B,OAAO,EAAE,eAAe,CAAA;IACxB,mBAAmB,EAAE,MAAM,CAAA;CAC5B;AAED,wBAAgB,mBAAmB,CAAC,EAAE,OAAO,EAAE,mBAAmB,EAAE,EAAE,mBAAmB,sCAiCxF;AAED,wBAAgB,gBAAgB,CAAC,EAAE,OAAO,EAAE,mBAAmB,EAAE,EAAE,mBAAmB,sCA4CrF"}

package/build/components/conversation/reply_connectors.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { StyleSheet, View } from 'react-native';
 import Svg, { Path } from 'react-native-svg';
 import { useTheme } from '../../hooks';
@@ -13,9 +12,9 @@ export function TheirReplyConnector({ message, messageBubbleHeight }) {
     if (messageBubbleHeight === 0)
         return null; // Prevents UI shifting
     const connectorMap = {
-        shortTailCurve: _jsx(ShortTailCurveConnector, { height: messageBubbleHeight / 2 }),
-        shortHeadCurve: _jsx(ShortHeadCurveConnector, { height: messageBubbleHeight / 2 }),
-        verticalLine: _jsx(VerticalLineConnector, {}),
+        shortTailCurve: <ShortTailCurveConnector height={messageBubbleHeight / 2}/>,
+        shortHeadCurve: <ShortHeadCurveConnector height={messageBubbleHeight / 2}/>,
+        verticalLine: <VerticalLineConnector />,
         default: null,
     };
     const getConnectorKey = () => {
@@ -33,7 +32,7 @@ export function TheirReplyConnector({ message, messageBubbleHeight }) {
     if (!ConnectorComponent)
         return null;
     const spacerStyle = nextRendersAuthor ? styles.theirReplyConnectorSpacer : null;
-    return (_jsx(View, { style: [styles.theirReplyConnectorContainer, spacerStyle], children: ConnectorComponent }));
+    return (<View style={[styles.theirReplyConnectorContainer, spacerStyle]}>{ConnectorComponent}</View>);
 }
 export function MyReplyConnector({ message, messageBubbleHeight }) {
     const styles = useStyles();
@@ -41,10 +40,10 @@ export function MyReplyConnector({ message, messageBubbleHeight }) {
     if (messageBubbleHeight === 0)
         return null; // Prevents UI shifting
     const connectorMap = {
-        longTailCurve: (_jsx(LongTailCurveConnector, { height: messageBubbleHeight / 2, style: styles.myReplyConnectorPosition })),
-        longHeadCurve: (_jsx(LongHeadCurveConnector, { height: messageBubbleHeight / 2, style: styles.myReplyConnectorPosition })),
-        verticalLine: _jsx(VerticalLineConnector, { style: styles.myReplyConnectorPosition }),
-        swirl: _jsx(SwirlConnector, { style: styles.myReplyConnectorPosition, height: messageBubbleHeight }),
+        longTailCurve: (<LongTailCurveConnector height={messageBubbleHeight / 2} style={styles.myReplyConnectorPosition}/>),
+        longHeadCurve: (<LongHeadCurveConnector height={messageBubbleHeight / 2} style={styles.myReplyConnectorPosition}/>),
+        verticalLine: <VerticalLineConnector style={styles.myReplyConnectorPosition}/>,
+        swirl: <SwirlConnector style={styles.myReplyConnectorPosition} height={messageBubbleHeight}/>,
         default: null,
     };
     const getConnectorKey = () => {
@@ -62,36 +61,67 @@ export function MyReplyConnector({ message, messageBubbleHeight }) {
     if (!ConnectorComponent)
         return null;
     const spacerStyle = nextRendersAuthor ? styles.myReplyConnectorSpacer : null;
-    return (_jsx(EnforceLeftPositionForMyReplyConnector, { children: _jsx(View, { style: [styles.myReplyConnectorContainer, spacerStyle], children: ConnectorComponent }) }));
+    return (<EnforceLeftPositionForMyReplyConnector>
+      <View style={[styles.myReplyConnectorContainer, spacerStyle]}>{ConnectorComponent}</View>
+    </EnforceLeftPositionForMyReplyConnector>);
 }
 function VerticalLineConnector({ style }) {
     const styles = useStyles();
-    return _jsx(View, { style: [styles.verticalLineConnector, style] });
+    return <View style={[styles.verticalLineConnector, style]}/>;
 }
 function LongHeadCurveConnector({ height, style }) {
     const styles = useStyles();
     const { colors } = useTheme();
-    return (_jsxs(View, { style: [styles.longHeadCurveConnector, { marginTop: height }, style], children: [_jsx(Svg, { width: MY_REPLY_CONNECTOR_WIDTH, height: 18, fill: "none", children: _jsx(Path, { d: "M 2 18 L 2 16 A 14 14 0 0 1 16 2 L 38 2", stroke: colors.borderColorDefaultBase, strokeWidth: CONNECTOR_BORDER_WIDTH }) }), _jsx(View, { style: styles.svgConnnectorVerticalLineTail })] }));
+    return (<View style={[styles.longHeadCurveConnector, { marginTop: height }, style]}>
+      <Svg width={MY_REPLY_CONNECTOR_WIDTH} height={18} fill="none">
+        <Path d="M 2 18 L 2 16 A 14 14 0 0 1 16 2 L 38 2" stroke={colors.borderColorDefaultBase} strokeWidth={CONNECTOR_BORDER_WIDTH}/>
+      </Svg>
+      <View style={styles.svgConnnectorVerticalLineTail}/>
+    </View>);
 }
 function LongTailCurveConnector({ height, style }) {
     const styles = useStyles();
     const { colors } = useTheme();
-    return (_jsxs(View, { style: [{ height }, style], children: [_jsx(View, { style: styles.svgConnnectorVerticalLineHead }), _jsx(Svg, { width: MY_REPLY_CONNECTOR_WIDTH, height: 18, fill: "none", children: _jsx(Path, { d: "M 2 0 L 2 2 A 14 14 0 0 0 16 16 L 38 16", stroke: colors.borderColorDefaultBase, strokeWidth: CONNECTOR_BORDER_WIDTH }) })] }));
+    return (<View style={[{ height }, style]}>
+      <View style={styles.svgConnnectorVerticalLineHead}/>
+      <Svg width={MY_REPLY_CONNECTOR_WIDTH} height={18} fill="none">
+        <Path d="M 2 0 L 2 2 A 14 14 0 0 0 16 16 L 38 16" stroke={colors.borderColorDefaultBase} strokeWidth={CONNECTOR_BORDER_WIDTH}/>
+      </Svg>
+    </View>);
 }
 function ShortHeadCurveConnector({ height }) {
     const styles = useStyles();
     const { colors } = useTheme();
-    return (_jsxs(View, { style: [styles.shortHeadCurveConnector, { marginTop: height }], children: [_jsx(Svg, { width: 20, height: 18, fill: "none", children: _jsx(Path, { d: "M 2 18 L 2 16 A 14 14 0 0 1 16 2 L 20 2", stroke: colors.borderColorDefaultBase, strokeWidth: CONNECTOR_BORDER_WIDTH }) }), _jsx(View, { style: styles.svgConnnectorVerticalLineTail })] }));
+    return (<View style={[styles.shortHeadCurveConnector, { marginTop: height }]}>
+      <Svg width={20} height={18} fill="none">
+        <Path d="M 2 18 L 2 16 A 14 14 0 0 1 16 2 L 20 2" stroke={colors.borderColorDefaultBase} strokeWidth={CONNECTOR_BORDER_WIDTH}/>
+      </Svg>
+      <View style={styles.svgConnnectorVerticalLineTail}/>
+    </View>);
 }
 function ShortTailCurveConnector({ height }) {
     const styles = useStyles();
     const { colors } = useTheme();
-    return (_jsxs(View, { style: { height }, children: [_jsx(View, { style: styles.svgConnnectorVerticalLineHead }), _jsx(Svg, { width: 20, height: 18, fill: "none", children: _jsx(Path, { d: "M 2 0 L 2 2 A 14 14 0 0 0 16 16 L 20 16", stroke: colors.borderColorDefaultBase, strokeWidth: CONNECTOR_BORDER_WIDTH }) })] }));
+    return (<View style={{ height }}>
+      <View style={styles.svgConnnectorVerticalLineHead}/>
+      <Svg width={20} height={18} fill="none">
+        <Path d="M 2 0 L 2 2 A 14 14 0 0 0 16 16 L 20 16" stroke={colors.borderColorDefaultBase} strokeWidth={CONNECTOR_BORDER_WIDTH}/>
+      </Svg>
+    </View>);
 }
 function SwirlConnector({ style, height }) {
     const styles = useStyles();
     const { colors } = useTheme();
-    return (_jsxs(View, { style: [styles.swirlConnectorContainer, style], children: [_jsxs(View, { style: { height }, children: [_jsx(View, { style: styles.svgConnnectorVerticalLineHead }), _jsx(Svg, { width: 27, height: 34, fill: "none", children: _jsx(Path, { stroke: colors.borderColorDefaultBase, strokeWidth: CONNECTOR_BORDER_WIDTH, d: "M2.07 34c0-6.142 1.201-12.283 3.343-17m0 0c2.305-5.075 5.699-8.5 9.857-8.5 4.86 0 8.8 3.806 8.8 8.5s-3.94 8.5-8.8 8.5c-4.158 0-7.552-3.425-9.857-8.5zm0 0C3.271 12.283 2.07 6.142 2.07 0" }) }), _jsx(View, { style: styles.svgConnnectorVerticalLineTail })] }), _jsx(View, { style: styles.svgConnnectorVerticalLineTail })] }));
+    return (<View style={[styles.swirlConnectorContainer, style]}>
+      <View style={{ height }}>
+        <View style={styles.svgConnnectorVerticalLineHead}/>
+        <Svg width={27} height={34} fill="none">
+          <Path stroke={colors.borderColorDefaultBase} strokeWidth={CONNECTOR_BORDER_WIDTH} d="M2.07 34c0-6.142 1.201-12.283 3.343-17m0 0c2.305-5.075 5.699-8.5 9.857-8.5 4.86 0 8.8 3.806 8.8 8.5s-3.94 8.5-8.8 8.5c-4.158 0-7.552-3.425-9.857-8.5zm0 0C3.271 12.283 2.07 6.142 2.07 0"/>
+        </Svg>
+        <View style={styles.svgConnnectorVerticalLineTail}/>
+      </View>
+      <View style={styles.svgConnnectorVerticalLineTail}/>
+    </View>);
 }
 // TODO: Remove when Services React Native bumps to React Native 0.74 or higher.
 // This fixes a React Native bug where using `flexDirection: 'row-reverse'` also switches the `left`/`right` absolute positioning values.
@@ -99,8 +129,10 @@ function SwirlConnector({ style, height }) {
 // Long term fix is described here: https://reactnative.dev/blog/2024/04/22/release-0.74#new-layout-behaviors
 function EnforceLeftPositionForMyReplyConnector({ children }) {
     const styles = useStyles();
-    return (_jsx(View, { style: styles.resetPosition, pointerEvents: "none" // ensures wrapper does not block press events
-        , children: children }));
+    return (<View style={styles.resetPosition} pointerEvents="none" // ensures wrapper does not block press events
+    >
+      {children}
+    </View>);
 }
 const useStyles = () => {
     const { colors } = useTheme();

package/build/components/conversation/reply_connectors.js.map

@@ -1 +1 @@
-{"version":3,"file":"reply_connectors.js","sourceRoot":"","sources":["../../../src/components/conversation/reply_connectors.tsx"],"names":[],"mappings":"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","sourcesContent":["import { StyleSheet, View, ViewStyle } from 'react-native'\nimport Svg, { Path } from 'react-native-svg'\nimport { useTheme } from '../../hooks'\nimport { MessageResource } from '../../types'\nimport {\n  CONVERSATION_MESSAGE_LIST_PADDING_HORIZONTAL,\n  MESSAGE_AUTHOR_AVATAR_COLUMN_WIDTH,\n} from '../../utils/styles'\n\nconst MY_REPLY_CONNECTOR_WIDTH = 38\nconst CONNECTOR_BORDER_WIDTH = 4\nconst OFFSET_CONNECTOR_CONTAINER = CONNECTOR_BORDER_WIDTH / 2 // Accounts for the border width ensuring the connectors are centered under the avatar\nexport const AVATAR_CONNECTOR_SPACING = 8\n\ninterface ReplyConnectorProps {\n  message: MessageResource\n  messageBubbleHeight: number\n}\n\nexport function TheirReplyConnector({ message, messageBubbleHeight }: ReplyConnectorProps) {\n  const styles = useStyles()\n  const { nextRendersAuthor, threadPosition, renderAuthor, isReplyShadowMessage } = message\n\n  if (messageBubbleHeight === 0) return null // Prevents UI shifting\n\n  const connectorMap: Record<string, React.ReactNode | null> = {\n    shortTailCurve: <ShortTailCurveConnector height={messageBubbleHeight / 2} />,\n    shortHeadCurve: <ShortHeadCurveConnector height={messageBubbleHeight / 2} />,\n    verticalLine: <VerticalLineConnector />,\n    default: null,\n  }\n\n  const getConnectorKey = () => {\n    if (threadPosition === 'first' && !renderAuthor) return 'shortHeadCurve'\n    if (threadPosition === 'last' && !renderAuthor) return 'shortTailCurve'\n    if (\n      (threadPosition === 'first' && renderAuthor) ||\n      threadPosition === 'center' ||\n      isReplyShadowMessage\n    )\n      return 'verticalLine'\n    return 'default'\n  }\n\n  const ConnectorComponent = connectorMap[getConnectorKey()]\n  if (!ConnectorComponent) return null\n\n  const spacerStyle = nextRendersAuthor ? styles.theirReplyConnectorSpacer : null\n\n  return (\n    <View style={[styles.theirReplyConnectorContainer, spacerStyle]}>{ConnectorComponent}</View>\n  )\n}\n\nexport function MyReplyConnector({ message, messageBubbleHeight }: ReplyConnectorProps) {\n  const styles = useStyles()\n  const { nextRendersAuthor, threadPosition, prevIsMyReply, nextIsMyReply, isReplyShadowMessage } =\n    message\n\n  if (messageBubbleHeight === 0) return null // Prevents UI shifting\n\n  const connectorMap: Record<string, React.ReactNode | null> = {\n    longTailCurve: (\n      <LongTailCurveConnector\n        height={messageBubbleHeight / 2}\n        style={styles.myReplyConnectorPosition}\n      />\n    ),\n    longHeadCurve: (\n      <LongHeadCurveConnector\n        height={messageBubbleHeight / 2}\n        style={styles.myReplyConnectorPosition}\n      />\n    ),\n    verticalLine: <VerticalLineConnector style={styles.myReplyConnectorPosition} />,\n    swirl: <SwirlConnector style={styles.myReplyConnectorPosition} height={messageBubbleHeight} />,\n    default: null,\n  }\n\n  const getConnectorKey = () => {\n    if (threadPosition === 'first' || isReplyShadowMessage) return 'longHeadCurve'\n    if (threadPosition === 'center' && prevIsMyReply && nextIsMyReply) return 'verticalLine'\n    if (threadPosition === 'center' && (!prevIsMyReply || !nextIsMyReply)) return 'swirl'\n    if (threadPosition === 'last') return 'longTailCurve'\n\n    return 'default'\n  }\n\n  const ConnectorComponent = connectorMap[getConnectorKey()]\n  if (!ConnectorComponent) return null\n\n  const spacerStyle = nextRendersAuthor ? styles.myReplyConnectorSpacer : null\n\n  return (\n    <EnforceLeftPositionForMyReplyConnector>\n      <View style={[styles.myReplyConnectorContainer, spacerStyle]}>{ConnectorComponent}</View>\n    </EnforceLeftPositionForMyReplyConnector>\n  )\n}\n\nfunction VerticalLineConnector({ style }: { style?: ViewStyle }) {\n  const styles = useStyles()\n  return <View style={[styles.verticalLineConnector, style]} />\n}\n\nfunction LongHeadCurveConnector({ height, style }: { height: number; style?: ViewStyle }) {\n  const styles = useStyles()\n  const { colors } = useTheme()\n\n  return (\n    <View style={[styles.longHeadCurveConnector, { marginTop: height }, style]}>\n      <Svg width={MY_REPLY_CONNECTOR_WIDTH} height={18} fill=\"none\">\n        <Path\n          d=\"M 2 18 L 2 16 A 14 14 0 0 1 16 2 L 38 2\"\n          stroke={colors.borderColorDefaultBase}\n          strokeWidth={CONNECTOR_BORDER_WIDTH}\n        />\n      </Svg>\n      <View style={styles.svgConnnectorVerticalLineTail} />\n    </View>\n  )\n}\n\nfunction LongTailCurveConnector({ height, style }: { height: number; style?: ViewStyle }) {\n  const styles = useStyles()\n  const { colors } = useTheme()\n\n  return (\n    <View style={[{ height }, style]}>\n      <View style={styles.svgConnnectorVerticalLineHead} />\n      <Svg width={MY_REPLY_CONNECTOR_WIDTH} height={18} fill=\"none\">\n        <Path\n          d=\"M 2 0 L 2 2 A 14 14 0 0 0 16 16 L 38 16\"\n          stroke={colors.borderColorDefaultBase}\n          strokeWidth={CONNECTOR_BORDER_WIDTH}\n        />\n      </Svg>\n    </View>\n  )\n}\n\nfunction ShortHeadCurveConnector({ height }: { height: number }) {\n  const styles = useStyles()\n  const { colors } = useTheme()\n\n  return (\n    <View style={[styles.shortHeadCurveConnector, { marginTop: height }]}>\n      <Svg width={20} height={18} fill=\"none\">\n        <Path\n          d=\"M 2 18 L 2 16 A 14 14 0 0 1 16 2 L 20 2\"\n          stroke={colors.borderColorDefaultBase}\n          strokeWidth={CONNECTOR_BORDER_WIDTH}\n        />\n      </Svg>\n      <View style={styles.svgConnnectorVerticalLineTail} />\n    </View>\n  )\n}\n\nfunction ShortTailCurveConnector({ height }: { height: number }) {\n  const styles = useStyles()\n  const { colors } = useTheme()\n\n  return (\n    <View style={{ height }}>\n      <View style={styles.svgConnnectorVerticalLineHead} />\n      <Svg width={20} height={18} fill=\"none\">\n        <Path\n          d=\"M 2 0 L 2 2 A 14 14 0 0 0 16 16 L 20 16\"\n          stroke={colors.borderColorDefaultBase}\n          strokeWidth={CONNECTOR_BORDER_WIDTH}\n        />\n      </Svg>\n    </View>\n  )\n}\n\nfunction SwirlConnector({ style, height }: { style?: ViewStyle; height: number }) {\n  const styles = useStyles()\n  const { colors } = useTheme()\n\n  return (\n    <View style={[styles.swirlConnectorContainer, style]}>\n      <View style={{ height }}>\n        <View style={styles.svgConnnectorVerticalLineHead} />\n        <Svg width={27} height={34} fill=\"none\">\n          <Path\n            stroke={colors.borderColorDefaultBase}\n            strokeWidth={CONNECTOR_BORDER_WIDTH}\n            d=\"M2.07 34c0-6.142 1.201-12.283 3.343-17m0 0c2.305-5.075 5.699-8.5 9.857-8.5 4.86 0 8.8 3.806 8.8 8.5s-3.94 8.5-8.8 8.5c-4.158 0-7.552-3.425-9.857-8.5zm0 0C3.271 12.283 2.07 6.142 2.07 0\"\n          />\n        </Svg>\n        <View style={styles.svgConnnectorVerticalLineTail} />\n      </View>\n      <View style={styles.svgConnnectorVerticalLineTail} />\n    </View>\n  )\n}\n\n// TODO: Remove when Services React Native bumps to React Native 0.74 or higher.\n// This fixes a React Native bug where using `flexDirection: 'row-reverse'` also switches the `left`/`right` absolute positioning values.\n// The wrapper ensures the MyReplyConnector is always positioned to the left of the message bubble on older versions of React Native.\n// Long term fix is described here: https://reactnative.dev/blog/2024/04/22/release-0.74#new-layout-behaviors\nfunction EnforceLeftPositionForMyReplyConnector({ children }: { children: React.ReactNode }) {\n  const styles = useStyles()\n  return (\n    <View\n      style={styles.resetPosition}\n      pointerEvents=\"none\" // ensures wrapper does not block press events\n    >\n      {children}\n    </View>\n  )\n}\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n  const borderColor = colors.borderColorDefaultBase\n\n  return StyleSheet.create({\n    theirReplyConnectorContainer: {\n      width: '50%',\n      marginRight: OFFSET_CONNECTOR_CONTAINER,\n      alignSelf: 'flex-end',\n      flex: 1,\n    },\n    theirReplyConnectorSpacer: {\n      paddingBottom: AVATAR_CONNECTOR_SPACING,\n    },\n    myReplyConnectorContainer: {\n      width: MESSAGE_AUTHOR_AVATAR_COLUMN_WIDTH,\n      position: 'absolute',\n      left: CONVERSATION_MESSAGE_LIST_PADDING_HORIZONTAL - OFFSET_CONNECTOR_CONTAINER,\n      top: 0,\n      bottom: 0,\n    },\n    myReplyConnectorPosition: {\n      left: '50%',\n    },\n    myReplyConnectorSpacer: {\n      bottom: AVATAR_CONNECTOR_SPACING,\n    },\n    verticalLineConnector: {\n      flex: 1,\n      borderLeftWidth: CONNECTOR_BORDER_WIDTH,\n      borderLeftColor: borderColor,\n    },\n    longHeadCurveConnector: {\n      flex: 1,\n    },\n    shortHeadCurveConnector: {\n      flex: 1,\n    },\n    swirlConnectorContainer: {\n      flex: 1,\n    },\n    svgConnnectorVerticalLineHead: {\n      backgroundColor: borderColor,\n      width: CONNECTOR_BORDER_WIDTH,\n      flex: 1,\n      marginBottom: -1, // Ensures there is no gap between the vertical line and the swirl connector\n    },\n    svgConnnectorVerticalLineTail: {\n      backgroundColor: borderColor,\n      width: CONNECTOR_BORDER_WIDTH,\n      flex: 1,\n      marginTop: -1, // Ensures there is no gap between the vertical line and the swirl connector\n    },\n    // TODO: Remove when Services React Native bumps to React Native 0.74 or higher.\n    resetPosition: {\n      position: 'absolute',\n      left: 0,\n      right: 0,\n      top: 0,\n      bottom: 0,\n    },\n  })\n}\n"]}
+{"version":3,"file":"reply_connectors.js","sourceRoot":"","sources":["../../../src/components/conversation/reply_connectors.tsx"],"names":[],"mappings":"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","sourcesContent":["import { StyleSheet, View, ViewStyle } from 'react-native'\nimport Svg, { Path } from 'react-native-svg'\nimport { useTheme } from '../../hooks'\nimport { MessageResource } from '../../types'\nimport {\n  CONVERSATION_MESSAGE_LIST_PADDING_HORIZONTAL,\n  MESSAGE_AUTHOR_AVATAR_COLUMN_WIDTH,\n} from '../../utils/styles'\n\nconst MY_REPLY_CONNECTOR_WIDTH = 38\nconst CONNECTOR_BORDER_WIDTH = 4\nconst OFFSET_CONNECTOR_CONTAINER = CONNECTOR_BORDER_WIDTH / 2 // Accounts for the border width ensuring the connectors are centered under the avatar\nexport const AVATAR_CONNECTOR_SPACING = 8\n\ninterface ReplyConnectorProps {\n  message: MessageResource\n  messageBubbleHeight: number\n}\n\nexport function TheirReplyConnector({ message, messageBubbleHeight }: ReplyConnectorProps) {\n  const styles = useStyles()\n  const { nextRendersAuthor, threadPosition, renderAuthor, isReplyShadowMessage } = message\n\n  if (messageBubbleHeight === 0) return null // Prevents UI shifting\n\n  const connectorMap: Record<string, React.ReactNode | null> = {\n    shortTailCurve: <ShortTailCurveConnector height={messageBubbleHeight / 2} />,\n    shortHeadCurve: <ShortHeadCurveConnector height={messageBubbleHeight / 2} />,\n    verticalLine: <VerticalLineConnector />,\n    default: null,\n  }\n\n  const getConnectorKey = () => {\n    if (threadPosition === 'first' && !renderAuthor) return 'shortHeadCurve'\n    if (threadPosition === 'last' && !renderAuthor) return 'shortTailCurve'\n    if (\n      (threadPosition === 'first' && renderAuthor) ||\n      threadPosition === 'center' ||\n      isReplyShadowMessage\n    )\n      return 'verticalLine'\n    return 'default'\n  }\n\n  const ConnectorComponent = connectorMap[getConnectorKey()]\n  if (!ConnectorComponent) return null\n\n  const spacerStyle = nextRendersAuthor ? styles.theirReplyConnectorSpacer : null\n\n  return (\n    <View style={[styles.theirReplyConnectorContainer, spacerStyle]}>{ConnectorComponent}</View>\n  )\n}\n\nexport function MyReplyConnector({ message, messageBubbleHeight }: ReplyConnectorProps) {\n  const styles = useStyles()\n  const { nextRendersAuthor, threadPosition, prevIsMyReply, nextIsMyReply, isReplyShadowMessage } =\n    message\n\n  if (messageBubbleHeight === 0) return null // Prevents UI shifting\n\n  const connectorMap: Record<string, React.ReactNode | null> = {\n    longTailCurve: (\n      <LongTailCurveConnector\n        height={messageBubbleHeight / 2}\n        style={styles.myReplyConnectorPosition}\n      />\n    ),\n    longHeadCurve: (\n      <LongHeadCurveConnector\n        height={messageBubbleHeight / 2}\n        style={styles.myReplyConnectorPosition}\n      />\n    ),\n    verticalLine: <VerticalLineConnector style={styles.myReplyConnectorPosition} />,\n    swirl: <SwirlConnector style={styles.myReplyConnectorPosition} height={messageBubbleHeight} />,\n    default: null,\n  }\n\n  const getConnectorKey = () => {\n    if (threadPosition === 'first' || isReplyShadowMessage) return 'longHeadCurve'\n    if (threadPosition === 'center' && prevIsMyReply && nextIsMyReply) return 'verticalLine'\n    if (threadPosition === 'center' && (!prevIsMyReply || !nextIsMyReply)) return 'swirl'\n    if (threadPosition === 'last') return 'longTailCurve'\n\n    return 'default'\n  }\n\n  const ConnectorComponent = connectorMap[getConnectorKey()]\n  if (!ConnectorComponent) return null\n\n  const spacerStyle = nextRendersAuthor ? styles.myReplyConnectorSpacer : null\n\n  return (\n    <EnforceLeftPositionForMyReplyConnector>\n      <View style={[styles.myReplyConnectorContainer, spacerStyle]}>{ConnectorComponent}</View>\n    </EnforceLeftPositionForMyReplyConnector>\n  )\n}\n\nfunction VerticalLineConnector({ style }: { style?: ViewStyle }) {\n  const styles = useStyles()\n  return <View style={[styles.verticalLineConnector, style]} />\n}\n\nfunction LongHeadCurveConnector({ height, style }: { height: number; style?: ViewStyle }) {\n  const styles = useStyles()\n  const { colors } = useTheme()\n\n  return (\n    <View style={[styles.longHeadCurveConnector, { marginTop: height }, style]}>\n      <Svg width={MY_REPLY_CONNECTOR_WIDTH} height={18} fill=\"none\">\n        <Path\n          d=\"M 2 18 L 2 16 A 14 14 0 0 1 16 2 L 38 2\"\n          stroke={colors.borderColorDefaultBase}\n          strokeWidth={CONNECTOR_BORDER_WIDTH}\n        />\n      </Svg>\n      <View style={styles.svgConnnectorVerticalLineTail} />\n    </View>\n  )\n}\n\nfunction LongTailCurveConnector({ height, style }: { height: number; style?: ViewStyle }) {\n  const styles = useStyles()\n  const { colors } = useTheme()\n\n  return (\n    <View style={[{ height }, style]}>\n      <View style={styles.svgConnnectorVerticalLineHead} />\n      <Svg width={MY_REPLY_CONNECTOR_WIDTH} height={18} fill=\"none\">\n        <Path\n          d=\"M 2 0 L 2 2 A 14 14 0 0 0 16 16 L 38 16\"\n          stroke={colors.borderColorDefaultBase}\n          strokeWidth={CONNECTOR_BORDER_WIDTH}\n        />\n      </Svg>\n    </View>\n  )\n}\n\nfunction ShortHeadCurveConnector({ height }: { height: number }) {\n  const styles = useStyles()\n  const { colors } = useTheme()\n\n  return (\n    <View style={[styles.shortHeadCurveConnector, { marginTop: height }]}>\n      <Svg width={20} height={18} fill=\"none\">\n        <Path\n          d=\"M 2 18 L 2 16 A 14 14 0 0 1 16 2 L 20 2\"\n          stroke={colors.borderColorDefaultBase}\n          strokeWidth={CONNECTOR_BORDER_WIDTH}\n        />\n      </Svg>\n      <View style={styles.svgConnnectorVerticalLineTail} />\n    </View>\n  )\n}\n\nfunction ShortTailCurveConnector({ height }: { height: number }) {\n  const styles = useStyles()\n  const { colors } = useTheme()\n\n  return (\n    <View style={{ height }}>\n      <View style={styles.svgConnnectorVerticalLineHead} />\n      <Svg width={20} height={18} fill=\"none\">\n        <Path\n          d=\"M 2 0 L 2 2 A 14 14 0 0 0 16 16 L 20 16\"\n          stroke={colors.borderColorDefaultBase}\n          strokeWidth={CONNECTOR_BORDER_WIDTH}\n        />\n      </Svg>\n    </View>\n  )\n}\n\nfunction SwirlConnector({ style, height }: { style?: ViewStyle; height: number }) {\n  const styles = useStyles()\n  const { colors } = useTheme()\n\n  return (\n    <View style={[styles.swirlConnectorContainer, style]}>\n      <View style={{ height }}>\n        <View style={styles.svgConnnectorVerticalLineHead} />\n        <Svg width={27} height={34} fill=\"none\">\n          <Path\n            stroke={colors.borderColorDefaultBase}\n            strokeWidth={CONNECTOR_BORDER_WIDTH}\n            d=\"M2.07 34c0-6.142 1.201-12.283 3.343-17m0 0c2.305-5.075 5.699-8.5 9.857-8.5 4.86 0 8.8 3.806 8.8 8.5s-3.94 8.5-8.8 8.5c-4.158 0-7.552-3.425-9.857-8.5zm0 0C3.271 12.283 2.07 6.142 2.07 0\"\n          />\n        </Svg>\n        <View style={styles.svgConnnectorVerticalLineTail} />\n      </View>\n      <View style={styles.svgConnnectorVerticalLineTail} />\n    </View>\n  )\n}\n\n// TODO: Remove when Services React Native bumps to React Native 0.74 or higher.\n// This fixes a React Native bug where using `flexDirection: 'row-reverse'` also switches the `left`/`right` absolute positioning values.\n// The wrapper ensures the MyReplyConnector is always positioned to the left of the message bubble on older versions of React Native.\n// Long term fix is described here: https://reactnative.dev/blog/2024/04/22/release-0.74#new-layout-behaviors\nfunction EnforceLeftPositionForMyReplyConnector({ children }: { children: React.ReactNode }) {\n  const styles = useStyles()\n  return (\n    <View\n      style={styles.resetPosition}\n      pointerEvents=\"none\" // ensures wrapper does not block press events\n    >\n      {children}\n    </View>\n  )\n}\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n  const borderColor = colors.borderColorDefaultBase\n\n  return StyleSheet.create({\n    theirReplyConnectorContainer: {\n      width: '50%',\n      marginRight: OFFSET_CONNECTOR_CONTAINER,\n      alignSelf: 'flex-end',\n      flex: 1,\n    },\n    theirReplyConnectorSpacer: {\n      paddingBottom: AVATAR_CONNECTOR_SPACING,\n    },\n    myReplyConnectorContainer: {\n      width: MESSAGE_AUTHOR_AVATAR_COLUMN_WIDTH,\n      position: 'absolute',\n      left: CONVERSATION_MESSAGE_LIST_PADDING_HORIZONTAL - OFFSET_CONNECTOR_CONTAINER,\n      top: 0,\n      bottom: 0,\n    },\n    myReplyConnectorPosition: {\n      left: '50%',\n    },\n    myReplyConnectorSpacer: {\n      bottom: AVATAR_CONNECTOR_SPACING,\n    },\n    verticalLineConnector: {\n      flex: 1,\n      borderLeftWidth: CONNECTOR_BORDER_WIDTH,\n      borderLeftColor: borderColor,\n    },\n    longHeadCurveConnector: {\n      flex: 1,\n    },\n    shortHeadCurveConnector: {\n      flex: 1,\n    },\n    swirlConnectorContainer: {\n      flex: 1,\n    },\n    svgConnnectorVerticalLineHead: {\n      backgroundColor: borderColor,\n      width: CONNECTOR_BORDER_WIDTH,\n      flex: 1,\n      marginBottom: -1, // Ensures there is no gap between the vertical line and the swirl connector\n    },\n    svgConnnectorVerticalLineTail: {\n      backgroundColor: borderColor,\n      width: CONNECTOR_BORDER_WIDTH,\n      flex: 1,\n      marginTop: -1, // Ensures there is no gap between the vertical line and the swirl connector\n    },\n    // TODO: Remove when Services React Native bumps to React Native 0.74 or higher.\n    resetPosition: {\n      position: 'absolute',\n      left: 0,\n      right: 0,\n      top: 0,\n      bottom: 0,\n    },\n  })\n}\n"]}

package/build/components/conversation/reply_shadow_message.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { MessageResource } from '../../types';
 interface ReplyShadowMessageProps extends MessageResource {
     messageId: string;
@@ -6,6 +7,6 @@ interface ReplyShadowMessageProps extends MessageResource {
     isReplyShadowMessage: boolean;
     nextRendersAuthor: boolean;
 }
-export declare function ReplyShadowMessage({ conversation_id, inReplyScreen, messageId, isReplyShadowMessage, nextRendersAuthor, }: ReplyShadowMessageProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function ReplyShadowMessage({ conversation_id, inReplyScreen, messageId, isReplyShadowMessage, nextRendersAuthor, }: ReplyShadowMessageProps): React.JSX.Element | null;
 export {};
 //# sourceMappingURL=reply_shadow_message.d.ts.map

package/build/components/conversation/reply_shadow_message.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"reply_shadow_message.d.ts","sourceRoot":"","sources":["../../../src/components/conversation/reply_shadow_message.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AAiB7C,UAAU,uBAAwB,SAAQ,eAAe;IACvD,SAAS,EAAE,MAAM,CAAA;IACjB,eAAe,EAAE,MAAM,CAAA;IACvB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,oBAAoB,EAAE,OAAO,CAAA;IAC7B,iBAAiB,EAAE,OAAO,CAAA;CAC3B;AAED,wBAAgB,kBAAkB,CAAC,EACjC,eAAe,EACf,aAAa,EACb,SAAS,EACT,oBAAoB,EACpB,iBAAiB,GAClB,EAAE,uBAAuB,kDAczB"}
+{"version":3,"file":"reply_shadow_message.d.ts","sourceRoot":"","sources":["../../../src/components/conversation/reply_shadow_message.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAWzB,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AAiB7C,UAAU,uBAAwB,SAAQ,eAAe;IACvD,SAAS,EAAE,MAAM,CAAA;IACjB,eAAe,EAAE,MAAM,CAAA;IACvB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,oBAAoB,EAAE,OAAO,CAAA;IAC7B,iBAAiB,EAAE,OAAO,CAAA;CAC3B;AAED,wBAAgB,kBAAkB,CAAC,EACjC,eAAe,EACf,aAAa,EACb,SAAS,EACT,oBAAoB,EACpB,iBAAiB,GAClB,EAAE,uBAAuB,4BAczB"}

package/build/components/conversation/reply_shadow_message.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useNavigation } from '@react-navigation/native';
 import { some } from 'lodash';
 import React from 'react';
@@ -16,15 +15,15 @@ export function ReplyShadowMessage({ conversation_id, inReplyScreen, messageId,
     if (inReplyScreen)
         return null;
     if (isLoading)
-        return _jsx(ShadowMessageFallback, { text: "Loading..." });
+        return <ShadowMessageFallback text="Loading..."/>;
     if (isError || !message)
-        return _jsx(ShadowMessageFallback, { text: "Message deleted" });
+        return <ShadowMessageFallback text="Message deleted"/>;
     const enrichedMessage = {
         ...message,
         isReplyShadowMessage,
         nextRendersAuthor,
     };
-    return _jsx(ShadowMessageContent, { conversation_id: conversation_id, ...enrichedMessage });
+    return <ShadowMessageContent conversation_id={conversation_id} {...enrichedMessage}/>;
 }
 function ShadowMessageContent({ conversation_id, ...message }) {
     const { text, deletedAt, author, attachments } = message;
@@ -47,30 +46,53 @@ function ShadowMessageContent({ conversation_id, ...message }) {
     };
     const attachmentLabel = some(attachments) ? pluralize(attachments.length, 'attachment') : '';
     const accessibilityLabel = `${author?.name || ''} Reply Preview ${attachmentLabel} ${messageText || ''} ${timestamp} ${replyCountText}`;
-    return (_jsx(Pressable, { android_ripple: { color: colors.androidRippleNeutral }, onPress: handleNavigateToReplies, onPressIn: handleMessagePressIn, onPressOut: handleMessagePressOut, accessibilityLabel: accessibilityLabel, accessibilityHint: "Navigate to reply screen for this message", accessibilityRole: "link", children: _jsxs(Animated.View, { style: [styles.message, animatedBackgroundColor], children: [!message.mine && (_jsxs(View, { children: [_jsx(View, { style: [styles.avatarWrapper, !isDeleted && styles.avatarOpacity], children: _jsx(Avatar, { size: "xs", sourceUri: message.author.avatar, style: styles.avatar, maxFontSizeMultiplier: 1, fallbackIconName: isDeleted ? 'publishing.trash' : 'general.person', showFallback: isDeleted }) }), _jsx(TheirReplyConnector, { message: message, messageBubbleHeight: messageBubbleHeight })] })), _jsxs(View, { style: styles.messageContent, children: [_jsxs(View, { style: styles.messageBubble, onLayout: e => setMessageBubbleHeight(e.nativeEvent.layout.height), children: [_jsx(MessageAttachmentImagery, { attachments: attachments }), text && (_jsx(Text, { variant: "footnote", style: styles.messageText, numberOfLines: scalableNumberOfLines, children: messageText }))] }), _jsx(View, { style: styles.messageMeta, children: _jsx(Text, { variant: "footnote", style: styles.replyCountText, children: replyCountText }) })] }), message.mine && (_jsx(MyReplyConnector, { message: message, messageBubbleHeight: messageBubbleHeight }))] }) }));
+    return (<Pressable android_ripple={{ color: colors.androidRippleNeutral }} onPress={handleNavigateToReplies} onPressIn={handleMessagePressIn} onPressOut={handleMessagePressOut} accessibilityLabel={accessibilityLabel} accessibilityHint="Navigate to reply screen for this message" accessibilityRole="link">
+      <Animated.View style={[styles.message, animatedBackgroundColor]}>
+        {!message.mine && (<View>
+            <View style={[styles.avatarWrapper, !isDeleted && styles.avatarOpacity]}>
+              <Avatar size="xs" sourceUri={message.author.avatar} style={styles.avatar} maxFontSizeMultiplier={1} fallbackIconName={isDeleted ? 'publishing.trash' : 'general.person'} showFallback={isDeleted}/>
+            </View>
+            <TheirReplyConnector message={message} messageBubbleHeight={messageBubbleHeight}/>
+          </View>)}
+        <View style={styles.messageContent}>
+          <View style={styles.messageBubble} onLayout={e => setMessageBubbleHeight(e.nativeEvent.layout.height)}>
+            <MessageAttachmentImagery attachments={attachments}/>
+            {text && (<Text variant="footnote" style={styles.messageText} numberOfLines={scalableNumberOfLines}>
+                {messageText}
+              </Text>)}
+          </View>
+          <View style={styles.messageMeta}>
+            <Text variant="footnote" style={styles.replyCountText}>
+              {replyCountText}
+            </Text>
+          </View>
+        </View>
+        {message.mine && (<MyReplyConnector message={message} messageBubbleHeight={messageBubbleHeight}/>)}
+      </Animated.View>
+    </Pressable>);
 }
 function MessageAttachmentImagery({ attachments, }) {
     if (!attachments || attachments.length === 0)
         return null;
     const attachment = attachments[0];
     if (attachment.type === 'giphy') {
-        return _jsx(GiphyImage, { attachment: attachment });
+        return <GiphyImage attachment={attachment}/>;
     }
     if (attachment.type === 'ExpandedLink') {
-        return _jsx(ExpandedLinkImage, { attachment: attachment });
+        return <ExpandedLinkImage attachment={attachment}/>;
     }
     if (attachment.type === 'MessageAttachment') {
         const contentType = attachment.attributes?.contentType;
         const basicType = contentType?.split('/')[0];
         switch (basicType) {
             case 'image':
-                return _jsx(MessageAttachmentImage, { attachment: attachment });
+                return <MessageAttachmentImage attachment={attachment}/>;
             case 'video':
-                return _jsx(MessageAttachmentIcon, { iconName: "general.outlinedVideoFile" });
+                return <MessageAttachmentIcon iconName="general.outlinedVideoFile"/>;
             case 'audio':
-                return _jsx(MessageAttachmentIcon, { iconName: "general.outlinedMusicFile" });
+                return <MessageAttachmentIcon iconName="general.outlinedMusicFile"/>;
             case 'application':
-                return _jsx(MessageAttachmentIcon, { iconName: "general.outlinedGenericFile" });
+                return <MessageAttachmentIcon iconName="general.outlinedGenericFile"/>;
             default:
                 return null;
         }
@@ -82,26 +104,34 @@ function GiphyImage({ attachment }) {
     const { url } = giphy.fixedWidth;
     const { width, height } = assertKeysAreNumbers(giphy.fixedWidth);
     const styles = useStyles({ imageWidth: width, imageHeight: height });
-    return (_jsx(Image, { source: { uri: url }, wrapperStyle: styles.imageWrapper, style: styles.image, alt: title, loaderSize: 16 }));
+    return (<Image source={{ uri: url }} wrapperStyle={styles.imageWrapper} style={styles.image} alt={title} loaderSize={16}/>);
 }
 function ExpandedLinkImage({ attachment, }) {
     const { title = '', imageUrl, imageHeight, imageWidth } = attachment.attributes;
     const styles = useStyles({ imageWidth, imageHeight });
-    return (_jsx(Image, { source: { uri: imageUrl }, wrapperStyle: styles.imageWrapper, style: styles.image, alt: title, loaderSize: 16 }));
+    return (<Image source={{ uri: imageUrl }} wrapperStyle={styles.imageWrapper} style={styles.image} alt={title} loaderSize={16}/>);
 }
 function MessageAttachmentImage({ attachment, }) {
     const { url, urlMedium, filename, metadata = {} } = attachment.attributes;
     const styles = useStyles({ imageWidth: metadata.width, imageHeight: metadata.height });
-    return (_jsx(Image, { source: { uri: urlMedium || url }, style: styles.image, wrapperStyle: styles.imageWrapper, alt: filename, loaderSize: 16 }));
+    return (<Image source={{ uri: urlMedium || url }} style={styles.image} wrapperStyle={styles.imageWrapper} alt={filename} loaderSize={16}/>);
 }
 function MessageAttachmentIcon({ iconName }) {
     const styles = useStyles();
-    return (_jsx(Icon, { name: iconName, style: styles.attachmentIcon, maxFontSizeMultiplier: MAX_FONT_SIZE_MULTIPLIER }));
+    return (<Icon name={iconName} style={styles.attachmentIcon} maxFontSizeMultiplier={MAX_FONT_SIZE_MULTIPLIER}/>);
 }
 // TODO: The mine prop is not used yet, but in the future we will be adding a way to find the `mine` value for this fallback.
 function ShadowMessageFallback({ text, mine }) {
     const styles = useStyles({ mine });
-    return (_jsx(View, { style: styles.message, children: _jsx(View, { style: styles.messageContent, children: _jsx(View, { style: styles.messageBubble, children: _jsx(Text, { variant: "footnote", style: styles.messageText, children: text }) }) }) }));
+    return (<View style={styles.message}>
+      <View style={styles.messageContent}>
+        <View style={styles.messageBubble}>
+          <Text variant="footnote" style={styles.messageText}>
+            {text}
+          </Text>
+        </View>
+      </View>
+    </View>);
 }
 const useStyles = ({ mine, imageWidth = 32, imageHeight = 32 } = {}) => {
     const { colors } = useTheme();