fix: TextInput border being cut out

[brunohkbx]

Summary

Following up #2678. useTheme doesn't work in the component LabelBackground when you pass a custom theme to the TextInput as in the example below:

<TextInput
  mode="outlined"
  label="Test"
  theme={{
    roundness: 25,
  }}
  underlineColor="red"
  value="custom rounded input"
/>

The solution was to pass the prop roundness along under the labelProps

Before	After

Test plan

1. Check it out in the example app

[callstack-bot]

Hey @brunohkbx, thank you for your pull request 🤗. The documentation from this branch can be viewed here.

[github-actions]

The mobile version of example app from this branch is ready! You can see it here

.

[lukewalczak]

Thanks for that fix @brunohkbx 🎉 , left one small nit.

[rahmanharoon]

How can I move that label to right side? Is their any method to do that

[zoobibackups]

Summary

Following up #2678. useTheme doesn't work in the component LabelBackground when you pass a custom theme to the TextInput as in the example below:

<TextInput
  mode="outlined"
  label="Test"
  theme={{
    roundness: 25,
  }}
  underlineColor="red"
  value="custom rounded input"
/>

The solution was to pass the prop roundness along under the labelProps

Before After

Test plan

1. Check it out in the example app

Can you provide the solution(code) because I am still facing the issue

<TextInput
        placeholder="Enter your email"
        mode="outlined"
        label="Email"
        theme={{roundness:30}}
       
    />

[brunohkbx]

@zoobibackups which version are you using?

[lukewalczak]

Probably that fix is not released yet, let's try to install the library from the main branch.