Skip to content

Leading/trailing icon displaying as emoji rather than vector icon #4316

@iannngit

Description

@iannngit

Current behaviour

TextInput icon has set close-circle but it becomes an emoji.

Expected behaviour

Show a close circle icon in solid color.

How to reproduce?

My project became like this after upgrading to Expo 50. So I think it's relating to dependency versions.

A rough code

import {
  HelperText,
  TextInput
} from 'react-native-paper';

<TextInput
...
    right={<TextInput.Icon
        icon="close-circle"
    />}
...
/>

Preview

Screenshot 2024-02-16 155904

What have you tried so far?

I've tried to change the right attribute of TextInput to a @expo/vector-icons MaterialCommunityIcon but it doesn't display.

<TextInput
...
    right={<MaterialCommunityIcons name="close-circle" />}
...
/>

Your Environment

software version
android emulator, Android 33
react-native 0.73.4
react-native-paper 5.12.3
node 18
npm or yarn 9.5.1
expo sdk 50.0.6

Metadata

Metadata

Assignees

No one assigned

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions