Skip to content

Add classNames prop to pass a className to each element #241

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
DominikGanic opened this issue Apr 5, 2025 · 3 comments · Fixed by #244
Closed

Add classNames prop to pass a className to each element #241

DominikGanic opened this issue Apr 5, 2025 · 3 comments · Fixed by #244
Labels
enhancement New feature or request good first issue Good for newcomers

Comments

@DominikGanic
Copy link

Hi, pretty cool component, however we can't modify the inputs class only the wrapper. This is the reason I have to step back now. We use tailwind and would love to modify the input classes, but no chance, we must hardcode it with input-id which is absolutely not modern.

Thanks anyways!

@TotomInc TotomInc changed the title We should be able to modify the input! Add classNes Apr 5, 2025
@TotomInc TotomInc changed the title Add classNes Add classNames prop to pass a className to each element Apr 5, 2025
@TotomInc
Copy link
Owner

TotomInc commented Apr 5, 2025

That's a valid point. I could add something similar to react-select: https://react-select.com/styles#the-classnames-prop

@DominikGanic
Copy link
Author

Looking forward to hear about changes! Thank you :)

TotomInc added a commit that referenced this issue Apr 9, 2025
@TotomInc TotomInc added enhancement New feature or request good first issue Good for newcomers labels Apr 9, 2025
@TotomInc
Copy link
Owner

TotomInc commented Apr 9, 2025

The classes prop is available in 0.11.6: https://vue3-select-component.vercel.app/props.html#classes

At the moment, this is a simple object that takes strings. It might get a bit reworked later to accept functions too in order to conditionally add CSS classes depending on the state (menu open, option selected, focus, hover, etc.)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request good first issue Good for newcomers
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants