@runopencode/rx-stencil 0.4.4 → 0.5.0

package/dist/collection/tests/rx/operator/to-property.unit.js

@@ -0,0 +1,28 @@
+import { describe, it, expect, } from "@stencil/vitest";
+import { Subject } from "rxjs";
+import { toProperty } from "../../../rx";
+describe('toProperty()', () => {
+    it('Streams value into property.', async () => {
+        let cmp = new ComponentMockWithProperty();
+        let subject = new Subject();
+        subject.pipe(toProperty(cmp, 'foo')).subscribe();
+        expect(cmp.foo).toBe('');
+        subject.next('bar');
+        expect(cmp.foo).toBe('bar');
+    });
+    it('Streams value into property which is not defined.', () => {
+        let cmp = new ComponentMockWithoutProperty();
+        let subject = new Subject();
+        subject.pipe(toProperty(cmp, 'foo')).subscribe();
+        expect(cmp.foo).toBe(undefined);
+        subject.next('bar');
+        expect(cmp.foo).toBe('bar');
+    });
+});
+class ComponentMockWithoutProperty {
+}
+class ComponentMockWithProperty {
+    constructor() {
+        this.foo = '';
+    }
+}

package/dist/collection/tests/rx/operator/until-disconnected.unit.js

@@ -0,0 +1,25 @@
+import { describe, it, expect, } from "@stencil/vitest";
+import { Subject } from "rxjs";
+import { untilDisconnected } from "../../../rx";
+describe('untilDisconnected()', () => {
+    it('Emits until disconnected.', async () => {
+        let cmp = new ComponentMock();
+        let observable = new Subject();
+        let values = [];
+        observable
+            .pipe(untilDisconnected(cmp))
+            .subscribe((value) => {
+            values.push(value);
+        });
+        observable.next(1);
+        observable.next(2);
+        cmp.disconnectedCallback();
+        observable.next(3);
+        expect(values).toStrictEqual([1, 2]);
+    });
+});
+class ComponentMock {
+    disconnectedCallback() {
+        // noop.
+    }
+}

package/dist/collection/tests/rx/operator/while-connected/test-while-connected.component.js

@@ -0,0 +1,32 @@
+import { Host, h, } from "@stencil/core";
+import { fromEvent, whileConnected, } from "../../../../rx";
+export class TestWhileConnectedComponent {
+    constructor() {
+        this._raw = 0;
+        this._reemitted = 0;
+    }
+    connectedCallback() {
+        fromEvent(this, 'click')
+            .pipe(whileConnected(this))
+            .subscribe(() => {
+            this._raw++;
+        });
+        fromEvent(this, 'click')
+            .pipe(whileConnected(this, {
+            reemit: true,
+        }))
+            .subscribe(() => {
+            this._reemitted++;
+        });
+    }
+    render() {
+        return (h(Host, { key: '200210990aa48a6d459121125f66cefb39984a6d' }, this._raw, "/", this._reemitted));
+    }
+    static get is() { return "test-while-connected"; }
+    static get states() {
+        return {
+            "_raw": {},
+            "_reemitted": {}
+        };
+    }
+}

package/dist/collection/tests/rx/subscriber/set-property.unit.js

@@ -0,0 +1,53 @@
+import { expect } from "@stencil/vitest";
+import { Subject } from "rxjs";
+import { describe, vi, it, beforeEach, } from "vitest";
+import { setProperty } from "../../../rx";
+vi.mock('@stencil/core', () => ({
+    forceUpdate: vi.fn(() => void 0),
+}));
+import { forceUpdate } from "@stencil/core";
+describe('setProperty().', () => {
+    let observable;
+    let cmp;
+    beforeEach(() => {
+        observable = new Subject();
+        cmp = new ComponentMock();
+        vi.clearAllMocks();
+    });
+    it('Sets property without triggering render.', async () => {
+        observable.subscribe(setProperty(cmp, 'foo'));
+        expect(cmp.foo).toBeUndefined();
+        observable.next('bar');
+        expect(cmp.foo).toBe('bar');
+        expect(forceUpdate).not.toHaveBeenCalled();
+        await Promise.resolve();
+        expect(forceUpdate).not.toHaveBeenCalled();
+    });
+    it('Sets property with triggering render synchronously.', async () => {
+        observable.subscribe(setProperty(cmp, 'foo', {
+            scheduleRender: true,
+            nextTick: false,
+        }));
+        expect(cmp.foo).toBeUndefined();
+        observable.next('bar');
+        expect(cmp.foo).toBe('bar');
+        expect(forceUpdate).toHaveBeenCalled();
+        vi.clearAllMocks();
+        await Promise.resolve();
+        expect(forceUpdate).not.toHaveBeenCalled();
+    });
+    it('Sets property with triggering render asynchronously.', async () => {
+        observable.subscribe(setProperty(cmp, 'foo', {
+            scheduleRender: true,
+            nextTick: true,
+        }));
+        expect(cmp.foo).toBeUndefined();
+        observable.next('bar');
+        expect(cmp.foo).toBe('bar');
+        expect(forceUpdate).not.toHaveBeenCalled();
+        await Promise.resolve();
+        expect(forceUpdate).toHaveBeenCalled();
+    });
+});
+class ComponentMock {
+}

package/dist/collection/utils/decorator.js

@@ -0,0 +1,33 @@
+import { filter, take, } from "rxjs";
+import { whileConnected } from "../rx/operator/while-connected";
+export function applyOperators(...args) {
+    let [observable, cmp, options] = args;
+    return applyOperatorsInternal(observable, cmp, options);
+}
+/**
+ * A TypeScript types hack to make the applyOperators function work
+ * with both ViewChild and ViewChildren options.
+ *
+ * @internal
+ */
+function applyOperatorsInternal(observable, cmp, options) {
+    if (options === null || options === void 0 ? void 0 : options.whileConnected) {
+        observable = observable.pipe(whileConnected(cmp, {
+            reemit: true,
+        }));
+    }
+    if (options === null || options === void 0 ? void 0 : options.filter) {
+        observable = observable.pipe(true === options.filter
+            ? filter((value) => {
+                if (Array.isArray(value) && value.length > 0) {
+                    return true;
+                }
+                return !!value;
+            })
+            : filter(options.filter));
+    }
+    if (options === null || options === void 0 ? void 0 : options.cached) {
+        observable = observable.pipe(take(1));
+    }
+    return observable;
+}

package/dist/collection/utils/index.js

@@ -1 +1 @@
-export { getPropertyDescriptor } from './get-property-descriptor';
+export { getHostRef, isPropOrState, } from './stencil';

package/dist/collection/utils/rxjs.js

@@ -0,0 +1,67 @@
+import { distinctUntilChanged, filter, identity, } from "rxjs";
+import { mutationObservable, } from "../rx";
+/**
+ * Returns an RxJS operator that emits only when the element changes, based on the provided comparator function.
+ *
+ * If boolean `true` is provided, the default comparator function will be used, which compares the elements by reference.
+ *
+ * If falsy value is provided, the operator will emit every time the source observable emits.
+ *
+ * @internal
+ */
+export function distinctUntilElementChanged(comparator) {
+    if (!comparator) {
+        return identity;
+    }
+    if ('function' === typeof comparator) {
+        return distinctUntilChanged(comparator);
+    }
+    return distinctUntilChanged();
+}
+/**
+ * Returns an RxJS operator that emits only when the array of elements changes, based on the provided comparator function.
+ *
+ * If boolean `true` is provided, the default comparator function will be used, which compares the elements by reference.
+ *
+ * If falsy value is provided, the operator will emit every time the source observable emits.
+ *
+ * @internal
+ */
+export function distinctUntilElementsChanged(comparator) {
+    if (!comparator) {
+        return identity;
+    }
+    // If the comparator is a function, use it to compare elements. Otherwise, use the default comparator that compares elements by reference.
+    let cmpFn = 'function' === typeof comparator ? comparator : (previous, current) => previous === current;
+    return distinctUntilChanged((previous, current) => {
+        var _a;
+        if (previous.length !== current.length) {
+            return false;
+        }
+        return (_a = previous === null || previous === void 0 ? void 0 : previous.every((item, index) => cmpFn(item, current[index]))) !== null && _a !== void 0 ? _a : false;
+    });
+}
+/**
+ * Observe the subtree of an element for mutations.
+ *
+ * This function returns an observable that emits an array of MutationRecords whenever a mutation occurs
+ * in the subtree of the specified element.
+ *
+ * @internal
+ */
+export function observeSubtree(element) {
+    return mutationObservable(element, {
+        childList: true,
+        subtree: true,
+    }).pipe(filter((records) => {
+        for (let i = 0; i < records.length; i++) {
+            if ('childList' !== records[i].type) {
+                continue;
+            }
+            if (records[i].addedNodes.length || records[i].removedNodes.length) {
+                return true;
+            }
+        }
+        return false;
+    }));
+}

package/dist/collection/utils/stencil.js

@@ -0,0 +1,66 @@
+/**
+ * Get the host reference of a component.
+ *
+ * This is useful for accessing the underlying DOM element of a Stencil component.
+ *
+ * @internal
+ */
+export function getHostRef(cmp) {
+    return cmp.__stencil__getHostRef();
+}
+/**
+ * Check if a property is defined as a member of the component with @State or @Prop decorator.
+ *
+ * @internal
+ */
+export function isPropOrState(cmp, property) {
+    let hostRef = getHostRef(cmp);
+    return !!hostRef.$cmpMeta$.$members$[property];
+}
+/**
+ * Check if a component uses Shadow DOM.
+ *
+ * @internal
+ */
+export function usesShadowDom(cmp) {
+    let hostRef = getHostRef(cmp);
+    let flags = hostRef.$cmpMeta$.$flags$;
+    return (flags & (1 << 0)) !== 0;
+}
+/**
+ * Check if a node is an emulated view child node.
+ *
+ * We are checking if node is a child node of the component which is not
+ * in emulated slot.
+ *
+ * @internal
+ */
+export function isEmulatedViewChild(node, element) {
+    // If the node has the 's-ol' property, it is not an emulated content child.
+    if ('s-ol' in node) {
+        return false;
+    }
+    // If it is direct child of the component, it is not an emulated content child.
+    if (node.parentElement === element) {
+        return false;
+    }
+    return isEmulatedViewChild(node.parentElement, element);
+}
+/**
+ * Get the tag name of a component.
+ *
+ * @internal
+ */
+export function getComponentTagName(cmp) {
+    let hostRef = getHostRef(cmp);
+    return hostRef.$cmpMeta$.$tagName$;
+}
+/**
+ * Check if a component has been rendered at least once.
+ *
+ * @internal
+ */
+export function isRendered(cmp) {
+    let hostRef = getHostRef(cmp);
+    return (hostRef.$renderCount$ || 0) > 0;
+}

package/dist/collection/utils/values-registry.js

@@ -0,0 +1,40 @@
+let registries = new Map();
+export class ValuesRegistry {
+    constructor() {
+        this._observables = new WeakMap();
+    }
+    has(element, property) {
+        return this._observables.has(element) && this._observables.get(element).has(property);
+    }
+    get(element, property) {
+        var _a, _b;
+        return (_b = (_a = this._observables.get(element)) === null || _a === void 0 ? void 0 : _a.get(property)) === null || _b === void 0 ? void 0 : _b[0];
+    }
+    set(element, property, observable, initial) {
+        this.delete(element, property);
+        if (!this._observables.has(element)) {
+            this._observables.set(element, new Map());
+        }
+        this._observables.get(element).set(property, [observable, initial, undefined]);
+        this._observables.get(element).get(property)[2] = observable.subscribe((value) => {
+            this._observables.get(element).get(property)[1] = value;
+        });
+    }
+    delete(element, property) {
+        if (this._observables.has(element) && this._observables.get(element).has(property)) {
+            let previous = this._observables.get(element).get(property)[2];
+            previous === null || previous === void 0 ? void 0 : previous.unsubscribe();
+            this._observables.get(element).delete(property);
+        }
+    }
+    value(element, property) {
+        var _a, _b;
+        return (_b = (_a = this._observables.get(element)) === null || _a === void 0 ? void 0 : _a.get(property)) === null || _b === void 0 ? void 0 : _b[1];
+    }
+}
+export function getRegistry(key) {
+    if (!registries.has(key)) {
+        registries.set(key, new ValuesRegistry());
+    }
+    return registries.get(key);
+}

package/dist/components/index.js

@@ -1 +1 @@
-import{getElement as t,forceUpdate as e}from"@stencil/core/internal/client";export{getAssetPath,render,setAssetPath,setNonce,setPlatformOptions}from"@stencil/core/internal/client";import{c as r,p as n,g as o}from"./set-property.js";export{s as setProperty}from"./set-property.js";function i(t,e){return new r.Observable((r=>{let n=new MutationObserver((t=>{r.next(t)}));return n.observe(t,e),()=>{n.disconnect()}}))}function u(t,...e){if(0===e.length)throw Error("At least one property must be specified.");return r.combineLatest(e.map((e=>n(t,e))))}function l(t){if("function"!=typeof t.render)throw Error("Component does not have a render function.");return new r.Observable((e=>{let r=t.render;return t.render=function(){return Promise.resolve().then((()=>{e.next()})),r.call(this)},()=>{t.render=r}}))}function c(t){return i(t,{subtree:!0,childList:!0}).pipe(r.filter((t=>{for(let e=0;e<t.length;e++)if("childList"===t[e].type&&(t[e].addedNodes.length||t[e].removedNodes.length))return!0;return!1})),r.map((()=>{})))}function _(e,n){return(o,i)=>{Object.defineProperty(o,i,{set:function(){throw Error(`Property "${i}" is read-only.`)},get:function(){let o=`__rx__query_selector__observable__shadow_root__${(null==n?void 0:n.shadowRoot)?"yes":"no"}__mutation_observer__${(null==n?void 0:n.mutationObserver)?"yes":"no"}__selector__${e}__`;if(!this[o]){let i=(null==n?void 0:n.shadowRoot)?t(this).shadowRoot:t(this),s=(null==n?void 0:n.mutationObserver)?c(i):l(this);this[o]=s.pipe(r.startWith(),r.map((()=>i.querySelector(e))),r.distinctUntilChanged(),r.shareReplay(1))}return this[o]}})}}function f(e,n){return(o,i)=>{Object.defineProperty(o,i,{set:function(){throw Error(`Property "${i}" is read-only.`)},get:function(){let o=`__rx__query_selector_all__observable__shadow_root__${(null==n?void 0:n.shadowRoot)?"yes":"no"}__mutation_observer__${(null==n?void 0:n.mutationObserver)?"yes":"no"}__selector__${e}__`;if(!this[o]){let i=(null==n?void 0:n.shadowRoot)?t(this).shadowRoot:t(this),s=(null==n?void 0:n.mutationObserver)?c(i):l(this);this[o]=s.pipe(r.startWith(),r.map((()=>Array.from(i.querySelectorAll(e)))),r.distinctUntilChanged(((t,e)=>{if(t.length!==e.length)return!1;for(let r=0;r<t.length;r++)if(t[r]!==e[r])return!1;return!0})),r.shareReplay(1))}return this[o]}})}}function a(t,n=!0){return o=>o.pipe(r.tap((()=>{n?Promise.resolve().then((()=>e(t))):e(t)})))}function h(t,e){return o(t,e),n=>n.pipe(r.tap((r=>{t[e]=r})))}let d=new WeakMap,p=function(t){let e=t.disconnectedCallback;if(!e)throw Error(`Component "${t.constructor.name}" does not have a "disconnectedCallback()" method defined.`);let n=new r.Subject;return t.disconnectedCallback=function(){e&&e.call(t),n.next()},n.asObservable()},v=function(e){let n=t(e);if(null===n.parentNode)throw Error(`Component "${e.constructor.name}" is not within DOM.`);return new r.Observable((t=>{let r=new MutationObserver((e=>{e.forEach((e=>{for(let r of Array.from(e.removedNodes))r===n&&(t.next(),t.complete())}))}));return r.observe(n.parentNode,{childList:!0,subtree:!0}),()=>{r.disconnect(),d.delete(e)}}))};function y(t){return e=>{d.has(t)||function(t){let e=[p,v];for(let r of e)try{return void d.set(t,r(t))}catch(t){}throw Error(`Could not create disconnect observable for component "${t.constructor.name}".`)}(t);let n=d.get(t);return e.pipe(r.takeUntil(n))}}export{_ as QuerySelector,f as QuerySelectorAll,i as mutationObservable,u as propertiesObservable,n as propertyObservable,l as renderObservable,a as scheduleRender,h as toProperty,y as untilDisconnected}
+import{getElement as e,Build as t}from"@stencil/core/internal/client";export{getAssetPath,render,setAssetPath,setNonce,setPlatformOptions}from"@stencil/core/internal/client";import{c as n}from"./index2.js";import{u as r,i,g as o}from"./stencil.js";import{o as l,d as c,a,v as d,r as b}from"./mutation-observable.js";export{m as mutationObservable}from"./mutation-observable.js";export{f as fromEvent,s as scheduleRender}from"./schedule-render.js";export{p as propertiesObservable}from"./properties-observable.js";export{p as propertyObservable}from"./property-observable.js";export{u as untilDisconnected}from"./until-disconnected.js";export{s as setProperty}from"./set-property.js";function h(t,r){return i=>{let o=e(t);if(!(null==r?void 0:r.reemit))return i.pipe(n.filter((()=>o.isConnected)));let l,s=!1,u=new n.Subject,c=t.connectedCallback;return t.connectedCallback=function(){null==c||c.call(this),s&&(u.next(l),s=!1,l=void 0)},n.merge(u,i.pipe(n.tap((e=>{o.isConnected||(s=!0,l=e)})),n.filter((()=>o.isConnected))))}}function v(...e){let[t,r,i]=e;return function(e,t,r){return(null==r?void 0:r.whileConnected)&&(e=e.pipe(h(t,{reemit:!0}))),(null==r?void 0:r.filter)&&(e=e.pipe(n.filter(!0===r.filter?e=>!!(Array.isArray(e)&&e.length>0)||!!e:r.filter))),(null==r?void 0:r.cached)&&(e=e.pipe(n.take(1))),e}(t,r,i)}let j=new Map;class O{constructor(){this._observables=new WeakMap}has(e,t){return this._observables.has(e)&&this._observables.get(e).has(t)}get(e,t){var n,r;return null===(r=null===(n=this._observables.get(e))||void 0===n?void 0:n.get(t))||void 0===r?void 0:r[0]}set(e,t,n,r){this.delete(e,t),this._observables.has(e)||this._observables.set(e,new Map),this._observables.get(e).set(t,[n,r,void 0]),this._observables.get(e).get(t)[2]=n.subscribe((n=>{this._observables.get(e).get(t)[1]=n}))}delete(e,t){if(this._observables.has(e)&&this._observables.get(e).has(t)){let n=this._observables.get(e).get(t)[2];null==n||n.unsubscribe(),this._observables.get(e).delete(t)}}value(e,t){var n,r;return null===(r=null===(n=this._observables.get(e))||void 0===n?void 0:n.get(t))||void 0===r?void 0:r[1]}}function y(e){return j.has(e)||j.set(e,new O),j.get(e)}function g(t,o,s){let u=e(t),a=l(u).pipe(n.map((()=>{})),n.startWith(void 0));return s=Object.assign({distinct:!0},s),r(t)?a.pipe(n.map((()=>u.querySelector(o))),c(s.distinct)):a.pipe(n.map((()=>{let e=Array.from(u.querySelectorAll(o));for(let t=0;t<e.length;t++){let n=e[t];if(!i(n,u))return n}return null})),c(s.distinct))}function C(n,r){return function(i,o){let l=i.connectedCallback;i.connectedCallback=function(){null==l||l.call(this)};let s=Object.getOwnPropertyDescriptor(i.prototype,o)||{configurable:!0,enumerable:!0};delete s.value,delete s.writable,Object.defineProperty(i,o,Object.assign(Object.assign({},s),{set(e){t.isDev&&console.warn(`@ContentChild property "${o}" is read-only and cannot be set.`)},get(){let t=e(this),i=y("@ContentChild");if(!i.has(t,o)){let e=g(this,n,r);e=v(e,this,r),i.set(t,o,e)}return i.value(t,o)}}))}}function w(t,o,s){let u=e(t),c=l(u).pipe(n.map((()=>{})),n.startWith(void 0));return s=Object.assign({distinct:!0},s),r(t)?c.pipe(n.map((()=>Array.from(u.querySelectorAll(o)))),a(s.distinct)):c.pipe(n.map((()=>Array.from(u.querySelectorAll(o)).filter((e=>!i(e,u))))),a(s.distinct))}function x(n,r){return function(i,o){let l=i.connectedCallback;i.connectedCallback=function(){null==l||l.call(this)};let s=Object.getOwnPropertyDescriptor(i.prototype,o)||{configurable:!0,enumerable:!0};delete s.value,delete s.writable,Object.defineProperty(i,o,Object.assign(Object.assign({},s),{set(e){t.isDev&&console.warn(`@ContentChildren property "${o}" is read-only and cannot be set.`)},get(){let t=e(i),l=y("@ContentChildren");if(!l.has(t,o)){let e=w(this,n,r);e=v(e,this,r),l.set(t,o,e)}return l.value(t,o)}}))}}function A(n,r){return function(i,o){let l=i.connectedCallback;i.connectedCallback=function(){null==l||l.call(this)};let s=Object.getOwnPropertyDescriptor(i.prototype,o)||{configurable:!0,enumerable:!0};delete s.value,delete s.writable,Object.defineProperty(i,o,Object.assign(Object.assign({},s),{set(e){t.isDev&&console.warn(`@ViewChild property "${o}" is read-only and cannot be set.`)},get(){let t=e(this),i=y("@ViewChild");if(!i.has(t,o)){let e=d(this,n,r);e=v(e,this,r),i.set(t,o,e)}return i.value(t,o)}}))}}function $(e,t){return"content"===(null==t?void 0:t.target)?C(e,t):A(e,t)}function P(t,l,s){let u=e(t),c=o(t),d=b(t);return s=Object.assign({distinct:!0},s),(c.t||0)>0&&(d=d.pipe(n.startWith(void 0))),r(t)?d.pipe(n.map((()=>Array.from(u.shadowRoot.querySelectorAll(l)))),a(s.distinct)):d.pipe(n.map((()=>Array.from(u.querySelectorAll(l)))),n.map((e=>e.filter((e=>i(e,u))))),a(s.distinct))}function V(n,r){return function(i,o){let l=i.connectedCallback;i.connectedCallback=function(){null==l||l.call(this)};let s=Object.getOwnPropertyDescriptor(i.prototype,o)||{configurable:!0,enumerable:!0};delete s.value,delete s.writable,Object.defineProperty(i,o,Object.assign(Object.assign({},s),{set(e){t.isDev&&console.warn(`@ViewChildren property "${o}" is read-only and cannot be set.`)},get(){let t=e(i),l=y("@ViewChildren");if(!l.has(t,o)){let e=P(this,n,r);e=v(e,this,r),l.set(t,o,e)}return l.value(t,o)}}))}}function M(e,t){return"content"===(null==t?void 0:t.target)?x(e,t):V(e,t)}function k(e,r){return t.isDev&&!e.hasOwnProperty(r)&&console.warn(`It seams that ${r} does not exist on component ${o(e).o.i}. This warning will not be displayed in production environment.`),t=>t.pipe(n.tap((t=>{e[r]=t})))}export{C as ContentChild,x as ContentChildren,$ as QuerySelector,M as QuerySelectorAll,A as ViewChild,V as ViewChildren,g as contentChildObservable,w as contentChildrenObservable,b as renderObservable,k as toProperty,d as viewChildObservable,P as viewChildrenObservable,h as whileConnected}