Closed cervisebas closed 3 months ago
The recent updates enhance the dropdown components across the application by introducing ref forwarding capabilities. This allows parent components to programmatically manage focus and blur states, improving user interactions through newly added buttons. The modifications foster a more interactive user interface, significantly elevating the overall functionality and responsiveness of the dropdown elements.
Files | Change Summary |
---|---|
Example/src/App.tsx |
Introduced useRef for managing dropdown focus and blur; added buttons for user interaction with dropdown state. |
src/DropDown.tsx |
Added ref forwarding; exposed focus and blur methods for external control; updated export statement for Dropdown . |
src/multi-select-dropdown.tsx |
Incorporated ref forwarding and imperative methods (focus , blur ); improved interaction capabilities. |
src/types.ts |
Defined new DropdownRef type to clarify the interface for focus and blur methods. |
src/dropdown-input.tsx |
Added error prop to handle error states in TextInput , enhancing usability. |
src/use-dropdown.ts |
Introduced setEnable function to control the dropdown's enabled state directly from external components. |
sequenceDiagram
participant User
participant App
participant Dropdown
User->>App: Clicks Focus Button
App->>Dropdown: Calls focus()
Dropdown-->>User: Dropdown is focused
User->>App: Clicks Blur Button
App->>Dropdown: Calls blur()
Dropdown-->>User: Dropdown is blurred
🐰 In fields where the bunnies play,
New dropdowns hop and sway.
With a click and a blink, they bloom,
Focusing bright, dismissing gloom.
Oh, the joy in each little flutter,
Interactive magic, making hearts flutter! 🌸
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?
@cervisebas thanks for the pr, it is a good addition can you resolve the conflicts so I can merge it, I fixed some points.
@cervisebas once it gets merged we should update the documentation as well.
@cervisebas thanks for the pr, it is a good addition can you resolve the conflicts so I can merge it, I fixed some points.
Where can I see the conflicts?
@cervisebas thanks for the pr, it is a good addition can you resolve the conflicts so I can merge it, I fixed some points.
Where can I see the conflicts?
can you merge latest main in your branch. It should give you conflicts
@fateh999 Merge completed!
@cervisebas thanks for the pr, it is a good addition can you resolve the conflicts so I can merge it, I fixed some points.
Where can I see the conflicts?
can you merge latest main in your branch. It should give you conflicts
Thanks for the help
I would like the
focus()
andblur()
methods to be added by reference, so that, through external components, these behaviors could be controlled.Code example:
Video example:
https://github.com/user-attachments/assets/6fb7e010-e4d2-4a32-8205-d0913501f65d
Summary by CodeRabbit
New Features
Improvements
Documentation
focus()
andblur()
).