feat(input) - update radio and checkbox components for shine #2060
Conversation
🦋 Changeset detectedLatest commit: ee22c2b The changes in this PR will be included in the next version bump. Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
❌ Deploy Preview for stacks-svelte failed. Why did it fail? →
|
✅ Deploy Preview for stacks ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
ttaylor-stack
requested review from
CGuindon,
dancormier,
giamir and
mukunku
…' of https://github.com/StackExchange/Stacks into spark-77/update-radio-and-checkbox-components-for-shine
| } | ||
|
|
||
|
|
||
| &&__checkmark { |
There was a problem hiding this comment.
I've added this instead of checking against child elements because I thought it would be cleaner, let me know if I should change this
|
|
||
| <script> | ||
| document.getElementById("indeterminate-checkbox-1").indeterminate = true; | ||
| document.getElementById("example-focus-rad")?.focus(); |
There was a problem hiding this comment.
@CGuindon I tried forcing focus for the docs as specified in the figma but I couldn't get it working, @giamir @dancormier let me know if there is another way to get it to force focus. From what I've seen only 1 element can be forced focus and when you click it removes the focus
CGuindon
left a comment
CGuindon
left a comment
There was a problem hiding this comment.
I'm tempted to just call this "Checkbox & Radio" — that's more common to the component function itself that would be more familiar. @dancormier @giamir Thoughts and preferences?
For the checkmark example, I can select the unselected ones but then I can deselect/uncheck any. I think we should make this available to test out (I can check and uncheck them examples) similar to Radio and Checkmark.
For the Vertical group example, let's add the example I have in Figma with checkmarks as well below the others
(not needed for horiztonal)
Same for With Description Copy example — include checkmarks version.
|
Deploy for Svelte preview failed....? |
PR to update radio and checkbox components to SHINE designs. Added Checkmark component too.
Stacks Svelte components created for all of the above
Story: https://stackoverflow.atlassian.net/browse/SPARK-77
Figma: https://www.figma.com/design/do4Ug0Yws8xCfRjHe9cJfZ/Project-SHINE---Product-UI?node-id=2344-22923&m=dev
NOTE: I haven't updated the migration guide because there are no breaking changes and I don't think its needed for new components. Let me know if this is correct