[Tech Week] RAC + Spectrum + Tailwind examples #5217
Conversation
|
Build successful! 🎉 |
|
Build successful! 🎉 |
|
Build successful! 🎉 |
reidbarber
changed the title
|
Build successful! 🎉 |
| let [value, setValue] = useState(""); | ||
| let [isTextFieldFocused, setIsTextFieldFocused] = useState(false); | ||
| return ( | ||
| <Group |
There was a problem hiding this comment.
this example seems inverted from the docs https://react-spectrum.adobe.com/react-aria/Group.html#example
I think you could stop tracking the focused state if you flipped it around
There was a problem hiding this comment.
I wanted to have the focus ring around the entire bar if the input was focused, and just around the button if it is focused. I think that's different behavior than what you're talking about (I may be wrong).
There was a problem hiding this comment.
Ah, I see, it'd require a little more work to do that. But now I'm no longer sure if it should be done because they really are two components, not really a composite like NumberField and Combobox are with their buttons...
Maybe there should be a form around the Group? and the button should submit? That way, if a user is typing in the textfield and hits enter, it'd "search" automatically?
examples/rac-spectrum-tailwind/src/components/StarRatingGroup.tsx
Outdated
Show resolved
Hide resolved
|
Build successful! 🎉 |
snowystinger
left a comment
snowystinger
left a comment
There was a problem hiding this comment.
Happy for followup, in general it looks good. Do you have a new link for the codesandbox? i still can't use arrow keys to navigate the star rating in the link in the description
| let [value, setValue] = useState(""); | ||
| let [isTextFieldFocused, setIsTextFieldFocused] = useState(false); | ||
| return ( | ||
| <Group |
There was a problem hiding this comment.
Ah, I see, it'd require a little more work to do that. But now I'm no longer sure if it should be done because they really are two components, not really a composite like NumberField and Combobox are with their buttons...
Maybe there should be a form around the Group? and the button should submit? That way, if a user is typing in the textfield and hits enter, it'd "search" automatically?
@snowystinger Can you try refreshing? It seems to be working for me. Let me know if it still doesn't work and I can investigate. |
yihuiliao
left a comment
yihuiliao
left a comment
There was a problem hiding this comment.
lgtm! also just gonna pop in and say that i'm able to use the arrow keys to navigate the star rating if that's helpful at all
|
Build successful! 🎉 |
|
## API Changes
unknown top level export { type: 'identifier', name: 'Column' } |
Contains docs and more examples for how to create custom Spectrum components using RAC and Tailwind.
Can be previewed here: https://codesandbox.io/p/sandbox/silly-zhukovsky-m4s422?file=%2Fsrc%2FApp.js%3A1%2C1
✅ Pull Request Checklist:
📝 Test Instructions:
🧢 Your Project: