diff --git a/packages/@ember/-internals/glimmer/lib/component.ts b/packages/@ember/-internals/glimmer/lib/component.ts
index d661970ff29..e96a45ccf9a 100644
--- a/packages/@ember/-internals/glimmer/lib/component.ts
+++ b/packages/@ember/-internals/glimmer/lib/component.ts
@@ -38,24 +38,61 @@ export const BOUNDS = symbol('BOUNDS');
The easiest way to create a `Component` is via
a template. If you name a template
- `app/templates/components/my-foo.hbs`, you will be able to use
- `` or `{{my-foo}}` in other templates, which will make
- an instance of the isolated component.
+ `app/templates/components/person-profile.hbs`:
- ```app/templates/components/my-foo.hbs
+ ```app/templates/components/person-profile.hbs
+
{{@person.name}}
+
+ {{@person.signature}}
+ ```
+
+ You will be able to use `` to
+ refer to this component elsewhere in your
+ application:
+
+ ```app/templates/application.hbs
```
- or
+ Note that component names are capitalized here
+ in order to distinguish them from regular HTML
+ elements.
+
+ While the angle bracket is generally preferred,
+ it is also possible to invoke the same component
+ with the `{{person-profile}}` syntax:
- ```app/templates/components/my-foo.hbs
+ ```app/templates/application.hbs
{{person-profile person=this.currentUser}}
```
- ```app/templates/components/person-profile.hbs
- {{person.title}}
-
- {{person.signature}}
+ Not that with this syntax, component names are
+ dashified and arguments are passed without the `@`
+ sign.
+
+ In both cases, it will render the content of the
+ component template we created above. The end result
+ will be something like this:
+
+ ```hbs
+ Tomster
+
+ Out of office this week
+ ```
+
+ Components can be nested inside sub-folders for
+ logical groupping. For example, if we placed our
+ template in `app/templates/components/person/short-profile.hbs`,
+ we can invoke it as ``:
+
+ ```app/templates/application.hbs
+
+ ```
+
+ Or equivalently, `{{person/short-profile}}`:
+
+ ```app/templates/application.hbs
+ {{person/short-profile person=this.currentUser}}
```
You can use `yield` inside a template to
diff --git a/packages/@ember/canary-features/index.ts b/packages/@ember/canary-features/index.ts
index 94395a45289..cef6a5609b8 100644
--- a/packages/@ember/canary-features/index.ts
+++ b/packages/@ember/canary-features/index.ts
@@ -17,7 +17,7 @@ export const DEFAULT_FEATURES = {
EMBER_IMPROVED_INSTRUMENTATION: null,
EMBER_MODULE_UNIFICATION: null,
EMBER_METAL_TRACKED_PROPERTIES: null,
- EMBER_GLIMMER_ANGLE_BRACKET_NESTED_LOOKUP: null,
+ EMBER_GLIMMER_ANGLE_BRACKET_NESTED_LOOKUP: true,
EMBER_ROUTING_BUILD_ROUTEINFO_METADATA: true,
EMBER_NATIVE_DECORATOR_SUPPORT: null,
};