@pod-os/contacts 0.0.2-rc.40ff2aa.0

package/dist/esm/pos-new-thing-form.entry.js

@@ -0,0 +1,61 @@
+import { r as registerInstance, c as createEvent, h } from './index-_4aU9NfA.js';
+import { s as subscribePodOs } from './PodOsAware-jlzl8vRd.js';
+
+const posNewThingFormCss = () => `:host{display:block}form{display:grid;grid-template-columns:var(--size-16) 1fr;grid-gap:var(--scale-0)}label{grid-column:1 / 2;display:flex;align-items:center;justify-content:flex-end}input,pos-select-term,button{grid-column:2 / 3}input,pos-select-term::part(input){outline:var(--pos-input-outline);padding:var(--scale-000);border:none;border-radius:var(--radius-xs);width:var(--size-full);box-sizing:border-box;background:var(--pos-input-background-color);color:var(--pos-normal-text-color)}input:focus-within,pos-select-term::part(input):focus-within{outline:var(--pos-input-focus-outline)}#new-uri{grid-column:1/3;cursor:default;word-break:break-all;color:var(--pos-normal-text-color);font-weight:var(--weight-light);background:var(--pos-disabled-color);padding:var(--scale-000);border-radius:var(--radius-xs)}input#create{outline:none;box-shadow:var(--shadow-sm);cursor:pointer;color:var(--pos-primary-text-color);background-color:var(--pos-primary-color)}input#create:disabled{cursor:default;color:var(--pos-disabled-text-color);background-color:var(--pos-disabled-color);box-shadow:none}input#create:hover:not(:disabled),input#create:focus{filter:brightness(110%);box-shadow:var(--shadow-md)}`;
+
+const PosNewThingForm = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.linkEmitter = createEvent(this, "pod-os:link", 7);
+        this.errorEmitter = createEvent(this, "pod-os:error", 7);
+        this.subscribePodOs = createEvent(this, "pod-os:init", 7);
+        this.canSubmit = false;
+        this.receivePodOs = async (os) => {
+            this.os = os;
+        };
+    }
+    validate() {
+        this.canSubmit = Boolean(this.name && this.selectedTypeUri);
+    }
+    componentWillLoad() {
+        subscribePodOs(this);
+    }
+    render() {
+        return (h("form", { key: 'a362c5b749dd744123973987ff8b0291485b465e', method: "dialog", onSubmit: e => this.handleSubmit(e) }, h("label", { key: '45c78b0b48955cc157d04f547285b4ae4c19c38f', htmlFor: "type" }, "Type"), h("pos-select-term", { key: 'e3c3ab9abdbbb585916d95ba1aa14a066dbc5bd0', id: "type", placeholder: "", value: this.selectedTypeUri, "onPod-os:term-selected": e => this.onTermSelected(e) }), h("label", { key: 'c696f8ed862d40d3c366ef0ede5e88e574928db3', htmlFor: "name" }, "Name"), h("input", { key: '89e6289e24ca9d3969da97c7aeb22224db1c376c', id: "name", type: "text", value: this.name, onInput: e => this.handleChange(e) }), this.newUri ? (h("div", { id: "new-uri", title: "This will be the URI of the new thing" }, this.newUri)) : null, h("input", { key: 'b9520afef34177c6f14ab0798c045536d5661a2a', id: "create", type: "submit", value: "Create", disabled: !this.canSubmit })));
+    }
+    handleChange(event) {
+        this.name = event.target.value;
+        this.newUri = this.os.proposeUriForNewThing(this.referenceUri, this.name);
+    }
+    onTermSelected(event) {
+        this.selectedTypeUri = event.detail.uri;
+    }
+    async handleSubmit(event) {
+        try {
+            await this.os.addNewThing(this.newUri, this.name, this.selectedTypeUri);
+            this.linkEmitter.emit(this.newUri);
+            this.reset();
+        }
+        catch (error) {
+            event.preventDefault();
+            this.errorEmitter.emit(error);
+        }
+    }
+    reset() {
+        this.name = '';
+        this.newUri = '';
+        this.selectedTypeUri = '';
+    }
+    static get delegatesFocus() { return true; }
+    static get watchers() { return {
+        "name": [{
+                "validate": 0
+            }],
+        "selectedTypeUri": [{
+                "validate": 0
+            }]
+    }; }
+};
+PosNewThingForm.style = posNewThingFormCss();
+
+export { PosNewThingForm as pos_new_thing_form };

package/dist/esm/pos-predicate.entry.js

@@ -0,0 +1,27 @@
+import { r as registerInstance, h } from './index-_4aU9NfA.js';
+import './chunk.URTPIBTY-DtWmW4Pb.js';
+import './chunk.5JY5FUCG-BOo64hgz.js';
+import './chunk.6CTB5ZDJ-BnGEOH37.js';
+import './chunk.YHLNUJ7P-CGClYowr.js';
+import './chunk.ZGGPD2XJ-BfEMOYfC.js';
+import './class-map-CuxcTjQ5.js';
+
+const posPredicateCss = () => `:host{--text-color:var(--pos-primary-color);font-family:var(--font-sans)}button{line-height:var(--scale-0);font-family:inherit;margin:0;padding:0;display:flex;background:none;border:none;cursor:pointer}button,a{color:var(--text-color);font-weight:var(--weight-light);line-height:var(--scale-0);font-size:var(--scale-0);font-family:inherit}.container{display:flex;gap:var(--size-1);flex-direction:row;align-items:center;line-height:var(--scale-0)}`;
+
+const PosPredicate = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.expanded = false;
+    }
+    render() {
+        if (this.expanded) {
+            return (h("div", { class: "container" }, h("a", { href: this.uri }, this.uri), h("sl-tooltip", { content: `Collapse URI` }, h("button", { "aria-label": `collapse URI to ${this.label}`, onClick: () => (this.expanded = false) }, h("sl-icon", { name: "arrow-left-circle" })))));
+        }
+        else {
+            return (h("sl-tooltip", { content: `${this.uri}` }, h("button", { onClick: () => (this.expanded = true) }, this.label)));
+        }
+    }
+};
+PosPredicate.style = posPredicateCss();
+
+export { PosPredicate as pos_predicate };

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

@@ -0,0 +1,46 @@
+import { r as registerInstance, c as createEvent, h } from './index-_4aU9NfA.js';
+import { s as subscribeResource } from './ResourceAware-BW_CkW1K.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}`;
+
+const PosRelations = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.subscribeResource = createEvent(this, "pod-os:resource", 7);
+        this.data = [];
+        this.receiveResource = (resource) => {
+            this.data = resource.relations();
+        };
+    }
+    componentWillLoad() {
+        subscribeResource(this);
+    }
+    render() {
+        const items = this.data.map(it => (h("div", { class: "predicate-values" }, h("dt", null, h("pos-predicate", { uri: it.predicate, label: it.label })), h("div", { class: "values" }, it.uris.map(uri => (h("dd", null, h("pos-rich-link", { uri: uri }))))))));
+        return this.data.length > 0 ? h("dl", null, items) : null;
+    }
+};
+PosRelations.style = posRelationsCss();
+
+const posReverseRelationsCss = () => `: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}`;
+
+const PosReverseRelations = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.subscribeResource = createEvent(this, "pod-os:resource", 7);
+        this.data = [];
+        this.receiveResource = (resource) => {
+            this.data = resource.reverseRelations();
+        };
+    }
+    componentWillLoad() {
+        subscribeResource(this);
+    }
+    render() {
+        const items = this.data.map(it => (h("div", { class: "predicate-values" }, h("dt", null, h("pos-predicate", { uri: it.predicate, label: `is ${it.label} of` })), h("div", { class: "values" }, it.uris.map(uri => (h("dd", null, h("pos-rich-link", { uri: uri }))))))));
+        return this.data.length > 0 ? h("dl", null, items) : null;
+    }
+};
+PosReverseRelations.style = posReverseRelationsCss();
+
+export { PosRelations as pos_relations, PosReverseRelations as pos_reverse_relations };

package/dist/esm/pos-select-term.entry.js

@@ -0,0 +1,39 @@
+import { r as registerInstance, c as createEvent, h, e as Host } from './index-_4aU9NfA.js';
+import { s as subscribePodOs } from './PodOsAware-jlzl8vRd.js';
+
+const posSelectTermCss = () => `:host{display:block}input{background-color:transparent;color:var(--pos-normal-text-color);border:none;padding-top:1rem;padding-bottom:1rem}input:focus{outline:none}`;
+
+const PosSelectTerm = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.subscribePodOs = createEvent(this, "pod-os:init", 7);
+        this.termSelected = createEvent(this, "pod-os:term-selected", 7);
+        this.placeholder = 'Type to search...';
+        this.value = '';
+        this.terms = [];
+        this.receivePodOs = async (os) => {
+            this.os = os;
+        };
+    }
+    componentWillLoad() {
+        subscribePodOs(this);
+    }
+    setTerms() {
+        this.terms = this.os.listKnownTerms();
+    }
+    handleChange(event) {
+        this.termSelected.emit({ uri: event.target.value });
+    }
+    render() {
+        return (h(Host, { key: '2e995b15a3b76a13cd7e11d09670121a6191b5ce' }, h("input", { key: 'ad79f1b410312790d4f5cd1f398b2eec3c04aad7', part: "input", list: "terms", placeholder: this.placeholder, value: this.value, onChange: ev => this.handleChange(ev) }), h("datalist", { key: 'e3cc9ce85b75033bac29a32ca8e55c57535a9659', part: "terms", id: "terms" }, this.terms.map(term => (h("option", { value: term.uri }, term.shorthand))))));
+    }
+    static get delegatesFocus() { return true; }
+    static get watchers() { return {
+        "os": [{
+                "setTerms": 0
+            }]
+    }; }
+};
+PosSelectTerm.style = posSelectTermCss();
+
+export { PosSelectTerm as pos_select_term };

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

@@ -0,0 +1,27 @@
+import { r as registerInstance, c as createEvent, h } from './index-_4aU9NfA.js';
+import { R as RdfDocument } from './index-DFqG64hG.js';
+import { s as subscribeResource } from './ResourceAware-BW_CkW1K.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)}}}`;
+
+const PosSubjects = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.subscribeResource = createEvent(this, "pod-os:resource", 7);
+        this.data = [];
+        this.receiveResource = (resource) => {
+            const doc = resource.assume(RdfDocument);
+            this.data = doc.subjects();
+        };
+    }
+    componentWillLoad() {
+        subscribeResource(this);
+    }
+    render() {
+        const items = this.data.map(it => (h("li", null, h("pos-rich-link", { uri: it.uri }))));
+        return this.data.length > 0 ? h("ul", null, items) : null;
+    }
+};
+PosSubjects.style = posSubjectsCss();
+
+export { PosSubjects as pos_subjects };

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

@@ -0,0 +1,36 @@
+import { r as registerInstance, h, e as Host, a as getElement } from './index-_4aU9NfA.js';
+import { u as usePodOS } from './usePodOS-D0uCfr1-.js';
+import { u as useResource } from './useResource-yVO4JQ9P.js';
+
+const posToolAttachmentsCss = () => `:host{display:flex;flex-direction:column;gap:var(--size-1);h2{margin:0;padding:0;font-size:var(--scale-2)}}`;
+
+const defaultAppLayoutCss = () => `:host{--gap-size:var(--size-1);display:flex;flex-direction:column;gap:var(--gap-size);margin:var(--gap-size)}section{display:flex;flex-direction:column;gap:var(--gap-size)}@media (min-width: 640px){:host{--gap-size:var(--size-4);flex-direction:row;flex-wrap:wrap;section{&:first-of-type{flex:1}}section:not(:first-of-type){flex:0 0 30%}}}`;
+
+const articleCardCss = () => `article{padding:var(--size-2);display:flex;flex-direction:column;gap:var(--size-2);outline:var(--pos-border-solid);border-radius:var(--radius-sm);box-shadow:var(--shadow-md);background-color:var(--pos-card-background);header{display:flex;flex-direction:column;gap:var(--size-2);h1{margin:0}}}`;
+
+const PosToolAttachments = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+    }
+    async componentWillLoad() {
+        this.os = await usePodOS(this.el);
+        this.resource = await useResource(this.el);
+    }
+    render() {
+        var _a;
+        return (h(Host, { key: 'c7670fa2c000099af02d33a702a404e9889d4552' }, h("section", { key: '1b3ce82d5101ec4c0b6e6df26ede473c7287b747' }, h("article", { key: 'b9929952d801ab53a848985af7ed08c18072a662' }, h("h2", { key: 'dc39c20da1730c6ea01b32a99dc8b0680a33b6c2' }, "Attachments"), h("pos-attachments", { key: '65fd33e592be78e1a15ac9c2238321973a3f8612', ref: it => (this.attachmentsElement = it) }))), h("section", { key: '4ebe089659ed2c517440a9ff06141f332e44c56d' }, ((_a = this.resource) === null || _a === void 0 ? void 0 : _a.editable) ? (h("pos-upload", { accept: ['*/*'], uploader: file => {
+                const result = this.os.attachments().uploadAndAddAttachment(this.resource, file);
+                result.map(it => {
+                    this.attachmentsElement.addToList({
+                        uri: it.url,
+                        label: file.name,
+                    });
+                });
+                return result;
+            } })) : null)));
+    }
+    get el() { return getElement(this); }
+};
+PosToolAttachments.style = posToolAttachmentsCss() + (defaultAppLayoutCss() + articleCardCss());
+
+export { PosToolAttachments as pos_tool_attachments };

package/dist/esm/pos-tool-select.entry.js

@@ -0,0 +1,28 @@
+import { r as registerInstance, c as createEvent, h } from './index-_4aU9NfA.js';
+import './chunk.ZGGPD2XJ-BfEMOYfC.js';
+import './chunk.YHLNUJ7P-CGClYowr.js';
+
+const posToolSelectCss = () => `:host {\\n  --button-size: var(--size-16);\\n  display: block;\\n  position: sticky;\\n  align-self: flex-start;\\n  top: 0;\\n  overflow: auto;\\n  min-width: var(--button-size);\\n  z-index: var(--layer-1);\\n}\\n\\n[role='tablist'] {\\n  display: flex;\\n  flex-direction: column;\\n  justify-content: center;\\n\\n  border-right: var(--size-px) solid var(--pos-border-color);\\n\\n  button {\\n    display: flex;\\n    flex-direction: column;\\n    align-items: center;\\n    justify-content: center;\\n    gap: 0;\\n    font-size: var(--size-6);\\n    position: relative;\\n    overflow: hidden;\\n    outline: none;\\n    border: none;\\n    width: var(--button-size);\\n    min-width: var(--button-size);\\n    height: var(--button-size);\\n    min-height: var(--button-size);\\n    color: var(--pos-normal-text-color);\\n    background-color: var(--pos-background-color);\\n\\n    &::after {\\n      content: '';\\n      position: absolute;\\n      top: 50%;\\n      left: 50%;\\n      width: 0;\\n      height: 0;\\n      border-radius: 100%;\\n      background: color-mix(in srgb, var(--pos-primary-color), transparent 50%);\\n      transform: translate(-50%, -50%);\\n      opacity: 1;\\n    }\\n\\n    &:active::after,\\n    &:focus::after {\\n      width: calc(var(--button-size) * 1.5);\\n      height: calc(var(--button-size) * 1.5);\\n      opacity: 0;\\n      transition:\\n        width 0.5s ease-out,\\n        height 0.5s ease-out,\\n        opacity 1s ease-out;\\n    }\\n\\n    &:focus-visible {\\n      border: var(--size-px) solid var(--pos-primary-color);\\n    }\\n\\n    @media (min-width: 640px) {\\n      &[aria-selected] {\\n        border-right: var(--size-1) solid var(--pos-primary-color);\\n      }\\n    }\\n\\n    .text {\\n      font-size: var(--size-3);\\n      white-space: nowrap;\\n      text-overflow: ellipsis;\\n      width: 100%;\\n      overflow: hidden;\\n    }\\n  }\\n}\\n\\n@media (max-width: 640px) {\\n  :host {\\n    position: fixed;\\n    top: unset;\\n    bottom: 0;\\n    width: 100dvw;\\n  }\\n  [role='tablist'] {\\n    flex-direction: row;\\n    background-color: var(--pos-background-color);\\n\\n    border-top: var(--size-px) solid var(--pos-border-color);\\n\\n    button {\\n      &[aria-selected] {\\n        border-top: var(--size-1) solid var(--pos-primary-color);\\n      }\\n    }\\n  }\\n}\\n`;
+
+const PosToolSelect = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.toolSelected = createEvent(this, "pod-os:tool-selected", 7);
+        /**
+         * All tools that are available
+         */
+        this.tools = [];
+    }
+    render() {
+        if (this.tools.length > 1) {
+            return (h("div", { role: "tablist", "aria-label": "Tools", "aria-multiselectable": "false" }, this.tools.map(it => {
+                var _a;
+                return (h("button", { role: "tab", "aria-selected": ((_a = this.selected) === null || _a === void 0 ? void 0 : _a.element) === it.element, onClick: () => this.toolSelected.emit(it) }, h("sl-icon", { name: it.icon }), h("span", { class: "text" }, it.label)));
+            })));
+        }
+        return null;
+    }
+};
+PosToolSelect.style = posToolSelectCss();
+
+export { PosToolSelect as pos_tool_select };

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

@@ -0,0 +1,20 @@
+import { r as registerInstance, c as createEvent } from './index-_4aU9NfA.js';
+import { s as subscribeResource } from './ResourceAware-BW_CkW1K.js';
+
+const PosValue = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.subscribeResource = createEvent(this, "pod-os:resource", 7);
+        this.receiveResource = (resource) => {
+            this.resource = resource;
+        };
+    }
+    componentWillLoad() {
+        subscribeResource(this);
+    }
+    render() {
+        return this.resource ? this.resource.anyValue(this.predicate) : null;
+    }
+};
+
+export { PosValue as pos_value };

package/dist/esm/session-dNJIwSOx.js

@@ -0,0 +1,284 @@
+import { S as StencilCore } from './index-_4aU9NfA.js';
+
+const appendToMap = (map, propName, value) => {
+    let refs = map.get(propName);
+    if (!refs) {
+        refs = [];
+        map.set(propName, refs);
+    }
+    if (!refs.some((ref) => ref.deref() === value)) {
+        refs.push(new WeakRef(value));
+    }
+};
+const debounce = (fn, ms) => {
+    let timeoutId;
+    return (...args) => {
+        if (timeoutId) {
+            clearTimeout(timeoutId);
+        }
+        timeoutId = setTimeout(() => {
+            timeoutId = 0;
+            fn(...args);
+        }, ms);
+    };
+};
+
+/**
+ * Check if a possible element isConnected.
+ * The property might not be there, so we check for it.
+ *
+ * We want it to return true if isConnected is not a property,
+ * otherwise we would remove these elements and would not update.
+ *
+ * Better leak in Edge than to be useless.
+ */
+const isConnected = (maybeElement) => !('isConnected' in maybeElement) || maybeElement.isConnected;
+const cleanupElements = debounce((map) => {
+    for (let key of map.keys()) {
+        const refs = map.get(key).filter((ref) => {
+            const elm = ref.deref();
+            return elm && isConnected(elm);
+        });
+        map.set(key, refs);
+    }
+}, 2_000);
+const core = StencilCore;
+const forceUpdate = core.forceUpdate;
+const getRenderingRef = core.getRenderingRef;
+const stencilSubscription = () => {
+    if (typeof getRenderingRef !== 'function' || typeof forceUpdate !== 'function') {
+        // If we are not in a stencil project, we do nothing.
+        // This function is not really exported by @stencil/core.
+        return {};
+    }
+    const ensureForceUpdate = forceUpdate;
+    const ensureGetRenderingRef = getRenderingRef;
+    const elmsToUpdate = new Map();
+    return {
+        dispose: () => elmsToUpdate.clear(),
+        get: (propName) => {
+            const elm = ensureGetRenderingRef();
+            if (elm) {
+                appendToMap(elmsToUpdate, propName, elm);
+            }
+        },
+        set: (propName) => {
+            const refs = elmsToUpdate.get(propName);
+            if (refs) {
+                const nextRefs = refs.filter((ref) => {
+                    const elm = ref.deref();
+                    if (!elm)
+                        return false;
+                    return ensureForceUpdate(elm);
+                });
+                elmsToUpdate.set(propName, nextRefs);
+            }
+            cleanupElements(elmsToUpdate);
+        },
+        reset: () => {
+            elmsToUpdate.forEach((refs) => {
+                refs.forEach((ref) => {
+                    const elm = ref.deref();
+                    if (elm)
+                        ensureForceUpdate(elm);
+                });
+            });
+            cleanupElements(elmsToUpdate);
+        },
+    };
+};
+
+const unwrap = (val) => (typeof val === 'function' ? val() : val);
+const createObservableMap = (defaultState, shouldUpdate = (a, b) => a !== b) => {
+    const resolveDefaultState = () => (unwrap(defaultState) ?? {});
+    const initialState = resolveDefaultState();
+    let states = new Map(Object.entries(initialState));
+    const proxyAvailable = typeof Proxy !== 'undefined';
+    const plainState = proxyAvailable ? null : {};
+    const handlers = {
+        dispose: [],
+        get: [],
+        set: [],
+        reset: [],
+    };
+    // Track onChange listeners to enable removeListener functionality
+    const changeListeners = new Map();
+    const reset = () => {
+        // When resetting the state, the default state may be a function - unwrap it to invoke it.
+        // otherwise, the state won't be properly reset
+        states = new Map(Object.entries(resolveDefaultState()));
+        if (!proxyAvailable) {
+            syncPlainStateKeys();
+        }
+        handlers.reset.forEach((cb) => cb());
+    };
+    const dispose = () => {
+        // Call first dispose as resetting the state would
+        // cause less updates ;)
+        handlers.dispose.forEach((cb) => cb());
+        reset();
+    };
+    const get = (propName) => {
+        handlers.get.forEach((cb) => cb(propName));
+        return states.get(propName);
+    };
+    const set = (propName, value) => {
+        const oldValue = states.get(propName);
+        if (shouldUpdate(value, oldValue, propName)) {
+            states.set(propName, value);
+            if (!proxyAvailable) {
+                ensurePlainProperty(propName);
+            }
+            handlers.set.forEach((cb) => cb(propName, value, oldValue));
+        }
+    };
+    const state = (proxyAvailable
+        ? new Proxy(initialState, {
+            get(_, propName) {
+                return get(propName);
+            },
+            ownKeys(_) {
+                return Array.from(states.keys());
+            },
+            getOwnPropertyDescriptor() {
+                return {
+                    enumerable: true,
+                    configurable: true,
+                };
+            },
+            has(_, propName) {
+                return states.has(propName);
+            },
+            set(_, propName, value) {
+                set(propName, value);
+                return true;
+            },
+        })
+        : (() => {
+            syncPlainStateKeys();
+            return plainState;
+        })());
+    const on = (eventName, callback) => {
+        handlers[eventName].push(callback);
+        return () => {
+            removeFromArray(handlers[eventName], callback);
+        };
+    };
+    const onChange = (propName, cb) => {
+        const setHandler = (key, newValue) => {
+            if (key === propName) {
+                cb(newValue);
+            }
+        };
+        const resetHandler = () => {
+            const snapshot = resolveDefaultState();
+            cb(snapshot[propName]);
+        };
+        // Register the handlers
+        const unSet = on('set', setHandler);
+        const unReset = on('reset', resetHandler);
+        // Track the relationship between the user callback and internal handlers
+        changeListeners.set(cb, { setHandler, resetHandler, propName });
+        return () => {
+            unSet();
+            unReset();
+            changeListeners.delete(cb);
+        };
+    };
+    const use = (...subscriptions) => {
+        const unsubs = subscriptions.reduce((unsubs, subscription) => {
+            if (subscription.set) {
+                unsubs.push(on('set', subscription.set));
+            }
+            if (subscription.get) {
+                unsubs.push(on('get', subscription.get));
+            }
+            if (subscription.reset) {
+                unsubs.push(on('reset', subscription.reset));
+            }
+            if (subscription.dispose) {
+                unsubs.push(on('dispose', subscription.dispose));
+            }
+            return unsubs;
+        }, []);
+        return () => unsubs.forEach((unsub) => unsub());
+    };
+    const forceUpdate = (key) => {
+        const oldValue = states.get(key);
+        handlers.set.forEach((cb) => cb(key, oldValue, oldValue));
+    };
+    const removeListener = (propName, listener) => {
+        const listenerInfo = changeListeners.get(listener);
+        if (listenerInfo && listenerInfo.propName === propName) {
+            // Remove the specific handlers that were created for this listener
+            removeFromArray(handlers.set, listenerInfo.setHandler);
+            removeFromArray(handlers.reset, listenerInfo.resetHandler);
+            changeListeners.delete(listener);
+        }
+    };
+    function ensurePlainProperty(key) {
+        if (proxyAvailable || !plainState) {
+            return;
+        }
+        if (Object.prototype.hasOwnProperty.call(plainState, key)) {
+            return;
+        }
+        Object.defineProperty(plainState, key, {
+            configurable: true,
+            enumerable: true,
+            get() {
+                return get(key);
+            },
+            set(value) {
+                set(key, value);
+            },
+        });
+    }
+    function syncPlainStateKeys() {
+        if (proxyAvailable || !plainState) {
+            return;
+        }
+        const knownKeys = new Set(states.keys());
+        for (const key of Object.keys(plainState)) {
+            if (!knownKeys.has(key)) {
+                delete plainState[key];
+            }
+        }
+        for (const key of knownKeys) {
+            ensurePlainProperty(key);
+        }
+    }
+    return {
+        state,
+        get,
+        set,
+        on,
+        onChange,
+        use,
+        dispose,
+        reset,
+        forceUpdate,
+        removeListener,
+    };
+};
+const removeFromArray = (array, item) => {
+    const index = array.indexOf(item);
+    if (index >= 0) {
+        array[index] = array[array.length - 1];
+        array.length--;
+    }
+};
+
+const createStore = (defaultState, shouldUpdate) => {
+    const map = createObservableMap(defaultState, shouldUpdate);
+    map.use(stencilSubscription());
+    return map;
+};
+
+const store = createStore({
+    isLoggedIn: false,
+    webId: '',
+    profile: null
+});
+
+export { createStore as c, store as s };

package/dist/esm/settings-B396TU1j.js

@@ -0,0 +1,27 @@
+import { c as createStore } from './session-dNJIwSOx.js';
+
+const storedSettings = localStorage.getItem('settings');
+const initialSettings = storedSettings
+    ? JSON.parse(storedSettings)
+    : {
+        offlineCache: false,
+    };
+const localSettings = createStore(initialSettings);
+persistChanges();
+syncChangesAcrossTabs();
+function persistChanges() {
+    localSettings.on('set', () => {
+        const snapshot = JSON.stringify(localSettings.state);
+        localStorage.setItem('settings', snapshot);
+    });
+}
+function syncChangesAcrossTabs() {
+    window.addEventListener('storage', event => {
+        if (event.key === 'settings' && event.newValue) {
+            const newSettings = JSON.parse(event.newValue);
+            localSettings.state.offlineCache = newSettings.offlineCache;
+        }
+    });
+}
+
+export { localSettings as l };

package/dist/esm/usePodOS-D0uCfr1-.js

@@ -0,0 +1,14 @@
+function usePodOS(el) {
+    return new Promise(resolve => {
+        el.dispatchEvent(new CustomEvent('pod-os:init', {
+            bubbles: true,
+            composed: true,
+            cancelable: true,
+            detail: (os) => {
+                resolve(os);
+            },
+        }));
+    });
+}
+
+export { usePodOS as u };

package/dist/esm/useResource-yVO4JQ9P.js

@@ -0,0 +1,14 @@
+function useResource(el) {
+    return new Promise(resolve => {
+        el.dispatchEvent(new CustomEvent('pod-os:resource', {
+            bubbles: true,
+            composed: true,
+            cancelable: true,
+            detail: (thing) => {
+                resolve(thing);
+            },
+        }));
+    });
+}
+
+export { useResource as u };

package/dist/index.cjs.js

@@ -0,0 +1 @@
+module.exports = require('./cjs/index.cjs.js');

package/dist/index.js

@@ -0,0 +1 @@
+export * from './esm/index.js';

package/dist/types/components/address-book-page/address-book-page.d.ts

@@ -0,0 +1,23 @@
+import { AddressBook, Contact, ContactsModule, Group } from '@solid-data-modules/contacts-rdflib';
+import '@shoelace-style/shoelace/dist/components/icon/icon.js';
+export declare class AddressBookPage {
+    el: HTMLElement;
+    uri: string;
+    contactsModule: ContactsModule;
+    addressBook: AddressBook;
+    selectedContact: Contact;
+    selectedGroup: Group;
+    error: any;
+    private menuOpen;
+    private readonly disconnected$;
+    componentWillLoad(): Promise<void>;
+    onContactSelected(event: CustomEvent<Contact>): Promise<void>;
+    onGroupSelected(event: CustomEvent<Group>): Promise<void>;
+    onContactCreated(event: CustomEvent<Contact>): Promise<void>;
+    loadAddressBook(): Promise<void>;
+    render(): any;
+    private openMenu;
+    private closeMenu;
+    private closeContact;
+    private retry;
+}