Skip to content

Commit 0eb9c73

Browse files
committed
small doc tweaks
1 parent 8c600ca commit 0eb9c73

2 files changed

Lines changed: 3 additions & 3 deletions

File tree

docs/_guide/targets.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ subtitle: Querying Descendants
55

66
One of the three [core patterns]({{ site.baseurl }}/guide/introduction#three-core-concepts-observe-listen-query) is Querying. In Catalyst, Targets are the preferred way to query. Targets use `querySelector` under the hood, but in a way that makes it a lot simpler to work with.
77

8-
Catalyst Components are really just Web Components, so you could simply use `querySelector` or `querySelectorAll` to select descendants of the element. Targets avoid some of the problems of `querySelector`; they provide a more consistent interface, avoid coupling CSS classes or HTML tag names to JS, and they handle subtle issues like nested components. Targets are also a little more ergonomic to reuse in a class. We'd recommend using Targets over `querySelector` wherever you can.
8+
Catalyst Components are really just Web Components, so you could use `querySelector` or `querySelectorAll` to select descendants of the element. Targets avoid some of the problems of `querySelector`; they provide a more consistent interface, avoid coupling CSS classes or HTML tag names to JS, and they handle subtle issues like nested components. Targets are also a little more ergonomic to reuse in a class. We'd recommend using Targets over `querySelector` wherever you can.
99

1010
To create a Target, use the `@target` decorator on a class field, and add the matching `data-target` attribute to your HTML, like so:
1111

docs/_guide/your-first-component.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -62,11 +62,11 @@ defineObservedAttributes(HelloWorldElement)
6262
window.customElements.define('hello-world', HelloWorldElement)
6363
```
6464

65-
Using the `@controller` decorator saves on having to write this boilerplate for each element.
65+
The `@controller` decorator saves on having to write this boilerplate for each element.
6666

6767
### What about without TypeScript Decorators?
6868

69-
If you don't want to use TypeScript decorators, you can use `controller` as a regular function, and just pass it your class:
69+
If you don't want to use TypeScript decorators, you can use `controller` as a regular function by passing it to your class:
7070

7171
```js
7272
import {controller} from '@github/catalyst'

0 commit comments

Comments
 (0)