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.

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

[docs] Better definition of what withStyles is #9235

Merged
merged 1 commit into from Dec 4, 2017
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
4 changes: 2 additions & 2 deletions docs/src/pages/customization/css-in-js.md
Expand Up @@ -14,8 +14,8 @@ We think that it's the future:
- [The future of component-based styling](https://medium.freecodecamp.com/css-in-javascript-the-future-of-component-based-styling-70b161a79a32)

So, you may have noticed in the demos how this *CSS-in-JS* looks.
We use the [`withStyles`](#api)
higher-order component to inject an array of styles into the DOM as CSS, using JSS. Here's an example:
We use the higher-order component created by [`withStyles`](#api)
Copy link
Member

Choose a reason for hiding this comment

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

withStyles is the higher order component. I don't think this change is correct.

Copy link
Member

Choose a reason for hiding this comment

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

I retract my earlier comment, I think this change is correct. withStyles is not an HOC, it's simply a function which takes a styles object and returns an HOC, which takes a component and returns a component.

Copy link
Member

Choose a reason for hiding this comment

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

@pelotom What about the second half of that sentence? (See the end of my #9226 (comment))

Copy link
Member

Choose a reason for hiding this comment

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

@mbrookes you mean this part?

Would it be more correct to say that the resulting enhanced component injects the CSS? (At what point is the CSS actually injected?)

Since they're all related it would be good pick them up in the associated PR.

I might say something like

Calling withStyles(styles) produces a higher-order component--that is, a function which takes a component and produces a new, enhanced component. The enhancement in this case is to inject class names for the given styles into the props of the component it is applied to.

to inject an array of styles into the DOM as CSS, using JSS. Here's an example:

{{demo='pages/customization/CssInJs.js'}}

Expand Down