Skip to content

Commit

Permalink
[Docs] Explicit React CSS selector syntax description
Browse files Browse the repository at this point in the history
It is not obvious on reading through the document as-is that the CSS selector syntax works on React component names and their props. While it can be inferred through reading "The Key and Ref Props" section, that section can easily be missed when someone is specifically looking at the lists and examples of selectors to see what can be used. It is much clearer to explicitly state this syntax works on React components.
  • Loading branch information
levimeahan authored and ljharb committed Jun 30, 2019
1 parent d9cc09e commit be50697
Showing 1 changed file with 2 additions and 1 deletion.
3 changes: 2 additions & 1 deletion docs/api/selector.md
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ follows:
- id syntax (`#foo`, `#foo-bar`, etc.)
- attribute syntax (`[href="foo"]`, `[type="text"]`, and the other attribute selectors listed [here](https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS/Attribute_selectors).)
- universal syntax (`*`)
- React component name and props (`Button`, `Button[type="submit"]`, etc) - however, please note that it is strongly encouraged to find by component constructor/function and not by display name.

The attribute syntax also works by value, rather than by string. Strings, numbers, and boolean property values are supported. Example:

Expand Down Expand Up @@ -40,7 +41,7 @@ a[href="foo"]
.foo input
```

**The Key and Ref Props**
**React Key and Ref Props**

While in most cases, any React prop can be used, there are exceptions.
The `key` and `ref` props will never work; React uses these props internally.
Expand Down

0 comments on commit be50697

Please sign in to comment.