ember-source 7.2.0-alpha.4 → 7.2.0

package/dist/dev/packages/shared-chunks/{index-dyv6rcBf.js → index-C5Q8WHUG.js}

@@ -1,55 +1,50 @@
 import { privatize } from '../@ember/-internals/container/index.js';
 import { E as ENV } from './env-g-kaAFLN.js';
 import { isFactory, getOwner } from '../@ember/-internals/owner/index.js';
-import { a as guidFor } from './guid-PO2v9BaN.js';
+import { g as guidFor } from './guid-Cbq2sNV_.js';
 import { constructStyleDeprecationMessage, getViewId, getViewElement } from '../@ember/-internals/views/lib/system/utils.js';
 import { deprecate, warn } from '../@ember/debug/index.js';
 import { schedule, _backburner, _getCurrentRunLoop } from '../@ember/runloop/index.js';
 import { associateDestroyableChild, isDestroyed, destroy, registerDestructor, isDestroying } from '../@glimmer/destroyable/index.js';
 import { artifacts } from '../@glimmer/program/index.js';
-import { R as RuntimeOpImpl } from './program-CPXeXWVB.js';
-import { v as valueForRef, U as UNDEFINED_REFERENCE, b as createComputeRef, j as isConstRef, d as createConstRef, l as isUpdatableRef, f as createInvokableRef, h as createReadOnlyRef, i as createUnboundRef, e as createDebugAliasRef, a as childRefFromParts, u as updateRef } from './reference-C-OXd_kp.js';
-import { e as clientBuilder } from './element-builder-Cl1kHFJE.js';
-import { E as EMPTY_ARGS, g as createCapturedArgs, c as EMPTY_POSITIONAL, h as curry } from './untouchable-this-BHdAERUu.js';
-import { g as runtimeOptions, i as inTransaction, r as renderComponent$1, d as renderMain } from './render-Dz3OWqXy.js';
-import { d as dict } from './collections-DEt-i-8B.js';
-import { u as unwrapTemplate, b as CurlyComponentManager, i as initialRenderInstrumentDetails, p as processComponentInitializationAssertions, a as ComponentStateBucket, D as DIRTY_TAG, c as isCurlyManager, B as BOUNDS } from './curly-YoYS2vXw.js';
-import { b as CONSTANT_TAG, k as consumeTag, u as isTracking, o as debug, D as DIRTY_TAG$1, m as createTag, B as valueForTag, c as CURRENT_TAG, z as validateTag } from './cache-CeWOBNQg.js';
-import { a as RSVP } from './rsvp-C6j8G1D1.js';
-import { h as hasDOM } from './index-DX90CU4L.js';
-import EngineInstance from '../@ember/engine/instance.js';
+import { R as RuntimeOpImpl } from './program-DlgjqLa6.js';
+import { v as valueForRef, U as UNDEFINED_REFERENCE, c as createComputeRef, i as isConstRef, a as createConstRef, d as isUpdatableRef, j as createInvokableRef, k as createReadOnlyRef, l as createUnboundRef, h as createDebugAliasRef, g as childRefFromParts, u as updateRef } from './reference-BqOLhKFy.js';
+import { c as clientBuilder } from './api-C0PAtEgQ.js';
+import { E as EMPTY_ARGS, c as createCapturedArgs, b as EMPTY_POSITIONAL, d as curry } from './arguments-CDkbOqTS.js';
+import { g as runtimeOptions, i as inTransaction, r as renderComponent$1, d as renderMain } from './render-87_sKZ_k.js';
+import { d as dict } from './collections-DPkjqeA3.js';
+import { u as unwrapTemplate, a as CurlyComponentManager, i as initialRenderInstrumentDetails, p as processComponentInitializationAssertions, b as ComponentStateBucket, D as DIRTY_TAG, c as isCurlyManager, B as BOUNDS } from './curly-Ei5G8jhk.js';
+import { C as CONSTANT_TAG, c as consumeTag, z as isTracking, e as debug, D as DIRTY_TAG$1, r as createTag, a as valueForTag, k as CURRENT_TAG, v as validateTag } from './cache-DGDPVCpC.js';
+import { h as hasDOM } from './index-BGP1rw3B.js';
 import { _instrumentStart } from '../@ember/instrumentation/index.js';
-import { c as capabilityFlagsFrom } from './capabilities-CZkuOqqC.js';
-import { h as templateFactory } from './index-DkwVSPP5.js';
+import { c as capabilityFlagsFrom } from './capabilities-CajW4QjE.js';
+import { t as templateFactory } from './index-DaFzpTIE.js';
 import { assert } from '../@ember/debug/lib/assert.js';
 import { g as getFactoryFor } from './container-BzzHmCNj.js';
-import { g as get, a as _getProp } from './property_get-BjbsrgpU.js';
-import { _ as _setProp, s as set } from './property_set-LJskl202.js';
+import { g as get, b as _getProp } from './property_get-CRP7MFz_.js';
+import { _ as _setProp, s as set } from './property_set-qCUylPEK.js';
 import { g as getDebugName } from './get-debug-name-CSniHBsn.js';
 import setGlobalContext from '../@glimmer/global-context/index.js';
-import { t as tagForObject, o as objectAt, b as tagForProperty } from './chain-tags-DfmU63mS.js';
+import { t as tagForObject, o as objectAt, a as tagForProperty } from './chain-tags-uWSImHzB.js';
 import { isEmberArray } from '../@ember/array/-internals.js';
 import { i as isObject } from './spec-BXl1reqK.js';
-import { t as tagFor } from './meta-Cjo3zQJq.js';
+import { t as tagFor } from './meta-BqC7f9Ia.js';
 import { contentFor } from '../@ember/-internals/runtime/lib/mixins/-proxy.js';
 import { i as isProxy } from './is_proxy-Bzg0d4m4.js';
-import { i as internalHelper } from './internal-helper-IC87S6iZ.js';
+import { i as internalHelper } from './internal-helper-CKrni0b_.js';
 import { i as isHTMLSafe } from './index-D-xTBV4B.js';
-import { isArray } from '../@ember/array/index.js';
+import isArray from '../@ember/array/lib/is-array.js';
 import { g as getComponentTemplate } from './template-R_5UMHhb.js';
-import { c as hasInternalComponentManager, j as setInternalHelperManager, g as getInternalComponentManager } from './api-DG5kRT-o.js';
-import { h as hash, f as fn, a as array } from './hash-2-93qikL.js';
-import { g as get$1, c as concat } from './get-CO3EIWsm.js';
-import { o as on } from './on-Ch_lyozr.js';
-import { T as TEMPLATE_ONLY_COMPONENT_MANAGER, t as templateOnlyComponent } from './template-only-BxYzSEnC.js';
-import { i as isClassicHelper, C as CLASSIC_HELPER_MANAGER } from './helper-Bm6EhgSW.js';
+import { c as hasInternalComponentManager, j as setInternalHelperManager, g as getInternalComponentManager } from './api-DuLOZMO_.js';
+import { h as hash, f as fn, a as array } from './hash-Bg4r3CU4.js';
+import { g as get$1, c as concat } from './get-B4o_4OLA.js';
+import { o as on } from './on-CQqC2-wL.js';
+import { T as TEMPLATE_ONLY_COMPONENT_MANAGER, t as templateOnlyComponent } from './template-only-Cu639ICT.js';
+import { i as isClassicHelper, C as CLASSIC_HELPER_MANAGER } from './helper--ZiOCQkd.js';
 import { dasherize } from '../@ember/-internals/string/index.js';
-import { a as uniqueId } from './unique-id-Hd96VZlE.js';
-import '../route-recognizer/index.js';
-import './unrecognized-url-error-BQdkjTtZ.js';
-import '../@ember/routing/lib/routing-service.js';
+import { a as uniqueId } from './unique-id-Csxuh1I7.js';
 import { generateControllerFactory } from '../@ember/routing/lib/generate_controller.js';
-import { E as EvaluationContextImpl } from './program-context-BaYVr5GA.js';
+import { E as EvaluationContextImpl } from './program-context-Dq8xN2HI.js';
 
 function instrumentationPayload$1(def) {
   // "main" used to be the outlet name, keeping it around for compatibility
@@ -92,14 +87,15 @@ class OutletComponentManager {
       let currentState = valueForRef(currentStateRef);
       let currentOwner = currentState?.render?.owner;
       if (parentOwner && parentOwner !== currentOwner) {
-        (!(currentOwner instanceof EngineInstance) && assert('Expected currentOwner to be an EngineInstance', currentOwner instanceof EngineInstance));
+        (!(currentOwner != null && 'buildChildEngineInstance' in currentOwner) && assert('Expected currentOwner to be an EngineInstance', currentOwner != null && 'buildChildEngineInstance' in currentOwner));
+        let engineInstance = currentOwner;
         let {
           mountPoint
-        } = currentOwner;
+        } = engineInstance;
         if (mountPoint) {
           state.engine = {
             mountPoint,
-            instance: currentOwner
+            instance: engineInstance
           };
         }
       }
@@ -242,55 +238,102 @@ class RootComponentDefinition {
 }
 
 /**
-@module ember
+@module @ember/helper
 */
 
 /**
-  The `{{#each}}` helper loops over elements in a collection. It is an extension
+  The `{{#each}}` keyword loops over elements in a collection. It is an extension
   of the base Handlebars `{{#each}}` helper.
 
   The default behavior of `{{#each}}` is to yield its inner block once for every
   item in an array passing the item as the first block parameter.
 
-  Assuming the `@developers` argument contains this array:
+  ```gjs {data-filename="app/components/developer-list.gjs"}
+  import Component from '@glimmer/component';
 
-  ```javascript
-  [{ name: 'Yehuda' },{ name: 'Tom' }, { name: 'Paul' }];
+  export default class DeveloperList extends Component {
+    developers = [
+      { name: 'Yehuda' },
+      { name: 'Tom' },
+      { name: 'Paul' },
+    ];
+
+    <template>
+      <ul>
+        {{#each this.developers as |person|}}
+          <li>Hello, {{person.name}}!</li>
+        {{/each}}
+      </ul>
+    </template>
+  }
   ```
 
-  ```handlebars
-  <ul>
-    {{#each @developers as |person|}}
-      <li>Hello, {{person.name}}!</li>
-    {{/each}}
-  </ul>
-  ```
+  The same rules apply to arrays of primitives:
 
-  The same rules apply to arrays of primitives.
+  ```app/components/developer-names.gjs
+  import Component from '@glimmer/component';
 
-  ```javascript
-  ['Yehuda', 'Tom', 'Paul']
+  export default class DeveloperNames extends Component {
+    developerNames = ['Yehuda', 'Tom', 'Paul'];
+
+    <template>
+      <ul>
+        {{#each this.developerNames as |name|}}
+          <li>Hello, {{name}}!</li>
+        {{/each}}
+      </ul>
+    </template>
+  }
   ```
 
-  ```handlebars
-  <ul>
-    {{#each @developerNames as |name|}}
-      <li>Hello, {{name}}!</li>
-    {{/each}}
-  </ul>
+  `{{#each}}` also supports native JavaScript [`Set`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set)
+  values and other iterables:
+
+  ```gjs {data-filename="app/components/developer-set.gjs"}
+  import Component from '@glimmer/component';
+
+  export default class DeveloperSet extends Component {
+    developers = new Set([
+      { name: 'Yehuda' },
+      { name: 'Tom' },
+      { name: 'Paul' },
+    ]);
+
+    <template>
+      <ul>
+        {{#each this.developers as |person|}}
+          <li>Hello, {{person.name}}!</li>
+        {{/each}}
+      </ul>
+    </template>
+  }
   ```
 
-  During iteration, the index of each item in the array is provided as a second block
-  parameter.
+  During iteration, the index of each item in the array is provided as a second
+  block parameter:
 
-  ```handlebars
-  <ul>
-    {{#each @developers as |person index|}}
-      <li>Hello, {{person.name}}! You're number {{index}} in line</li>
-    {{/each}}
-  </ul>
+  ```app/components/developer-list-with-index.gjs
+  import Component from '@glimmer/component';
+
+  export default class DeveloperListWithIndex extends Component {
+    developers = [
+      { name: 'Yehuda' },
+      { name: 'Tom' },
+      { name: 'Paul' },
+    ];
+
+    <template>
+      <ul>
+        {{#each this.developers as |person index|}}
+          <li>Hello, {{person.name}}! You're number {{index}} in line</li>
+        {{/each}}
+      </ul>
+    </template>
+  }
   ```
 
+  `#each` is a keyword and does not need to be imported.
+
   ### Specifying Keys
 
   In order to improve rendering speed, Ember will try to reuse the DOM elements
@@ -305,30 +348,38 @@ class RootComponentDefinition {
   needed. However, in some rare cases, the objects' identities may change even
   though they represent the same underlying data.
 
-  For example:
+  For example, mapping over `people` produces a new array of new objects on each
+  render. Use `key` so Ember can match items across those renders:
 
-  ```javascript
-  people.map(person => {
-    return { ...person, type: 'developer' };
-  });
-  ```
+  ```gjs {data-filename="app/components/mapped-developers.gjs"}
+  import Component from '@glimmer/component';
 
-  In this case, each time the `people` array is `map`-ed over, it will produce
-  an new array with completely different objects between renders. In these cases,
-  you can help Ember determine how these objects related to each other with the
-  `key` option:
+  export default class MappedDevelopers extends Component {
+    people = [
+      { name: 'Yehuda' },
+      { name: 'Tom' },
+      { name: 'Paul' },
+    ];
 
-  ```handlebars
-  <ul>
-    {{#each @developers key="name" as |person|}}
-      <li>Hello, {{person.name}}!</li>
-    {{/each}}
-  </ul>
+    get developers() {
+      return this.people.map((person) => {
+        return { ...person, type: 'developer' };
+      });
+    }
+
+    <template>
+      <ul>
+        {{#each this.developers key="name" as |person|}}
+          <li>Hello, {{person.name}}!</li>
+        {{/each}}
+      </ul>
+    </template>
+  }
   ```
 
   By doing so, Ember will use the value of the property specified (`person.name`
   in the example) to find a "match" from the previous render. That is, if Ember
-  has previously seen an object from the `@developers` array with a matching
+  has previously seen an object from the `developers` array with a matching
   name, its DOM elements will be re-used.
 
   There are two special values for `key`:
@@ -341,50 +392,59 @@ class RootComponentDefinition {
   `{{#each}}` can have a matching `{{else}}`. The contents of this block will render
   if the collection is empty.
 
-  ```handlebars
-  <ul>
-    {{#each @developers as |person|}}
-      <li>{{person.name}} is available!</li>
-    {{else}}
-      <li>Sorry, nobody is available for this task.</li>
-    {{/each}}
-  </ul>
+  ```gjs {data-filename="app/components/available-developers.gjs"}
+  import Component from '@glimmer/component';
+
+  export default class AvailableDevelopers extends Component {
+    developers = [];
+
+    <template>
+      <ul>
+        {{#each this.developers as |person|}}
+          <li>{{person.name}} is available!</li>
+        {{else}}
+          <li>Sorry, nobody is available for this task.</li>
+        {{/each}}
+      </ul>
+    </template>
+  }
   ```
 
   @method each
-  @for Ember.Templates.helpers
+  @for Keywords
+  @static
+  @noimport
   @public
  */
 
 /**
-  The `{{each-in}}` helper loops over properties on an object.
+  The `{{#each-in}}` keyword loops over properties on an object, or entries in a
+  native JavaScript [`Map`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map).
 
   For example, given this component definition:
 
-  ```app/components/developer-details.js
+  ```gjs {data-filename="app/components/developer-details.gjs"}
   import Component from '@glimmer/component';
   import { tracked } from '@glimmer/tracking';
 
-  export default class extends Component {
+  export default class DeveloperDetails extends Component {
     @tracked developer = {
-      "name": "Shelly Sails",
-      "age": 42
+      name: 'Shelly Sails',
+      age: 42,
     };
+
+    <template>
+      <ul>
+        {{#each-in this.developer as |key value|}}
+          <li>{{key}}: {{value}}</li>
+        {{/each-in}}
+      </ul>
+    </template>
   }
   ```
 
   This template would display all properties on the `developer`
-  object in a list:
-
-  ```app/components/developer-details.hbs
-  <ul>
-    {{#each-in this.developer as |key value|}}
-      <li>{{key}}: {{value}}</li>
-    {{/each-in}}
-  </ul>
-  ```
-
-  Outputting their name and age:
+  object in a list, outputting their name and age:
 
   ```html
   <ul>
@@ -393,8 +453,55 @@ class RootComponentDefinition {
   </ul>
   ```
 
+  The same pattern works with a `Map`:
+
+  ```gjs {data-filename="app/components/developer-map.gjs"}
+  import Component from '@glimmer/component';
+
+  export default class DeveloperMap extends Component {
+    map = new Map([
+      ['name', 'Shelly Sails'],
+      ['age', 42],
+    ]);
+
+    <template>
+      <ul>
+        {{#each-in this.map as |key value|}}
+          <li>{{key}}: {{value}}</li>
+        {{/each-in}}
+      </ul>
+    </template>
+  }
+  ```
+
+  When a `Map` uses object keys, you can pass `key="@identity"` to explicitly
+  track entries across re-renders using the JavaScript identity of each key:
+
+  ```gjs {data-filename="app/components/object-keyed-map.gjs"}
+  import Component from '@glimmer/component';
+
+  export default class ObjectKeyedMap extends Component {
+    map = new Map([
+      [{ name: 'one' }, 'foo'],
+      [{ name: 'two' }, 'bar'],
+    ]);
+
+    <template>
+      <ul>
+        {{#each-in this.map key="@identity" as |key value|}}
+          <li>{{key.name}}: {{value}}</li>
+        {{/each-in}}
+      </ul>
+    </template>
+  }
+  ```
+
+  `#each-in` is a keyword and does not need to be imported.
+
   @method each-in
-  @for Ember.Templates.helpers
+  @static
+  @noimport
+  @for Keywords
   @public
   @since 2.1.0
 */
@@ -857,80 +964,50 @@ const trackArray = internalHelper(({
 });
 
 /**
-@module ember
+@module @ember/helper
 */
 
 /**
-  The `mut` helper lets you __clearly specify__ that a child `Component` can update the
-  (mutable) value passed to it, which will __change the value of the parent component__.
-
-  To specify that a parameter is mutable, when invoking the child `Component`:
-
-  ```handlebars
-  <MyChild @childClickCount={{fn (mut totalClicks)}} />
-  ```
-
-   or
-
-  ```handlebars
-  {{my-child childClickCount=(mut totalClicks)}}
-  ```
-
-  The child `Component` can then modify the parent's value just by modifying its own
-  property:
-
-  ```javascript
-  // my-child.js
-  export default class MyChild extends Component {
-    click() {
-      this.incrementProperty('childClickCount');
-    }
-  }
-  ```
+  The `mut` helper is a shortcut for updating for args.
+    
+  However, defining update functions on your backing class is preferable to using `mut`.
+    
+  More directly: Don't use `mut`. 
 
-  Note that for curly components (`{{my-component}}`) the bindings are already mutable,
-  making the `mut` unnecessary.
-
-  Additionally, the `mut` helper can be combined with the `fn` helper to
-  mutate a value. For example:
-
-  ```handlebars
-  <MyChild @childClickCount={{this.totalClicks}} @click-count-change={{fn (mut totalClicks))}} />
-  ```
-
-  or
+  The `mut` helper, when used with `fn`, will return a function that
+  sets the value passed to `mut` to its first argument. As an example, we can create a
+  button that increments a value passing the value directly to the `fn`:
 
   ```handlebars
-  {{my-child childClickCount=totalClicks click-count-change=(fn (mut totalClicks))}}
+  <MyChild @childClickCount={{this.totalClicks}} @clickCountChange={{fn (mut this.totalClicks)}} />
   ```
 
-  The child `Component` would invoke the function with the new click value:
+  The child `Component` would invoke the function with the new click count:
 
-  ```javascript
-  // my-child.js
+  ```gjs {data-filename="app/components/my-child.gjs"}
+  import Component from '@glimmer/component';
+  import { action } from '@ember/object';
+    
   export default class MyChild extends Component {
-    click() {
-      this.get('click-count-change')(this.get('childClickCount') + 1);
+    @action
+    update() {
+      this.args.clickCountChange(this.args.childClickCount + 1);
     }
+    
+    <template>
+      <button {{on "click" this.update}}>
+        Click me!
+      </button>
+    </template>
   }
   ```
 
   The `mut` helper changes the `totalClicks` value to what was provided as the `fn` argument.
 
-  The `mut` helper, when used with `fn`, will return a function that
-  sets the value passed to `mut` to its first argument. As an example, we can create a
-  button that increments a value passing the value directly to the `fn`:
-
-  ```handlebars
-  {{! inc helper is not provided by Ember }}
-  <button onclick={{fn (mut count) (inc count)}}>
-    Increment count
-  </button>
-  ```
-
   @method mut
   @param {Object} [attr] the "two-way" attribute that can be modified.
-  @for Ember.Templates.helpers
+  @static
+  @for Keywords
   @public
 */
 
@@ -955,13 +1032,17 @@ const mut = internalHelper(({
 });
 
 /**
-@module ember
+@module @ember/helper
 */
 
 
 /**
   The `readonly` helper let's you specify that a binding is one-way only,
   instead of two-way.
+  
+  This is a vestigial helper from the days of `@ember/component` and does not apply to
+  components extending from `@glimmer/component`.
+    
   When you pass a `readonly` binding from an outer context (e.g. parent component),
   to to an inner context (e.g. child component), you are saying that changing that
   property in the inner context does not change the value in the outer context.
@@ -974,14 +1055,6 @@ const mut = internalHelper(({
   }
   ```
 
-  ```app/templates/components/my-parent.hbs
-  {{log totalClicks}} // -> 3
-  <MyChild @childClickCount={{readonly totalClicks}} />
-  ```
-  ```
-  {{my-child childClickCount=(readonly totalClicks)}}
-  ```
-
   Now, when you update `childClickCount`:
 
   ```app/components/my-child.js
@@ -1071,7 +1144,9 @@ const mut = internalHelper(({
 
   @method readonly
   @param {Object} [attr] the read-only attribute.
-  @for Ember.Templates.helpers
+  @for Keywords
+  @noimport
+  @static
   @private
 */
 const readonly = internalHelper(({
@@ -1083,7 +1158,7 @@ const readonly = internalHelper(({
 });
 
 /**
-@module ember
+@module @ember/helper
 */
 
 
@@ -1109,9 +1184,13 @@ const readonly = internalHelper(({
 
   The `unbound` helper only accepts a single argument, and it return an
   unbound value.
+ 
+ `unbound` is a template keyword and does not need to be imported.
 
   @method unbound
-  @for Ember.Templates.helpers
+  @static
+  @noimport
+  @for Keywords
   @public
 */
 
@@ -1156,7 +1235,7 @@ class MountManager {
     // mount is a runtime helper, this shouldn't use dynamic layout
     // we should resolve the engine app template in the helper
     // it also should use the owner that looked up the mount helper.
-    (!(owner instanceof EngineInstance) && assert('Expected owner to be an EngineInstance', owner instanceof EngineInstance));
+    (!('buildChildEngineInstance' in owner) && assert('Expected owner to be an EngineInstance', 'buildChildEngineInstance' in owner));
     let engine = owner.buildChildEngineInstance(name);
     engine.boot();
     let applicationFactory = engine.factoryFor(`controller:application`);
@@ -1254,7 +1333,7 @@ class MountDefinition {
 }
 
 /**
-@module ember
+@module @ember/helper
 */
 
 
@@ -1265,15 +1344,14 @@ class MountDefinition {
 
   For example, the following template mounts the `ember-chat` engine:
 
-  ```handlebars
-  {{! application.hbs }}
+  ```gjs {data-filename="app/templates/application.gjs"}
   {{mount "ember-chat"}}
   ```
 
   Additionally, you can also pass in a `model` argument that will be
   set as the engines model. This can be an existing object:
 
-  ```
+  ```hbs
   <div>
     {{mount 'admin' model=userSettings}}
   </div>
@@ -1281,21 +1359,28 @@ class MountDefinition {
 
   Or an inline `hash`, and you can even pass components:
 
+  ```gjs
+  import SignInButton from '../components/sign-in-button';
+  <template>
+    <div>
+      <h1>Application template!</h1>
+      {{mount 'admin' model=(hash
+          title='Secret Admin'
+          signInButton=SignInButton
+      )}}
+    </div>
+  </template>
   ```
-  <div>
-    <h1>Application template!</h1>
-    {{mount 'admin' model=(hash
-        title='Secret Admin'
-        signInButton=(component 'sign-in-button')
-    )}}
-  </div>
-  ```
+ 
+ `mount` is built-in and does not need to be imported.
 
   @method mount
   @param {String} name Name of the engine to mount.
   @param {Object} [model] Object that will be set as
                           the model of the engine.
-  @for Ember.Templates.helpers
+  @for Keywords
+  @static
+  @noimport
   @public
 */
 const mountHelper = internalHelper((args, owner) => {
@@ -1430,28 +1515,41 @@ function makeRouteTemplate(owner, name, template) {
   return curry(0, routeTemplate, owner, null, true);
 }
 
+/**
+ @module @ember/helper
+ */
+
 /**
   The `{{outlet}}` helper lets you specify where a child route will render in
   your template. An important use of the `{{outlet}}` helper is in your
-  application's `application.hbs` file:
-
-  ```app/templates/application.hbs
-  <MyHeader />
-
-  <div class="my-dynamic-content">
-    <!-- this content will change based on the current route, which depends on the current URL -->
-    {{outlet}}
-  </div>
-
-  <MyFooter />
+  application's `application.gjs` file:
+
+  ```gjs {data-filename="app/templates/application.gjs"}
+  import MyHeader from '../components/my-header';
+  import MyFooter from '../components/my-footer';
+    
+  <template>
+    <MyHeader />
+  
+    <div class="my-dynamic-content">
+      <!-- this content will change based on the current route, which depends on the current URL -->
+      {{outlet}}
+    </div>
+  
+    <MyFooter />
+  </template>
   ```
 
   See the [routing guide](https://guides.emberjs.com/release/routing/rendering-a-template/) for more
   information on how your `route` interacts with the `{{outlet}}` helper.
   Note: Your content __will not render__ if there isn't an `{{outlet}}` for it.
 
+  `outlet` is built-in and does not need to be imported. 
+ 
   @method outlet
-  @for Ember.Templates.helpers
+  @for Keywords
+  @static
+  @noimport
   @public
 */
 const outletHelper = internalHelper((_args, owner, scope) => {
@@ -2001,7 +2099,12 @@ let renderSettledDeferred = null;
 */
 function renderSettled() {
   if (renderSettledDeferred === null) {
-    renderSettledDeferred = RSVP.defer();
+    let resolve;
+    let promise = new Promise(r => resolve = r);
+    renderSettledDeferred = {
+      promise,
+      resolve
+    };
     // if there is no current runloop, the promise created above will not have
     // a chance to resolve (because its resolved in backburner's "end" event)
     if (!_getCurrentRunLoop()) {