UNPKG

1.67 kBTypeScriptView Raw
1/**
2 * @decorator
3 *
4 * Marks a property as tracked.
5 *
6 * By default, a component's properties are expected to be static,
7 * meaning you are not able to update them and have the template update accordingly.
8 * Marking a property as tracked means that when that property changes,
9 * a rerender of the component is scheduled so the template is kept up to date.
10 *
11 * @example
12 *
13 * ```typescript
14 * import Component from '@glimmer/component';
15 * import { tracked } from '@glimmer/tracking';
16 *
17 * export default class MyComponent extends Component {
18 * @tracked
19 * remainingApples = 10
20 * }
21 * ```
22 *
23 * When something changes the component's `remainingApples` property, the rerender
24 * will be scheduled.
25 *
26 * @example Computed Properties
27 *
28 * In the case that you have a getter that depends on other properties, tracked
29 * properties accessed within the getter will automatically be tracked for you.
30 * That means when any of those dependent tracked properties is changed, a
31 * rerender of the component will be scheduled.
32 *
33 * In the following example we have two properties,
34 * `eatenApples`, and `remainingApples`.
35 *
36 *
37 * ```typescript
38 * import Component from '@glimmer/component';
39 * import { tracked } from '@glimmer/tracking';
40 *
41 * const totalApples = 100;
42 *
43 * export default class MyComponent extends Component {
44 * @tracked
45 * eatenApples = 0
46 *
47 * get remainingApples() {
48 * return totalApples - this.eatenApples;
49 * }
50 *
51 * increment() {
52 * this.eatenApples = this.eatenApples + 1;
53 * }
54 * }
55 * ```
56 */
57export declare let tracked: PropertyDecorator;
58export declare function setPropertyDidChange(cb: () => void): void;