Fix Controlled Components to Non-Controlled Components using Ref insteado useState

[manuelbento19]

Is your feature request related to a problem? Please describe. A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like The issue aims to fix a problem present in the project, where certain components were being controlled using the component's internal state (useState). This controlled components approach has caused inconveniences, especially in cases where we need to integrate with APIs or external libraries that require direct access to DOM elements.

Describe alternatives you've considered To solve this problem, I suggest migrating controlled components to uncontrolled ones, using references (ref). By doing so, we can maintain better control over DOM elements, enabling direct interactions and simplifying integration with external libraries.

Additional context The unreferenced components (ref) approach offers significant benefits, including better performance, improved encapsulation, and smoother integration into the React lifecycle. Additionally, it reduces code complexity by avoiding unnecessary state management for elements that do not require direct control.

This fix not only addresses the immediate issues related to integration with external APIs, but also lays a solid foundation for future development, promoting good development practices and ensuring code scalability and maintainability.

[welcome[bot]]

Thanks for opening your first issue here! If your issue falls within a template, please ensure you have followed that template

[raspberri05]

I saw your new PR for this and requested some small changes. Also, please consider starring this repository as it will enable more developers to find and contribute to this project.