Skip to content

Conversation

@reidbarber
Copy link
Member

@reidbarber reidbarber commented Oct 29, 2025

Adds an icons tag to the search menu where you can search icons and copy the imports (same as on the Icons page).

Also adds skeleton loading placeholders as the suspense fallback.

We may want to add vertical divider before the Icons tag in the menu to indicate that icons won't show up in the "All" search, open to feedback on this.

✅ 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

📝 Test Instructions:

Open the search menu, select the Icons tag, and begin searching: https://reactspectrum.blob.core.windows.net/reactspectrum/ead2b65279c4a6d8027454ca43fbf5fb436d29fc/s2-docs/index.html

🧢 Your Project:

yihuiliao
yihuiliao previously approved these changes Oct 30, 2025
Copy link
Member

@yihuiliao yihuiliao left a comment

Choose a reason for hiding this comment

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

I think a vertical divider would be nice because otherwise it's a little weird. So something to indicate some separation would be helpful.

Have we thought about adding something like a toast or tooltip to indicate that you've copied the import when you click on the icon? Otherwise I feel like it's unclear what happens when you select an icon

@rspbot
Copy link

rspbot commented Oct 30, 2025

</TagGroup>
)}
{tabIconTag.length > 0 && tags.length > 0 && (
<Divider orientation="vertical" size="S" styles={style({marginY: 8, marginStart: -8})} />
Copy link
Member

Choose a reason for hiding this comment

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

any way we could make this divider a bit thicker or increase the contrast? it's a bit difficult to see

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.

4 participants