-
Notifications
You must be signed in to change notification settings - Fork 672
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
Add custom svg option to checkbox component #2022
Add custom svg option to checkbox component #2022
Conversation
Signed-off-by: Jay Clark <[email protected]>
This pull request is being automatically deployed with Vercel (learn more). 🔍 Inspect: https://vercel.com/systemui/theme-ui/A6qcNzvntDdWyRKR5CtKF6zWHJC4 |
We also need a third additional state... |
@MuhammadJamaluddin Could you explain a bit more? I don’t see anything in the existing component code about that state. |
Yeah, it's missing indeed, but it should have been added Any checkbox could have 3 states (not just two)... see here for more details |
Huh, TIL. Let me work on adding that! |
I know you’re still working on this & no rush—thank you for contributing! You’re welcome to break customizing the radio buttons off into a separate PR too, keeps each one easier to review/manage. |
Thanks, that’s a good idea. I do have some more work done on this PR locally but I’ve been out of town & there’s no wifi at the cottage I’m staying at. Just wanted to leave a quick note that I haven’t forgotten about this one, but it may be a few more days before I can sync my updates. :) |
Alright, I had to already built a solution for me since I quickly needed this... Here's a sandbox of the styles & logic I used... feel free to ask any questions. |
The same styles & flow works perfectly as well with radio buttons (only difference is the |
@MuhammadJamaluddin Sorry I couldn't solve this, closing my draft out. I'm not a graphic designer, and I just couldn't figure out how to create the indeterminate checkbox SVG. |
No worries... I can open a PR with my solution @lachlanjc @hasparus I could include the icons I have (unless we have an |
Signed-off-by: Jay Clark [email protected]
Addresses #2013
There is currently no option to display a one-off custom checkbox or radio button. This PR adds that feature. This functionality creates a custom checkbox/radio button icon if alternate icons are passed to a Checkbox component, while preserving the default appearance for all other buttons. It is different from updating theme.forms, which allows users to change the overall default appearance of all checkboxes and radio buttons.
I'm keeping the PR in draft mode for the moment while I work on refactoring/investigating a possible alternate implementation. Once I've finished that, I'll add additional commits for the radio button.