feat(chat): implement @mention chip overlay rendering with Unicode placeholder tracking
Add visual overlay rendering for @mention chips in the chat input using Unicode private use area characters as invisible placeholders. The implementation includes chip data tracking via `MentionChipMap`, dynamic segment parsing to separate chip and text content for overlay display, and updated memo comparison in `MessageBubble` to include avatar press handlers for proper re-render prevention.
This commit is contained in:
@@ -556,6 +556,29 @@ export function createChatScreenStyles(colors: AppColors, dynamicStyles?: {
|
||||
inputTransparent: {
|
||||
color: 'transparent',
|
||||
},
|
||||
mentionOverlay: {
|
||||
...StyleSheet.absoluteFillObject,
|
||||
flexDirection: 'row',
|
||||
flexWrap: 'wrap',
|
||||
alignItems: 'flex-start',
|
||||
paddingTop: 8,
|
||||
paddingBottom: 8,
|
||||
paddingHorizontal: spacing.xs,
|
||||
},
|
||||
mentionChipText: {
|
||||
fontSize: 16,
|
||||
color: colors.primary.main,
|
||||
fontWeight: '500',
|
||||
lineHeight: 20,
|
||||
backgroundColor: `${colors.primary.main}15`,
|
||||
borderRadius: 4,
|
||||
overflow: 'hidden',
|
||||
},
|
||||
mentionOverlayText: {
|
||||
fontSize: 16,
|
||||
color: colors.chat.textPrimary,
|
||||
lineHeight: 20,
|
||||
},
|
||||
|
||||
// 输入框@高亮
|
||||
inputHighlightOverlay: {
|
||||
|
||||
Reference in New Issue
Block a user