@furystack/shades 8.0.9 → 8.0.11
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/esm/services/location-service.d.ts.map +1 -1
- package/esm/services/location-service.js +26 -21
- package/esm/services/location-service.js.map +1 -1
- package/esm/services/resource-manager.js +21 -23
- package/esm/services/resource-manager.js.map +1 -1
- package/esm/services/screen-service.js +32 -31
- package/esm/services/screen-service.js.map +1 -1
- package/esm/shade.js +80 -74
- package/esm/shade.js.map +1 -1
- package/package.json +7 -7
- package/src/services/location-service.spec.ts +6 -5
- package/src/services/location-service.tsx +6 -3
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"location-service.d.ts","sourceRoot":"","sources":["../../src/services/location-service.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAClD,OAAO,EAAE,eAAe,EAAS,MAAM,kBAAkB,CAAA;AAGzD,qBACa,eAAgB,YAAW,UAAU;IACzC,OAAO;IAWd;;OAEG;IACI,qBAAqB,0BAAuD;IAEnF;;OAEG;IACI,qBAAqB,0BAAqC;IAEjE;;OAEG;IACI,uBAAuB,0BAA+C;IAEtE,mCAAmC,uBAEzC;IAEM,4BAA4B,mDAEjC;IAEK,WAAW;IAMlB,SAAgB,sBAAsB,oCAA0C;IAEhF;;;;;OAKG;IACI,cAAc,CAAC,CAAC,EAAE,GAAG,EAAE,MAAM,EAAE,YAAY,EAAE,CAAC;
|
|
1
|
+
{"version":3,"file":"location-service.d.ts","sourceRoot":"","sources":["../../src/services/location-service.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAClD,OAAO,EAAE,eAAe,EAAS,MAAM,kBAAkB,CAAA;AAGzD,qBACa,eAAgB,YAAW,UAAU;IACzC,OAAO;IAWd;;OAEG;IACI,qBAAqB,0BAAuD;IAEnF;;OAEG;IACI,qBAAqB,0BAAqC;IAEjE;;OAEG;IACI,uBAAuB,0BAA+C;IAEtE,mCAAmC,uBAEzC;IAEM,4BAA4B,mDAEjC;IAEK,WAAW;IAMlB,SAAgB,sBAAsB,oCAA0C;IAEhF;;;;;OAKG;IACI,cAAc,CAAC,CAAC,EAAE,GAAG,EAAE,MAAM,EAAE,YAAY,EAAE,CAAC;IAuBrD,OAAO,CAAC,eAAe,CAAY;IACnC,OAAO,CAAC,kBAAkB,CAAY;;CAoBvC"}
|
|
@@ -10,7 +10,7 @@ var __metadata = (this && this.__metadata) || function (k, v) {
|
|
|
10
10
|
import { ObservableValue, Trace } from '@furystack/utils';
|
|
11
11
|
import { Injectable } from '@furystack/inject';
|
|
12
12
|
import { deserializeQueryString, serializeToQueryString } from '@furystack/rest';
|
|
13
|
-
|
|
13
|
+
let LocationService = class LocationService {
|
|
14
14
|
dispose() {
|
|
15
15
|
window.removeEventListener('popstate', this.updateState);
|
|
16
16
|
window.removeEventListener('hashchange', this.updateState);
|
|
@@ -21,11 +21,28 @@ export let LocationService = class LocationService {
|
|
|
21
21
|
this.onDeserializedLocationSearchChanged.dispose();
|
|
22
22
|
this.locationDeserializerObserver.dispose();
|
|
23
23
|
}
|
|
24
|
+
/**
|
|
25
|
+
* Observable value that will be updated when the location pathname (e.g. /page/1) changes
|
|
26
|
+
*/
|
|
27
|
+
onLocationPathChanged = new ObservableValue(new URL(location.href).pathname);
|
|
28
|
+
/**
|
|
29
|
+
* Observable value that will be updated when the location hash (e.g. #hash) changes
|
|
30
|
+
*/
|
|
31
|
+
onLocationHashChanged = new ObservableValue(location.hash);
|
|
32
|
+
/**
|
|
33
|
+
* Observable value that will be updated when the location search (e.g. ?search=1) changes
|
|
34
|
+
*/
|
|
35
|
+
onLocationSearchChanged = new ObservableValue(location.search);
|
|
36
|
+
onDeserializedLocationSearchChanged = new ObservableValue(deserializeQueryString(this.onLocationSearchChanged.getValue()));
|
|
37
|
+
locationDeserializerObserver = this.onLocationSearchChanged.subscribe((search) => {
|
|
38
|
+
this.onDeserializedLocationSearchChanged.setValue(deserializeQueryString(search));
|
|
39
|
+
});
|
|
24
40
|
updateState() {
|
|
25
41
|
this.onLocationPathChanged.setValue(location.pathname);
|
|
26
42
|
this.onLocationHashChanged.setValue(location.hash);
|
|
27
43
|
this.onLocationSearchChanged.setValue(location.search);
|
|
28
44
|
}
|
|
45
|
+
searchParamObservables = new Map();
|
|
29
46
|
/**
|
|
30
47
|
*
|
|
31
48
|
* @param key The search param key (e.g. ?search=1 -> search)
|
|
@@ -33,7 +50,8 @@ export let LocationService = class LocationService {
|
|
|
33
50
|
* @returns An observable with the current value (or default value) of the search param
|
|
34
51
|
*/
|
|
35
52
|
useSearchParam(key, defaultValue) {
|
|
36
|
-
|
|
53
|
+
const existing = this.searchParamObservables.get(key);
|
|
54
|
+
if (!existing) {
|
|
37
55
|
const actualValue = this.onDeserializedLocationSearchChanged.getValue()[key] ?? defaultValue;
|
|
38
56
|
const newObservable = new ObservableValue(actualValue);
|
|
39
57
|
this.searchParamObservables.set(key, newObservable);
|
|
@@ -44,29 +62,15 @@ export let LocationService = class LocationService {
|
|
|
44
62
|
});
|
|
45
63
|
this.onDeserializedLocationSearchChanged.subscribe((search) => {
|
|
46
64
|
const value = search[key] ?? defaultValue;
|
|
47
|
-
this.searchParamObservables.get(key)?.setValue(value
|
|
65
|
+
this.searchParamObservables.get(key)?.setValue(value);
|
|
48
66
|
});
|
|
67
|
+
return newObservable;
|
|
49
68
|
}
|
|
50
|
-
return
|
|
69
|
+
return existing;
|
|
51
70
|
}
|
|
71
|
+
pushStateTracer;
|
|
72
|
+
replaceStateTracer;
|
|
52
73
|
constructor() {
|
|
53
|
-
/**
|
|
54
|
-
* Observable value that will be updated when the location pathname (e.g. /page/1) changes
|
|
55
|
-
*/
|
|
56
|
-
this.onLocationPathChanged = new ObservableValue(new URL(location.href).pathname);
|
|
57
|
-
/**
|
|
58
|
-
* Observable value that will be updated when the location hash (e.g. #hash) changes
|
|
59
|
-
*/
|
|
60
|
-
this.onLocationHashChanged = new ObservableValue(location.hash);
|
|
61
|
-
/**
|
|
62
|
-
* Observable value that will be updated when the location search (e.g. ?search=1) changes
|
|
63
|
-
*/
|
|
64
|
-
this.onLocationSearchChanged = new ObservableValue(location.search);
|
|
65
|
-
this.onDeserializedLocationSearchChanged = new ObservableValue(deserializeQueryString(this.onLocationSearchChanged.getValue()));
|
|
66
|
-
this.locationDeserializerObserver = this.onLocationSearchChanged.subscribe((search) => {
|
|
67
|
-
this.onDeserializedLocationSearchChanged.setValue(deserializeQueryString(search));
|
|
68
|
-
});
|
|
69
|
-
this.searchParamObservables = new Map();
|
|
70
74
|
window.addEventListener('popstate', () => this.updateState());
|
|
71
75
|
window.addEventListener('hashchange', () => this.updateState());
|
|
72
76
|
this.pushStateTracer = Trace.method({
|
|
@@ -87,4 +91,5 @@ LocationService = __decorate([
|
|
|
87
91
|
Injectable({ lifetime: 'singleton' }),
|
|
88
92
|
__metadata("design:paramtypes", [])
|
|
89
93
|
], LocationService);
|
|
94
|
+
export { LocationService };
|
|
90
95
|
//# sourceMappingURL=location-service.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"location-service.js","sourceRoot":"","sources":["../../src/services/location-service.tsx"],"names":[],"mappings":";;;;;;;;;AACA,OAAO,EAAE,eAAe,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAA;AACzD,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AAC9C,OAAO,EAAE,sBAAsB,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAA;AAEzE,
|
|
1
|
+
{"version":3,"file":"location-service.js","sourceRoot":"","sources":["../../src/services/location-service.tsx"],"names":[],"mappings":";;;;;;;;;AACA,OAAO,EAAE,eAAe,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAA;AACzD,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AAC9C,OAAO,EAAE,sBAAsB,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAA;AAEzE,IAAM,eAAe,GAArB,MAAM,eAAe;IACnB,OAAO;QACZ,MAAM,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,WAAW,CAAC,CAAA;QACxD,MAAM,CAAC,mBAAmB,CAAC,YAAY,EAAE,IAAI,CAAC,WAAW,CAAC,CAAA;QAC1D,IAAI,CAAC,eAAe,CAAC,OAAO,EAAE,CAAA;QAC9B,IAAI,CAAC,kBAAkB,CAAC,OAAO,EAAE,CAAA;QACjC,IAAI,CAAC,qBAAqB,CAAC,OAAO,EAAE,CAAA;QACpC,IAAI,CAAC,uBAAuB,CAAC,OAAO,EAAE,CAAA;QACtC,IAAI,CAAC,mCAAmC,CAAC,OAAO,EAAE,CAAA;QAClD,IAAI,CAAC,4BAA4B,CAAC,OAAO,EAAE,CAAA;IAC7C,CAAC;IAED;;OAEG;IACI,qBAAqB,GAAG,IAAI,eAAe,CAAC,IAAI,GAAG,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,CAAA;IAEnF;;OAEG;IACI,qBAAqB,GAAG,IAAI,eAAe,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAA;IAEjE;;OAEG;IACI,uBAAuB,GAAG,IAAI,eAAe,CAAS,QAAQ,CAAC,MAAM,CAAC,CAAA;IAEtE,mCAAmC,GAAG,IAAI,eAAe,CAC9D,sBAAsB,CAAC,IAAI,CAAC,uBAAuB,CAAC,QAAQ,EAAE,CAAC,CAChE,CAAA;IAEM,4BAA4B,GAAG,IAAI,CAAC,uBAAuB,CAAC,SAAS,CAAC,CAAC,MAAM,EAAE,EAAE;QACtF,IAAI,CAAC,mCAAmC,CAAC,QAAQ,CAAC,sBAAsB,CAAC,MAAM,CAAC,CAAC,CAAA;IACnF,CAAC,CAAC,CAAA;IAEK,WAAW;QAChB,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAA;QACtD,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAA;QAClD,IAAI,CAAC,uBAAuB,CAAC,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAA;IACxD,CAAC;IAEe,sBAAsB,GAAG,IAAI,GAAG,EAAgC,CAAA;IAEhF;;;;;OAKG;IACI,cAAc,CAAI,GAAW,EAAE,YAAe;QACnD,MAAM,QAAQ,GAAG,IAAI,CAAC,sBAAsB,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;QAErD,IAAI,CAAC,QAAQ,EAAE;YACb,MAAM,WAAW,GAAI,IAAI,CAAC,mCAAmC,CAAC,QAAQ,EAAE,CAAC,GAAG,CAAO,IAAI,YAAY,CAAA;YACnG,MAAM,aAAa,GAAG,IAAI,eAAe,CAAC,WAAW,CAAC,CAAA;YACtD,IAAI,CAAC,sBAAsB,CAAC,GAAG,CAAC,GAAG,EAAE,aAAa,CAAC,CAAA;YAEnD,aAAa,CAAC,SAAS,CAAC,CAAC,KAAK,EAAE,EAAE;gBAChC,MAAM,MAAM,GAAG,sBAAsB,CAAC,EAAE,GAAG,sBAAsB,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,KAAK,EAAE,CAAC,CAAA;gBACnG,MAAM,MAAM,GAAG,GAAG,QAAQ,CAAC,QAAQ,IAAI,MAAM,EAAE,CAAA;gBAC/C,OAAO,CAAC,SAAS,CAAC,EAAE,EAAE,EAAE,EAAE,MAAM,CAAC,CAAA;YACnC,CAAC,CAAC,CAAA;YAEF,IAAI,CAAC,mCAAmC,CAAC,SAAS,CAAC,CAAC,MAAM,EAAE,EAAE;gBAC5D,MAAM,KAAK,GAAI,MAAM,CAAC,GAAG,CAAO,IAAI,YAAY,CAAA;gBAChD,IAAI,CAAC,sBAAsB,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,QAAQ,CAAC,KAAU,CAAC,CAAA;YAC5D,CAAC,CAAC,CAAA;YACF,OAAO,aAAa,CAAA;SACrB;QACD,OAAO,QAA8B,CAAA;IACvC,CAAC;IAEO,eAAe,CAAY;IAC3B,kBAAkB,CAAY;IAEtC;QACE,MAAM,CAAC,gBAAgB,CAAC,UAAU,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,CAAA;QAC7D,MAAM,CAAC,gBAAgB,CAAC,YAAY,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,CAAA;QAE/D,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC,MAAM,CAAC;YAClC,MAAM,EAAE,OAAO;YACf,MAAM,EAAE,OAAO,CAAC,SAAS;YACzB,OAAO,EAAE,KAAK;YACd,UAAU,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE;SACrC,CAAC,CAAA;QAEF,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC,MAAM,CAAC;YACrC,MAAM,EAAE,OAAO;YACf,MAAM,EAAE,OAAO,CAAC,YAAY;YAC5B,OAAO,EAAE,KAAK;YACd,UAAU,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE;SACrC,CAAC,CAAA;IACJ,CAAC;CACF,CAAA;AA7FY,eAAe;IAD3B,UAAU,CAAC,EAAE,QAAQ,EAAE,WAAW,EAAE,CAAC;;GACzB,eAAe,CA6F3B"}
|
|
@@ -3,35 +3,33 @@ import { ObservableValue } from '@furystack/utils';
|
|
|
3
3
|
* Class for managing observables and disposables for components, based on key-value maps
|
|
4
4
|
*/
|
|
5
5
|
export class ResourceManager {
|
|
6
|
-
|
|
7
|
-
this.disposables = new Map();
|
|
8
|
-
this.observers = new Map();
|
|
9
|
-
this.useObservable = (key, observable, callback, getLast) => {
|
|
10
|
-
const alreadyUsed = this.observers.get(key);
|
|
11
|
-
if (alreadyUsed) {
|
|
12
|
-
return [alreadyUsed.observable.getValue(), alreadyUsed.observable.setValue.bind(alreadyUsed.observable)];
|
|
13
|
-
}
|
|
14
|
-
const observer = observable.subscribe(callback, getLast);
|
|
15
|
-
this.observers.set(key, observer);
|
|
16
|
-
return [observable.getValue(), observable.setValue.bind(observable)];
|
|
17
|
-
};
|
|
18
|
-
this.stateObservers = new Map();
|
|
19
|
-
this.useState = (key, initialValue, callback) => {
|
|
20
|
-
if (!this.stateObservers.has(key)) {
|
|
21
|
-
const newObservable = new ObservableValue(initialValue);
|
|
22
|
-
this.stateObservers.set(key, newObservable);
|
|
23
|
-
newObservable.subscribe(callback);
|
|
24
|
-
}
|
|
25
|
-
const observable = this.stateObservers.get(key);
|
|
26
|
-
return [observable.getValue(), observable.setValue.bind(observable)];
|
|
27
|
-
};
|
|
28
|
-
}
|
|
6
|
+
disposables = new Map();
|
|
29
7
|
useDisposable(key, factory) {
|
|
30
8
|
if (!this.disposables.has(key)) {
|
|
31
9
|
this.disposables.set(key, factory());
|
|
32
10
|
}
|
|
33
11
|
return this.disposables.get(key);
|
|
34
12
|
}
|
|
13
|
+
observers = new Map();
|
|
14
|
+
useObservable = (key, observable, callback, getLast) => {
|
|
15
|
+
const alreadyUsed = this.observers.get(key);
|
|
16
|
+
if (alreadyUsed) {
|
|
17
|
+
return [alreadyUsed.observable.getValue(), alreadyUsed.observable.setValue.bind(alreadyUsed.observable)];
|
|
18
|
+
}
|
|
19
|
+
const observer = observable.subscribe(callback, getLast);
|
|
20
|
+
this.observers.set(key, observer);
|
|
21
|
+
return [observable.getValue(), observable.setValue.bind(observable)];
|
|
22
|
+
};
|
|
23
|
+
stateObservers = new Map();
|
|
24
|
+
useState = (key, initialValue, callback) => {
|
|
25
|
+
if (!this.stateObservers.has(key)) {
|
|
26
|
+
const newObservable = new ObservableValue(initialValue);
|
|
27
|
+
this.stateObservers.set(key, newObservable);
|
|
28
|
+
newObservable.subscribe(callback);
|
|
29
|
+
}
|
|
30
|
+
const observable = this.stateObservers.get(key);
|
|
31
|
+
return [observable.getValue(), observable.setValue.bind(observable)];
|
|
32
|
+
};
|
|
35
33
|
dispose() {
|
|
36
34
|
this.disposables.forEach((r) => r.dispose());
|
|
37
35
|
this.disposables.clear();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"resource-manager.js","sourceRoot":"","sources":["../../src/services/resource-manager.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAA;AAIlD;;GAEG;AACH,MAAM,OAAO,eAAe;
|
|
1
|
+
{"version":3,"file":"resource-manager.js","sourceRoot":"","sources":["../../src/services/resource-manager.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAA;AAIlD;;GAEG;AACH,MAAM,OAAO,eAAe;IACT,WAAW,GAAG,IAAI,GAAG,EAAsB,CAAA;IAErD,aAAa,CAAuB,GAAW,EAAE,OAAgB;QACtE,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE;YAC9B,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,GAAG,EAAE,OAAO,EAAE,CAAC,CAAA;SACrC;QACD,OAAO,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,GAAG,CAAM,CAAA;IACvC,CAAC;IAEe,SAAS,GAAG,IAAI,GAAG,EAA8B,CAAA;IAE1D,aAAa,GAAG,CACrB,GAAW,EACX,UAA8B,EAC9B,QAAgC,EAChC,OAAiB,EAC4B,EAAE;QAC/C,MAAM,WAAW,GAAG,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,GAAG,CAAiC,CAAA;QAC3E,IAAI,WAAW,EAAE;YACf,OAAO,CAAC,WAAW,CAAC,UAAU,CAAC,QAAQ,EAAE,EAAE,WAAW,CAAC,UAAU,CAAC,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAA;SACzG;QACD,MAAM,QAAQ,GAAG,UAAU,CAAC,SAAS,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAA;QACxD,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,GAAG,EAAE,QAAQ,CAAC,CAAA;QACjC,OAAO,CAAC,UAAU,CAAC,QAAQ,EAAE,EAAE,UAAU,CAAC,QAAQ,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAA;IACtE,CAAC,CAAA;IAEe,cAAc,GAAG,IAAI,GAAG,EAAgC,CAAA;IAEjE,QAAQ,GAAG,CAChB,GAAW,EACX,YAAe,EACf,QAAgC,EACa,EAAE;QAC/C,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE;YACjC,MAAM,aAAa,GAAG,IAAI,eAAe,CAAI,YAAY,CAAC,CAAA;YAC1D,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,GAAG,EAAE,aAAa,CAAC,CAAA;YAC3C,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAA;SAClC;QACD,MAAM,UAAU,GAAG,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,GAAG,CAAuB,CAAA;QACrE,OAAO,CAAC,UAAU,CAAC,QAAQ,EAAE,EAAE,UAAU,CAAC,QAAQ,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAA;IACtE,CAAC,CAAA;IAEM,OAAO;QACZ,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,OAAO,EAAE,CAAC,CAAA;QAC5C,IAAI,CAAC,WAAW,CAAC,KAAK,EAAE,CAAA;QACxB,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,OAAO,EAAE,CAAC,CAAA;QAC1C,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAA;QAEtB,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,OAAO,EAAE,CAAC,CAAA;QAC/C,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,CAAA;IAC7B,CAAC;CACF"}
|
|
@@ -13,13 +13,43 @@ export const ScreenSizes = ['xs', 'sm', 'md', 'lg', 'xl'];
|
|
|
13
13
|
/**
|
|
14
14
|
* Service for handling screen size changes
|
|
15
15
|
*/
|
|
16
|
-
|
|
16
|
+
let ScreenService = class ScreenService {
|
|
17
|
+
getOrientation = () => (window.matchMedia?.('(orientation:landscape').matches ? 'landscape' : 'portrait');
|
|
18
|
+
/**
|
|
19
|
+
* The definitions of the breakpoints
|
|
20
|
+
*/
|
|
21
|
+
breakpoints = {
|
|
22
|
+
xl: { minSize: 1920 },
|
|
23
|
+
lg: { minSize: 1280 },
|
|
24
|
+
md: { minSize: 960 },
|
|
25
|
+
sm: { minSize: 600 },
|
|
26
|
+
xs: { minSize: 0 },
|
|
27
|
+
};
|
|
17
28
|
dispose() {
|
|
18
29
|
window.removeEventListener('resize', this.onResizeListener);
|
|
19
30
|
}
|
|
31
|
+
/**
|
|
32
|
+
* Observers for the current screen size. Will refresh on resize
|
|
33
|
+
*/
|
|
34
|
+
screenSize = {
|
|
35
|
+
atLeast: {
|
|
36
|
+
xs: new ObservableValue(this.screenSizeAtLeast('xs')),
|
|
37
|
+
sm: new ObservableValue(this.screenSizeAtLeast('sm')),
|
|
38
|
+
md: new ObservableValue(this.screenSizeAtLeast('md')),
|
|
39
|
+
lg: new ObservableValue(this.screenSizeAtLeast('lg')),
|
|
40
|
+
xl: new ObservableValue(this.screenSizeAtLeast('xl')),
|
|
41
|
+
},
|
|
42
|
+
};
|
|
20
43
|
screenSizeAtLeast(size) {
|
|
21
44
|
return window.innerWidth >= this.breakpoints[size].minSize;
|
|
22
45
|
}
|
|
46
|
+
/**
|
|
47
|
+
* Observable value for tracking the screen orientation
|
|
48
|
+
*/
|
|
49
|
+
orientation = new ObservableValue(this.getOrientation());
|
|
50
|
+
onResizeListener = () => {
|
|
51
|
+
this.refreshValues();
|
|
52
|
+
};
|
|
23
53
|
refreshValues() {
|
|
24
54
|
this.orientation.setValue(this.getOrientation());
|
|
25
55
|
ScreenSizes.forEach((size) => {
|
|
@@ -27,36 +57,6 @@ export let ScreenService = class ScreenService {
|
|
|
27
57
|
});
|
|
28
58
|
}
|
|
29
59
|
constructor() {
|
|
30
|
-
this.getOrientation = () => (window.matchMedia?.('(orientation:landscape').matches ? 'landscape' : 'portrait');
|
|
31
|
-
/**
|
|
32
|
-
* The definitions of the breakpoints
|
|
33
|
-
*/
|
|
34
|
-
this.breakpoints = {
|
|
35
|
-
xl: { minSize: 1920 },
|
|
36
|
-
lg: { minSize: 1280 },
|
|
37
|
-
md: { minSize: 960 },
|
|
38
|
-
sm: { minSize: 600 },
|
|
39
|
-
xs: { minSize: 0 },
|
|
40
|
-
};
|
|
41
|
-
/**
|
|
42
|
-
* Observers for the current screen size. Will refresh on resize
|
|
43
|
-
*/
|
|
44
|
-
this.screenSize = {
|
|
45
|
-
atLeast: {
|
|
46
|
-
xs: new ObservableValue(this.screenSizeAtLeast('xs')),
|
|
47
|
-
sm: new ObservableValue(this.screenSizeAtLeast('sm')),
|
|
48
|
-
md: new ObservableValue(this.screenSizeAtLeast('md')),
|
|
49
|
-
lg: new ObservableValue(this.screenSizeAtLeast('lg')),
|
|
50
|
-
xl: new ObservableValue(this.screenSizeAtLeast('xl')),
|
|
51
|
-
},
|
|
52
|
-
};
|
|
53
|
-
/**
|
|
54
|
-
* Observable value for tracking the screen orientation
|
|
55
|
-
*/
|
|
56
|
-
this.orientation = new ObservableValue(this.getOrientation());
|
|
57
|
-
this.onResizeListener = () => {
|
|
58
|
-
this.refreshValues();
|
|
59
|
-
};
|
|
60
60
|
window.addEventListener('resize', this.onResizeListener);
|
|
61
61
|
this.refreshValues();
|
|
62
62
|
}
|
|
@@ -65,4 +65,5 @@ ScreenService = __decorate([
|
|
|
65
65
|
Injectable({ lifetime: 'singleton' }),
|
|
66
66
|
__metadata("design:paramtypes", [])
|
|
67
67
|
], ScreenService);
|
|
68
|
+
export { ScreenService };
|
|
68
69
|
//# sourceMappingURL=screen-service.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"screen-service.js","sourceRoot":"","sources":["../../src/services/screen-service.ts"],"names":[],"mappings":";;;;;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AAE9C,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAA;AAElD,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAU,CAAA;AAMlE;;GAEG;AAEI,
|
|
1
|
+
{"version":3,"file":"screen-service.js","sourceRoot":"","sources":["../../src/services/screen-service.ts"],"names":[],"mappings":";;;;;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AAE9C,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAA;AAElD,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAU,CAAA;AAMlE;;GAEG;AAEI,IAAM,aAAa,GAAnB,MAAM,aAAa;IAChB,cAAc,GAAG,GAAG,EAAE,CAAC,CAAC,MAAM,CAAC,UAAU,EAAE,CAAC,wBAAwB,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,UAAU,CAAC,CAAA;IAEjH;;OAEG;IACa,WAAW,GAA+C;QACxE,EAAE,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;QACrB,EAAE,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;QACrB,EAAE,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE;QACpB,EAAE,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE;QACpB,EAAE,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE;KACnB,CAAA;IAEM,OAAO;QACZ,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAA;IAC7D,CAAC;IAED;;OAEG;IACa,UAAU,GAEtB;QACF,OAAO,EAAE;YACP,EAAE,EAAE,IAAI,eAAe,CAAU,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC;YAC9D,EAAE,EAAE,IAAI,eAAe,CAAU,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC;YAC9D,EAAE,EAAE,IAAI,eAAe,CAAU,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC;YAC9D,EAAE,EAAE,IAAI,eAAe,CAAU,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC;YAC9D,EAAE,EAAE,IAAI,eAAe,CAAU,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC;SAC/D;KACF,CAAA;IAEO,iBAAiB,CAAC,IAAgB;QACxC,OAAO,MAAM,CAAC,UAAU,IAAI,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,OAAO,CAAA;IAC5D,CAAC;IAED;;OAEG;IACI,WAAW,GAAG,IAAI,eAAe,CAA2B,IAAI,CAAC,cAAc,EAAE,CAAC,CAAA;IAEjF,gBAAgB,GAAG,GAAG,EAAE;QAC9B,IAAI,CAAC,aAAa,EAAE,CAAA;IACtB,CAAC,CAAA;IAEO,aAAa;QACnB,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC,CAAA;QAChD,WAAW,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;YAC3B,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC,CAAA;QACtE,CAAC,CAAC,CAAA;IACJ,CAAC;IAED;QACE,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAA;QACxD,IAAI,CAAC,aAAa,EAAE,CAAA;IACtB,CAAC;CACF,CAAA;AAzDY,aAAa;IADzB,UAAU,CAAC,EAAE,QAAQ,EAAE,WAAW,EAAE,CAAC;;GACzB,aAAa,CAyDzB"}
|
package/esm/shade.js
CHANGED
|
@@ -14,86 +14,14 @@ export const Shade = (o) => {
|
|
|
14
14
|
if (!existing) {
|
|
15
15
|
const ElementBase = o.elementBase || HTMLElement;
|
|
16
16
|
customElements.define(customElementName, class extends ElementBase {
|
|
17
|
-
|
|
18
|
-
super(...arguments);
|
|
19
|
-
this._renderCount = 0;
|
|
20
|
-
this.resourceManager = new ResourceManager();
|
|
21
|
-
/**
|
|
22
|
-
* @param options Options for rendering the component
|
|
23
|
-
* @returns the JSX element
|
|
24
|
-
*/
|
|
25
|
-
this.render = (options) => {
|
|
26
|
-
this._renderCount++;
|
|
27
|
-
return o.render(options);
|
|
28
|
-
};
|
|
29
|
-
/**
|
|
30
|
-
* @returns values for the current render options
|
|
31
|
-
*/
|
|
32
|
-
this.getRenderOptions = () => {
|
|
33
|
-
const renderOptions = {
|
|
34
|
-
props: this.props,
|
|
35
|
-
injector: this.injector,
|
|
36
|
-
children: this.shadeChildren,
|
|
37
|
-
element: this,
|
|
38
|
-
renderCount: this._renderCount,
|
|
39
|
-
useObservable: (key, obesrvable, callback, getLast) => this.resourceManager.useObservable(key, obesrvable, callback || (() => this.updateComponent()), getLast),
|
|
40
|
-
useState: (key, initialValue) => this.resourceManager.useState(key, initialValue, this.updateComponent.bind(this)),
|
|
41
|
-
useSearchState: (key, initialValue) => this.resourceManager.useObservable(`useSearchState-${key}`, this.injector.getInstance(LocationService).useSearchParam(key, initialValue), () => this.updateComponent()),
|
|
42
|
-
useStoredState: (key, initialValue, storageArea = localStorage) => {
|
|
43
|
-
const getFromStorage = () => {
|
|
44
|
-
const value = storageArea?.getItem(key);
|
|
45
|
-
return value ? JSON.parse(value) : initialValue;
|
|
46
|
-
};
|
|
47
|
-
const setToStorage = (value) => {
|
|
48
|
-
if (JSON.stringify(value) !== storageArea?.getItem(key)) {
|
|
49
|
-
const newValue = JSON.stringify(value);
|
|
50
|
-
storageArea?.setItem(key, newValue);
|
|
51
|
-
}
|
|
52
|
-
if (JSON.stringify(observable.getValue()) !== JSON.stringify(value)) {
|
|
53
|
-
observable.setValue(value);
|
|
54
|
-
}
|
|
55
|
-
};
|
|
56
|
-
const observable = this.resourceManager.useDisposable(`useStoredState-${key}`, () => new ObservableValue(getFromStorage()));
|
|
57
|
-
const updateFromStorageEvent = (e) => {
|
|
58
|
-
e.key === key &&
|
|
59
|
-
e.storageArea === storageArea &&
|
|
60
|
-
setToStorage((e.newValue && JSON.parse(e.newValue)) || initialValue);
|
|
61
|
-
};
|
|
62
|
-
this.resourceManager.useDisposable(`useStoredState-${key}-storage-event`, () => {
|
|
63
|
-
window.addEventListener('storage', updateFromStorageEvent);
|
|
64
|
-
const channelName = `useStoredState-broadcast-channel`;
|
|
65
|
-
const messageChannel = new BroadcastChannel(channelName);
|
|
66
|
-
messageChannel.onmessage = (e) => {
|
|
67
|
-
if (e.data.key === key) {
|
|
68
|
-
setToStorage(e.data.value);
|
|
69
|
-
}
|
|
70
|
-
};
|
|
71
|
-
const subscription = observable.subscribe((value) => {
|
|
72
|
-
messageChannel.postMessage({ key, value });
|
|
73
|
-
});
|
|
74
|
-
return {
|
|
75
|
-
dispose: () => {
|
|
76
|
-
window.removeEventListener('storage', updateFromStorageEvent);
|
|
77
|
-
subscription.dispose();
|
|
78
|
-
messageChannel.close();
|
|
79
|
-
},
|
|
80
|
-
};
|
|
81
|
-
});
|
|
82
|
-
observable.subscribe(setToStorage);
|
|
83
|
-
return this.resourceManager.useObservable(`useStoredState-${key}`, observable, () => this.updateComponent());
|
|
84
|
-
},
|
|
85
|
-
useDisposable: this.resourceManager.useDisposable.bind(this.resourceManager),
|
|
86
|
-
};
|
|
87
|
-
return renderOptions;
|
|
88
|
-
};
|
|
89
|
-
this.cleanup = undefined;
|
|
90
|
-
}
|
|
17
|
+
_renderCount = 0;
|
|
91
18
|
/**
|
|
92
19
|
* @returns the current render count
|
|
93
20
|
*/
|
|
94
21
|
getRenderCount() {
|
|
95
22
|
return this._renderCount;
|
|
96
23
|
}
|
|
24
|
+
resourceManager = new ResourceManager();
|
|
97
25
|
connectedCallback() {
|
|
98
26
|
o.onAttach?.(this.getRenderOptions());
|
|
99
27
|
this.callConstructed();
|
|
@@ -103,6 +31,82 @@ export const Shade = (o) => {
|
|
|
103
31
|
this.resourceManager.dispose();
|
|
104
32
|
this.cleanup?.();
|
|
105
33
|
}
|
|
34
|
+
/**
|
|
35
|
+
* Will be triggered when updating the external props object
|
|
36
|
+
*/
|
|
37
|
+
props;
|
|
38
|
+
/**
|
|
39
|
+
* Will be updated when on children change
|
|
40
|
+
*/
|
|
41
|
+
shadeChildren;
|
|
42
|
+
/**
|
|
43
|
+
* @param options Options for rendering the component
|
|
44
|
+
* @returns the JSX element
|
|
45
|
+
*/
|
|
46
|
+
render = (options) => {
|
|
47
|
+
this._renderCount++;
|
|
48
|
+
return o.render(options);
|
|
49
|
+
};
|
|
50
|
+
/**
|
|
51
|
+
* @returns values for the current render options
|
|
52
|
+
*/
|
|
53
|
+
getRenderOptions = () => {
|
|
54
|
+
const renderOptions = {
|
|
55
|
+
props: this.props,
|
|
56
|
+
injector: this.injector,
|
|
57
|
+
children: this.shadeChildren,
|
|
58
|
+
element: this,
|
|
59
|
+
renderCount: this._renderCount,
|
|
60
|
+
useObservable: (key, obesrvable, callback, getLast) => this.resourceManager.useObservable(key, obesrvable, callback || (() => this.updateComponent()), getLast),
|
|
61
|
+
useState: (key, initialValue) => this.resourceManager.useState(key, initialValue, this.updateComponent.bind(this)),
|
|
62
|
+
useSearchState: (key, initialValue) => this.resourceManager.useObservable(`useSearchState-${key}`, this.injector.getInstance(LocationService).useSearchParam(key, initialValue), () => this.updateComponent()),
|
|
63
|
+
useStoredState: (key, initialValue, storageArea = localStorage) => {
|
|
64
|
+
const getFromStorage = () => {
|
|
65
|
+
const value = storageArea?.getItem(key);
|
|
66
|
+
return value ? JSON.parse(value) : initialValue;
|
|
67
|
+
};
|
|
68
|
+
const setToStorage = (value) => {
|
|
69
|
+
if (JSON.stringify(value) !== storageArea?.getItem(key)) {
|
|
70
|
+
const newValue = JSON.stringify(value);
|
|
71
|
+
storageArea?.setItem(key, newValue);
|
|
72
|
+
}
|
|
73
|
+
if (JSON.stringify(observable.getValue()) !== JSON.stringify(value)) {
|
|
74
|
+
observable.setValue(value);
|
|
75
|
+
}
|
|
76
|
+
};
|
|
77
|
+
const observable = this.resourceManager.useDisposable(`useStoredState-${key}`, () => new ObservableValue(getFromStorage()));
|
|
78
|
+
const updateFromStorageEvent = (e) => {
|
|
79
|
+
e.key === key &&
|
|
80
|
+
e.storageArea === storageArea &&
|
|
81
|
+
setToStorage((e.newValue && JSON.parse(e.newValue)) || initialValue);
|
|
82
|
+
};
|
|
83
|
+
this.resourceManager.useDisposable(`useStoredState-${key}-storage-event`, () => {
|
|
84
|
+
window.addEventListener('storage', updateFromStorageEvent);
|
|
85
|
+
const channelName = `useStoredState-broadcast-channel`;
|
|
86
|
+
const messageChannel = new BroadcastChannel(channelName);
|
|
87
|
+
messageChannel.onmessage = (e) => {
|
|
88
|
+
if (e.data.key === key) {
|
|
89
|
+
setToStorage(e.data.value);
|
|
90
|
+
}
|
|
91
|
+
};
|
|
92
|
+
const subscription = observable.subscribe((value) => {
|
|
93
|
+
messageChannel.postMessage({ key, value });
|
|
94
|
+
});
|
|
95
|
+
return {
|
|
96
|
+
dispose: () => {
|
|
97
|
+
window.removeEventListener('storage', updateFromStorageEvent);
|
|
98
|
+
subscription.dispose();
|
|
99
|
+
messageChannel.close();
|
|
100
|
+
},
|
|
101
|
+
};
|
|
102
|
+
});
|
|
103
|
+
observable.subscribe(setToStorage);
|
|
104
|
+
return this.resourceManager.useObservable(`useStoredState-${key}`, observable, () => this.updateComponent());
|
|
105
|
+
},
|
|
106
|
+
useDisposable: this.resourceManager.useDisposable.bind(this.resourceManager),
|
|
107
|
+
};
|
|
108
|
+
return renderOptions;
|
|
109
|
+
};
|
|
106
110
|
/**
|
|
107
111
|
* Updates the component in the DOM.
|
|
108
112
|
*/
|
|
@@ -135,6 +139,8 @@ export const Shade = (o) => {
|
|
|
135
139
|
this.cleanup = cleanupResult;
|
|
136
140
|
}
|
|
137
141
|
}
|
|
142
|
+
cleanup = undefined;
|
|
143
|
+
_injector;
|
|
138
144
|
getInjectorFromParent() {
|
|
139
145
|
let parent = this.parentElement;
|
|
140
146
|
while (parent) {
|
package/esm/shade.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"shade.js","sourceRoot":"","sources":["../src/shade.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAA;AAElD,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE5C,OAAO,EAAE,eAAe,EAAE,MAAM,gCAAgC,CAAA;AAChE,OAAO,EAAE,eAAe,EAAE,MAAM,gCAAgC,CAAA;AA8ChE;;;;GAIG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,CAAS,CAAuB,EAAE,EAAE;IACvD,8BAA8B;IAC9B,MAAM,iBAAiB,GAAG,CAAC,CAAC,aAAa,CAAA;IAEzC,MAAM,QAAQ,GAAG,cAAc,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAA;IACtD,IAAI,CAAC,QAAQ,EAAE;QACb,MAAM,WAAW,GAAG,CAAC,CAAC,WAAW,IAAI,WAAW,CAAA;QAEhD,cAAc,CAAC,MAAM,CACnB,iBAAiB,EACjB,KAAM,SAAQ,WAAW;
|
|
1
|
+
{"version":3,"file":"shade.js","sourceRoot":"","sources":["../src/shade.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@furystack/shades",
|
|
3
|
-
"version": "8.0.
|
|
3
|
+
"version": "8.0.11",
|
|
4
4
|
"description": "Google Authentication Provider for FuryStack",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"scripts": {
|
|
@@ -38,15 +38,15 @@
|
|
|
38
38
|
"homepage": "https://github.com/furystack/furystack",
|
|
39
39
|
"devDependencies": {
|
|
40
40
|
"@types/jsdom": "^21.1.2",
|
|
41
|
-
"@types/node": "^20.5.
|
|
41
|
+
"@types/node": "^20.5.6",
|
|
42
42
|
"jsdom": "^22.1.0",
|
|
43
|
-
"typescript": "^5.
|
|
44
|
-
"vitest": "^0.34.
|
|
43
|
+
"typescript": "^5.2.2",
|
|
44
|
+
"vitest": "^0.34.3"
|
|
45
45
|
},
|
|
46
46
|
"dependencies": {
|
|
47
|
-
"@furystack/inject": "^8.0
|
|
48
|
-
"@furystack/rest": "^5.0.
|
|
49
|
-
"@furystack/utils": "^4.0.
|
|
47
|
+
"@furystack/inject": "^8.1.0",
|
|
48
|
+
"@furystack/rest": "^5.0.11",
|
|
49
|
+
"@furystack/utils": "^4.0.9",
|
|
50
50
|
"path-to-regexp": "^6.2.1",
|
|
51
51
|
"semaphore-async-await": "^1.5.1"
|
|
52
52
|
},
|
|
@@ -5,6 +5,7 @@ global.TextDecoder = TextDecoder as any
|
|
|
5
5
|
|
|
6
6
|
import { Injector } from '@furystack/inject'
|
|
7
7
|
import { using } from '@furystack/utils'
|
|
8
|
+
import { serializeValue } from '@furystack/rest'
|
|
8
9
|
import { LocationService } from './'
|
|
9
10
|
import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest'
|
|
10
11
|
|
|
@@ -74,7 +75,7 @@ describe('LocationService', () => {
|
|
|
74
75
|
it('Should return the value from the query string', () => {
|
|
75
76
|
using(new Injector(), (i) => {
|
|
76
77
|
const service = i.getInstance(LocationService)
|
|
77
|
-
history.pushState(null, '',
|
|
78
|
+
history.pushState(null, '', `/loc1?test=${serializeValue(1)}`)
|
|
78
79
|
const testSearchParam = service.useSearchParam('test', 123)
|
|
79
80
|
expect(testSearchParam.getValue()).toBe(1)
|
|
80
81
|
})
|
|
@@ -83,10 +84,10 @@ describe('LocationService', () => {
|
|
|
83
84
|
it('should update the observable value on push / replace states', () => {
|
|
84
85
|
using(new Injector(), (i) => {
|
|
85
86
|
const service = i.getInstance(LocationService)
|
|
86
|
-
history.pushState(null, '',
|
|
87
|
+
history.pushState(null, '', `/loc1?test=${serializeValue(1)}`)
|
|
87
88
|
const testSearchParam = service.useSearchParam('test', 234)
|
|
88
89
|
expect(testSearchParam.getValue()).toBe(1)
|
|
89
|
-
history.replaceState(null, '',
|
|
90
|
+
history.replaceState(null, '', `/loc1?test=${serializeValue('2')}`)
|
|
90
91
|
expect(testSearchParam.getValue()).toBe('2')
|
|
91
92
|
})
|
|
92
93
|
})
|
|
@@ -94,10 +95,10 @@ describe('LocationService', () => {
|
|
|
94
95
|
it('Should update the URL based on search value change', () => {
|
|
95
96
|
using(new Injector(), (i) => {
|
|
96
97
|
const service = i.getInstance(LocationService)
|
|
97
|
-
history.pushState(null, '',
|
|
98
|
+
history.pushState(null, '', `/loc1?test=${serializeValue('2')}`)
|
|
98
99
|
const testSearchParam = service.useSearchParam('test', '')
|
|
99
100
|
testSearchParam.setValue('2')
|
|
100
|
-
expect(location.search).toBe('?test=
|
|
101
|
+
expect(location.search).toBe('?test=IjIi')
|
|
101
102
|
})
|
|
102
103
|
})
|
|
103
104
|
})
|
|
@@ -53,7 +53,9 @@ export class LocationService implements Disposable {
|
|
|
53
53
|
* @returns An observable with the current value (or default value) of the search param
|
|
54
54
|
*/
|
|
55
55
|
public useSearchParam<T>(key: string, defaultValue: T) {
|
|
56
|
-
|
|
56
|
+
const existing = this.searchParamObservables.get(key)
|
|
57
|
+
|
|
58
|
+
if (!existing) {
|
|
57
59
|
const actualValue = (this.onDeserializedLocationSearchChanged.getValue()[key] as T) ?? defaultValue
|
|
58
60
|
const newObservable = new ObservableValue(actualValue)
|
|
59
61
|
this.searchParamObservables.set(key, newObservable)
|
|
@@ -66,10 +68,11 @@ export class LocationService implements Disposable {
|
|
|
66
68
|
|
|
67
69
|
this.onDeserializedLocationSearchChanged.subscribe((search) => {
|
|
68
70
|
const value = (search[key] as T) ?? defaultValue
|
|
69
|
-
this.searchParamObservables.get(key)?.setValue(
|
|
71
|
+
this.searchParamObservables.get(key)?.setValue(value as T)
|
|
70
72
|
})
|
|
73
|
+
return newObservable
|
|
71
74
|
}
|
|
72
|
-
return
|
|
75
|
+
return existing as ObservableValue<T>
|
|
73
76
|
}
|
|
74
77
|
|
|
75
78
|
private pushStateTracer: Disposable
|