@pod-os/elements 0.41.0-rc.fcadbb6.0 → 0.41.0

package/dist/cjs/pos-relations_2.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-CFcC3IGM.js');
+var index = require('./index-CjKppELa.js');
 var ResourceAware = require('./ResourceAware-uqh9ZRDt.js');
 
 const posRelationsCss = () => `:host{--background-base-color:color-mix(in srgb, var(--pos-background-color), var(--color-grey-800) 10%);--background-color-even:hsl(from var(--background-base-color) h s calc(l + 7));--background-color-odd:hsl(from var(--background-base-color) h s calc(l + 10));--border-color:var(--background-base-color)}dd{padding:0;margin:0}dl{display:flex;flex-direction:column;gap:var(--size-1);padding:0;margin:0}dt{margin-bottom:var(--size-1)}.predicate-values:nth-child(odd){background-color:var(--background-color-odd)}.predicate-values:nth-child(even){background-color:var(--background-color-even)}.predicate-values{display:flex;flex-direction:column;border:var(--size-px) solid var(--border-color);padding:var(--size-2);gap:var(--size-1);.values{display:flex;flex-direction:column;gap:var(--size-3)}}pos-rich-link{--background-color:inherit}`;

package/dist/cjs/pos-subjects.cjs.entry.js

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-CFcC3IGM.js');
-var index$1 = require('./index-BP03J2RA.js');
+var index = require('./index-CjKppELa.js');
+var index$1 = require('./index-BPvAwpRj.js');
 var ResourceAware = require('./ResourceAware-uqh9ZRDt.js');
 
 const posSubjectsCss = () => `:host{--background-base-color:color-mix(in srgb, var(--pos-background-color), var(--color-grey-800) 10%);--background-color-even:hsl(from var(--background-base-color) h s calc(l + 7));--background-color-odd:hsl(from var(--background-base-color) h s calc(l + 10));--border-color:var(--background-base-color)}ul{display:flex;flex-direction:column;gap:var(--size-2);margin:0;padding:0;li{border:var(--size-px) solid var(--border-color);padding:var(--size-4);list-style-type:none;&:nth-child(even){background-color:var(--background-color-even)}&:nth-child(odd){background-color:var(--background-color-odd)}}}`;

package/dist/cjs/pos-switch.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-CFcC3IGM.js');
+var index = require('./index-CjKppELa.js');
 var ResourceAware = require('./ResourceAware-uqh9ZRDt.js');
 var index$1 = require('./index-DlHQ3blV.js');
 

package/dist/cjs/pos-tool-attachments.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-CFcC3IGM.js');
+var index = require('./index-CjKppELa.js');
 var usePodOS = require('./usePodOS-BnFzjtlx.js');
 var useResource = require('./useResource-IN7KmaP3.js');
 

package/dist/cjs/pos-value.cjs.entry.js

@@ -1,22 +1,42 @@
 'use strict';
 
-var index = require('./index-CFcC3IGM.js');
+var index = require('./index-CjKppELa.js');
 var ResourceAware = require('./ResourceAware-uqh9ZRDt.js');
+var index$1 = require('./index-DlHQ3blV.js');
 
 const PosValue = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.subscribeResource = index.createEvent(this, "pod-os:resource", 7);
+        this.disconnected$ = new index$1.cjsExports.Subject();
         this.receiveResource = (resource) => {
             this.resource = resource;
+            this.observeAnyValue();
         };
     }
     componentWillLoad() {
         ResourceAware.subscribeResource(this);
     }
+    observeAnyValue() {
+        this.disconnected$.next();
+        this.resource
+            .observeAnyValue(this.predicate)
+            .pipe(index$1.cjsExports.takeUntil(this.disconnected$))
+            .subscribe(value => (this.value = value));
+    }
     render() {
-        return this.resource ? this.resource.anyValue(this.predicate) : null;
+        var _a;
+        return (_a = this.value) !== null && _a !== void 0 ? _a : null;
+    }
+    disconnectedCallback() {
+        this.disconnected$.next();
+        this.disconnected$.complete();
     }
+    static get watchers() { return {
+        "predicate": [{
+                "observeAnyValue": 0
+            }]
+    }; }
 };
 
 exports.pos_value = PosValue;

package/dist/collection/components/pos-description/pos-description.js

@@ -1,21 +1,36 @@
 import { subscribeResource } from "../events/ResourceAware";
+import { Subject, takeUntil } from "rxjs";
+/**
+ * Displays a description of the resource, as provided by [Thing.description()](https://pod-os.org/reference/core/classes/thing/#description).
+ *
+ * Re-renders when data in the store changes using [Thing.observeDescription()](https://pod-os.org/reference/core/classes/thing/#observeDescription).
+ */
 export class PosDescription {
     constructor() {
+        this.disconnected$ = new Subject();
         this.receiveResource = (resource) => {
-            this.resource = resource;
+            this.disconnected$.next();
+            resource
+                .observeDescription()
+                .pipe(takeUntil(this.disconnected$))
+                .subscribe(description => (this.description = description));
         };
     }
     componentWillLoad() {
         subscribeResource(this);
     }
     render() {
-        return this.resource ? this.resource.description() : null;
+        return this.description ? this.description : null;
+    }
+    disconnectedCallback() {
+        this.disconnected$.next();
+        this.disconnected$.complete();
     }
     static get is() { return "pos-description"; }
     static get encapsulation() { return "shadow"; }
     static get states() {
         return {
-            "resource": {}
+            "description": {}
         };
     }
     static get events() {

package/dist/collection/components/pos-label/pos-label.js

@@ -1,24 +1,35 @@
 import { subscribeResource } from "../events/ResourceAware";
+import { Subject, takeUntil } from "rxjs";
 /**
- * Displays a human-readable label of the resource, provided by [Thing.label()](https://pod-os.org/reference/core/classes/thing/#label)
+ * Displays a human-readable label of the resource, as provided by [Thing.label()](https://pod-os.org/reference/core/classes/thing/#label).
+ *
+ * Re-renders when data in the store changes using [Thing.observeLabel()](https://pod-os.org/reference/core/classes/thing/#observeLabel).
  */
 export class PosLabel {
     constructor() {
+        this.disconnected$ = new Subject();
         this.receiveResource = (resource) => {
-            this.resource = resource;
+            resource
+                .observeLabel()
+                .pipe(takeUntil(this.disconnected$))
+                .subscribe(label => (this.label = label));
         };
     }
     componentWillLoad() {
         subscribeResource(this);
     }
     render() {
-        return this.resource ? this.resource.label() : null;
+        return this.label ? this.label : null;
+    }
+    disconnectedCallback() {
+        this.disconnected$.next();
+        this.disconnected$.complete();
     }
     static get is() { return "pos-label"; }
     static get encapsulation() { return "shadow"; }
     static get states() {
         return {
-            "resource": {}
+            "label": {}
         };
     }
     static get events() {

package/dist/collection/components/pos-value/pos-value.js

@@ -1,19 +1,35 @@
 import { subscribeResource } from "../events/ResourceAware";
+import { Subject, takeUntil } from "rxjs";
 /**
  * Shows a single value linked to the resource using the given predicate.
- * The value is determined by [Thing.anyValue()](https://pod-os.org/reference/core/classes/thing/#anyvalue)
+ * The value is determined by [Thing.observeAnyValue()](https://pod-os.org/reference/core/classes/thing/#observeanyvalue)
+ * and re-renders when data in the store changes
  */
 export class PosValue {
     constructor() {
+        this.disconnected$ = new Subject();
         this.receiveResource = (resource) => {
             this.resource = resource;
+            this.observeAnyValue();
         };
     }
     componentWillLoad() {
         subscribeResource(this);
     }
+    observeAnyValue() {
+        this.disconnected$.next();
+        this.resource
+            .observeAnyValue(this.predicate)
+            .pipe(takeUntil(this.disconnected$))
+            .subscribe(value => (this.value = value));
+    }
     render() {
-        return this.resource ? this.resource.anyValue(this.predicate) : null;
+        var _a;
+        return (_a = this.value) !== null && _a !== void 0 ? _a : null;
+    }
+    disconnectedCallback() {
+        this.disconnected$.next();
+        this.disconnected$.complete();
     }
     static get is() { return "pos-value"; }
     static get encapsulation() { return "shadow"; }
@@ -35,14 +51,15 @@ export class PosValue {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
+                "reflect": true,
                 "attribute": "predicate"
             }
         };
     }
     static get states() {
         return {
-            "resource": {}
+            "resource": {},
+            "value": {}
         };
     }
     static get events() {
@@ -63,4 +80,10 @@ export class PosValue {
                 }
             }];
     }
+    static get watchers() {
+        return [{
+                "propName": "predicate",
+                "methodName": "observeAnyValue"
+            }];
+    }
 }