@runopencode/rx-stencil 0.4.4 → 0.5.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.
Files changed (161) hide show
  1. package/dist/cjs/{index-CbERigo8.js → index-DWhjpI-K.js} +396 -41
  2. package/dist/{esm/set-property-CpZKE-Xu.js → cjs/index-Dssn3hdS.js} +2 -61
  3. package/dist/cjs/index.cjs.js +280 -244
  4. package/dist/cjs/loader.cjs.js +2 -2
  5. package/dist/cjs/mutation-observable-qY7nC854.js +152 -0
  6. package/dist/cjs/properties-observable-DXbVBslA.js +23 -0
  7. package/dist/cjs/property-observable-CPp5WEjC.js +86 -0
  8. package/dist/cjs/rx-async.cjs.entry.js +21 -14
  9. package/dist/cjs/rx-stencil.cjs.js +3 -3
  10. package/dist/cjs/schedule-render-DG4hFv5E.js +53 -0
  11. package/dist/cjs/set-property-C3KARzdl.js +33 -0
  12. package/dist/cjs/stencil-uD4ZIy1h.js +75 -0
  13. package/dist/cjs/test-properties-observable.cjs.entry.js +27 -0
  14. package/dist/cjs/test-property-observable.cjs.entry.js +31 -0
  15. package/dist/cjs/test-schedule-render.cjs.entry.js +28 -0
  16. package/dist/cjs/test-view-child-observable-shadow-dom.cjs.entry.js +40 -0
  17. package/dist/cjs/until-disconnected-BTCr-3q2.js +27 -0
  18. package/dist/collection/collection-manifest.json +9 -2
  19. package/dist/collection/components/async/async.js +42 -10
  20. package/dist/collection/components/index.js +1 -1
  21. package/dist/collection/rx/decorator/content-child.js +34 -0
  22. package/dist/collection/rx/decorator/content-children.js +34 -0
  23. package/dist/collection/rx/decorator/index.js +6 -2
  24. package/dist/collection/rx/decorator/query-selector-all.js +6 -38
  25. package/dist/collection/rx/decorator/query-selector.js +6 -51
  26. package/dist/collection/rx/decorator/view-child.js +34 -0
  27. package/dist/collection/rx/decorator/view-children.js +34 -0
  28. package/dist/collection/rx/index.js +1 -0
  29. package/dist/collection/rx/observable/connected-observable.js +27 -0
  30. package/dist/collection/rx/observable/content-child-observable.js +24 -0
  31. package/dist/collection/rx/observable/content-children-observable.js +15 -0
  32. package/dist/collection/rx/observable/from-event.js +26 -0
  33. package/dist/collection/rx/observable/index.js +9 -4
  34. package/dist/collection/rx/observable/mutation-observable.js +6 -0
  35. package/dist/collection/rx/observable/properties-observable.js +5 -0
  36. package/dist/collection/rx/observable/property-observable.js +72 -17
  37. package/dist/collection/rx/observable/render-observable.js +18 -9
  38. package/dist/collection/rx/observable/view-child-observable.js +30 -0
  39. package/dist/collection/rx/observable/view-children-observable.js +21 -0
  40. package/dist/collection/rx/operator/index.js +4 -3
  41. package/dist/collection/rx/operator/to-property.js +7 -7
  42. package/dist/collection/rx/operator/until-disconnected.js +12 -94
  43. package/dist/collection/rx/operator/while-connected.js +39 -0
  44. package/dist/collection/rx/subscriber/index.js +1 -1
  45. package/dist/collection/rx/subscriber/set-property.js +13 -0
  46. package/dist/collection/rx/types.js +1 -0
  47. package/dist/collection/tests/rx/observable/from-event/test-from-event.component.js +30 -0
  48. package/dist/collection/tests/rx/observable/properties-observable/test-properties-observable.component.js +85 -0
  49. package/dist/collection/tests/rx/observable/property-observable/test-property-observable.component.js +47 -0
  50. package/dist/collection/tests/rx/observable/render-observable.unit.js +38 -0
  51. package/dist/collection/tests/rx/observable/view-child-observable/test-view-child-observable-shadow-dom.component.js +96 -0
  52. package/dist/collection/tests/rx/operator/schedule-render/test-schedule-render.component.js +42 -0
  53. package/dist/collection/tests/rx/operator/to-property.unit.js +28 -0
  54. package/dist/collection/tests/rx/operator/until-disconnected.unit.js +25 -0
  55. package/dist/collection/tests/rx/operator/while-connected/test-while-connected.component.js +32 -0
  56. package/dist/collection/tests/rx/subscriber/set-property.unit.js +53 -0
  57. package/dist/collection/utils/decorator.js +33 -0
  58. package/dist/collection/utils/index.js +1 -1
  59. package/dist/collection/utils/rxjs.js +67 -0
  60. package/dist/collection/utils/stencil.js +66 -0
  61. package/dist/collection/utils/values-registry.js +40 -0
  62. package/dist/components/index.js +1 -1
  63. package/dist/components/index2.js +1 -0
  64. package/dist/components/mutation-observable.js +1 -0
  65. package/dist/components/properties-observable.js +1 -0
  66. package/dist/components/property-observable.js +1 -0
  67. package/dist/components/rx-async.js +1 -1
  68. package/dist/components/schedule-render.js +1 -0
  69. package/dist/components/set-property.js +1 -1
  70. package/dist/components/stencil.js +1 -0
  71. package/dist/components/test-properties-observable.d.ts +11 -0
  72. package/dist/components/test-properties-observable.js +1 -0
  73. package/dist/components/test-property-observable.d.ts +11 -0
  74. package/dist/components/test-property-observable.js +1 -0
  75. package/dist/components/test-schedule-render.d.ts +11 -0
  76. package/dist/components/test-schedule-render.js +1 -0
  77. package/dist/components/test-view-child-observable-shadow-dom.d.ts +11 -0
  78. package/dist/components/test-view-child-observable-shadow-dom.js +1 -0
  79. package/dist/components/until-disconnected.js +1 -0
  80. package/dist/esm/{index-BIBww8qU.js → index-BCGlW-2C.js} +396 -42
  81. package/dist/{cjs/set-property-BZHuI0P5.js → esm/index-Bn8mRT4P.js} +1 -67
  82. package/dist/esm/index.js +266 -240
  83. package/dist/esm/loader.js +3 -3
  84. package/dist/esm/mutation-observable-xA7xgk29.js +145 -0
  85. package/dist/esm/properties-observable-Bzq-rZ4c.js +21 -0
  86. package/dist/esm/property-observable-BKyQe0OR.js +84 -0
  87. package/dist/esm/rx-async.entry.js +18 -11
  88. package/dist/esm/rx-stencil.js +4 -4
  89. package/dist/esm/schedule-render-BGCI5FMG.js +50 -0
  90. package/dist/esm/set-property-CgrvJ28c.js +31 -0
  91. package/dist/esm/stencil-BQCAKjCT.js +68 -0
  92. package/dist/esm/test-properties-observable.entry.js +25 -0
  93. package/dist/esm/test-property-observable.entry.js +29 -0
  94. package/dist/esm/test-schedule-render.entry.js +26 -0
  95. package/dist/esm/test-view-child-observable-shadow-dom.entry.js +38 -0
  96. package/dist/esm/until-disconnected-D2pF81SM.js +25 -0
  97. package/dist/rx-stencil/index.esm.js +1 -1
  98. package/dist/rx-stencil/p-7c570c65.entry.js +1 -0
  99. package/dist/rx-stencil/p-BCGlW-2C.js +3 -0
  100. package/dist/rx-stencil/p-BLLg2g3n.js +1 -0
  101. package/dist/rx-stencil/p-BQCAKjCT.js +1 -0
  102. package/dist/rx-stencil/p-Bn8mRT4P.js +1 -0
  103. package/dist/rx-stencil/p-D1zETqVV.js +1 -0
  104. package/dist/rx-stencil/p-DHIVm3-O.js +1 -0
  105. package/dist/rx-stencil/p-J0xLdrjW.js +1 -0
  106. package/dist/rx-stencil/p-Sf5sf4Pq.js +1 -0
  107. package/dist/rx-stencil/p-a4c71f45.entry.js +1 -0
  108. package/dist/rx-stencil/p-b2c6ba01.entry.js +1 -0
  109. package/dist/rx-stencil/p-dc654207.entry.js +1 -0
  110. package/dist/rx-stencil/p-e661490a.entry.js +1 -0
  111. package/dist/rx-stencil/p-wVeMJABH.js +1 -0
  112. package/dist/rx-stencil/rx-stencil.esm.js +1 -1
  113. package/dist/types/components/async/async.d.ts +9 -2
  114. package/dist/types/components/index.d.ts +1 -1
  115. package/dist/types/components.d.ts +92 -2
  116. package/dist/types/rx/decorator/content-child.d.ts +3 -0
  117. package/dist/types/rx/decorator/content-children.d.ts +3 -0
  118. package/dist/types/rx/decorator/index.d.ts +6 -2
  119. package/dist/types/rx/decorator/query-selector-all.d.ts +7 -21
  120. package/dist/types/rx/decorator/query-selector.d.ts +7 -29
  121. package/dist/types/rx/decorator/view-child.d.ts +27 -0
  122. package/dist/types/rx/decorator/view-children.d.ts +11 -0
  123. package/dist/types/rx/index.d.ts +1 -0
  124. package/dist/types/rx/observable/connected-observable.d.ts +9 -0
  125. package/dist/types/rx/observable/content-child-observable.d.ts +5 -0
  126. package/dist/types/rx/observable/content-children-observable.d.ts +5 -0
  127. package/dist/types/rx/observable/from-event.d.ts +26 -0
  128. package/dist/types/rx/observable/index.d.ts +9 -4
  129. package/dist/types/rx/observable/mutation-observable.d.ts +6 -0
  130. package/dist/types/rx/observable/properties-observable.d.ts +5 -0
  131. package/dist/types/rx/observable/property-observable.d.ts +1 -1
  132. package/dist/types/rx/observable/render-observable.d.ts +6 -1
  133. package/dist/types/rx/observable/view-child-observable.d.ts +17 -0
  134. package/dist/types/rx/observable/view-children-observable.d.ts +5 -0
  135. package/dist/types/rx/operator/index.d.ts +4 -3
  136. package/dist/types/rx/operator/to-property.d.ts +1 -3
  137. package/dist/types/rx/operator/while-connected.d.ts +22 -0
  138. package/dist/types/rx/subscriber/index.d.ts +1 -1
  139. package/dist/types/rx/subscriber/set-property.d.ts +13 -0
  140. package/dist/types/rx/types.d.ts +12 -0
  141. package/dist/types/stencil-public-runtime.d.ts +74 -55
  142. package/dist/types/tests/rx/observable/properties-observable/test-properties-observable.component.d.ts +9 -0
  143. package/dist/types/tests/rx/observable/property-observable/test-property-observable.component.d.ts +8 -0
  144. package/dist/types/tests/rx/observable/render-observable.unit.d.ts +1 -0
  145. package/dist/types/tests/rx/observable/view-child-observable/test-view-child-observable-shadow-dom.component.d.ts +12 -0
  146. package/dist/types/tests/rx/operator/schedule-render/test-schedule-render.component.d.ts +7 -0
  147. package/dist/types/tests/rx/operator/to-property.unit.d.ts +1 -0
  148. package/dist/types/tests/rx/operator/until-disconnected.unit.d.ts +1 -0
  149. package/dist/types/tests/rx/subscriber/set-property.unit.d.ts +1 -0
  150. package/dist/types/utils/decorator.d.ts +11 -0
  151. package/dist/types/utils/index.d.ts +1 -1
  152. package/dist/types/utils/rxjs.d.ts +31 -0
  153. package/dist/types/utils/stencil.d.ts +54 -0
  154. package/dist/types/utils/values-registry.d.ts +10 -0
  155. package/loader/index.d.ts +1 -1
  156. package/package.json +19 -10
  157. package/dist/collection/utils/get-property-descriptor.js +0 -17
  158. package/dist/rx-stencil/p-77100dee.entry.js +0 -1
  159. package/dist/rx-stencil/p-BIBww8qU.js +0 -2
  160. package/dist/rx-stencil/p-IbpJ_cRo.js +0 -1
  161. package/dist/types/utils/get-property-descriptor.d.ts +0 -7
@@ -1,7 +1,3 @@
1
- 'use strict';
2
-
3
- var index = require('./index-CbERigo8.js');
4
-
5
1
  var cjs = {};
6
2
 
7
3
  var Observable = {};
@@ -9460,66 +9456,4 @@ function requireCjs () {
9460
9456
 
9461
9457
  var cjsExports = /*@__PURE__*/ requireCjs();
9462
9458
 
9463
- /**
9464
- * Returns property descriptor for the given property of the component.
9465
- *
9466
- * {@internal}
9467
- */
9468
- function getPropertyDescriptor(cmp, property, configurableRequired = true) {
9469
- // descriptors are defined on prototype, so we have to go one level up.
9470
- let prototype = Object.getPrototypeOf(cmp);
9471
- let descriptor = Object.getOwnPropertyDescriptor(prototype, property);
9472
- if (!descriptor) {
9473
- throw new Error(`Property "${property}" is not defined on component "${cmp.constructor.name}".`);
9474
- }
9475
- if (configurableRequired && !descriptor.configurable) {
9476
- throw new Error(`Property "${property}" is not configurable on component "${cmp.constructor.name}".`);
9477
- }
9478
- return descriptor;
9479
- }
9480
-
9481
- /**
9482
- * Returns an observable that emits property value when the component property value changes.
9483
- */
9484
- function propertyObservable(cmp, property) {
9485
- let subjectProperty = `__rx__subject_for_property__${property}__`;
9486
- if (!cmp[subjectProperty]) {
9487
- let descriptor = getPropertyDescriptor(cmp, property);
9488
- let previousSetter = descriptor.set;
9489
- let previousGetter = descriptor.get;
9490
- // we have to invoke previous getter on component instance to get the current value
9491
- let currentValue = undefined !== previousGetter ? previousGetter.call(cmp) : descriptor.value;
9492
- let subject = new cjsExports.BehaviorSubject(currentValue);
9493
- descriptor.set = function (value) {
9494
- if (previousSetter) {
9495
- previousSetter.call(this, value);
9496
- }
9497
- subject.next(value);
9498
- };
9499
- Object.defineProperty(cmp, property, descriptor);
9500
- cmp[subjectProperty] = subject;
9501
- }
9502
- return cmp[subjectProperty]
9503
- .asObservable()
9504
- .pipe(cjsExports.distinctUntilChanged());
9505
- }
9506
-
9507
- function setProperty(cmp, property, options = {}) {
9508
- let resolvedOptions = Object.assign({ scheduleRender: false, nextTick: true }, options);
9509
- return (value) => {
9510
- cmp[property] = value;
9511
- if (!resolvedOptions.scheduleRender) {
9512
- return;
9513
- }
9514
- if (!resolvedOptions.nextTick) {
9515
- index.forceUpdate(cmp);
9516
- return;
9517
- }
9518
- Promise.resolve().then(() => index.forceUpdate(cmp));
9519
- };
9520
- }
9521
-
9522
- exports.cjsExports = cjsExports;
9523
- exports.getPropertyDescriptor = getPropertyDescriptor;
9524
- exports.propertyObservable = propertyObservable;
9525
- exports.setProperty = setProperty;
9459
+ export { cjsExports as c };
package/dist/esm/index.js CHANGED
@@ -1,281 +1,307 @@
1
- import { g as getElement, f as forceUpdate } from './index-BIBww8qU.js';
2
- import { c as cjsExports, p as propertyObservable, g as getPropertyDescriptor } from './set-property-CpZKE-Xu.js';
3
- export { s as setProperty } from './set-property-CpZKE-Xu.js';
1
+ import { g as getElement } from './index-BCGlW-2C.js';
2
+ import { c as cjsExports } from './index-Bn8mRT4P.js';
3
+ import { u as usesShadowDom, i as isEmulatedViewChild, g as getHostRef } from './stencil-BQCAKjCT.js';
4
+ import { o as observeSubtree, d as distinctUntilElementChanged, a as distinctUntilElementsChanged, v as viewChildObservable, r as renderObservable } from './mutation-observable-xA7xgk29.js';
5
+ export { m as mutationObservable } from './mutation-observable-xA7xgk29.js';
6
+ export { f as fromEvent, s as scheduleRender } from './schedule-render-BGCI5FMG.js';
7
+ export { p as propertiesObservable } from './properties-observable-Bzq-rZ4c.js';
8
+ export { p as propertyObservable } from './property-observable-BKyQe0OR.js';
9
+ export { u as untilDisconnected } from './until-disconnected-D2pF81SM.js';
10
+ export { s as setProperty } from './set-property-CgrvJ28c.js';
4
11
 
5
- function mutationObservable(target, options) {
6
- return new cjsExports.Observable((observer) => {
7
- let mutation = new MutationObserver((mutations) => {
8
- observer.next(mutations);
9
- });
10
- mutation.observe(target, options);
11
- return () => {
12
- mutation.disconnect();
12
+ /**
13
+ * Operator that emits values from the source observable only
14
+ * while the component is connected to DOM.
15
+ *
16
+ * This can be useful for cases where you want to move components in and out of the DOM,
17
+ * but still want to receive values from an observable while the component is connected
18
+ * and react to them.
19
+ */
20
+ function whileConnected(cmp, options) {
21
+ return (source) => {
22
+ let element = getElement(cmp);
23
+ let reemit = (options === null || options === void 0 ? void 0 : options.reemit) || false;
24
+ if (!reemit) {
25
+ return source.pipe(cjsExports.filter(() => element.isConnected));
26
+ }
27
+ let captured = false;
28
+ let last = undefined;
29
+ let reemiter = new cjsExports.Subject();
30
+ let previousConnectedCallback = cmp.connectedCallback;
31
+ cmp.connectedCallback = function () {
32
+ previousConnectedCallback === null || previousConnectedCallback === void 0 ? void 0 : previousConnectedCallback.call(this);
33
+ if (!captured) {
34
+ return;
35
+ }
36
+ reemiter.next(last);
37
+ captured = false;
38
+ last = undefined;
13
39
  };
14
- });
40
+ return cjsExports.merge(reemiter, source.pipe(cjsExports.tap((value) => {
41
+ if (element.isConnected) {
42
+ return;
43
+ }
44
+ captured = true;
45
+ last = value;
46
+ }), cjsExports.filter(() => element.isConnected)));
47
+ };
15
48
  }
16
49
 
50
+ function applyOperators(...args) {
51
+ let [observable, cmp, options] = args;
52
+ return applyOperatorsInternal(observable, cmp, options);
53
+ }
17
54
  /**
18
- * Returns an observable that emits an array of values from the given properties.
55
+ * A TypeScript types hack to make the applyOperators function work
56
+ * with both ViewChild and ViewChildren options.
57
+ *
58
+ * @internal
19
59
  */
20
- function propertiesObservable(cmp, ...properties) {
21
- if (0 === properties.length) {
22
- throw new Error('At least one property must be specified.');
60
+ function applyOperatorsInternal(observable, cmp, options) {
61
+ if (options === null || options === void 0 ? void 0 : options.whileConnected) {
62
+ observable = observable.pipe(whileConnected(cmp, {
63
+ reemit: true,
64
+ }));
65
+ }
66
+ if (options === null || options === void 0 ? void 0 : options.filter) {
67
+ observable = observable.pipe(true === options.filter
68
+ ? cjsExports.filter((value) => {
69
+ if (Array.isArray(value) && value.length > 0) {
70
+ return true;
71
+ }
72
+ return !!value;
73
+ })
74
+ : cjsExports.filter(options.filter));
75
+ }
76
+ if (options === null || options === void 0 ? void 0 : options.cached) {
77
+ observable = observable.pipe(cjsExports.take(1));
23
78
  }
24
- return cjsExports.combineLatest(properties.map((property) => {
25
- return propertyObservable(cmp, property);
26
- }));
79
+ return observable;
27
80
  }
28
81
 
29
- /**
30
- * Returns an observable that emits when the component render()
31
- * function is called. Value will be emitted after the next
32
- * microtask (next tick).
33
- */
34
- function renderObservable(cmp) {
35
- if ('function' !== typeof cmp.render) {
36
- throw new Error('Component does not have a render function.');
82
+ let registries = new Map();
83
+ class ValuesRegistry {
84
+ constructor() {
85
+ this._observables = new WeakMap();
86
+ }
87
+ has(element, property) {
88
+ return this._observables.has(element) && this._observables.get(element).has(property);
89
+ }
90
+ get(element, property) {
91
+ var _a, _b;
92
+ return (_b = (_a = this._observables.get(element)) === null || _a === void 0 ? void 0 : _a.get(property)) === null || _b === void 0 ? void 0 : _b[0];
93
+ }
94
+ set(element, property, observable, initial) {
95
+ this.delete(element, property);
96
+ if (!this._observables.has(element)) {
97
+ this._observables.set(element, new Map());
98
+ }
99
+ this._observables.get(element).set(property, [observable, initial, undefined]);
100
+ this._observables.get(element).get(property)[2] = observable.subscribe((value) => {
101
+ this._observables.get(element).get(property)[1] = value;
102
+ });
103
+ }
104
+ delete(element, property) {
105
+ if (this._observables.has(element) && this._observables.get(element).has(property)) {
106
+ let previous = this._observables.get(element).get(property)[2];
107
+ previous === null || previous === void 0 ? void 0 : previous.unsubscribe();
108
+ this._observables.get(element).delete(property);
109
+ }
110
+ }
111
+ value(element, property) {
112
+ var _a, _b;
113
+ return (_b = (_a = this._observables.get(element)) === null || _a === void 0 ? void 0 : _a.get(property)) === null || _b === void 0 ? void 0 : _b[1];
37
114
  }
38
- return new cjsExports.Observable((subscriber) => {
39
- let previousRender = cmp.render;
40
- cmp.render = function () {
41
- Promise.resolve().then(() => {
42
- subscriber.next();
43
- });
44
- return previousRender.call(this);
45
- };
46
- return () => {
47
- cmp.render = previousRender;
48
- };
49
- });
115
+ }
116
+ function getRegistry(key) {
117
+ if (!registries.has(key)) {
118
+ registries.set(key, new ValuesRegistry());
119
+ }
120
+ return registries.get(key);
50
121
  }
51
122
 
52
- /**
53
- * Observe all sub nodes of the given node and notify
54
- * when any of them is removed and/or added.
55
- *
56
- * {@internal}
57
- */
58
- function observeSubNodes(target) {
59
- return mutationObservable(target, {
60
- subtree: true,
61
- childList: true,
62
- }).pipe(cjsExports.filter((records) => {
63
- for (let i = 0; i < records.length; i++) {
64
- if ('childList' !== records[i].type) {
65
- continue;
66
- }
67
- if (records[i].addedNodes.length || records[i].removedNodes.length) {
68
- return true;
123
+ function contentChildObservable(cmp, selector, options) {
124
+ let element = getElement(cmp);
125
+ let mutations = observeSubtree(element).pipe(cjsExports.map(() => void 0), cjsExports.startWith(void 0));
126
+ options = Object.assign({ distinct: true }, options);
127
+ // In shadow DOM, we can just listen for the mutations and query the element directly.
128
+ if (usesShadowDom(cmp)) {
129
+ return mutations.pipe(cjsExports.map(() => element.querySelector(selector)), distinctUntilElementChanged(options.distinct));
130
+ }
131
+ // When shadow DOM is emulated, we need to filter out elements that are part of the emulated view child.
132
+ return mutations.pipe(cjsExports.map(() => {
133
+ let candidates = Array.from(element.querySelectorAll(selector));
134
+ for (let i = 0; i < candidates.length; i++) {
135
+ let candidate = candidates[i];
136
+ if (!isEmulatedViewChild(candidate, element)) {
137
+ return candidate;
69
138
  }
70
139
  }
71
- return false;
72
- }), cjsExports.map(() => {
73
- /* noop */
74
- }));
140
+ return null;
141
+ }), distinctUntilElementChanged(options.distinct));
75
142
  }
76
- /**
77
- * Property decorator inspired by Angular's @ViewChild/@ContentChild.
78
- *
79
- * After each render, the decorated property will be set to the first element
80
- * matching the given selector. If no element is found, the property will be
81
- * set to null.
82
- */
83
- function QuerySelector(selector, options) {
84
- return (target, property) => {
85
- let descriptor = {
86
- set: function () {
87
- throw new Error(`Property "${property}" is read-only.`);
143
+
144
+ function ContentChild(selector, options) {
145
+ return function (cmp, property) {
146
+ let connectedCallback = cmp.connectedCallback;
147
+ cmp.connectedCallback = function () {
148
+ connectedCallback === null || connectedCallback === void 0 ? void 0 : connectedCallback.call(this);
149
+ };
150
+ let descriptor = Object.getOwnPropertyDescriptor(cmp.prototype, property) || {
151
+ configurable: true,
152
+ enumerable: true,
153
+ };
154
+ delete descriptor['value'];
155
+ delete descriptor['writable'];
156
+ Object.defineProperty(cmp, property, Object.assign(Object.assign({}, descriptor), { set(_value) {
88
157
  },
89
- get: function () {
90
- let observableProperty = `__rx__query_selector__observable__shadow_root__${(options === null || options === void 0 ? void 0 : options.shadowRoot) ? 'yes' : 'no'}__mutation_observer__${(options === null || options === void 0 ? void 0 : options.mutationObserver) ? 'yes' : 'no'}__selector__${selector}__`;
91
- if (!this[observableProperty]) {
92
- let root = (options === null || options === void 0 ? void 0 : options.shadowRoot) ? getElement(this).shadowRoot : getElement(this);
93
- let observable = (options === null || options === void 0 ? void 0 : options.mutationObserver) ? observeSubNodes(root) : renderObservable(this);
94
- this[observableProperty] = observable.pipe(cjsExports.startWith(), cjsExports.map(() => root.querySelector(selector)), cjsExports.distinctUntilChanged(), cjsExports.shareReplay(1));
158
+ get() {
159
+ let element = getElement(this);
160
+ let registry = getRegistry('@ContentChild');
161
+ if (!registry.has(element, property)) {
162
+ let observable = contentChildObservable(this, selector, options);
163
+ observable = applyOperators(observable, this, options);
164
+ registry.set(element, property, observable);
95
165
  }
96
- return this[observableProperty];
97
- },
98
- };
99
- Object.defineProperty(target, property, descriptor);
166
+ return registry.value(element, property);
167
+ } }));
100
168
  };
101
169
  }
102
170
 
103
- /**
104
- * Property decorator inspired by Angular's @ViewChild/@ContentChild.
105
- *
106
- * After each render, the decorated property will be set to the first element
107
- * matching the given selector. If no element is found, the property will be
108
- * set to null.
109
- */
110
- function QuerySelectorAll(selector, options) {
111
- return (target, property) => {
112
- let descriptor = {
113
- set: function () {
114
- throw new Error(`Property "${property}" is read-only.`);
171
+ function contentChildrenObservable(cmp, selector, options) {
172
+ let element = getElement(cmp);
173
+ let mutations = observeSubtree(element).pipe(cjsExports.map(() => void 0), cjsExports.startWith(void 0));
174
+ options = Object.assign({ distinct: true }, options);
175
+ // In shadow DOM, we can just listen for the mutations and query the element directly.
176
+ if (usesShadowDom(cmp)) {
177
+ return mutations.pipe(cjsExports.map(() => Array.from(element.querySelectorAll(selector))), distinctUntilElementsChanged(options.distinct));
178
+ }
179
+ // When shadow DOM is emulated, we need to filter out elements that are part of the emulated view child.
180
+ return mutations.pipe(cjsExports.map(() => Array.from(element.querySelectorAll(selector)).filter((candidate) => !isEmulatedViewChild(candidate, element))), distinctUntilElementsChanged(options.distinct));
181
+ }
182
+
183
+ function ContentChildren(selector, options) {
184
+ return function (cmp, property) {
185
+ let connectedCallback = cmp.connectedCallback;
186
+ cmp.connectedCallback = function () {
187
+ connectedCallback === null || connectedCallback === void 0 ? void 0 : connectedCallback.call(this);
188
+ };
189
+ let descriptor = Object.getOwnPropertyDescriptor(cmp.prototype, property) || {
190
+ configurable: true,
191
+ enumerable: true,
192
+ };
193
+ delete descriptor['value'];
194
+ delete descriptor['writable'];
195
+ Object.defineProperty(cmp, property, Object.assign(Object.assign({}, descriptor), { set(_value) {
115
196
  },
116
- get: function () {
117
- let observableProperty = `__rx__query_selector_all__observable__shadow_root__${(options === null || options === void 0 ? void 0 : options.shadowRoot) ? 'yes' : 'no'}__mutation_observer__${(options === null || options === void 0 ? void 0 : options.mutationObserver) ? 'yes' : 'no'}__selector__${selector}__`;
118
- if (!this[observableProperty]) {
119
- let root = (options === null || options === void 0 ? void 0 : options.shadowRoot) ? getElement(this).shadowRoot : getElement(this);
120
- let observable = (options === null || options === void 0 ? void 0 : options.mutationObserver) ? observeSubNodes(root) : renderObservable(this);
121
- this[observableProperty] = observable.pipe(cjsExports.startWith(), cjsExports.map(() => Array.from(root.querySelectorAll(selector))), cjsExports.distinctUntilChanged((previous, current) => {
122
- if (previous.length !== current.length) {
123
- return false;
124
- }
125
- for (let i = 0; i < previous.length; i++) {
126
- if (previous[i] !== current[i]) {
127
- return false;
128
- }
129
- }
130
- return true;
131
- }), cjsExports.shareReplay(1));
197
+ get() {
198
+ let element = getElement(cmp);
199
+ let registry = getRegistry('@ContentChildren');
200
+ if (!registry.has(element, property)) {
201
+ let observable = contentChildrenObservable(this, selector, options);
202
+ observable = applyOperators(observable, this, options);
203
+ registry.set(element, property, observable);
132
204
  }
133
- return this[observableProperty];
134
- },
135
- };
136
- Object.defineProperty(target, property, descriptor);
205
+ return registry.value(element, property);
206
+ } }));
137
207
  };
138
208
  }
139
209
 
140
- /**
141
- * Schedule a render of the component. This is useful when you
142
- * want to force a render of the component as result of changing
143
- * the values of the component which are not tracked by Stencil,
144
- * observables, for example.
145
- *
146
- * By default, the render is scheduled on the next tick, but you
147
- * can disable this behavior by passing `false` as second argument.
148
- */
149
- function scheduleRender(cmp, nextTick = true) {
150
- return (source) => {
151
- return source.pipe(cjsExports.tap(() => {
152
- if (!nextTick) {
153
- forceUpdate(cmp);
154
- return;
155
- }
156
- Promise.resolve().then(() => forceUpdate(cmp));
157
- }));
210
+ function ViewChild(selector, options) {
211
+ return function (cmp, property) {
212
+ let connectedCallback = cmp.connectedCallback;
213
+ cmp.connectedCallback = function () {
214
+ connectedCallback === null || connectedCallback === void 0 ? void 0 : connectedCallback.call(this);
215
+ };
216
+ let descriptor = Object.getOwnPropertyDescriptor(cmp.prototype, property) || {
217
+ configurable: true,
218
+ enumerable: true,
219
+ };
220
+ delete descriptor['value'];
221
+ delete descriptor['writable'];
222
+ Object.defineProperty(cmp, property, Object.assign(Object.assign({}, descriptor), { set(_value) {
223
+ },
224
+ get() {
225
+ let element = getElement(this);
226
+ let registry = getRegistry('@ViewChild');
227
+ if (!registry.has(element, property)) {
228
+ let observable = viewChildObservable(this, selector, options);
229
+ observable = applyOperators(observable, this, options);
230
+ registry.set(element, property, observable);
231
+ }
232
+ return registry.value(element, property);
233
+ } }));
158
234
  };
159
235
  }
160
236
 
161
- /**
162
- * Use this function to tap into a value stream and flush value to
163
- * component property. You may also use this function as subscription
164
- * function (function will detect that value is passed instead of
165
- * observable).
166
- */
167
- function toProperty(cmp, property) {
168
- // ensure that the property is defined on the component.
169
- getPropertyDescriptor(cmp, property);
170
- // @ts-ignore
171
- return (source) => {
172
- return source.pipe(cjsExports.tap((value) => {
173
- cmp[property] = value;
174
- }));
175
- };
237
+ function QuerySelector(selector, options) {
238
+ if ('content' === (options === null || options === void 0 ? void 0 : options.target)) {
239
+ return ContentChild(selector, options);
240
+ }
241
+ return ViewChild(selector, options);
176
242
  }
177
243
 
178
- /**
179
- * A map of component observables that are being watched for
180
- * disconnect callback invocation. A weak map is being used
181
- * so that the component instance can be garbage collected.
182
- *
183
- * {@internal}
184
- */
185
- let disconnectObservables = new WeakMap();
186
- /**
187
- * Creates an observable that emits a value when the component
188
- * is disconnected from DOM and method `disconnectedCallback()`
189
- * is invoked. StencilJS will supress the invocation of this
190
- * method if it is not defined on the component.
191
- *
192
- * {@internal}
193
- */
194
- let createUsingDisconnectedCallback = function (cmp) {
195
- let previousDisconnected = cmp.disconnectedCallback;
196
- if (!previousDisconnected) {
197
- throw new Error(`Component "${cmp.constructor.name}" does not have a "disconnectedCallback()" method defined.`);
198
- }
199
- let disconnectedSubject$ = new cjsExports.Subject();
200
- cmp.disconnectedCallback = function () {
201
- if (previousDisconnected) {
202
- previousDisconnected.call(cmp);
203
- }
204
- disconnectedSubject$.next();
205
- };
206
- return disconnectedSubject$.asObservable();
207
- };
208
- /**
209
- * Mutation observer is our next heuristic. We will monitor parent
210
- * node of the component and emit a value when the component is
211
- * disconnected from DOM. This will only work, of course, if the
212
- * component is not the root node of the application and component
213
- * is already within DOM.
214
- *
215
- * {@internal}
216
- */
217
- let createUsingMutationObserver = function (cmp) {
244
+ function viewChildrenObservable(cmp, selector, options) {
218
245
  let element = getElement(cmp);
219
- if (null === element.parentNode) {
220
- throw new Error(`Component "${cmp.constructor.name}" is not within DOM.`);
246
+ let hostRef = getHostRef(cmp);
247
+ let rendered = renderObservable(cmp);
248
+ options = Object.assign({ distinct: true }, options);
249
+ if ((hostRef.$renderCount$ || 0) > 0) {
250
+ rendered = rendered.pipe(cjsExports.startWith(void 0));
221
251
  }
222
- return new cjsExports.Observable((observer) => {
223
- let mutationObserver = new MutationObserver((mutations) => {
224
- mutations.forEach((record) => {
225
- for (let node of Array.from(record.removedNodes)) {
226
- if (node !== element) {
227
- continue;
228
- }
229
- observer.next();
230
- observer.complete();
231
- }
232
- });
233
- });
234
- mutationObserver.observe(element.parentNode, {
235
- childList: true,
236
- subtree: true,
237
- });
238
- return () => {
239
- mutationObserver.disconnect();
240
- // we can not re-use this observable, so we have to delete it
241
- disconnectObservables.delete(cmp);
252
+ // In shadow DOM, this is quite cheap, we can query only shadow DOM and skip the light DOM.
253
+ if (usesShadowDom(cmp)) {
254
+ return rendered.pipe(cjsExports.map(() => Array.from(element.shadowRoot.querySelectorAll(selector))), distinctUntilElementsChanged(options.distinct));
255
+ }
256
+ // When shadow DOM is emulated, this is more expensive, we need to query light DOM and use elements
257
+ // which matches the selector, and it is not a child of any emulated slot node.
258
+ return rendered.pipe(cjsExports.map(() => Array.from(element.querySelectorAll(selector))), cjsExports.map((candidates) => candidates.filter((candidate) => isEmulatedViewChild(candidate, element))), distinctUntilElementsChanged(options.distinct));
259
+ }
260
+
261
+ function ViewChildren(selector, options) {
262
+ return function (cmp, property) {
263
+ let connectedCallback = cmp.connectedCallback;
264
+ cmp.connectedCallback = function () {
265
+ connectedCallback === null || connectedCallback === void 0 ? void 0 : connectedCallback.call(this);
242
266
  };
243
- });
244
- };
245
- /**
246
- * Creates an observable that emits a value when the component
247
- * is disconnected from DOM.
248
- *
249
- * {@internal}
250
- */
251
- function createDisconnectObservable(cmp) {
252
- let functions = [
253
- createUsingDisconnectedCallback,
254
- createUsingMutationObserver,
255
- ];
256
- for (let fn of functions) {
257
- try {
258
- disconnectObservables.set(cmp, fn(cmp));
259
- return;
260
- }
261
- catch (e) {
262
- // noop
263
- }
267
+ let descriptor = Object.getOwnPropertyDescriptor(cmp.prototype, property) || {
268
+ configurable: true,
269
+ enumerable: true,
270
+ };
271
+ delete descriptor['value'];
272
+ delete descriptor['writable'];
273
+ Object.defineProperty(cmp, property, Object.assign(Object.assign({}, descriptor), { set(_value) {
274
+ },
275
+ get() {
276
+ let element = getElement(cmp);
277
+ let registry = getRegistry('@ViewChildren');
278
+ if (!registry.has(element, property)) {
279
+ let observable = viewChildrenObservable(this, selector, options);
280
+ observable = applyOperators(observable, this, options);
281
+ registry.set(element, property, observable);
282
+ }
283
+ return registry.value(element, property);
284
+ } }));
285
+ };
286
+ }
287
+
288
+ function QuerySelectorAll(selector, options) {
289
+ if ('content' === (options === null || options === void 0 ? void 0 : options.target)) {
290
+ return ContentChildren(selector, options);
264
291
  }
265
- throw new Error(`Could not create disconnect observable for component "${cmp.constructor.name}".`);
292
+ return ViewChildren(selector, options);
266
293
  }
294
+
267
295
  /**
268
- * Operator that unsubscribes from the source observable when
269
- * the component is disconnected from DOM.
296
+ * Use this function to tap into a value stream and flush value to
297
+ * component property.
270
298
  */
271
- function untilDisconnected(cmp) {
299
+ function toProperty(cmp, property) {
272
300
  return (source) => {
273
- if (!disconnectObservables.has(cmp)) {
274
- createDisconnectObservable(cmp);
275
- }
276
- let disconnectObservable$ = disconnectObservables.get(cmp);
277
- return source.pipe(cjsExports.takeUntil(disconnectObservable$));
301
+ return source.pipe(cjsExports.tap((value) => {
302
+ cmp[property] = value;
303
+ }));
278
304
  };
279
305
  }
280
306
 
281
- export { QuerySelector, QuerySelectorAll, mutationObservable, propertiesObservable, propertyObservable, renderObservable, scheduleRender, toProperty, untilDisconnected };
307
+ export { ContentChild, ContentChildren, QuerySelector, QuerySelectorAll, ViewChild, ViewChildren, contentChildObservable, contentChildrenObservable, renderObservable, toProperty, viewChildObservable, viewChildrenObservable, whileConnected };
@@ -1,11 +1,11 @@
1
- import { b as bootstrapLazy } from './index-BIBww8qU.js';
2
- export { s as setNonce } from './index-BIBww8qU.js';
1
+ import { b as bootstrapLazy } from './index-BCGlW-2C.js';
2
+ export { s as setNonce } from './index-BCGlW-2C.js';
3
3
  import { g as globalScripts } from './app-globals-DQuL1Twl.js';
4
4
 
5
5
  const defineCustomElements = async (win, options) => {
6
6
  if (typeof window === 'undefined') return undefined;
7
7
  await globalScripts();
8
- return bootstrapLazy([["rx-async",[[0,"rx-async",{"value":[16]}]]]], options);
8
+ return bootstrapLazy([["rx-async",[[0,"rx-async",{"value":[16],"transform":[16],"_value":[32]}]]],["test-properties-observable",[[0,"test-properties-observable",{"foo":[1],"bar":[1],"baz":[1],"_value":[32]}]]],["test-property-observable",[[0,"test-property-observable",{"setValue":[64]}]]],["test-schedule-render",[[0,"test-schedule-render",{"increase":[64]}]]],["test-view-child-observable-shadow-dom",[[257,"test-view-child-observable-shadow-dom",{"which":[1],"getLog":[64],"clearLog":[64]}]]]], options);
9
9
  };
10
10
 
11
11
  export { defineCustomElements };