@pod-os/elements 0.26.1-rc.a682a29.0 → 0.26.1-rc.b9287e0.0

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

@@ -2,11 +2,13 @@ import { h, Host } from "@stencil/core";
 import session from "../../store/session";
 export class PosLogin {
     constructor() {
+        this.customLoggedInComponent = false;
         this.setOs = async (os) => {
             this.os = os;
         };
     }
     componentWillLoad() {
+        this.customLoggedInComponent = !!this.host.querySelector('[slot="if-logged-in"]');
         this.initializeOsEmitter.emit(this.setOs);
     }
     login(event) {
@@ -16,11 +18,23 @@ export class PosLogin {
     logout() {
         this.os.logout();
     }
+    onLogin() {
+        this.openDialog();
+    }
     openDialog() {
         this.dialog.showModal();
     }
     render() {
-        return (h(Host, { key: '6349e0939fb22cddc9a6e47d424ce2badd518dcd' }, h("div", { key: '940d720ae5a7b951fe4a1bf411e463add43d93d0', class: "container" }, session.state.isLoggedIn ? (h("pos-resource", { uri: session.state.webId }, h("span", { class: "user-data" }, h("pos-picture", null), h("pos-label", null)))) : (''), !session.state.isLoggedIn && (h("button", { key: '40aeea2f9686c9792c3952f8b899f9e819895bae', id: "login", onClick: () => this.openDialog() }, "Login")), session.state.isLoggedIn && (h("button", { key: 'dd8129f4ae6b590231c33d072f4094b7bfc99da5', id: "logout", onClick: () => this.logout() }, "Logout"))), h("pos-dialog", { key: '33278d394f830f5c6040c3c22dc720440dd9d75c', ref: el => (this.dialog = el) }, h("span", { key: '96d3c645cacb1b38bd9adca8562ae4068eeabe11', slot: "title" }, "Sign in to your Pod"), h("pos-login-form", { key: '0c296b68774e4e2c1ed6091c305348b36e80178f', "onPod-os:idp-url-selected": ev => this.login(ev), slot: "content" }))));
+        return (h(Host, { key: 'e061448eb4f6dadc9c9e3a46f81fb005e616005e' }, h("div", { key: 'f3b3d50ffaa2ee4ef158c079d4c1c0d40193658c', class: "container" }, !session.state.isLoggedIn ? (h("button", { id: "login", onClick: () => this.openDialog() }, "Login")) : (this.loggedInComponents())), h("pos-dialog", { key: '2cd28478553dd3efe744caa350bdb7f2853d5221', ref: el => (this.dialog = el) }, h("span", { key: '70c819fe9152d6c3ae186b848f5a156a90a7fe08', slot: "title" }, "Sign in to your Pod"), h("pos-login-form", { key: 'f4b1e70f049f40ad420d9907d24c8b14170e033a', "onPod-os:idp-url-selected": ev => this.login(ev), slot: "content" }))));
+    }
+    loggedInComponents() {
+        return this.customLoggedInComponent ? h("slot", { name: "if-logged-in" }) : this.defaultLoggedInComponents();
+    }
+    defaultLoggedInComponents() {
+        return [
+            h("pos-resource", { uri: session.state.webId }, h("span", { class: "user-data" }, h("pos-picture", null), h("pos-label", null))),
+            h("button", { id: "logout", onClick: () => this.logout() }, "Logout"),
+        ];
     }
     static get is() { return "pos-login"; }
     static get encapsulation() { return "shadow"; }
@@ -36,7 +50,8 @@ export class PosLogin {
     }
     static get states() {
         return {
-            "os": {}
+            "os": {},
+            "customLoggedInComponent": {}
         };
     }
     static get events() {
@@ -57,5 +72,21 @@ export class PosLogin {
                 }
             }];
     }
+    static get elementRef() { return "host"; }
+    static get listeners() {
+        return [{
+                "name": "pod-os:logout",
+                "method": "logout",
+                "target": "document",
+                "capture": false,
+                "passive": false
+            }, {
+                "name": "pod-os:login",
+                "method": "onLogin",
+                "target": "document",
+                "capture": false,
+                "passive": false
+            }];
+    }
 }
 //# sourceMappingURL=pos-login.js.map

package/dist/collection/components/pos-login/pos-login.js.map

@@ -1 +1 @@
-{"version":3,"file":"pos-login.js","sourceRoot":"","sources":["../../../../src/components/pos-login/pos-login.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAE/E,OAAO,OAAO,MAAM,qBAAqB,CAAC;AAO1C,MAAM,OAAO,QAAQ;IALrB;QAcE,UAAK,GAAG,KAAK,EAAE,EAAS,EAAE,EAAE;YAC1B,IAAI,CAAC,EAAE,GAAG,EAAE,CAAC;QACf,CAAC,CAAC;KAiDH;IAvDC,iBAAiB;QACf,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC5C,CAAC;IAMD,KAAK,CAAC,KAA0B;QAC9B,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC;QAC5B,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;IACxB,CAAC;IAED,MAAM;QACJ,IAAI,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC;IACnB,CAAC;IAID,UAAU;QACR,IAAI,CAAC,MAAM,CAAC,SAAS,EAAE,CAAC;IAC1B,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAC,WAAW;gBACnB,OAAO,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,CAC1B,oBAAc,GAAG,EAAE,OAAO,CAAC,KAAK,CAAC,KAAK;oBACpC,YAAM,KAAK,EAAC,WAAW;wBACrB,sBAAe;wBACf,oBAAa,CACR,CACM,CAChB,CAAC,CAAC,CAAC,CACF,EAAE,CACH;gBACA,CAAC,OAAO,CAAC,KAAK,CAAC,UAAU,IAAI,CAC5B,+DAAQ,EAAE,EAAC,OAAO,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,UAAU,EAAE,YAE1C,CACV;gBACA,OAAO,CAAC,KAAK,CAAC,UAAU,IAAI,CAC3B,+DAAQ,EAAE,EAAC,QAAQ,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,aAEvC,CACV,CACG;YACN,mEAAY,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,MAAM,GAAG,EAA0B,CAAC;gBAC/D,6DAAM,IAAI,EAAC,OAAO,0BAA2B;gBAC7C,oGAA2C,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,EAAE,IAAI,EAAC,SAAS,GAAG,CACvE,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { PodOS } from '@pod-os/core';\nimport { Component, Event, EventEmitter, h, Host, State } from '@stencil/core';\n\nimport session from '../../store/session';\n\n@Component({\n  tag: 'pos-login',\n  shadow: true,\n  styleUrl: 'pos-login.css',\n})\nexport class PosLogin {\n  @Event({ eventName: 'pod-os:init' }) initializeOsEmitter: EventEmitter;\n\n  @State() os: PodOS;\n\n  componentWillLoad() {\n    this.initializeOsEmitter.emit(this.setOs);\n  }\n\n  setOs = async (os: PodOS) => {\n    this.os = os;\n  };\n\n  login(event: CustomEvent<string>) {\n    const idpUrl = event.detail;\n    this.os.login(idpUrl);\n  }\n\n  logout() {\n    this.os.logout();\n  }\n\n  private dialog: HTMLPosDialogElement;\n\n  openDialog() {\n    this.dialog.showModal();\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class=\"container\">\n          {session.state.isLoggedIn ? (\n            <pos-resource uri={session.state.webId}>\n              <span class=\"user-data\">\n                <pos-picture />\n                <pos-label />\n              </span>\n            </pos-resource>\n          ) : (\n            ''\n          )}\n          {!session.state.isLoggedIn && (\n            <button id=\"login\" onClick={() => this.openDialog()}>\n              Login\n            </button>\n          )}\n          {session.state.isLoggedIn && (\n            <button id=\"logout\" onClick={() => this.logout()}>\n              Logout\n            </button>\n          )}\n        </div>\n        <pos-dialog ref={el => (this.dialog = el as HTMLPosDialogElement)}>\n          <span slot=\"title\">Sign in to your Pod</span>\n          <pos-login-form onPod-os:idp-url-selected={ev => this.login(ev)} slot=\"content\" />\n        </pos-dialog>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"pos-login.js","sourceRoot":"","sources":["../../../../src/components/pos-login/pos-login.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAEhG,OAAO,OAAO,MAAM,qBAAqB,CAAC;AAO1C,MAAM,OAAO,QAAQ;IALrB;QAaU,4BAAuB,GAAY,KAAK,CAAC;QAOjD,UAAK,GAAG,KAAK,EAAE,EAAS,EAAE,EAAE;YAC1B,IAAI,CAAC,EAAE,GAAG,EAAE,CAAC;QACf,CAAC,CAAC;KA4DH;IAnEC,iBAAiB;QACf,IAAI,CAAC,uBAAuB,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,uBAAuB,CAAC,CAAC;QAClF,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC5C,CAAC;IAMD,KAAK,CAAC,KAA0B;QAC9B,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC;QAC5B,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;IACxB,CAAC;IAGD,MAAM;QACJ,IAAI,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC;IACnB,CAAC;IAKD,OAAO;QACL,IAAI,CAAC,UAAU,EAAE,CAAC;IACpB,CAAC;IAED,UAAU;QACR,IAAI,CAAC,MAAM,CAAC,SAAS,EAAE,CAAC;IAC1B,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAC,WAAW,IACnB,CAAC,OAAO,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,CAC3B,cAAQ,EAAE,EAAC,OAAO,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,UAAU,EAAE,YAE1C,CACV,CAAC,CAAC,CAAC,CACF,IAAI,CAAC,kBAAkB,EAAE,CAC1B,CACG;YACN,mEAAY,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,MAAM,GAAG,EAAE,CAAC;gBACvC,6DAAM,IAAI,EAAC,OAAO,0BAA2B;gBAC7C,oGAA2C,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,EAAE,IAAI,EAAC,SAAS,GAAG,CACvE,CACR,CACR,CAAC;IACJ,CAAC;IAEO,kBAAkB;QACxB,OAAO,IAAI,CAAC,uBAAuB,CAAC,CAAC,CAAC,YAAM,IAAI,EAAC,cAAc,GAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,yBAAyB,EAAE,CAAC;IAC7G,CAAC;IAEO,yBAAyB;QAC/B,OAAO;YACL,oBAAc,GAAG,EAAE,OAAO,CAAC,KAAK,CAAC,KAAK;gBACpC,YAAM,KAAK,EAAC,WAAW;oBACrB,sBAAe;oBACf,oBAAa,CACR,CACM;YACf,cAAQ,EAAE,EAAC,QAAQ,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,aAEvC;SACV,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { PodOS } from '@pod-os/core';\nimport { Component, Element, Event, EventEmitter, h, Host, Listen, State } from '@stencil/core';\n\nimport session from '../../store/session';\n\n@Component({\n  tag: 'pos-login',\n  shadow: true,\n  styleUrl: 'pos-login.css',\n})\nexport class PosLogin {\n  @Event({ eventName: 'pod-os:init' }) initializeOsEmitter: EventEmitter;\n\n  @State() os: PodOS;\n\n  @Element() host: HTMLElement;\n\n  @State()\n  private customLoggedInComponent: boolean = false;\n\n  componentWillLoad() {\n    this.customLoggedInComponent = !!this.host.querySelector('[slot=\"if-logged-in\"]');\n    this.initializeOsEmitter.emit(this.setOs);\n  }\n\n  setOs = async (os: PodOS) => {\n    this.os = os;\n  };\n\n  login(event: CustomEvent<string>) {\n    const idpUrl = event.detail;\n    this.os.login(idpUrl);\n  }\n\n  @Listen('pod-os:logout', { target: 'document' })\n  logout() {\n    this.os.logout();\n  }\n\n  private dialog: HTMLPosDialogElement;\n\n  @Listen('pod-os:login', { target: 'document' })\n  onLogin() {\n    this.openDialog();\n  }\n\n  openDialog() {\n    this.dialog.showModal();\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class=\"container\">\n          {!session.state.isLoggedIn ? (\n            <button id=\"login\" onClick={() => this.openDialog()}>\n              Login\n            </button>\n          ) : (\n            this.loggedInComponents()\n          )}\n        </div>\n        <pos-dialog ref={el => (this.dialog = el)}>\n          <span slot=\"title\">Sign in to your Pod</span>\n          <pos-login-form onPod-os:idp-url-selected={ev => this.login(ev)} slot=\"content\" />\n        </pos-dialog>\n      </Host>\n    );\n  }\n\n  private loggedInComponents() {\n    return this.customLoggedInComponent ? <slot name=\"if-logged-in\"></slot> : this.defaultLoggedInComponents();\n  }\n\n  private defaultLoggedInComponents() {\n    return [\n      <pos-resource uri={session.state.webId}>\n        <span class=\"user-data\">\n          <pos-picture />\n          <pos-label />\n        </span>\n      </pos-resource>,\n      <button id=\"logout\" onClick={() => this.logout()}>\n        Logout\n      </button>,\n    ];\n  }\n}\n"]}

package/dist/collection/components/pos-navigation/bar/pos-navigation-bar.css

@@ -14,6 +14,9 @@ section.current {
 section.current button {
   cursor: pointer;
   font-size: var(--scale-1);
+  display: flex;
+  align-items: center;
+  justify-content: center;
   flex-grow: 1;
   background: none;
   color: var(--pos-normal-text-color);
@@ -25,4 +28,11 @@ section.current button {
   &:focus {
     text-decoration: underline;
   }
+  :first-child {
+    flex-grow: 1;
+  }
+  svg {
+    width: var(--size-6);
+    color: var(--pos-subtle-text-color);
+  }
 }

package/dist/collection/components/pos-navigation/bar/pos-navigation-bar.js

@@ -11,7 +11,10 @@ export class PosNavigationBar {
     }
     render() {
         const ariaLabel = this.current ? `${this.current.label()} (Click to search or enter URI)` : 'Search or enter URI';
-        return (h("section", { key: '79ac5c5dc2d6c2d44e852f9671d0895a29fb62a6', class: "current" }, this.current && this.searchIndexReady && h("pos-make-findable", { key: 'be92d99ead125c1a29520639da6dfd6e28007d85', uri: this.current.uri }), h("button", { key: '4ecdd49e46614f604c36ef760422d54f99ab00f1', "aria-label": ariaLabel, onClick: () => this.onClick() }, this.current ? this.current.label() : 'Search or enter URI')));
+        return (h("section", { key: '79ac5c5dc2d6c2d44e852f9671d0895a29fb62a6', class: "current" }, this.current && this.searchIndexReady && h("pos-make-findable", { key: 'be92d99ead125c1a29520639da6dfd6e28007d85', uri: this.current.uri }), h("button", { key: '4ecdd49e46614f604c36ef760422d54f99ab00f1', "aria-label": ariaLabel, onClick: () => this.onClick() }, h("div", { key: '002c4138be9b798cecec90de50f7500cffd89df7' }, this.current ? this.current.label() : 'Search or enter URI'), this.icon())));
+    }
+    icon() {
+        return (h("svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", "stroke-width": "1.5", stroke: "currentColor" }, h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", d: "m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z" })));
     }
     static get is() { return "pos-navigation-bar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/pos-navigation/bar/pos-navigation-bar.js.map

@@ -1 +1 @@
-{"version":3,"file":"pos-navigation-bar.js","sourceRoot":"","sources":["../../../../../src/components/pos-navigation/bar/pos-navigation-bar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAQhF,MAAM,OAAO,gBAAgB;IAMnB,OAAO;QACb,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnC,CAAC;IAGD,QAAQ,CAAC,CAAgB;QACvB,IAAI,CAAC,CAAC,CAAC,OAAO,IAAI,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,EAAE,CAAC;YAC9C,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QACnC,CAAC;IACH,CAAC;IAED,MAAM;QACJ,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,iCAAiC,CAAC,CAAC,CAAC,qBAAqB,CAAC;QAElH,OAAO,CACL,gEAAS,KAAK,EAAC,SAAS;YACrB,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,gBAAgB,IAAI,0EAAmB,GAAG,EAAE,IAAI,CAAC,OAAO,CAAC,GAAG,GAAsB;YACxG,6EAAoB,SAAS,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,EAAE,IACzD,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,qBAAqB,CACrD,CACD,CACX,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Event, EventEmitter, h, Listen, Prop } from '@stencil/core';\nimport { Thing } from '@pod-os/core';\n\n@Component({\n  tag: 'pos-navigation-bar',\n  shadow: true,\n  styleUrl: 'pos-navigation-bar.css',\n})\nexport class PosNavigationBar {\n  @Prop() current?: Thing;\n  @Prop() searchIndexReady: boolean;\n\n  @Event({ eventName: 'pod-os:navigate' }) navigate: EventEmitter;\n\n  private onClick() {\n    this.navigate.emit(this.current);\n  }\n\n  @Listen('keydown', { target: 'document' })\n  activate(e: KeyboardEvent) {\n    if ((e.ctrlKey || e.metaKey) && e.key === 'k') {\n      e.preventDefault();\n      this.navigate.emit(this.current);\n    }\n  }\n\n  render() {\n    const ariaLabel = this.current ? `${this.current.label()} (Click to search or enter URI)` : 'Search or enter URI';\n\n    return (\n      <section class=\"current\">\n        {this.current && this.searchIndexReady && <pos-make-findable uri={this.current.uri}></pos-make-findable>}\n        <button aria-label={ariaLabel} onClick={() => this.onClick()}>\n          {this.current ? this.current.label() : 'Search or enter URI'}\n        </button>\n      </section>\n    );\n  }\n}\n"]}
+{"version":3,"file":"pos-navigation-bar.js","sourceRoot":"","sources":["../../../../../src/components/pos-navigation/bar/pos-navigation-bar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAQhF,MAAM,OAAO,gBAAgB;IAMnB,OAAO;QACb,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnC,CAAC;IAGD,QAAQ,CAAC,CAAgB;QACvB,IAAI,CAAC,CAAC,CAAC,OAAO,IAAI,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,EAAE,CAAC;YAC9C,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QACnC,CAAC;IACH,CAAC;IAED,MAAM;QACJ,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,iCAAiC,CAAC,CAAC,CAAC,qBAAqB,CAAC;QAElH,OAAO,CACL,gEAAS,KAAK,EAAC,SAAS;YACrB,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,gBAAgB,IAAI,0EAAmB,GAAG,EAAE,IAAI,CAAC,OAAO,CAAC,GAAG,GAAsB;YACxG,6EAAoB,SAAS,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,EAAE;gBAC1D,8DAAM,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,qBAAqB,CAAO;gBACvE,IAAI,CAAC,IAAI,EAAE,CACL,CACD,CACX,CAAC;IACJ,CAAC;IAEO,IAAI;QACV,OAAO,CACL,0BACc,MAAM,EAClB,KAAK,EAAC,4BAA4B,EAClC,IAAI,EAAC,MAAM,EACX,OAAO,EAAC,WAAW,kBACN,KAAK,EAClB,MAAM,EAAC,cAAc;YAErB,8BACiB,OAAO,qBACN,OAAO,EACvB,CAAC,EAAC,+EAA+E,GACjF,CACE,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Event, EventEmitter, h, Listen, Prop } from '@stencil/core';\nimport { Thing } from '@pod-os/core';\n\n@Component({\n  tag: 'pos-navigation-bar',\n  shadow: true,\n  styleUrl: 'pos-navigation-bar.css',\n})\nexport class PosNavigationBar {\n  @Prop() current?: Thing;\n  @Prop() searchIndexReady: boolean;\n\n  @Event({ eventName: 'pod-os:navigate' }) navigate: EventEmitter;\n\n  private onClick() {\n    this.navigate.emit(this.current);\n  }\n\n  @Listen('keydown', { target: 'document' })\n  activate(e: KeyboardEvent) {\n    if ((e.ctrlKey || e.metaKey) && e.key === 'k') {\n      e.preventDefault();\n      this.navigate.emit(this.current);\n    }\n  }\n\n  render() {\n    const ariaLabel = this.current ? `${this.current.label()} (Click to search or enter URI)` : 'Search or enter URI';\n\n    return (\n      <section class=\"current\">\n        {this.current && this.searchIndexReady && <pos-make-findable uri={this.current.uri}></pos-make-findable>}\n        <button aria-label={ariaLabel} onClick={() => this.onClick()}>\n          <div>{this.current ? this.current.label() : 'Search or enter URI'}</div>\n          {this.icon()}\n        </button>\n      </section>\n    );\n  }\n\n  private icon() {\n    return (\n      <svg\n        aria-hidden=\"true\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        fill=\"none\"\n        viewBox=\"0 0 24 24\"\n        stroke-width=\"1.5\"\n        stroke=\"currentColor\"\n      >\n        <path\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          d=\"m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z\"\n        />\n      </svg>\n    );\n  }\n}\n"]}

package/dist/collection/components/pos-new-thing-form/pos-new-thing-form.js

@@ -14,7 +14,7 @@ export class PosNewThingForm {
         subscribePodOs(this);
     }
     render() {
-        return (h("form", { key: '6d8a76b95abc98ab382b425b2dd8894983bb9522', method: "dialog", onSubmit: e => this.handleSubmit(e) }, h("label", { key: '6fe391ac186c0b0a8e6bb3265e66469dac3ab187', htmlFor: "type" }, "Type"), h("pos-select-term", { key: '33b50596c8cd22d8ce2b1af114277fa9bfd80355', id: "type", placeholder: "", value: this.selectedTypeUri, "onPod-os:term-selected": e => this.onTermSelected(e) }), h("label", { key: '8681f29f0c20d59c2be10a1f49cc38dea6abd19d', htmlFor: "name" }, "Name"), h("input", { key: 'f5905d871b55821f7019134d972e1f156c55f49e', 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: 'dade4834abecd9bf2fc8eb5bca0b1f60784287a4', id: "create", type: "submit", value: "Create", disabled: !this.canSubmit })));
+        return (h("form", { key: 'b1fb16121ecdbed1a3f19df9f9acd1cbc70f91f1', method: "dialog", onSubmit: e => this.handleSubmit(e) }, h("label", { key: '87397db04178def97089013afb85287bfc3fe679', htmlFor: "type" }, "Type"), h("pos-select-term", { key: 'dcc4829c2af46d899617f1ee1e8b3b3fd0a8ebf3', id: "type", placeholder: "", value: this.selectedTypeUri, "onPod-os:term-selected": e => this.onTermSelected(e) }), h("label", { key: 'a9ae3917bce29016bf2923b11a9c278a2e54afe4', htmlFor: "name" }, "Name"), h("input", { key: '3638043dac61fdda67a28f95c0ab9991a3a36979', 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: '2bcec9f76f2b2f45abadf395b826938d6dcc67ab', id: "create", type: "submit", value: "Create", disabled: !this.canSubmit })));
     }
     handleChange(event) {
         this.name = event.target.value;

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

@@ -16,7 +16,7 @@ export class PosPicture {
     render() {
         const pic = this.resource ? this.resource.picture() : null;
         if (!pic)
-            return null;
+            return h("slot", null);
         return h("pos-image", { blurredBackground: this.blurredBackground, src: pic.url, alt: this.resource.label() });
     }
     static get is() { return "pos-picture"; }

package/dist/collection/components/pos-picture/pos-picture.js.map

@@ -1 +1 @@
-{"version":3,"file":"pos-picture.js","sourceRoot":"","sources":["../../../../src/components/pos-picture/pos-picture.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAE/E,OAAO,EAAiB,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAO3E,MAAM,OAAO,UAAU;IALvB;QAME;;WAEG;QACK,sBAAiB,GAAY,KAAK,CAAC;QAU3C,oBAAe,GAAG,CAAC,QAAe,EAAE,EAAE;YACpC,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;QAC3B,CAAC,CAAC;KAOH;IAbC,iBAAiB;QACf,iBAAiB,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC;IAMD,MAAM;QACJ,MAAM,GAAG,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;QAC3D,IAAI,CAAC,GAAG;YAAE,OAAO,IAAI,CAAC;QACtB,OAAO,iBAAW,iBAAiB,EAAE,IAAI,CAAC,iBAAiB,EAAE,GAAG,EAAE,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,GAAc,CAAC;IACtH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Event, EventEmitter, State, h, Prop } from '@stencil/core';\nimport { Thing } from '@pod-os/core';\nimport { ResourceAware, subscribeResource } from '../events/ResourceAware';\n\n@Component({\n  tag: 'pos-picture',\n  shadow: true,\n  styleUrl: 'pos-picture.css',\n})\nexport class PosPicture implements ResourceAware {\n  /**\n   * Use a blurred version of the image as its own background, if the image is scaled down to fit into the container.\n   */\n  @Prop() blurredBackground: boolean = false;\n\n  @State() resource: Thing;\n\n  @Event({ eventName: 'pod-os:resource' }) subscribeResource: EventEmitter;\n\n  componentWillLoad() {\n    subscribeResource(this);\n  }\n\n  receiveResource = (resource: Thing) => {\n    this.resource = resource;\n  };\n\n  render() {\n    const pic = this.resource ? this.resource.picture() : null;\n    if (!pic) return null;\n    return <pos-image blurredBackground={this.blurredBackground} src={pic.url} alt={this.resource.label()}></pos-image>;\n  }\n}\n"]}
+{"version":3,"file":"pos-picture.js","sourceRoot":"","sources":["../../../../src/components/pos-picture/pos-picture.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAE/E,OAAO,EAAiB,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAO3E,MAAM,OAAO,UAAU;IALvB;QAME;;WAEG;QACK,sBAAiB,GAAY,KAAK,CAAC;QAU3C,oBAAe,GAAG,CAAC,QAAe,EAAE,EAAE;YACpC,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;QAC3B,CAAC,CAAC;KAOH;IAbC,iBAAiB;QACf,iBAAiB,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC;IAMD,MAAM;QACJ,MAAM,GAAG,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;QAC3D,IAAI,CAAC,GAAG;YAAE,OAAO,eAAa,CAAC;QAC/B,OAAO,iBAAW,iBAAiB,EAAE,IAAI,CAAC,iBAAiB,EAAE,GAAG,EAAE,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,GAAc,CAAC;IACtH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Event, EventEmitter, State, h, Prop } from '@stencil/core';\nimport { Thing } from '@pod-os/core';\nimport { ResourceAware, subscribeResource } from '../events/ResourceAware';\n\n@Component({\n  tag: 'pos-picture',\n  shadow: true,\n  styleUrl: 'pos-picture.css',\n})\nexport class PosPicture implements ResourceAware {\n  /**\n   * Use a blurred version of the image as its own background, if the image is scaled down to fit into the container.\n   */\n  @Prop() blurredBackground: boolean = false;\n\n  @State() resource: Thing;\n\n  @Event({ eventName: 'pod-os:resource' }) subscribeResource: EventEmitter;\n\n  componentWillLoad() {\n    subscribeResource(this);\n  }\n\n  receiveResource = (resource: Thing) => {\n    this.resource = resource;\n  };\n\n  render() {\n    const pic = this.resource ? this.resource.picture() : null;\n    if (!pic) return <slot></slot>;\n    return <pos-image blurredBackground={this.blurredBackground} src={pic.url} alt={this.resource.label()}></pos-image>;\n  }\n}\n"]}

package/dist/collection/components/pos-rich-link/pos-rich-link.js

@@ -1,10 +1,10 @@
 import { h } from "@stencil/core";
 export class PosRichLink {
     render() {
-        return (h("pos-resource", { key: '389fb8817f5a7ff77965a8bb9924f48af15c528c', lazy: true, uri: this.uri }, h("p", { key: '1946deeff38a510800ef1558fd6374f65d72cd7f', class: "content" }, h("a", { key: '776c99ca32c7cd7fac30ab1f18b1c024b234d85f', href: this.uri, onClick: e => {
+        return (h("pos-resource", { key: '73845f265bf6ce6b9245c3b1a98c169ee110b650', lazy: true, uri: this.uri }, h("p", { key: '5d2698dd9cf27cb8b81cd679196f1b65eb8b45f8', class: "content" }, h("a", { key: '26973e0fa9966c07b0568a1893aef2d35f51744a', href: this.uri, onClick: e => {
                 e.preventDefault();
                 this.linkEmitter.emit(this.uri);
-            } }, h("pos-label", { key: '0ddb22c414f2e4d61cf1beabb301b723b78235e1' })), h("span", { key: 'd2730c1fcc1c1521a7527bdb7a63c091ff49746c', class: "url" }, new URL(this.uri).host), h("pos-description", { key: '53867e57b7403aed46e94a5f3df0b8389bc68244' }))));
+            } }, h("pos-label", { key: 'f0cfb727e32f5e3c760bd06e8c3031639959ff2c' })), h("span", { key: '93bfbe0f64ceceac6f600a39827aa3387460de1f', class: "url" }, new URL(this.uri).host), h("pos-description", { key: '28a1a9afeb21720c3fe87ff5a4ad004173508a53' }))));
     }
     static get is() { return "pos-rich-link"; }
     static get encapsulation() { return "shadow"; }

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

@@ -38,7 +38,7 @@ export class PosRouter {
         this.routeChanged.emit(this.uri);
     }
     render() {
-        return h("slot", { key: 'a5a451a8ddf4a30c6e5cbb2faf61d44f5a286df9' });
+        return h("slot", { key: '8b09de3dbbd253665cd541b9f264b0dcdc774354' });
     }
     static get is() { return "pos-router"; }
     static get originalStyleUrls() {

package/dist/collection/components/pos-select-term/pos-select-term.js

@@ -19,7 +19,7 @@ export class PosSelectTerm {
         this.termSelected.emit({ uri: event.target.value });
     }
     render() {
-        return (h(Host, { key: '7f7d48443893800bb818e67865fccdbe1d10d44a' }, h("input", { key: 'ee24690418d5a4d6e357154e12685fa9975754f9', part: "input", list: "terms", placeholder: this.placeholder, value: this.value, onChange: ev => this.handleChange(ev) }), h("datalist", { key: '78fde7ccb4e0750e902da139b02810c15c21db3e', part: "terms", id: "terms" }, this.terms.map(term => (h("option", { value: term.uri }, term.shorthand))))));
+        return (h(Host, { key: '88196bb6125fb061a14058eb4b8c5ece2a479316' }, h("input", { key: '839d513d12de456412da84c6de912ecb0df1d36f', part: "input", list: "terms", placeholder: this.placeholder, value: this.value, onChange: ev => this.handleChange(ev) }), h("datalist", { key: '3b62eb3eba017b4f092f20385c3cd79f7ab3c977', part: "terms", id: "terms" }, this.terms.map(term => (h("option", { value: term.uri }, term.shorthand))))));
     }
     static get is() { return "pos-select-term"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/pos-user-menu/pos-user-menu.css

@@ -0,0 +1,24 @@
+button {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0;
+  margin: 0;
+  border: none;
+  background: none;
+  cursor: pointer;
+  border-radius: 50%;
+  pos-picture {
+    --width: 40px;
+    --height: 40px;
+    --border-radius: 50%;
+  }
+  sl-avatar {
+    --size: 40px;
+  }
+}
+
+sl-dropdown {
+  display: block;
+  --sl-color-primary-600: var(--pos-primary-color);
+}

package/dist/collection/components/pos-user-menu/pos-user-menu.js

@@ -0,0 +1,102 @@
+import { h } from "@stencil/core";
+import "./shoelace";
+export class PosUserMenu {
+    onSelect(e) {
+        const { value } = e.detail.item;
+        if (value === 'logout') {
+            this.logout.emit();
+        }
+        else if (value === 'profile') {
+            this.link.emit(this.webId);
+        }
+        else if (value === 'dashboard') {
+            this.link.emit('pod-os:dashboard');
+        }
+        else if (value === 'settings') {
+            this.link.emit('pod-os:settings');
+        }
+    }
+    render() {
+        if (!this.webId)
+            return null; //?
+        return (h("pos-resource", { uri: this.webId }, h("sl-dropdown", null, h("button", { slot: "trigger" }, h("pos-picture", null, h("sl-avatar", null))), h("sl-menu", null, h("sl-menu-item", { value: "dashboard" }, "Dashboard"), h("sl-menu-item", { value: "profile" }, h("pos-label", null)), h("sl-menu-item", { value: "settings" }, "Settings"), h("sl-divider", null), h("sl-menu-item", { value: "logout" }, "Logout")))));
+    }
+    static get is() { return "pos-user-menu"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["pos-user-menu.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["pos-user-menu.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "webId": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": true,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "web-id",
+                "reflect": false
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "logout",
+                "name": "pod-os:logout",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }, {
+                "method": "link",
+                "name": "pod-os:link",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }];
+    }
+    static get listeners() {
+        return [{
+                "name": "sl-select",
+                "method": "onSelect",
+                "target": undefined,
+                "capture": false,
+                "passive": false
+            }];
+    }
+}
+//# sourceMappingURL=pos-user-menu.js.map

package/dist/collection/components/pos-user-menu/pos-user-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pos-user-menu.js","sourceRoot":"","sources":["../../../../src/components/pos-user-menu/pos-user-menu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEhF,OAAO,YAAY,CAAC;AAOpB,MAAM,OAAO,WAAW;IAWtB,QAAQ,CAAC,CAAuE;QAC9E,MAAM,EAAE,KAAK,EAAE,GAAG,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC;QAChC,IAAI,KAAK,KAAK,QAAQ,EAAE,CAAC;YACvB,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;QACrB,CAAC;aAAM,IAAI,KAAK,KAAK,SAAS,EAAE,CAAC;YAC/B,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC7B,CAAC;aAAM,IAAI,KAAK,KAAK,WAAW,EAAE,CAAC;YACjC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;QACrC,CAAC;aAAM,IAAI,KAAK,KAAK,UAAU,EAAE,CAAC;YAChC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;QACpC,CAAC;IACH,CAAC;IAED,MAAM;QACJ,IAAI,CAAC,IAAI,CAAC,KAAK;YAAE,OAAO,IAAI,CAAC,CAAC,GAAG;QACjC,OAAO,CACL,oBAAc,GAAG,EAAE,IAAI,CAAC,KAAK;YAC3B;gBACE,cAAQ,IAAI,EAAC,SAAS;oBACpB;wBACE,oBAAuB,CACX,CACP;gBACT;oBACE,oBAAc,KAAK,EAAC,WAAW,gBAAyB;oBACxD,oBAAc,KAAK,EAAC,SAAS;wBAC3B,oBAAuB,CACV;oBACf,oBAAc,KAAK,EAAC,UAAU,eAAwB;oBACtD,qBAAyB;oBACzB,oBAAc,KAAK,EAAC,QAAQ,aAAsB,CAC1C,CACE,CACD,CAChB,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Event, EventEmitter, h, Listen, Prop } from '@stencil/core';\n\nimport './shoelace';\n\n@Component({\n  tag: 'pos-user-menu',\n  shadow: true,\n  styleUrl: 'pos-user-menu.css',\n})\nexport class PosUserMenu {\n  @Prop()\n  webId!: string;\n\n  @Event({ eventName: 'pod-os:logout' })\n  logout: EventEmitter;\n\n  @Event({ eventName: 'pod-os:link' })\n  link: EventEmitter;\n\n  @Listen('sl-select')\n  onSelect(e: CustomEvent<{ item: { value: 'profile' | 'logout' | 'dashboard' } }>) {\n    const { value } = e.detail.item;\n    if (value === 'logout') {\n      this.logout.emit();\n    } else if (value === 'profile') {\n      this.link.emit(this.webId);\n    } else if (value === 'dashboard') {\n      this.link.emit('pod-os:dashboard');\n    } else if (value === 'settings') {\n      this.link.emit('pod-os:settings');\n    }\n  }\n\n  render() {\n    if (!this.webId) return null; //?\n    return (\n      <pos-resource uri={this.webId}>\n        <sl-dropdown>\n          <button slot=\"trigger\">\n            <pos-picture>\n              <sl-avatar></sl-avatar>\n            </pos-picture>\n          </button>\n          <sl-menu>\n            <sl-menu-item value=\"dashboard\">Dashboard</sl-menu-item>\n            <sl-menu-item value=\"profile\">\n              <pos-label></pos-label>\n            </sl-menu-item>\n            <sl-menu-item value=\"settings\">Settings</sl-menu-item>\n            <sl-divider></sl-divider>\n            <sl-menu-item value=\"logout\">Logout</sl-menu-item>\n          </sl-menu>\n        </sl-dropdown>\n      </pos-resource>\n    );\n  }\n}\n"]}

package/dist/collection/components/pos-user-menu/shoelace.js

@@ -0,0 +1,6 @@
+import "@shoelace-style/shoelace/dist/components/dropdown/dropdown.js";
+import "@shoelace-style/shoelace/dist/components/menu/menu.js";
+import "@shoelace-style/shoelace/dist/components/menu-item/menu-item.js";
+import "@shoelace-style/shoelace/dist/components/avatar/avatar.js";
+import "@shoelace-style/shoelace/dist/components/divider/divider.js";
+//# sourceMappingURL=shoelace.js.map

package/dist/collection/components/pos-user-menu/shoelace.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shoelace.js","sourceRoot":"","sources":["../../../../src/components/pos-user-menu/shoelace.ts"],"names":[],"mappings":"AAAA,OAAO,+DAA+D,CAAC;AACvE,OAAO,uDAAuD,CAAC;AAC/D,OAAO,iEAAiE,CAAC;AACzE,OAAO,2DAA2D,CAAC;AACnE,OAAO,6DAA6D,CAAC","sourcesContent":["import '@shoelace-style/shoelace/dist/components/dropdown/dropdown.js';\nimport '@shoelace-style/shoelace/dist/components/menu/menu.js';\nimport '@shoelace-style/shoelace/dist/components/menu-item/menu-item.js';\nimport '@shoelace-style/shoelace/dist/components/avatar/avatar.js';\nimport '@shoelace-style/shoelace/dist/components/divider/divider.js';\n"]}

package/dist/collection/global.js

@@ -1,2 +1,8 @@
 import "@ionic/core";
+const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
+function updateTheme(e) {
+    document.documentElement.classList.toggle('sl-theme-dark', e.matches);
+}
+updateTheme(mediaQuery);
+mediaQuery.addEventListener('change', updateTheme);
 //# sourceMappingURL=global.js.map

package/dist/collection/global.js.map

@@ -1 +1 @@
-{"version":3,"file":"global.js","sourceRoot":"","sources":["../../src/global.ts"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAC","sourcesContent":["import '@ionic/core';\n"]}
+{"version":3,"file":"global.js","sourceRoot":"","sources":["../../src/global.ts"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAC;AAErB,MAAM,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAC;AAErE,SAAS,WAAW,CAAC,CAAC;IACpB,QAAQ,CAAC,eAAe,CAAC,SAAS,CAAC,MAAM,CAAC,eAAe,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC;AACxE,CAAC;AAED,WAAW,CAAC,UAAU,CAAC,CAAC;AAExB,UAAU,CAAC,gBAAgB,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC","sourcesContent":["import '@ionic/core';\n\nconst mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');\n\nfunction updateTheme(e) {\n  document.documentElement.classList.toggle('sl-theme-dark', e.matches);\n}\n\nupdateTheme(mediaQuery);\n\nmediaQuery.addEventListener('change', updateTheme);\n"]}

package/dist/components/index.js

@@ -1,6 +1,13 @@
 import { i as initialize } from './ionic-global.js';
 export { getAssetPath, setAssetPath, setNonce, setPlatformOptions } from '@stencil/core/internal/client';
 
+const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
+function updateTheme(e) {
+    document.documentElement.classList.toggle('sl-theme-dark', e.matches);
+}
+updateTheme(mediaQuery);
+mediaQuery.addEventListener('change', updateTheme);
+
 const globalFn = () => { };
 
 const globalScripts = () => {

package/dist/components/index.js.map

@@ -1 +1 @@
-{"file":"index.js","mappings":";;;;;AAEO,MAAM,aAAa,GAAG,MAAM;AACnC,EAAE,OAAO,OAAO,CAAC,GAAG,CAAC;AACrB,IAAIA,QAAoB,EAAE;AAC1B,IAAIC,UAAqB,EAAE;AAC3B,GAAG,CAAC,CAAC;AACL,CAAC;;","names":["elementsGlobalScript","ionicCoreGlobalScript"],"sources":["@stencil/core/internal/app-globals"],"sourcesContent":["import ionicCoreGlobalScript from '/home/runner/work/PodOS/PodOS/node_modules/@ionic/core/dist/collection/global/ionic-global.js';\nimport elementsGlobalScript from '/home/runner/work/PodOS/PodOS/elements/src/global.ts';\nexport const globalScripts = () => {\n  return Promise.all([\n    elementsGlobalScript(),\n    ionicCoreGlobalScript(),\n  ]);\n};\n"],"version":3}
+{"file":"index.js","mappings":";;;AAAA;AAEA;AAEA;;AAEA;AAEA,WAAW;;;;ACNJ,MAAM,aAAa,GAAG,MAAM;AACnC,EAAE,OAAO,OAAO,CAAC,GAAG,CAAC;AACrB,IAAIA,QAAoB,EAAE;AAC1B,IAAIC,UAAqB,EAAE;AAC3B,GAAG,CAAC,CAAC;AACL,CAAC;;","names":["elementsGlobalScript","ionicCoreGlobalScript"],"sources":["src/global.ts","@stencil/core/internal/app-globals"],"sourcesContent":["import '@ionic/core';\n\nconst mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');\n\nfunction updateTheme(e) {\n  document.documentElement.classList.toggle('sl-theme-dark', e.matches);\n}\n\nupdateTheme(mediaQuery);\n\nmediaQuery.addEventListener('change', updateTheme);\n","import ionicCoreGlobalScript from '/home/runner/work/PodOS/PodOS/node_modules/@ionic/core/dist/collection/global/ionic-global.js';\nimport elementsGlobalScript from '/home/runner/work/PodOS/PodOS/elements/src/global.ts';\nexport const globalScripts = () => {\n  return Promise.all([\n    elementsGlobalScript(),\n    ionicCoreGlobalScript(),\n  ]);\n};\n"],"version":3}

package/dist/components/pos-add-new-thing2.js

@@ -17,7 +17,7 @@ const PosAddNewThing = /*@__PURE__*/ proxyCustomElement(class PosAddNewThing ext
         this.dialog.showModal();
     }
     render() {
-        return (h(Host, { key: '6142a141ef03ca93a362a6b00ebe8d515c3a677a' }, h("button", { key: '72ecf353cd3a7d2d68f9ef28eb1bbe7fdb88b700', id: "new", title: "Add a new thing", onClick: () => this.openDialog() }, h("ion-icon", { key: 'bd05d75c42c10de6df519575787fc66eafb22930', name: "add-circle-outline" })), h("pos-dialog", { key: '23cf0118149704dfca16758970e4f4658e87e946', ref: el => (this.dialog = el) }, h("span", { key: '5af7b7f618cc20684c39134b5ea295400e651cb6', slot: "title" }, "Add a new thing"), h("pos-new-thing-form", { key: '895496c2f6ede3c8677d9d918e0b13582090baed', slot: "content", referenceUri: this.referenceUri }))));
+        return (h(Host, { key: '4adcc80d1a0d810279a85be26c8ec6717d91c8a2' }, h("button", { key: '9a3cdd12719c4d3e4ae1e0eff60ccd6101395d92', id: "new", title: "Add a new thing", onClick: () => this.openDialog() }, h("ion-icon", { key: 'efb2723db05962c02293931d0a334ba55908f596', name: "add-circle-outline" })), h("pos-dialog", { key: '954a947b2dc4082519c50cb71a4b6f0f3550c0fb', ref: el => (this.dialog = el) }, h("span", { key: '0a7e91bab3d8740bc8228782d70a980779db7ca1', slot: "title" }, "Add a new thing"), h("pos-new-thing-form", { key: '66ac9bcf72a71b58f4dbbc5cfd214b3609c78cbf', slot: "content", referenceUri: this.referenceUri }))));
     }
     static get style() { return PosAddNewThingStyle0; }
 }, [1, "pos-add-new-thing", {