Skip to content
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.

Sign up for GitHub

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

Jump to bottom

[Feedback] React components should support style prop #1040

Open
iansan5653 opened this issue Nov 26, 2024 · 3 comments · May be fixed by #1052
Open

[Feedback] React components should support style prop #1040

iansan5653 opened this issue Nov 26, 2024 · 3 comments · May be fixed by #1052
Labels
octicon type: feedback

Comments

@iansan5653
Copy link

The React Octicon components support the className prop, which makes it easy to apply custom styles to them. However, sometimes class-based styling is insufficient, such as when you need a fully dynamic style. For this, the style attribute is very important.

An example of its use might be when defining a dynamic icon color:

<SparkleFillIcon style={{color: ...}} />
@langermank
Copy link
Contributor

Hey @iansan5653, do you think the fill option could work for this? Here's an example: https://primer-6b9ae9b407-13348165.drafts.github.io/storybook/?path=/story/octicons--fill

@iansan5653
Copy link
Author

I think that does work for this specific problem. I still think that for consistency with other React components, it would be useful to support className styling we should also support inline styling via style. It's handy to have.

@tallys
Copy link
Contributor

tallys commented Dec 6, 2024

hey @iansan5653 thanks for opening the issue. We're not able to prioritize this at this time, but I will add it to our backlog for consideration when we revisit.

NameNoQuality added a commit to NameNoQuality/octicons that referenced this issue Dec 14, 2024
@NameNoQuality
Add documentation for style prop in React Octicons
efcac24 
Fixes primer#1040

Add documentation for the'style` prop in the React Octicon components.

* Add a new section in `lib/octicons_react/README.md` explaining the usage of the'style` prop.
* Provide an example of using the'style` prop to apply inline styles to an icon.

---

For more details, open the [Copilot Workspace session](https://copilot-workspace.githubnext.com/primer/octicons/issues/1040?shareId=XXXX-XXXX-XXXX-XXXX).
@NameNoQuality NameNoQuality linked a pull request Dec 14, 2024 that will close this issue
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
octicon type: feedback
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Add documentation for style prop in React Octicons NameNoQuality/octicons
3 participants
@iansan5653 @tallys @langermank