grainjs 1.0.2 → 1.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +23 -71
- package/dist/cjs/index.js +5 -1
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/lib/PriorityQueue.d.ts +1 -1
- package/dist/cjs/lib/_computed_queue.js +3 -3
- package/dist/cjs/lib/_computed_queue.js.map +1 -1
- package/dist/cjs/lib/binding.d.ts +11 -4
- package/dist/cjs/lib/binding.js +5 -5
- package/dist/cjs/lib/binding.js.map +1 -1
- package/dist/cjs/lib/computed.d.ts +49 -28
- package/dist/cjs/lib/computed.js +38 -52
- package/dist/cjs/lib/computed.js.map +1 -1
- package/dist/cjs/lib/dispose.d.ts +109 -96
- package/dist/cjs/lib/dispose.js +106 -80
- package/dist/cjs/lib/dispose.js.map +1 -1
- package/dist/cjs/lib/dom.d.ts +38 -18
- package/dist/cjs/lib/dom.js +44 -20
- package/dist/cjs/lib/dom.js.map +1 -1
- package/dist/cjs/lib/domComponent.d.ts +56 -48
- package/dist/cjs/lib/domComponent.js +66 -1
- package/dist/cjs/lib/domComponent.js.map +1 -1
- package/dist/cjs/lib/domComputed.d.ts +31 -21
- package/dist/cjs/lib/domComputed.js +14 -11
- package/dist/cjs/lib/domComputed.js.map +1 -1
- package/dist/cjs/lib/domDispose.d.ts +27 -12
- package/dist/cjs/lib/domDispose.js +26 -11
- package/dist/cjs/lib/domDispose.js.map +1 -1
- package/dist/cjs/lib/domForEach.d.ts +4 -3
- package/dist/cjs/lib/domForEach.js +10 -9
- package/dist/cjs/lib/domForEach.js.map +1 -1
- package/dist/cjs/lib/domImpl.d.ts +33 -10
- package/dist/cjs/lib/domImpl.js +28 -9
- package/dist/cjs/lib/domImpl.js.map +1 -1
- package/dist/cjs/lib/domMethods.d.ts +93 -47
- package/dist/cjs/lib/domMethods.js +88 -46
- package/dist/cjs/lib/domMethods.js.map +1 -1
- package/dist/cjs/lib/domevent.d.ts +87 -62
- package/dist/cjs/lib/domevent.js +84 -59
- package/dist/cjs/lib/domevent.js.map +1 -1
- package/dist/cjs/lib/emit.d.ts +62 -32
- package/dist/cjs/lib/emit.js +67 -53
- package/dist/cjs/lib/emit.js.map +1 -1
- package/dist/cjs/lib/kowrap.d.ts +6 -3
- package/dist/cjs/lib/kowrap.js +6 -3
- package/dist/cjs/lib/kowrap.js.map +1 -1
- package/dist/cjs/lib/obsArray.d.ts +91 -53
- package/dist/cjs/lib/obsArray.js +87 -55
- package/dist/cjs/lib/obsArray.js.map +1 -1
- package/dist/cjs/lib/observable.d.ts +25 -15
- package/dist/cjs/lib/observable.js +29 -18
- package/dist/cjs/lib/observable.js.map +1 -1
- package/dist/cjs/lib/pureComputed.d.ts +12 -15
- package/dist/cjs/lib/pureComputed.js +15 -18
- package/dist/cjs/lib/pureComputed.js.map +1 -1
- package/dist/cjs/lib/styled.d.ts +78 -61
- package/dist/cjs/lib/styled.js +26 -79
- package/dist/cjs/lib/styled.js.map +1 -1
- package/dist/cjs/lib/subscribe.d.ts +41 -37
- package/dist/cjs/lib/subscribe.js +31 -40
- package/dist/cjs/lib/subscribe.js.map +1 -1
- package/dist/cjs/lib/util.js +1 -0
- package/dist/cjs/lib/util.js.map +1 -1
- package/dist/cjs/lib/widgets/input.d.ts +3 -1
- package/dist/cjs/lib/widgets/input.js +6 -4
- package/dist/cjs/lib/widgets/input.js.map +1 -1
- package/dist/cjs/lib/widgets/select.d.ts +4 -2
- package/dist/cjs/lib/widgets/select.js +7 -5
- package/dist/cjs/lib/widgets/select.js.map +1 -1
- package/dist/esm/lib/_computed_queue.js +3 -3
- package/dist/esm/lib/_computed_queue.js.map +1 -1
- package/dist/esm/lib/binding.js +2 -2
- package/dist/esm/lib/binding.js.map +1 -1
- package/dist/esm/lib/computed.js +36 -50
- package/dist/esm/lib/computed.js.map +1 -1
- package/dist/esm/lib/dispose.js +104 -78
- package/dist/esm/lib/dispose.js.map +1 -1
- package/dist/esm/lib/dom.js +38 -18
- package/dist/esm/lib/dom.js.map +1 -1
- package/dist/esm/lib/domComponent.js +65 -0
- package/dist/esm/lib/domComponent.js.map +1 -1
- package/dist/esm/lib/domComputed.js +10 -7
- package/dist/esm/lib/domComputed.js.map +1 -1
- package/dist/esm/lib/domDispose.js +26 -11
- package/dist/esm/lib/domDispose.js.map +1 -1
- package/dist/esm/lib/domForEach.js +3 -2
- package/dist/esm/lib/domForEach.js.map +1 -1
- package/dist/esm/lib/domImpl.js +26 -7
- package/dist/esm/lib/domImpl.js.map +1 -1
- package/dist/esm/lib/domMethods.js +77 -35
- package/dist/esm/lib/domMethods.js.map +1 -1
- package/dist/esm/lib/domevent.js +84 -59
- package/dist/esm/lib/domevent.js.map +1 -1
- package/dist/esm/lib/emit.js +67 -53
- package/dist/esm/lib/emit.js.map +1 -1
- package/dist/esm/lib/kowrap.js +5 -2
- package/dist/esm/lib/kowrap.js.map +1 -1
- package/dist/esm/lib/obsArray.js +82 -50
- package/dist/esm/lib/obsArray.js.map +1 -1
- package/dist/esm/lib/observable.js +26 -15
- package/dist/esm/lib/observable.js.map +1 -1
- package/dist/esm/lib/pureComputed.js +15 -18
- package/dist/esm/lib/pureComputed.js.map +1 -1
- package/dist/esm/lib/styled.js +24 -77
- package/dist/esm/lib/styled.js.map +1 -1
- package/dist/esm/lib/subscribe.js +27 -36
- package/dist/esm/lib/subscribe.js.map +1 -1
- package/dist/esm/lib/util.js +1 -0
- package/dist/esm/lib/util.js.map +1 -1
- package/dist/esm/lib/widgets/input.js +3 -1
- package/dist/esm/lib/widgets/input.js.map +1 -1
- package/dist/esm/lib/widgets/select.js +3 -1
- package/dist/esm/lib/widgets/select.js.map +1 -1
- package/dist/grain-full.debug.js +2146 -3062
- package/dist/grain-full.debug.js.map +7 -0
- package/dist/grain-full.min.js +6 -2
- package/dist/grain-full.min.js.map +7 -1
- package/lib/binding.ts +9 -2
- package/lib/computed.ts +56 -56
- package/lib/dispose.ts +110 -85
- package/lib/dom.ts +39 -20
- package/lib/domComponent.ts +66 -57
- package/lib/domComputed.ts +29 -19
- package/lib/domDispose.ts +28 -11
- package/lib/domForEach.ts +7 -3
- package/lib/domImpl.ts +30 -7
- package/lib/domMethods.ts +101 -46
- package/lib/domevent.ts +85 -60
- package/lib/emit.ts +64 -50
- package/lib/kowrap.ts +5 -2
- package/lib/obsArray.ts +89 -54
- package/lib/observable.ts +26 -15
- package/lib/pureComputed.ts +16 -22
- package/lib/styled.ts +85 -71
- package/lib/subscribe.ts +41 -45
- package/lib/util.ts +1 -0
- package/lib/widgets/input.ts +3 -1
- package/lib/widgets/select.ts +3 -1
- package/package.json +38 -27
package/dist/esm/lib/obsArray.js
CHANGED
|
@@ -1,42 +1,27 @@
|
|
|
1
|
+
import { setDisposeOwner } from './dispose';
|
|
2
|
+
import { BaseObservable, Observable } from './observable';
|
|
3
|
+
import { subscribe } from './subscribe';
|
|
1
4
|
/**
|
|
2
|
-
* ObsArray extends a plain Observable to allow
|
|
5
|
+
* `ObsArray<T>` is essentially an array-valued observable. It extends a plain Observable to allow
|
|
6
|
+
* for more efficient observation of array changes. It also may be
|
|
7
|
+
* used as an owner for disposable array elements.
|
|
3
8
|
*
|
|
4
|
-
* As for any array-valued Observable
|
|
9
|
+
* As for any array-valued `Observable`, when the contents of the observed array changes, the
|
|
5
10
|
* listeners get called with new and previous values which are the same array. For simple changes,
|
|
6
|
-
* such as those made with
|
|
11
|
+
* such as those made with `.push()` and `.splice()` methods, `ObsArray` allows for more efficient
|
|
7
12
|
* handling of the change by calling listeners with splice info in the third argument.
|
|
8
13
|
*
|
|
9
|
-
*
|
|
10
|
-
*
|
|
11
|
-
*
|
|
12
|
-
*
|
|
13
|
-
*
|
|
14
|
-
*
|
|
15
|
-
*
|
|
16
|
-
*
|
|
17
|
-
* Both ObsArray and ComputedArray may be used with disposable elements as their owners. E.g.
|
|
14
|
+
* `ObsArray` may be used with disposable elements as their owner. E.g.
|
|
15
|
+
* ```ts
|
|
16
|
+
* const arr = obsArray<D>();
|
|
17
|
+
* arr.push(D.create(arr, "x"), D.create(arr, "y"));
|
|
18
|
+
* arr.pop(); // Element "y" gets disposed.
|
|
19
|
+
* arr.dispose(); // Element "x" gets disposed.
|
|
20
|
+
* ```
|
|
18
21
|
*
|
|
19
|
-
*
|
|
20
|
-
* arr.push(D.create(arr, "x"), D.create(arr, "y"));
|
|
21
|
-
* arr.pop(); // Element "y" gets disposed.
|
|
22
|
-
* arr.dispose(); // Element "x" gets disposed.
|
|
23
|
-
*
|
|
24
|
-
* const values = obsArray<string>();
|
|
25
|
-
* const compArr = computedArray<D>(values, (val, i, compArr) => D.create(compArr, val));
|
|
26
|
-
* values.push("foo", "bar"); // D("foo") and D("bar") get created
|
|
27
|
-
* values.pop(); // D("bar") gets disposed.
|
|
28
|
-
* compArr.dispose(); // D("foo") gets disposed.
|
|
29
|
-
*
|
|
30
|
-
* Note that only the pattern above works: obsArray (or compArray) may only be used to take
|
|
22
|
+
* Note that only the pattern above works: `obsArray` may only be used to take
|
|
31
23
|
* ownership of those disposables that are added to it as array elements.
|
|
32
24
|
*/
|
|
33
|
-
import { setDisposeOwner } from './dispose';
|
|
34
|
-
import { BaseObservable, Observable } from './observable';
|
|
35
|
-
import { subscribe } from './subscribe';
|
|
36
|
-
/**
|
|
37
|
-
* ObsArray<T> is essentially an array-valued observable. The main difference is that it may be
|
|
38
|
-
* used as an owner for disposable array elements.
|
|
39
|
-
*/
|
|
40
25
|
export class ObsArray extends BaseObservable {
|
|
41
26
|
constructor() {
|
|
42
27
|
super(...arguments);
|
|
@@ -45,6 +30,10 @@ export class ObsArray extends BaseObservable {
|
|
|
45
30
|
addListener(callback, optContext) {
|
|
46
31
|
return super.addListener(callback, optContext);
|
|
47
32
|
}
|
|
33
|
+
/**
|
|
34
|
+
* Take ownership of an item added to this array. This should _only_ be used for array elements,
|
|
35
|
+
* not any unrelated items.
|
|
36
|
+
*/
|
|
48
37
|
autoDispose(value) {
|
|
49
38
|
if (!this._ownedItems) {
|
|
50
39
|
this._ownedItems = new Set();
|
|
@@ -52,6 +41,7 @@ export class ObsArray extends BaseObservable {
|
|
|
52
41
|
this._ownedItems.add(value);
|
|
53
42
|
return value;
|
|
54
43
|
}
|
|
44
|
+
/** @override */
|
|
55
45
|
dispose() {
|
|
56
46
|
if (this._ownedItems) {
|
|
57
47
|
for (const item of this.get()) {
|
|
@@ -63,9 +53,11 @@ export class ObsArray extends BaseObservable {
|
|
|
63
53
|
}
|
|
64
54
|
super.dispose();
|
|
65
55
|
}
|
|
56
|
+
/** @internal */
|
|
66
57
|
_setWithSplice(value, splice) {
|
|
67
58
|
return this._setWithArg(value, splice);
|
|
68
59
|
}
|
|
60
|
+
/** @internal */
|
|
69
61
|
_disposeOwned(splice) {
|
|
70
62
|
if (!this._ownedItems) {
|
|
71
63
|
return;
|
|
@@ -94,10 +86,11 @@ export class ObsArray extends BaseObservable {
|
|
|
94
86
|
}
|
|
95
87
|
}
|
|
96
88
|
/**
|
|
97
|
-
* MutableObsArray<T
|
|
98
|
-
* allow more efficient processing of such changes. It is created with obsArray<T>()
|
|
89
|
+
* `MutableObsArray<T>` adds array-like mutation methods which emit events with splice info, to
|
|
90
|
+
* allow more efficient processing of such changes. It is created with `obsArray<T>()`.
|
|
99
91
|
*/
|
|
100
92
|
export class MutableObsArray extends ObsArray {
|
|
93
|
+
/** Appends elements to the end and returns the new length (like `Array#push`). */
|
|
101
94
|
push(...args) {
|
|
102
95
|
const value = this.get();
|
|
103
96
|
const start = value.length;
|
|
@@ -105,6 +98,7 @@ export class MutableObsArray extends ObsArray {
|
|
|
105
98
|
this._setWithSplice(value, { start, numAdded: args.length, deleted: [] });
|
|
106
99
|
return newLen;
|
|
107
100
|
}
|
|
101
|
+
/** Removes and returns the last element (like `Array#pop`). */
|
|
108
102
|
pop() {
|
|
109
103
|
const value = this.get();
|
|
110
104
|
if (value.length === 0) {
|
|
@@ -114,12 +108,14 @@ export class MutableObsArray extends ObsArray {
|
|
|
114
108
|
this._setWithSplice(value, { start: value.length, numAdded: 0, deleted: [ret] });
|
|
115
109
|
return ret;
|
|
116
110
|
}
|
|
111
|
+
/** Prepends elements to the start and returns the new length (like `Array#unshift`). */
|
|
117
112
|
unshift(...args) {
|
|
118
113
|
const value = this.get();
|
|
119
114
|
const newLen = value.unshift(...args);
|
|
120
115
|
this._setWithSplice(value, { start: 0, numAdded: args.length, deleted: [] });
|
|
121
116
|
return newLen;
|
|
122
117
|
}
|
|
118
|
+
/** Removes and returns the first element (like `Array#shift`). */
|
|
123
119
|
shift() {
|
|
124
120
|
const value = this.get();
|
|
125
121
|
if (value.length === 0) {
|
|
@@ -129,6 +125,10 @@ export class MutableObsArray extends ObsArray {
|
|
|
129
125
|
this._setWithSplice(value, { start: 0, numAdded: 0, deleted: [ret] });
|
|
130
126
|
return ret;
|
|
131
127
|
}
|
|
128
|
+
/**
|
|
129
|
+
* Removes and/or inserts elements at a given index and returns the removed elements (like
|
|
130
|
+
* `Array#splice`).
|
|
131
|
+
*/
|
|
132
132
|
splice(start, deleteCount = Infinity, ...newValues) {
|
|
133
133
|
const value = this.get();
|
|
134
134
|
const len = value.length;
|
|
@@ -140,7 +140,7 @@ export class MutableObsArray extends ObsArray {
|
|
|
140
140
|
}
|
|
141
141
|
/**
|
|
142
142
|
* Creates a new MutableObsArray with an optional initial value, defaulting to the empty array.
|
|
143
|
-
* It is essentially the same as observable<T[]
|
|
143
|
+
* It is essentially the same as `observable<T[]>`, but with array-like mutation methods.
|
|
144
144
|
*/
|
|
145
145
|
export function obsArray(value = []) {
|
|
146
146
|
return new MutableObsArray(value);
|
|
@@ -152,7 +152,7 @@ function isObsArray(val) {
|
|
|
152
152
|
return Array.isArray(val.get());
|
|
153
153
|
}
|
|
154
154
|
/**
|
|
155
|
-
* See computedArray()
|
|
155
|
+
* See [`computedArray()`](#computedArray) for documentation.
|
|
156
156
|
*/
|
|
157
157
|
export class ComputedArray extends ObsArray {
|
|
158
158
|
constructor(obsArr, _mapper) {
|
|
@@ -162,6 +162,7 @@ export class ComputedArray extends ObsArray {
|
|
|
162
162
|
subscribe(obsArr, (use) => this._syncMap(obsArr)) :
|
|
163
163
|
subscribe(obsArr, (use, obsArrayValue) => { use(obsArrayValue); return this._syncMap(obsArrayValue); });
|
|
164
164
|
}
|
|
165
|
+
/** @internal */
|
|
165
166
|
dispose() {
|
|
166
167
|
this._unsync();
|
|
167
168
|
this._sub.dispose();
|
|
@@ -217,25 +218,43 @@ export class ComputedArray extends ObsArray {
|
|
|
217
218
|
}
|
|
218
219
|
}
|
|
219
220
|
/**
|
|
220
|
-
* Returns an ObsArray that maps all elements of the passed-in ObsArray through a mapper
|
|
221
|
-
* Also accepts an observable (e.g. a computed) whose value is an ObsArray
|
|
221
|
+
* Returns an `ObsArray` that maps all elements of the passed-in `ObsArray` through a mapper
|
|
222
|
+
* function. Also accepts an observable (e.g. a computed) whose value is an `ObsArray`.
|
|
223
|
+
* ```ts
|
|
224
|
+
* computedArray(obsArray, mapper)
|
|
225
|
+
* ```
|
|
222
226
|
*
|
|
223
|
-
*
|
|
227
|
+
* The result is analogous to:
|
|
228
|
+
* ```ts
|
|
229
|
+
* computed((use) => use(obsArray).map(mapper)) // for ObsArray
|
|
230
|
+
* computed((use) => use(use(obsArray)).map(mapper)) // for Observable<ObsArray>
|
|
231
|
+
* ```
|
|
224
232
|
*
|
|
225
|
-
* The
|
|
226
|
-
*
|
|
227
|
-
* computed((use) => use(obsArray).map(mapper)) // for ObsArray
|
|
228
|
-
* computed((use) => use(use(obsArray)).map(mapper)) // for Observable<ObsArray>
|
|
229
|
-
*
|
|
230
|
-
* The benefit of computedArray() is that a small change to the source array (e.g. one item
|
|
233
|
+
* The benefit of `computedArray()` is that a small change to the source array (e.g. one item
|
|
231
234
|
* added or removed), causes a small change to the mapped array, rather than a full rebuild.
|
|
232
235
|
*
|
|
233
|
-
* This is useful with an ObsArray or with an observable whose value is an ObsArray
|
|
234
|
-
* when the computed array
|
|
236
|
+
* This is useful with an `ObsArray` or with an observable whose value is an `ObsArray`, and also
|
|
237
|
+
* when the computed array's items are disposable and it owns them.
|
|
238
|
+
*
|
|
239
|
+
* There is no need or benefit to using `computedArray()` if you have a `computed()` that returns
|
|
240
|
+
* a plain array. It is specifically for the case when you want to preserve the efficiency of
|
|
241
|
+
* `ObsArray` when you map its values.
|
|
235
242
|
*
|
|
236
|
-
* Note that the mapper function is called with (item, index, array) as for a standard
|
|
237
|
-
* array.map()
|
|
243
|
+
* Note that the mapper function is called with `(item, index, array)` as for a standard
|
|
244
|
+
* `array.map()`, but that the index is only accurate at the time of the call, and will stop
|
|
238
245
|
* reflecting the true index if more items are inserted into the array later.
|
|
246
|
+
*
|
|
247
|
+
* As with `ObsArray`, a `ComputedArray` may be used with disposable elements as their owners. E.g.
|
|
248
|
+
* ```ts
|
|
249
|
+
* const values = obsArray<string>();
|
|
250
|
+
* const compArr = computedArray<D>(values, (val, i, compArr) => D.create(compArr, val));
|
|
251
|
+
* values.push("foo", "bar"); // D("foo") and D("bar") get created
|
|
252
|
+
* values.pop(); // D("bar") gets disposed.
|
|
253
|
+
* compArr.dispose(); // D("foo") gets disposed.
|
|
254
|
+
* ```
|
|
255
|
+
*
|
|
256
|
+
* Note that only the pattern above works: obsArray (or compArray) may only be used to take
|
|
257
|
+
* ownership of those disposables that are added to it as array elements.
|
|
239
258
|
*/
|
|
240
259
|
export function computedArray(obsArr, mapper) {
|
|
241
260
|
return new ComputedArray(obsArr, mapper);
|
|
@@ -253,6 +272,9 @@ export function computedArray(obsArr, mapper) {
|
|
|
253
272
|
export function makeLiveIndex(owner, obsArr, initialIndex = 0) {
|
|
254
273
|
return setDisposeOwner(owner, new LiveIndex(obsArr, initialIndex));
|
|
255
274
|
}
|
|
275
|
+
/**
|
|
276
|
+
* An Observable that represents an index into an `ObsArray`, clamped to be in the valid range.
|
|
277
|
+
*/
|
|
256
278
|
export class LiveIndex extends Observable {
|
|
257
279
|
constructor(_obsArray, initialIndex = 0) {
|
|
258
280
|
super(null);
|
|
@@ -261,16 +283,26 @@ export class LiveIndex extends Observable {
|
|
|
261
283
|
this.set(initialIndex);
|
|
262
284
|
this._listener = _obsArray.addListener(this._onArrayChange, this);
|
|
263
285
|
}
|
|
286
|
+
/**
|
|
287
|
+
* Set the index, clamping it to a valid value.
|
|
288
|
+
*/
|
|
264
289
|
set(index) {
|
|
265
290
|
// Clamp to [0, len) range of the observable array.
|
|
266
291
|
const len = this._obsArray.get().length;
|
|
267
292
|
super.set(len === 0 ? null : Math.max(0, Math.min(len - 1, index || 0)));
|
|
268
293
|
}
|
|
269
|
-
|
|
270
|
-
|
|
294
|
+
/**
|
|
295
|
+
* Turn "liveness" on or off. While set to false, the observable will not be adjusted as the
|
|
296
|
+
* array changes, except to keep it valid.
|
|
297
|
+
*
|
|
298
|
+
* @privateRemarks
|
|
299
|
+
* Note that this feature comes from a rather obscure need, and it would be better if something
|
|
300
|
+
* similar were possible without making it an explicit feature.
|
|
301
|
+
*/
|
|
271
302
|
setLive(value) {
|
|
272
303
|
this._isLive = value;
|
|
273
304
|
}
|
|
305
|
+
/** @override */
|
|
274
306
|
dispose() {
|
|
275
307
|
this._listener.dispose();
|
|
276
308
|
super.dispose();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"obsArray.js","sourceRoot":"","sources":["../../../lib/obsArray.ts"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"obsArray.js","sourceRoot":"","sources":["../../../lib/obsArray.ts"],"names":[],"mappings":"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"}
|
|
@@ -24,10 +24,11 @@ import { compute } from './_computed_queue';
|
|
|
24
24
|
import { setDisposeOwner } from './dispose';
|
|
25
25
|
import { Emitter } from './emit';
|
|
26
26
|
export { bundleChanges } from './_computed_queue';
|
|
27
|
+
/**
|
|
28
|
+
* Base class for several variants of observable values.
|
|
29
|
+
*/
|
|
27
30
|
export class BaseObservable {
|
|
28
|
-
|
|
29
|
-
* Internal constructor for an Observable. You should use observable() function instead.
|
|
30
|
-
*/
|
|
31
|
+
// Internal constructor for an Observable. You should use observable() function instead.
|
|
31
32
|
constructor(value) {
|
|
32
33
|
this._onChange = new Emitter();
|
|
33
34
|
this._value = value;
|
|
@@ -35,13 +36,13 @@ export class BaseObservable {
|
|
|
35
36
|
/**
|
|
36
37
|
* Returns the value of the observable. It is fast and does not create a subscription.
|
|
37
38
|
* (It is similar to knockout's peek()).
|
|
38
|
-
* @returns
|
|
39
|
+
* @returns The current value of the observable.
|
|
39
40
|
*/
|
|
40
41
|
get() { return this._value; }
|
|
41
42
|
/**
|
|
42
43
|
* Sets the value of the observable. If the value differs from the previously set one, then
|
|
43
44
|
* listeners to this observable will get called with (newValue, oldValue) as arguments.
|
|
44
|
-
* @param
|
|
45
|
+
* @param value - The new value to set.
|
|
45
46
|
*/
|
|
46
47
|
set(value) {
|
|
47
48
|
if (value !== this._value) {
|
|
@@ -60,9 +61,9 @@ export class BaseObservable {
|
|
|
60
61
|
}
|
|
61
62
|
/**
|
|
62
63
|
* Adds a callback to listen to changes in the observable.
|
|
63
|
-
* @param
|
|
64
|
-
* @param
|
|
65
|
-
* @returns
|
|
64
|
+
* @param callback - Function, called on changes with (newValue, oldValue) arguments.
|
|
65
|
+
* @param optContext - Context for the function.
|
|
66
|
+
* @returns Listener object. Its dispose() method removes the callback.
|
|
66
67
|
*/
|
|
67
68
|
addListener(callback, optContext) {
|
|
68
69
|
return this._onChange.addListener(callback, optContext);
|
|
@@ -76,7 +77,7 @@ export class BaseObservable {
|
|
|
76
77
|
/**
|
|
77
78
|
* Sets a single callback to be called when a listener is added or removed. It overwrites any
|
|
78
79
|
* previously-set such callback.
|
|
79
|
-
* @param
|
|
80
|
+
* @param changeCB - Function to call after a listener is added or
|
|
80
81
|
* removed. It's called with a boolean indicating whether this observable has any listeners.
|
|
81
82
|
* Pass in `null` to unset the callback. Note that it can be called multiple times in a row
|
|
82
83
|
* with hasListeners `true`.
|
|
@@ -87,6 +88,7 @@ export class BaseObservable {
|
|
|
87
88
|
/**
|
|
88
89
|
* Used by subscriptions to keep track of dependencies. An observable that has dependnecies,
|
|
89
90
|
* such as a computed observable, would override this method.
|
|
91
|
+
* @internal
|
|
90
92
|
*/
|
|
91
93
|
_getDepItem() {
|
|
92
94
|
return null;
|
|
@@ -105,10 +107,12 @@ export class BaseObservable {
|
|
|
105
107
|
isDisposed() {
|
|
106
108
|
return this._onChange.isDisposed();
|
|
107
109
|
}
|
|
110
|
+
/** @internal */
|
|
108
111
|
_disposeOwned(arg) { }
|
|
109
112
|
/**
|
|
110
113
|
* Allow derived classes to emit change events with an additional third argument describing the
|
|
111
114
|
* change. It always emits the event without checking for value equality.
|
|
115
|
+
* @internal
|
|
112
116
|
*/
|
|
113
117
|
_setWithArg(value, arg) {
|
|
114
118
|
const prev = this._value;
|
|
@@ -118,11 +122,15 @@ export class BaseObservable {
|
|
|
118
122
|
compute();
|
|
119
123
|
}
|
|
120
124
|
}
|
|
125
|
+
/**
|
|
126
|
+
* An Observable holds a value and allows subscribing to changes.
|
|
127
|
+
*/
|
|
121
128
|
export class Observable extends BaseObservable {
|
|
122
129
|
constructor() {
|
|
123
130
|
super(...arguments);
|
|
124
131
|
this._owned = undefined;
|
|
125
132
|
}
|
|
133
|
+
/** @internal */
|
|
126
134
|
// See module-level holder() function below for documentation.
|
|
127
135
|
static holder(value) {
|
|
128
136
|
const obs = new Observable(value);
|
|
@@ -149,6 +157,7 @@ export class Observable extends BaseObservable {
|
|
|
149
157
|
this._owned = value;
|
|
150
158
|
return value;
|
|
151
159
|
}
|
|
160
|
+
/** @internal */
|
|
152
161
|
_disposeOwned() {
|
|
153
162
|
if (this._owned) {
|
|
154
163
|
this._owned.dispose();
|
|
@@ -158,24 +167,26 @@ export class Observable extends BaseObservable {
|
|
|
158
167
|
}
|
|
159
168
|
/**
|
|
160
169
|
* Creates a new Observable with the initial value of optValue if given or undefined if omitted.
|
|
161
|
-
* @param
|
|
162
|
-
* @returns
|
|
170
|
+
* @param optValue - The initial value to set.
|
|
171
|
+
* @returns The newly created observable.
|
|
163
172
|
*/
|
|
164
173
|
export function observable(value) {
|
|
165
174
|
return new Observable(value);
|
|
166
175
|
}
|
|
167
176
|
/**
|
|
168
177
|
* Creates a new Observable with an initial disposable value owned by this observable, e.g.
|
|
169
|
-
*
|
|
178
|
+
* ```
|
|
170
179
|
* const obs = obsHolder<D>(D.create(null, ...args));
|
|
180
|
+
* ```
|
|
171
181
|
*
|
|
172
|
-
* This is needed because using simply observable<D>(value) would not cause the observable to take
|
|
182
|
+
* This is needed because using simply `observable<D>(value)` would not cause the observable to take
|
|
173
183
|
* ownership of value (i.e. to dispose it later). This function is a less hacky equivalent to:
|
|
174
|
-
*
|
|
184
|
+
* ```
|
|
175
185
|
* const obs = observable<D>(null as any);
|
|
176
186
|
* D.create(obs, ...args);
|
|
187
|
+
* ```
|
|
177
188
|
*
|
|
178
|
-
* To allow nulls, use observable<D|null>(null)
|
|
189
|
+
* To allow nulls, use `observable<D|null>(null)`; then the obsHolder() constructor is not needed.
|
|
179
190
|
*/
|
|
180
191
|
export function obsHolder(value) {
|
|
181
192
|
return Observable.holder(value);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"observable.js","sourceRoot":"","sources":["../../../lib/observable.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,OAAO,EAAC,OAAO,EAAU,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAiC,eAAe,EAAC,MAAM,WAAW,CAAC;AAC1E,OAAO,EAAC,OAAO,EAAW,MAAM,QAAQ,CAAC;AAEzC,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,MAAM,OAAO,cAAc;IAIzB
|
|
1
|
+
{"version":3,"file":"observable.js","sourceRoot":"","sources":["../../../lib/observable.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,14 +1,3 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* pureComputed.js implements a variant of computed() suitable for use with a pure read function
|
|
3
|
-
* (free of side-effects). A pureComputed is only subscribed to its dependencies when something is
|
|
4
|
-
* subscribed to it. At other times, it is not subscribed to anything, and calls to `get()` will
|
|
5
|
-
* recompute its value each time by calling its read() function.
|
|
6
|
-
*
|
|
7
|
-
* Its syntax and usage are otherwise exactly as for a computed.
|
|
8
|
-
*
|
|
9
|
-
* In addition to being cheaper when unused, a pureComputed() also avoids leaking memory when
|
|
10
|
-
* unused (since it's not registered with dependencies), so it is not necessary to dispose it.
|
|
11
|
-
*/
|
|
12
1
|
import { Observable } from './observable';
|
|
13
2
|
import { Subscription } from './subscribe';
|
|
14
3
|
function _noWrite() {
|
|
@@ -19,10 +8,19 @@ function _useFunc(obs) {
|
|
|
19
8
|
}
|
|
20
9
|
// Constant empty array, which we use to avoid allocating new read-only empty arrays.
|
|
21
10
|
const emptyArray = [];
|
|
11
|
+
/**
|
|
12
|
+
* `PureComputed` is a variant of `Computed` suitable for use with a pure read function
|
|
13
|
+
* (free of side-effects). A `PureComputed` is only subscribed to its dependencies when something is
|
|
14
|
+
* subscribed to it. At other times, it is not subscribed to anything, and calls to `get()` will
|
|
15
|
+
* recompute its value each time by calling its `read()` function.
|
|
16
|
+
*
|
|
17
|
+
* Its syntax and usage are otherwise exactly as for a `Computed`.
|
|
18
|
+
*
|
|
19
|
+
* In addition to being cheaper when unused, a `PureComputed` also avoids leaking memory when
|
|
20
|
+
* unused (since it's not registered with dependencies), so it is not necessary to dispose it.
|
|
21
|
+
*/
|
|
22
22
|
export class PureComputed extends Observable {
|
|
23
|
-
|
|
24
|
-
* Internal constructor for a PureComputed. You should use pureComputed() function instead.
|
|
25
|
-
*/
|
|
23
|
+
// Internal constructor for a PureComputed. You should use pureComputed() function instead.
|
|
26
24
|
constructor(callback, dependencies) {
|
|
27
25
|
// At initialization we force an undefined value even though it's not of type T: it's not
|
|
28
26
|
// actually used as get() is overridden.
|
|
@@ -34,10 +32,12 @@ export class PureComputed extends Observable {
|
|
|
34
32
|
this._inCall = false;
|
|
35
33
|
this.setListenerChangeCB(this._onListenerChange, this);
|
|
36
34
|
}
|
|
35
|
+
/** @internal */
|
|
37
36
|
_getDepItem() {
|
|
38
37
|
this._activate();
|
|
39
38
|
return this._sub._getDepItem();
|
|
40
39
|
}
|
|
40
|
+
/** @override */
|
|
41
41
|
get() {
|
|
42
42
|
if (!this._sub && !this._inCall) {
|
|
43
43
|
// _inCall member prevents infinite recursion.
|
|
@@ -59,7 +59,7 @@ export class PureComputed extends Observable {
|
|
|
59
59
|
/**
|
|
60
60
|
* "Sets" the value of the pure computed by calling the write() callback if one was provided in
|
|
61
61
|
* the constructor. Throws an error if there was no such callback (not a "writable" computed).
|
|
62
|
-
* @param
|
|
62
|
+
* @param value - The value to pass to the write() callback.
|
|
63
63
|
*/
|
|
64
64
|
set(value) { this._write(value); }
|
|
65
65
|
/**
|
|
@@ -100,9 +100,6 @@ export class PureComputed extends Observable {
|
|
|
100
100
|
super.set(this._callback(use, ...args));
|
|
101
101
|
}
|
|
102
102
|
}
|
|
103
|
-
/**
|
|
104
|
-
* Creates and returns a new PureComputed. The interface is identical to that of a Computed.
|
|
105
|
-
*/
|
|
106
103
|
export function pureComputed(...args) {
|
|
107
104
|
const readCb = args.pop();
|
|
108
105
|
// The cast helps ensure that Observable is compatible with ISubscribable abstraction that we use.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pureComputed.js","sourceRoot":"","sources":["../../../lib/pureComputed.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"pureComputed.js","sourceRoot":"","sources":["../../../lib/pureComputed.ts"],"names":[],"mappings":"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"}
|
package/dist/esm/lib/styled.js
CHANGED
|
@@ -1,72 +1,3 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* In-code styling for DOM components, inspired by Reacts Styled Components.
|
|
3
|
-
*
|
|
4
|
-
* Usage:
|
|
5
|
-
* const title = styled('h1', `
|
|
6
|
-
* font-size: 1.5em;
|
|
7
|
-
* text-align: center;
|
|
8
|
-
* color: palevioletred;
|
|
9
|
-
* `);
|
|
10
|
-
*
|
|
11
|
-
* const wrapper = styled('section', `
|
|
12
|
-
* padding: 4em;
|
|
13
|
-
* background: papayawhip;
|
|
14
|
-
* `);
|
|
15
|
-
*
|
|
16
|
-
* wrapper(title('Hello world'))
|
|
17
|
-
*
|
|
18
|
-
* This generates class names for title and wrapper, adds the styles to the document on first use,
|
|
19
|
-
* and the result is equivalent to:
|
|
20
|
-
*
|
|
21
|
-
* dom(`section.${wrapper.className}`, dom(`h1.${title.className}`, 'Hello world'));
|
|
22
|
-
*
|
|
23
|
-
* Calls to styled() should happen at the top level, at import time, in order to register all
|
|
24
|
-
* styles upfront. Actual work happens the first time a style is needed to create an element.
|
|
25
|
-
* Calling styled() elsewhere than at top level is wasteful and bad for performance.
|
|
26
|
-
*
|
|
27
|
-
* You may create a style that modifies an existing styled() or other component, e.g.
|
|
28
|
-
*
|
|
29
|
-
* const title2 = styled(title, `font-size: 1rem; color: red;`);
|
|
30
|
-
*
|
|
31
|
-
* Calling title2('Foo') becomes equivalent to dom(`h1.${title.className}.${title2.className}`).
|
|
32
|
-
*
|
|
33
|
-
* Styles may incorporate other related styles by nesting them under the main one as follows:
|
|
34
|
-
*
|
|
35
|
-
* const myButton = styled('button', `
|
|
36
|
-
* border-radius: 0.5rem;
|
|
37
|
-
* border: 1px solid grey;
|
|
38
|
-
* font-size: 1rem;
|
|
39
|
-
*
|
|
40
|
-
* &:active {
|
|
41
|
-
* background: lightblue;
|
|
42
|
-
* }
|
|
43
|
-
* &-small {
|
|
44
|
-
* font-size: 0.6rem;
|
|
45
|
-
* }
|
|
46
|
-
* `);
|
|
47
|
-
*
|
|
48
|
-
* In nested styles, ampersand (&) gets replaced with the generated .className of the main element.
|
|
49
|
-
*
|
|
50
|
-
* The resulting styled component provides a .cls() helper to simplify using prefixed classes. It
|
|
51
|
-
* behaves as dom.cls(), but prefixes the class names with the generated className of the main
|
|
52
|
-
* element. E.g. for the example above,
|
|
53
|
-
*
|
|
54
|
-
* myButton(myButton.cls('-small'), 'Test')
|
|
55
|
-
*
|
|
56
|
-
* creates a button with both the myButton style above, and the style specified under "&-small".
|
|
57
|
-
*
|
|
58
|
-
* Animations with @keyframes may be created with a unique name by using the keyframes() helper:
|
|
59
|
-
*
|
|
60
|
-
* const rotate360 = keyframes(`
|
|
61
|
-
* from { transform: rotate(0deg); }
|
|
62
|
-
* to { transform: rotate(360deg); }
|
|
63
|
-
* `);
|
|
64
|
-
*
|
|
65
|
-
* const Rotate = styled('div', `
|
|
66
|
-
* display: inline-block;
|
|
67
|
-
* animation: ${rotate360} 2s linear infinite;
|
|
68
|
-
* `);
|
|
69
|
-
*/
|
|
70
1
|
// Use the browser globals in a way that allows replacing them with mocks in tests.
|
|
71
2
|
import { G } from './browserGlobals';
|
|
72
3
|
import { dom } from './domImpl';
|
|
@@ -85,8 +16,24 @@ export function styled(creator, styles) {
|
|
|
85
16
|
cls: clsPrefix.bind(null, style.className),
|
|
86
17
|
});
|
|
87
18
|
}
|
|
88
|
-
|
|
89
|
-
|
|
19
|
+
/**
|
|
20
|
+
* Animations with `@keyframes` may be created with a unique name by using the keyframes() helper:
|
|
21
|
+
* ```ts
|
|
22
|
+
* const rotate360 = keyframes(`
|
|
23
|
+
* from { transform: rotate(0deg); }
|
|
24
|
+
* to { transform: rotate(360deg); }
|
|
25
|
+
* `);
|
|
26
|
+
*
|
|
27
|
+
* const Rotate = styled('div', `
|
|
28
|
+
* display: inline-block;
|
|
29
|
+
* animation: ${rotate360} 2s linear infinite;
|
|
30
|
+
* `);
|
|
31
|
+
* ```
|
|
32
|
+
*
|
|
33
|
+
* This function returns simply a string with the generated name. Note that keyframes do not
|
|
34
|
+
* support nesting or ampersand (&) handling, like `styled()` does, since these would be difficult
|
|
35
|
+
* and are entirely unneeded.
|
|
36
|
+
*/
|
|
90
37
|
export function keyframes(styles) {
|
|
91
38
|
return (new KeyframePiece(styles)).className;
|
|
92
39
|
}
|
|
@@ -109,12 +56,6 @@ function getNextStyleNum() {
|
|
|
109
56
|
return g._grainNextStyleNum = (g._grainNextStyleNum || 0) + 1;
|
|
110
57
|
}
|
|
111
58
|
class StylePiece {
|
|
112
|
-
constructor(_styles) {
|
|
113
|
-
this._styles = _styles;
|
|
114
|
-
this._mounted = false;
|
|
115
|
-
this.className = StylePiece._nextClassName();
|
|
116
|
-
StylePiece._unmounted.add(this);
|
|
117
|
-
}
|
|
118
59
|
// Generate a new css class name. The suffix ensures that names like "&2" can't cause a conflict.
|
|
119
60
|
static _nextClassName() { return `_grain${getNextStyleNum()}_`; }
|
|
120
61
|
// Mount all unmounted StylePieces, and clear the _unmounted map.
|
|
@@ -126,6 +67,12 @@ class StylePiece {
|
|
|
126
67
|
}
|
|
127
68
|
this._unmounted.clear();
|
|
128
69
|
}
|
|
70
|
+
constructor(_styles) {
|
|
71
|
+
this._styles = _styles;
|
|
72
|
+
this._mounted = false;
|
|
73
|
+
this.className = StylePiece._nextClassName();
|
|
74
|
+
StylePiece._unmounted.add(this);
|
|
75
|
+
}
|
|
129
76
|
addToElem(elem) {
|
|
130
77
|
if (!this._mounted) {
|
|
131
78
|
StylePiece._mountAll();
|