From c5048b1b1eb39e2d2fe1c32addf98dfcda00e00a Mon Sep 17 00:00:00 2001 From: NullVoxPopuli <199018+NullVoxPopuli@users.noreply.github.com> Date: Sat, 20 Sep 2025 18:56:46 -0400 Subject: [PATCH] s~tracked-built-ins~@ember/reactive/collections~g --- .../disabling-prototype-extensions.md | 6 +++--- .../in-depth-topics/autotracking-in-depth.md | 20 +++++++++---------- guides/release/services/index.md | 4 ++-- .../typescript/core-concepts/services.md | 4 ++-- 4 files changed, 17 insertions(+), 17 deletions(-) diff --git a/guides/release/configuring-ember/disabling-prototype-extensions.md b/guides/release/configuring-ember/disabling-prototype-extensions.md index d59f702690..a7b02928a8 100644 --- a/guides/release/configuring-ember/disabling-prototype-extensions.md +++ b/guides/release/configuring-ember/disabling-prototype-extensions.md @@ -41,13 +41,13 @@ native arrays with things like a template's `{{#each}}` helper, Ember.js will have no way to detect changes to the array and the template will not update as the underlying array changes. -You can restore automatic tracking of changes by replacing your native array with a `TrackedArray` from the 'tracked-built-ins' library. +You can restore automatic tracking of changes by replacing your native array with a `trackedArray` from [@ember/reactive/collections](https://api.emberjs.com/ember/release/modules/@ember%2Freactive%2Fcollections). ```javascript -import { TrackedArray } from '@glimmer/tracking'; +import { trackedArray } from '@ember/reactive/collections'; class Ocean { - islands = new TrackedArray(['Oahu', 'Kauai']); + islands = trackedArray(['Oahu', 'Kauai']); addIsland(newIsland) { this.islands.push(newIsland); diff --git a/guides/release/in-depth-topics/autotracking-in-depth.md b/guides/release/in-depth-topics/autotracking-in-depth.md index 0ff6f514ce..41b7c7132e 100644 --- a/guides/release/in-depth-topics/autotracking-in-depth.md +++ b/guides/release/in-depth-topics/autotracking-in-depth.md @@ -276,12 +276,12 @@ Generally, you should try to create classes with their tracked properties enumerated and decorated with `@tracked`, instead of relying on dynamically created POJOs. In some cases however, if your usage of properties on POJOs is too dynamic, you may not be able to enumerate every single property that could -be tracked. In this case, you can use `TrackedObject` from `tracked-built-ins`: +be tracked. In this case, you can use `trackedObject` from [@ember/reactive/collections](https://api.emberjs.com/ember/release/modules/@ember%2Freactive%2Fcollections): ```js -import { TrackedObject } from 'tracked-built-ins'; +import { trackedObject } from '@ember/reactive/collections'; -let obj = new TrackedObject({ +let obj = trackedObject({ a: 1, b: 2, }) @@ -291,21 +291,21 @@ obj.c = 3; ``` All property reading and writing on this object is automatically tracked. -`TrackedObject` is "shallowly" tracked. `obj.c = 4` would be tracked, but +`trackedObject` is "shallowly" tracked. `obj.c = 4` would be tracked, but `obj.c.somethingDeeper = 5` would not be tracked unless you've also made sure -that the contents of `obj.c` is itself another `TrackedObject`. +that the contents of `obj.c` is itself another `trackedObject`. #### Arrays -When you want to track the contents of an Array, you can use `TrackedArray` from -`tracked-built-ins`: +When you want to track the contents of an Array, you can use `trackedArray` from [@ember/reactive/collections](https://api.emberjs.com/ember/release/modules/@ember%2Freactive%2Fcollections): + ```js -import { TrackedArray } from 'tracked-built-ins'; +import { trackedArray } from '@ember/reactive/collections'; class ShoppingList { - items = new TrackedArray([]); + items = trackedArray([]); addItem(item) { this.items.push(item); @@ -313,7 +313,7 @@ class ShoppingList { } ``` -`TrackedArray` supports all the normal native `Array` methods, ensuring that +`trackedArray` supports all the normal native `Array` methods, ensuring that their reads and writes are tracked. ## Caching of tracked properties diff --git a/guides/release/services/index.md b/guides/release/services/index.md index 59d2627b89..501298a841 100644 --- a/guides/release/services/index.md +++ b/guides/release/services/index.md @@ -33,11 +33,11 @@ Like any Ember object, a service is initialized and can have properties and meth Below, the shopping cart service manages an items array that represents the items currently in the shopping cart. ```javascript {data-filename=app/services/shopping-cart.js} -import { TrackedArray } from 'tracked-built-ins'; import Service from '@ember/service'; +import { trackedArray } from '@ember/reactive/collections'; export default class ShoppingCartService extends Service { - items = new TrackedArray([]); + items = trackedArray([]); add(item) { this.items.push(item); diff --git a/guides/release/typescript/core-concepts/services.md b/guides/release/typescript/core-concepts/services.md index 257f81a99e..286f507bc8 100644 --- a/guides/release/typescript/core-concepts/services.md +++ b/guides/release/typescript/core-concepts/services.md @@ -6,10 +6,10 @@ Let's take this example from elsewhere in the [Ember Guides][example-location]: ```typescript {data-filename="app/services/shopping-cart.ts"} import Service from '@ember/service'; -import { TrackedSet } from 'tracked-built-ins'; +import { trackedSet } from '@ember/reactive/collections'; export default class ShoppingCartService extends Service { - items = new TrackedSet(); + items = trackedSet(); add(item) { this.items.add(item);