Skip to content

fix: add note about exception based on source code - #10574

Open
travisrcory wants to merge 1 commit into
adobe:mainfrom
travisrcory:styling-docs/clarify-tailwind
Open

fix: add note about exception based on source code#10574
travisrcory wants to merge 1 commit into
adobe:mainfrom
travisrcory:styling-docs/clarify-tailwind

Conversation

@travisrcory

@travisrcory travisrcory commented Sep 4, 2026

Copy link
Copy Markdown

This PR attempts to add a note to the styling when using the tailwind plugin to help catch the gotchas in the source code for how some of the data attributes map onto to tailwind selectors. Thaknks!

Closes

✅ Pull Request Checklist:

  • Included link to corresponding React Spectrum GitHub Issue.
  • Added/updated unit tests and storybook for this change (for new code or code which already has tests).
  • Filled out test instructions.
  • Updated documentation (if it already exists for this component).
  • Looked at the Accessibility Practices for this feature - Aria Practices
  • I understand every change in this PR and can explain why it's there.
  • If AI-assisted, I followed our AI contribution guidance and pointed my assistant at CLAUDE.md.

📝 Test Instructions:

🧢 Your Project:

</Tabs>
```

### Exceptions

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this is covered in the next section no?

@travisrcory travisrcory Sep 6, 2026

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Kinda, the gotcha my team ran into was that "hovered" uses "hover" instead of "hovered" which would one might expect at first glance at the docs (unless I'm not reading them closely!).

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah, I see the confusion. I think it's covered by

and native CSS pseudo classes

which, native CSS doesn't have a hovered

though that

when the names conflict

I think is making it a little confusing

Instead of it being an exceptions section, we could put in a mapping of all the pseudo selectors and their data attribute equivalent in a Disclosure in the Modifier prefix section

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants