@pod-os/elements 0.26.0 → 0.26.1-rc.2988a4e.0

package/dist/collection/apps/pos-app-browser/pos-app-browser.js.map

@@ -1 +1 @@
-{"version":3,"file":"pos-app-browser.js","sourceRoot":"","sources":["../../../../src/apps/pos-app-browser/pos-app-browser.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAMhE,MAAM,OAAO,aAAa;IAJ1B;QAKU,2BAAsB,GAAY,KAAK,CAAC;QAEhD;;;;;WAKG;QACK,SAAI,GAAyB,YAAY,CAAC;QAEzC,QAAG,GAAG,EAAE,CAAC;KAoCnB;IAlCC,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,gEAAS,sBAAsB,EAAE,IAAI,CAAC,sBAAsB;gBAC1D;oBACE,mEAAY,IAAI,EAAE,IAAI,CAAC,IAAI,4BAA0B,CAAC,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,GAAG,CAAC,CAAC,MAAM,CAAC;wBAC7E;4BACE,0EAAmB,YAAY,EAAE,IAAI,CAAC,GAAG,GAAsB;4BAC/D,2EAAoB,GAAG,EAAE,IAAI,CAAC,GAAG,KAAK,kBAAkB,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,GAAuB;4BAC/F,mEAAuB,CAChB;wBACT,+DACG,IAAI,CAAC,GAAG,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAChC,2BAAqB,GAAG,EAAE,IAAI,CAAC,GAAG,GAAI,CACvC,CAAC,CAAC,CAAC,CACF,oBAAc,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG;4BACxC,0BAAmB,CACN,CAChB,CACI;wBACP;4BACE,EAAC,IAAI,sDAAG;4BACR,+EAA0B;4BAC1B,mEAAc;4BACd,0DAAG,KAAK,EAAC,UAAU,EAAC,IAAI,EAAC,wBAAwB,sBAE7C,CACG,CACE,CACG,CACV,CACL,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF;AAED,MAAM,IAAI,GAAG,GAAG,EAAE;IAChB,OAAO,CACL,WAAK,OAAO,EAAC,aAAa,EAAC,KAAK,EAAC,4BAA4B;QAC3D,YACE,CAAC,EAAC,6CAA6C,EAC/C,KAAK,EAAE;gBACL,MAAM,EAAE,SAAS;gBACjB,QAAQ,EAAE,SAAS;gBACnB,cAAc,EAAE,IAAI;aACrB,qBACe,OAAO,GACvB;QAEF,YACE,CAAC,EAAC,0EAA0E,EAC5E,KAAK,EAAE;gBACL,MAAM,EAAE,OAAO;gBACf,QAAQ,EAAE,OAAO;gBACjB,cAAc,EAAE,IAAI;aACrB,qBACe,OAAO,GACvB;QAEF,YACE,CAAC,EAAC,gDAAgD,EAClD,KAAK,EAAE;gBACL,MAAM,EAAE,SAAS;gBACjB,QAAQ,EAAE,SAAS;gBACnB,cAAc,EAAE,IAAI;aACrB,qBACe,OAAO,GACvB,CACE,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { Component, h, Host, Prop, State } from '@stencil/core';\n\n@Component({\n  tag: 'pos-app-browser',\n  styleUrl: 'pos-app-browser.css',\n})\nexport class PosAppBrowser {\n  @Prop() restorePreviousSession: boolean = false;\n\n  /**\n   * The mode the app is running in:\n   *\n   * - standalone:  use this when you deploy it as a standalone web application\n   * - pod: use this when you host this app as a default interface for you pod\n   */\n  @Prop() mode: 'standalone' | 'pod' = 'standalone';\n\n  @State() uri = '';\n\n  render() {\n    return (\n      <Host>\n        <pos-app restorePreviousSession={this.restorePreviousSession}>\n          <pos-error-toast>\n            <pos-router mode={this.mode} onPod-os:route-changed={e => (this.uri = e.detail)}>\n              <header>\n                <pos-add-new-thing referenceUri={this.uri}></pos-add-new-thing>\n                <pos-navigation-bar uri={this.uri === 'pod-os:dashboard' ? '' : this.uri}></pos-navigation-bar>\n                <pos-login></pos-login>\n              </header>\n              <main>\n                {this.uri.startsWith('pod-os:') ? (\n                  <pos-internal-router uri={this.uri} />\n                ) : (\n                  <pos-resource key={this.uri} uri={this.uri}>\n                    <pos-type-router />\n                  </pos-resource>\n                )}\n              </main>\n              <footer>\n                <Logo />\n                <span>PodOS Browser</span>\n                <span>|</span>\n                <a class=\"settings\" href=\"?uri=pod-os%3Asettings\">\n                  ⚙ Settings\n                </a>\n              </footer>\n            </pos-router>\n          </pos-error-toast>\n        </pos-app>\n      </Host>\n    );\n  }\n}\n\nconst Logo = () => {\n  return (\n    <svg viewBox=\"0 0 400 400\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path\n        d=\"M50 350 L50 100 L200 50 L350 100 L350 350 Z\"\n        style={{\n          'fill': '#008BF8',\n          'stroke': '#008BF8',\n          'stroke-width': '70',\n        }}\n        stroke-linejoin=\"round\"\n      />\n\n      <path\n        d=\"M100 300 L100 150 L200 120 L300 150 L300 300 L130 300 L130 370 L100 370Z\"\n        style={{\n          'fill': 'white',\n          'stroke': 'white',\n          'stroke-width': '45',\n        }}\n        stroke-linejoin=\"round\"\n      />\n\n      <path\n        d=\"M150 250 L150 200 L200 180 L250 200 L250 250 Z\"\n        style={{\n          'fill': '#DC0073',\n          'stroke': '#DC0073',\n          'stroke-width': '20',\n        }}\n        stroke-linejoin=\"round\"\n      />\n    </svg>\n  );\n};\n"]}
+{"version":3,"file":"pos-app-browser.js","sourceRoot":"","sources":["../../../../src/apps/pos-app-browser/pos-app-browser.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAMhE,MAAM,OAAO,aAAa;IAJ1B;QAKU,2BAAsB,GAAY,KAAK,CAAC;QAEhD;;;;;WAKG;QACK,SAAI,GAAyB,YAAY,CAAC;QAEzC,QAAG,GAAG,EAAE,CAAC;KA0CnB;IAxCC,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,gEAAS,sBAAsB,EAAE,IAAI,CAAC,sBAAsB;gBAC1D;oBACE,mEAAY,IAAI,EAAE,IAAI,CAAC,IAAI,4BAA0B,CAAC,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,GAAG,CAAC,CAAC,MAAM,CAAC;wBAC7E;4BACE,0EAAmB,YAAY,EAAE,IAAI,CAAC,GAAG,GAAsB;4BAC/D,uEAAgB,GAAG,EAAE,IAAI,CAAC,GAAG,KAAK,kBAAkB,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,GAAmB;4BACvF,mEAAuB,CAChB;wBACT,+DAAO,IAAI,CAAC,WAAW,EAAE,CAAQ;wBACjC;4BACE,EAAC,IAAI,sDAAG;4BACR,+EAA0B;4BAC1B,mEAAc;4BACd,0DAAG,KAAK,EAAC,UAAU,EAAC,IAAI,EAAC,wBAAwB,sBAE7C,CACG,CACE,CACG,CACV,CACL,CACR,CAAC;IACJ,CAAC;IAEO,WAAW;QACjB,IAAI,IAAI,CAAC,GAAG,KAAK,EAAE,EAAE,CAAC;YACpB,OAAO,IAAI,CAAC;QACd,CAAC;QACD,IAAI,IAAI,CAAC,GAAG,CAAC,UAAU,CAAC,SAAS,CAAC,EAAE,CAAC;YACnC,OAAO,2BAAqB,GAAG,EAAE,IAAI,CAAC,GAAG,GAAI,CAAC;QAChD,CAAC;QACD,OAAO,CACL,oBAAc,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG;YACxC,0BAAmB,CACN,CAChB,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF;AAED,MAAM,IAAI,GAAG,GAAG,EAAE;IAChB,OAAO,CACL,WAAK,OAAO,EAAC,aAAa,EAAC,KAAK,EAAC,4BAA4B;QAC3D,YACE,CAAC,EAAC,6CAA6C,EAC/C,KAAK,EAAE;gBACL,MAAM,EAAE,SAAS;gBACjB,QAAQ,EAAE,SAAS;gBACnB,cAAc,EAAE,IAAI;aACrB,qBACe,OAAO,GACvB;QAEF,YACE,CAAC,EAAC,0EAA0E,EAC5E,KAAK,EAAE;gBACL,MAAM,EAAE,OAAO;gBACf,QAAQ,EAAE,OAAO;gBACjB,cAAc,EAAE,IAAI;aACrB,qBACe,OAAO,GACvB;QAEF,YACE,CAAC,EAAC,gDAAgD,EAClD,KAAK,EAAE;gBACL,MAAM,EAAE,SAAS;gBACjB,QAAQ,EAAE,SAAS;gBACnB,cAAc,EAAE,IAAI;aACrB,qBACe,OAAO,GACvB,CACE,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { Component, h, Host, Prop, State } from '@stencil/core';\n\n@Component({\n  tag: 'pos-app-browser',\n  styleUrl: 'pos-app-browser.css',\n})\nexport class PosAppBrowser {\n  @Prop() restorePreviousSession: boolean = false;\n\n  /**\n   * The mode the app is running in:\n   *\n   * - standalone: use this when you deploy it as a standalone web application\n   * - pod: use this when you host this app as a default interface for you pod\n   */\n  @Prop() mode: 'standalone' | 'pod' = 'standalone';\n\n  @State() uri = '';\n\n  render() {\n    return (\n      <Host>\n        <pos-app restorePreviousSession={this.restorePreviousSession}>\n          <pos-error-toast>\n            <pos-router mode={this.mode} onPod-os:route-changed={e => (this.uri = e.detail)}>\n              <header>\n                <pos-add-new-thing referenceUri={this.uri}></pos-add-new-thing>\n                <pos-navigation uri={this.uri === 'pod-os:dashboard' ? '' : this.uri}></pos-navigation>\n                <pos-login></pos-login>\n              </header>\n              <main>{this.mainContent()}</main>\n              <footer>\n                <Logo />\n                <span>PodOS Browser</span>\n                <span>|</span>\n                <a class=\"settings\" href=\"?uri=pod-os%3Asettings\">\n                  ⚙ Settings\n                </a>\n              </footer>\n            </pos-router>\n          </pos-error-toast>\n        </pos-app>\n      </Host>\n    );\n  }\n\n  private mainContent() {\n    if (this.uri === '') {\n      return null;\n    }\n    if (this.uri.startsWith('pod-os:')) {\n      return <pos-internal-router uri={this.uri} />;\n    }\n    return (\n      <pos-resource key={this.uri} uri={this.uri}>\n        <pos-type-router />\n      </pos-resource>\n    );\n  }\n}\n\nconst Logo = () => {\n  return (\n    <svg viewBox=\"0 0 400 400\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path\n        d=\"M50 350 L50 100 L200 50 L350 100 L350 350 Z\"\n        style={{\n          'fill': '#008BF8',\n          'stroke': '#008BF8',\n          'stroke-width': '70',\n        }}\n        stroke-linejoin=\"round\"\n      />\n\n      <path\n        d=\"M100 300 L100 150 L200 120 L300 150 L300 300 L130 300 L130 370 L100 370Z\"\n        style={{\n          'fill': 'white',\n          'stroke': 'white',\n          'stroke-width': '45',\n        }}\n        stroke-linejoin=\"round\"\n      />\n\n      <path\n        d=\"M150 250 L150 200 L200 180 L250 200 L250 250 Z\"\n        style={{\n          'fill': '#DC0073',\n          'stroke': '#DC0073',\n          'stroke-width': '20',\n        }}\n        stroke-linejoin=\"round\"\n      />\n    </svg>\n  );\n};\n"]}

package/dist/collection/apps/pos-app-dashboard/pos-getting-started/pos-getting-started.css

@@ -15,3 +15,15 @@ a {
   font-weight: var(--weight-bold);
   color: var(--pos-primary-color);
 }
+
+button.login {
+  background: none;
+  color: var(--pos-primary-color);
+  display: inline;
+  text-decoration: underline;
+  border: none;
+  padding: 0;
+  margin: 0;
+  cursor: pointer;
+  font-size: unset;
+}

package/dist/collection/apps/pos-app-dashboard/pos-getting-started/pos-getting-started.js

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class PosGettingStarted {
     render() {
-        return (h(Host, { key: 'a31a64545a5960ce8e34f0c612d2755e465c1131' }, h("div", { key: '29ec2c449fd5334e47199dece7c01c2a71ab6d98' }, h("h2", { key: 'e680003831826c8cd4615de083f9f9c305513c29' }, "Getting started \uD83D\uDE80"), h("p", { key: '8e80305087bee4c8ec05ac7cb16096caf0c61ad0' }, "\uD83D\uDD0E Enter a URL into the above navigation bar to browse through the web of data. "), h("p", { key: '4d7ba95047694e636934cb7a03c291adb0678bb6' }, "\uD83D\uDD10 Sign in to access private resources on your Solid Pod or those of your friends or coworkers.")), h("div", { key: '167ac903fa88b9be6cf00f2f5bfea23d8dfd14c9' }, h("p", { key: 'a0b06f944e534b889502a96c935686a3b7f349d0', class: "question" }, "New to Solid?"), h("p", { key: '8c26c4d20d0fcdb075ad4c0ea5ff012d22dee081' }, h("a", { key: 'd9bc5b7bfd213012078729e25e42b4ea8b970573', href: "https://solidproject.org/for-developers#hosted-pod-services" }, "Get a Pod \u2192"))), h("div", { key: '223f171699e3acf5f1c5c4819621bddc49db41f1' }, h("p", { key: 'e83cfd2b01c5abaf30f0053ef261c68ae0919f0a', class: "question" }, "Want to dig deeper into PodOS?"), h("p", { key: '8ccdbd60a250850c4105e99545f09755109ced86' }, h("a", { key: 'f72a83533b846bd8e8e798b0dd71cfc585a8d104', href: "http://pod-os.org" }, "Learn more \u2192")))));
+        return (h(Host, { key: '963476081378811bc5623921ca7f4dc5ac18b9f7' }, h("div", { key: 'df6a7a5bab3c026d1960c03a4d008f8bff0b1c9d' }, h("h2", { key: '9e7a1e2c081f87275641fe99afb72c1f8ef65115' }, "Getting started \uD83D\uDE80"), h("p", { key: 'dac8ca58a733d66ab80fa79ef59d62a254b3b83f' }, "\uD83D\uDD0E Enter a URL into the above navigation bar to browse through the web of data. "), h("p", { key: 'c90fbc4f7c09893f6ded65befe4c77f673df6db2' }, "\uD83D\uDD10", ' ', h("button", { key: '2688b10503c6d518a7a48601f35e1f20741d71c7', class: "login", onClick: () => this.login.emit() }, "Sign in"), ' ', "to access private resources on your Solid Pod or those of your friends or coworkers.")), h("div", { key: '5990c65adc978df16ec7b73c3be2b6b4b3a48ce3' }, h("p", { key: '8fd4cb0941da30c3b438338a557a6d4fb9d7ff33', class: "question" }, "New to Solid?"), h("p", { key: 'd6b06063acaac1d55dc0aea86c3d80f4e7c8ca6f' }, h("a", { key: 'b0a49b4e170c89f736cf9bd2dd567cfafbcec31c', href: "https://solidproject.org/for-developers#hosted-pod-services" }, "Get a Pod \u2192"))), h("div", { key: '7c88ea4bb3982346343cf10e6196d2d07057a24e' }, h("p", { key: '22cfb601fada05ca7b5f274f0b6a81d360344764', class: "question" }, "Want to dig deeper into PodOS?"), h("p", { key: 'fb03d0f84714feb53b1b053390a5e7b9686e610e' }, h("a", { key: '1681d6d1c860589ca1624abc3c05121ccde3f951', href: "http://pod-os.org" }, "Learn more \u2192")))));
     }
     static get is() { return "pos-getting-started"; }
     static get encapsulation() { return "shadow"; }
@@ -15,5 +15,23 @@ export class PosGettingStarted {
             "$": ["pos-getting-started.css"]
         };
     }
+    static get events() {
+        return [{
+                "method": "login",
+                "name": "pod-os:login",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }];
+    }
 }
 //# sourceMappingURL=pos-getting-started.js.map

package/dist/collection/apps/pos-app-dashboard/pos-getting-started/pos-getting-started.js.map

@@ -1 +1 @@
-{"version":3,"file":"pos-getting-started.js","sourceRoot":"","sources":["../../../../../src/apps/pos-app-dashboard/pos-getting-started/pos-getting-started.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOnD,MAAM,OAAO,iBAAiB;IAC5B,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH;gBACE,4FAA2B;gBAC3B,yJAAuF;gBACvF,wKAAsG,CAClG;YACN;gBACE,0DAAG,KAAK,EAAC,UAAU,oBAAkB;gBACrC;oBACE,0DAAG,IAAI,EAAC,6DAA6D,uBAAqB,CACxF,CACA;YACN;gBACE,0DAAG,KAAK,EAAC,UAAU,qCAAmC;gBACtD;oBACE,0DAAG,IAAI,EAAC,mBAAmB,wBAAsB,CAC/C,CACA,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host } from '@stencil/core';\n\n@Component({\n  tag: 'pos-getting-started',\n  styleUrl: 'pos-getting-started.css',\n  shadow: true,\n})\nexport class PosGettingStarted {\n  render() {\n    return (\n      <Host>\n        <div>\n          <h2>Getting started 🚀</h2>\n          <p>🔎 Enter a URL into the above navigation bar to browse through the web of data. </p>\n          <p>🔐 Sign in to access private resources on your Solid Pod or those of your friends or coworkers.</p>\n        </div>\n        <div>\n          <p class=\"question\">New to Solid?</p>\n          <p>\n            <a href=\"https://solidproject.org/for-developers#hosted-pod-services\">Get a Pod &rarr;</a>\n          </p>\n        </div>\n        <div>\n          <p class=\"question\">Want to dig deeper into PodOS?</p>\n          <p>\n            <a href=\"http://pod-os.org\">Learn more &rarr;</a>\n          </p>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"pos-getting-started.js","sourceRoot":"","sources":["../../../../../src/apps/pos-app-dashboard/pos-getting-started/pos-getting-started.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOxE,MAAM,OAAO,iBAAiB;IAI5B,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH;gBACE,4FAA2B;gBAC3B,yJAAuF;gBACvF;;oBACK,GAAG;oBACN,+DAAQ,KAAK,EAAC,OAAO,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,cAE7C;oBAAC,GAAG;2GAEX,CACA;YACN;gBACE,0DAAG,KAAK,EAAC,UAAU,oBAAkB;gBACrC;oBACE,0DAAG,IAAI,EAAC,6DAA6D,uBAAqB,CACxF,CACA;YACN;gBACE,0DAAG,KAAK,EAAC,UAAU,qCAAmC;gBACtD;oBACE,0DAAG,IAAI,EAAC,mBAAmB,wBAAsB,CAC/C,CACA,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Event, EventEmitter, h, Host } from '@stencil/core';\n\n@Component({\n  tag: 'pos-getting-started',\n  styleUrl: 'pos-getting-started.css',\n  shadow: true,\n})\nexport class PosGettingStarted {\n  @Event({ eventName: 'pod-os:login' })\n  login: EventEmitter<void>;\n\n  render() {\n    return (\n      <Host>\n        <div>\n          <h2>Getting started 🚀</h2>\n          <p>🔎 Enter a URL into the above navigation bar to browse through the web of data. </p>\n          <p>\n            🔐{' '}\n            <button class=\"login\" onClick={() => this.login.emit()}>\n              Sign in\n            </button>{' '}\n            to access private resources on your Solid Pod or those of your friends or coworkers.\n          </p>\n        </div>\n        <div>\n          <p class=\"question\">New to Solid?</p>\n          <p>\n            <a href=\"https://solidproject.org/for-developers#hosted-pod-services\">Get a Pod &rarr;</a>\n          </p>\n        </div>\n        <div>\n          <p class=\"question\">Want to dig deeper into PodOS?</p>\n          <p>\n            <a href=\"http://pod-os.org\">Learn more &rarr;</a>\n          </p>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/apps/pos-app-generic/pos-app-generic.js

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class PosAppGeneric {
     render() {
-        return (h(Host, { key: '170a57d59474ac6fa887251c96dfe64f93308e3f' }, h("section", { key: '208917e280149067f5a0c946636853f23fc83d7b' }, h("article", { key: '62c8f8a2b37455d7ec4ffc11cbb7e46b7262a6e8', "aria-labelledby": "thing-title" }, h("header", { key: '2f85c4bffecfa3e0f55ed07d98397647cfcd4acc' }, h("pos-picture", { key: '1094acb0b8cac8c9a8acaca29abeeaa5cc00aca0', blurredBackground: true }), h("h1", { key: 'eba5144dd2cf94fdfdc7514c26d68aecc8361139', id: "thing-title" }, h("pos-label", { key: 'ac03525509d037740d1b329fbaf64c68f9ea5376' })), h("pos-type-badges", { key: '0dbdb698a8a77a5a500a440142e078860b3c0681' })), h("main", { key: 'd87bfa4cf8bfb9b0ba633dff40f7d42478265cc1' }, h("pos-description", { key: 'c5c3b64864f8bc9d8e72b1a87f92bdd2435b4e41' })))), h("section", { key: 'f013653e7eafd26e6daa53c76a95d12939d356bd' }, h("pos-literals", { key: 'd34963cc5eed8c6e6baa3963009c352043f30db5' })), h("section", { key: 'ab70a3d890665c4ecfe987f35437de1a5dc3e655' }, h("pos-relations", { key: 'f8751d31a54b240cad0f089a9aea5123dc0c0bae' }), h("pos-reverse-relations", { key: '5aff024840f92393d69f0816263751efc6cb57f3' }))));
+        return (h(Host, { key: 'afbda65361df3b386348ee06a65c08b407d65708' }, h("section", { key: '78e6810a94e06e79e7f373c217de914e975d9a76' }, h("article", { key: 'daa8864317ef4354554a92d7e9de6f6bf7bbe24e', "aria-labelledby": "thing-title" }, h("header", { key: 'ca81075f3cfd0acf9915f738b691598759f554cd' }, h("pos-picture", { key: '682ea8c946bae1886a60f5985d13f3dc696d5108', blurredBackground: true }), h("h1", { key: '8e97b2c9b38c919eda5d896f2072c3ed1906daf2', id: "thing-title" }, h("pos-label", { key: '4e35e238dd6913756742f8eee0da96c7442fe12b' })), h("pos-type-badges", { key: '552b29a529807a1ea14316f620db410019b7a232' })), h("main", { key: '5ff73a76535daf5de695335adea4711f9c67355f' }, h("pos-description", { key: '3b4731fc93bd11c5221630c0547bdd1e5a78e416' })))), h("section", { key: 'e8f9950a602d197ec9bb0b28cc64ed68fd3989f4' }, h("pos-literals", { key: 'b2aae4058c620be3790cf1e4bb223667e2311247' })), h("section", { key: 'b9ad586436b66c12b562402a779289a97f3fbdd0' }, h("pos-relations", { key: '123da027d9a78aa1465d6d5bea91f671d48a8a90' }), h("pos-reverse-relations", { key: '97d3a4f3b7a276668c58aed5cee1b97683e333ce' }))));
     }
     static get is() { return "pos-app-generic"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/apps/pos-app-ldp-container/pos-app-ldp-container.js

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class PosAppLdpContainer {
     render() {
-        return (h(Host, { key: '76b7a2ab73232cbea2a7352527fd4fc35a75c66b' }, h("section", { key: '28d455d6e4b640de624a2c684133a6d4c7de2100' }, h("pos-container-contents", { key: '8e518a1122461108b3d33d66664f67feb55527c4' }), h("details", { key: '6be9b8cf613a54213e8281c0a4bf4e8235c1b4b1' }, h("summary", { key: '541ff3bbe8ec736361ea59fef319141a743c93ee' }, "All subjects"), h("pos-subjects", { key: '4e1927ea2365c354c7d1abf2eca50d892e1ac2bc' }))), h("section", { key: 'c9156ae4584e7f5803a7427b97844c3bbeae86bf' }, h("article", { key: 'c3fdc4cf0d4dd6624c63c2c6f4cf1c852a2468fc' }, h("header", { key: '4103d4a971e51942afeff1a26aca17454a962f31' }, h("h1", { key: 'eb000f4bac564b0255e28c44c112180a4558e323' }, h("pos-label", { key: '700a53e05c33d9c5a923dd5f73ecfb4ee969bc9d' })), h("pos-type-badges", { key: '15c37fc60de0e9ff1d36280da42bf0cc42c0c27c' })), h("pos-literals", { key: '4bf833339c2bedd888248e3893633496d2f61bd0' })))));
+        return (h(Host, { key: 'd1073c803fe6786740408b1e66fd415f0e26de90' }, h("section", { key: '288eaceb2e30282f9018c6bf6759586df637cfaf' }, h("pos-container-contents", { key: '9a6522288ea9df7b902dc5169ee69157a0df5840' }), h("details", { key: 'acf9410c0aec5244a2e1d1bb207aff32f9b21786' }, h("summary", { key: '27b26d9f81a9f4e20d793b28e70476063ff94374' }, "All subjects"), h("pos-subjects", { key: 'abaee22e92eabe54ea7a4b12c66419d78da0ae6d' }))), h("section", { key: '5d74265b93009aaa9cf6df0cc6fe18f5f91ca64f' }, h("article", { key: '81e460004603c914734133b39b7b77af50a439eb' }, h("header", { key: '16fa3a62c8c5cf4e0d07d57e007341679e33c195' }, h("h1", { key: 'a98c66bddb8294caa635d6c75cc7d6d28fac8b88' }, h("pos-label", { key: '9f3f29c4a49529dba5c34fb3c2e08a58c6621c7b' })), h("pos-type-badges", { key: '08866ce24fd093422a9ee6ec52ef9aa9197735e8' })), h("pos-literals", { key: '8e7dfe19b317a49a167e607e2e658b7c66e9b289' })))));
     }
     static get is() { return "pos-app-ldp-container"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/apps/pos-app-rdf-document/pos-app-rdf-document.js

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class PosAppRdfDocument {
     render() {
-        return (h(Host, { key: '9dd4b79cd54b3d2d61eea562b41a397cc1841279' }, h("section", { key: 'ec97b4983b9c45a5420b8e15b1b5d13a2b78f505' }, h("pos-subjects", { key: '7ca852dee46a4f1bb64cebccb397e2df7045be82' })), h("section", { key: '9aaf18c750b9847234ebb6d92c3c4ab605ff306e' }, h("article", { key: 'd794f6f83cfa49a37a759f0b8fa16b28038ec10b', "aria-labelledby": "doc-title" }, h("header", { key: 'bebbe27160a15351a1eabaa8c1ebb449beaa1005' }, h("h1", { key: 'cf5ba1875f2e22f162d2878789106738aac3d97c', id: "doc-title" }, h("pos-label", { key: 'fcb1a84e354ab5e2842077a6417c5b77ac9d87ed' })), h("pos-type-badges", { key: '370688f50c2906e069686d35a177c88b68de0a98' })), h("pos-literals", { key: '56bc40269a0269301603f3e9f101ad52738fca6a' })))));
+        return (h(Host, { key: '065921cc8beaab90ca56ff993a5d77673af22e18' }, h("section", { key: '9beb103877957c15a494d1604e2ae844172ddc03' }, h("pos-subjects", { key: '5e65e4c5f343e4f0a9ae124dfee4424894e181ff' })), h("section", { key: 'e8beb80dea5f126bcec14a2a3bec7b07aa7c0c15' }, h("article", { key: '38b1603b9bd834b219b4a3ab506c74a12f8d0569', "aria-labelledby": "doc-title" }, h("header", { key: 'c9818e9bd0795205821dab36057469d32e255c15' }, h("h1", { key: '2d676a39fb302e22a07c831e738d96587cfcc3a0', id: "doc-title" }, h("pos-label", { key: 'f5344016de55d828fb9a17c1e0fe43a699593244' })), h("pos-type-badges", { key: 'c273ec23e82f59a89fab79eeff367a23992796a3' })), h("pos-literals", { key: 'ffc386e8934568cf677e105f05d2a1e55d374463' })))));
     }
     static get is() { return "pos-app-rdf-document"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/apps/pos-app-settings/pos-app-settings.js

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class PosAppSettings {
     render() {
-        return h("pos-setting-offline-cache", { key: 'f065206f6291089773a19045243f04b6ce35eeb9' });
+        return h("pos-setting-offline-cache", { key: '0da588136a4c7c4238e0387bfe0649464ccd1c7d' });
     }
     static get is() { return "pos-app-settings"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/apps/pos-app-settings/pos-setting-offline-cache/pos-setting-offline-cache.js

@@ -2,7 +2,7 @@ import { h, Host } from "@stencil/core";
 import { localSettings } from "../../../store/settings";
 export class PosSettingOfflineCache {
     render() {
-        return (h(Host, { key: 'f024e7d542cfc87a4dc0a1f22694b664086ebd60' }, h("div", { key: 'e88e694cefa4a2361ca8c67f1bd023fda1b70f2a' }, h("h2", { key: 'c4b2e6270f26a2eb7f62e5076b40834903fc10e4' }, h("svg", { key: 'd63643c1ed908c6fe9ab4ff6c47b13848c714c32', xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", "stroke-width": "1.5", stroke: "currentColor" }, h("path", { key: '78f055556bb175ea17d0db1ccf78c16343d67d3f', "stroke-linecap": "round", "stroke-linejoin": "round", d: "M20.25 6.375c0 2.278-3.694 4.125-8.25 4.125S3.75 8.653 3.75 6.375m16.5 0c0-2.278-3.694-4.125-8.25-4.125S3.75 4.097 3.75 6.375m16.5 0v11.25c0 2.278-3.694 4.125-8.25 4.125s-8.25-1.847-8.25-4.125V6.375m16.5 0v3.75m-16.5-3.75v3.75m16.5 0v3.75C20.25 16.153 16.556 18 12 18s-8.25-1.847-8.25-4.125v-3.75m16.5 0c0 2.278-3.694 4.125-8.25 4.125s-8.25-1.847-8.25-4.125" })), "Cache Settings"), h("p", { key: '3045ae3214b9e91feb34857ce45a3db6529f2959', class: "info" }, "\u2139 Enable offline cache to be able to access previously loaded data while offline."), h("p", { key: '9987c1cb59b62e1eb06c67a9c646a9a2f125529a', class: "warn" }, "\u26A0 Private data may be stored on this device. Only enable it, if you trust this device."), h("label", { key: '55dd3c0fa7ece9a59437e7818d6cfa9b0e9eb5bf' }, h("input", { key: '22874f8a39b5016b71818fa1d6226bf66ff969c3', type: "checkbox", checked: localSettings.state.offlineCache, onChange: ev => (localSettings.state.offlineCache = ev.target.checked) }), "Enable offline cache"))));
+        return (h(Host, { key: 'b598a0dbe21fe9e7f1aa0f51f0b53c270feb8add' }, h("div", { key: '5cec10cc63203c8421bbb627643f1365899cc850' }, h("h2", { key: '094528da7d8567e8a2ba6e82fb1c05b2f4dc7b22' }, h("svg", { key: '3d3e8b17420ba7352877eb1c6bca17d3791b1bd6', xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", "stroke-width": "1.5", stroke: "currentColor" }, h("path", { key: '065bc78382b03bd2bcc3c812a71e9f27c4e3251c', "stroke-linecap": "round", "stroke-linejoin": "round", d: "M20.25 6.375c0 2.278-3.694 4.125-8.25 4.125S3.75 8.653 3.75 6.375m16.5 0c0-2.278-3.694-4.125-8.25-4.125S3.75 4.097 3.75 6.375m16.5 0v11.25c0 2.278-3.694 4.125-8.25 4.125s-8.25-1.847-8.25-4.125V6.375m16.5 0v3.75m-16.5-3.75v3.75m16.5 0v3.75C20.25 16.153 16.556 18 12 18s-8.25-1.847-8.25-4.125v-3.75m16.5 0c0 2.278-3.694 4.125-8.25 4.125s-8.25-1.847-8.25-4.125" })), "Cache Settings"), h("p", { key: '5e5d2ec497039791f82a857a709157e6b97efdfe', class: "info" }, "\u2139 Enable offline cache to be able to access previously loaded data while offline."), h("p", { key: 'd4ff4a3a17df1e5ed7ce076abbf98def4ebdac7d', class: "warn" }, "\u26A0 Private data may be stored on this device. Only enable it, if you trust this device."), h("label", { key: '1d1aa4f7b4b5fa53080cc5635a20ccee3faee29d' }, h("input", { key: '4223888802ea51dec26a3d23abdd9c28098de5aa', type: "checkbox", checked: localSettings.state.offlineCache, onChange: ev => (localSettings.state.offlineCache = ev.target.checked) }), "Enable offline cache"))));
     }
     static get is() { return "pos-setting-offline-cache"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/collection-manifest.json

@@ -28,7 +28,8 @@
     "components/pos-login/pos-login.js",
     "components/pos-login-form/pos-login-form.js",
     "components/pos-make-findable/pos-make-findable.js",
-    "components/pos-navigation-bar/pos-navigation-bar.js",
+    "components/pos-navigation/pos-navigation.js",
+    "components/pos-navigation/bar/pos-navigation-bar.js",
     "components/pos-new-thing-form/pos-new-thing-form.js",
     "components/pos-picture/pos-picture.js",
     "components/pos-predicate/pos-predicate.js",

package/dist/collection/components/pos-add-new-thing/pos-add-new-thing.css

@@ -9,8 +9,8 @@ button#new {
   align-items: center;
   justify-content: center;
   border: none;
-  width: var(--scale-5);
-  height: var(--scale-5);
+  width: var(--size-10);
+  height: var(--size-10);
   background-color: var(--pos-primary-color);
   color: var(--pos-primary-text-color);
   font-size: var(--scale-6);

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

@@ -4,7 +4,7 @@ export class PosAddNewThing {
         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: '5ed3ba3982467778ed2b9b02090c230acb6b1762' }, h("button", { key: '96ff5dbd0ba4ca4d8c1d25045efa06fea062e9cf', id: "new", title: "Add a new thing", onClick: () => this.openDialog() }, h("ion-icon", { key: '201a19c8ecb39e0e913d3fb8cf1ebee06bc41df5', name: "add-circle-outline" })), h("pos-dialog", { key: '421da81e6faf52119fe600cc388663299eab67ec', ref: el => (this.dialog = el) }, h("span", { key: '454e6e05dc478e9c1b378cb3308f006fab4d8738', slot: "title" }, "Add a new thing"), h("pos-new-thing-form", { key: 'a469379848776a4c7e9f8e3f94da76ba048d7fab', slot: "content", referenceUri: this.referenceUri }))));
     }
     static get is() { return "pos-add-new-thing"; }
     static get encapsulation() { return "shadow"; }

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

@@ -49,7 +49,7 @@ export class PosApp {
         }
     }
     render() {
-        return h("slot", { key: '988c393af75e8bd0f4ff2b4c04fe33b1ed686fa7' });
+        return h("slot", { key: '402887f3383b6053da157df211c28977720db8e2' });
     }
     static get is() { return "pos-app"; }
     static get properties() {

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

@@ -10,7 +10,7 @@ export class PosDialog {
         this.dialog.close();
     }
     render() {
-        return (h(Host, { key: '168dc7d1cf3feabd5f9b2b3f9add6b04467b36ef' }, h("dialog", { key: '8bbfb245d9ff066d111c116c1715be25b0907403', ref: el => (this.dialog = el) }, h("header", { key: '94e28eb2b8147cb6b2aedda0d8e6a5158117788e' }, h("slot", { key: 'a40c2d397b9f54056d4fd8089fdfcc1e446b6d61', name: "title" }), h("button", { key: 'f0f64f5aaafc331f9e3d0fb6201c453600157db1', tabindex: -1, id: "close", title: "Close", onClick: () => this.close() }, h("ion-icon", { key: 'd94a0cf3d19d7caa3717690004101e3ff4748760', name: "close-outline" }))), h("slot", { key: '3181fafe55869add4a587bf4726226055e98588d', name: "content" }))));
+        return (h(Host, { key: '307e23d3f92eae595a6bb9fd3e2487387d9b02c2' }, h("dialog", { key: '4c21714a0e2e84d809fe46b75d875c961ff8240c', ref: el => (this.dialog = el) }, h("header", { key: '0b9276c31a8deffa524a65b744d0ced04a753c1b' }, h("slot", { key: 'f4bcf72fcb25ea2619a0d7a40f524a10a91c0ca6', name: "title" }), h("button", { key: '8afb0911e29f8b4c81ff31f498266b398125327a', tabindex: -1, id: "close", title: "Close", onClick: () => this.close() }, h("ion-icon", { key: '464669b8a7f2aa1a1d274f933bb394a61abffc99', name: "close-outline" }))), h("slot", { key: 'f9fa43f73f8c295b6c728b4c7e7e3bf5c3be8948', name: "content" }))));
     }
     static get is() { return "pos-dialog"; }
     static get originalStyleUrls() {

package/dist/collection/components/pos-error-toast/pos-error-toast.js

@@ -27,7 +27,7 @@ export class PosErrorToast {
         await toast.present();
     }
     render() {
-        return (h(Host, { key: 'c1ee5f8a19177c79a3fe377fa27e4a32ffa9db9f' }, h("ion-toast", { key: '8759a3436a5caa16a11a2900a5f67d0dd205d097', trigger: "never", message: "Workarround to preload ion-toast and ion-ripple-effect to be able to show errors while offline", duration: 0 }, h("ion-ripple-effect", { key: '990aa24f2a18750ec5307498acda539b784c86c4' })), h("slot", { key: 'bea0650cc211dc2a161e7c634825adc045647d84' })));
+        return (h(Host, { key: '0dce513e04101d3b9011c635f5aab8897a246385' }, h("ion-toast", { key: '956224c61589fca317f8143055344c857aa894cf', trigger: "never", message: "Workarround to preload ion-toast and ion-ripple-effect to be able to show errors while offline", duration: 0 }, h("ion-ripple-effect", { key: 'e96e65e2f06b61970e241639e7c429a90404517e' })), h("slot", { key: '8869125c64fb97f9736e30df0a748c9ce6aec1da' })));
     }
     static get is() { return "pos-error-toast"; }
     static get encapsulation() { return "shadow"; }

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

@@ -28,7 +28,7 @@ export class PosLiterals {
         }
     }
     render() {
-        return (h(Host, { key: '26dd446e53e4157e6b635b5d711abf9ddf50b821' }, this.data.length > 0 ? (h("dl", null, 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.values.map(value => (h("dd", null, value))))))))) : null, h("pos-add-literal-value", { key: '756003351bba9399d1a53242c0153b18fc0b4b19', "onPod-os:added-literal-value": event => this.literalValueAdded(event.detail) })));
+        return (h(Host, { key: '571f571381d9a9c4bcf0188a782c46485266a3d8' }, this.data.length > 0 ? (h("dl", null, 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.values.map(value => (h("dd", null, value))))))))) : null, h("pos-add-literal-value", { key: 'e1b58aba48a56e60ec8bb1087f054972bb2c437c', "onPod-os:added-literal-value": event => this.literalValueAdded(event.detail) })));
     }
     static get is() { return "pos-literals"; }
     static get encapsulation() { return "shadow"; }

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: '5919c664924fc9020d2003b286178bbaadcbc749' }, h("div", { key: '7a4dbc59b515c9e7834a506795c51aaba1a95d4c', class: "container" }, !session.state.isLoggedIn ? (h("button", { id: "login", onClick: () => this.openDialog() }, "Login")) : (this.loggedInComponents())), h("pos-dialog", { key: 'fb0a021cc751223a3bd3bf3b7ef4efd8e14e24af', ref: el => (this.dialog = el) }, h("span", { key: '0b652f2575bb2d037e05dbdbbaade37c3229e4f9', slot: "title" }, "Sign in to your Pod"), h("pos-login-form", { key: '4927ad17b14afd59509126ae5620fc34a381829e', "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-login-form/pos-login-form.js

@@ -8,7 +8,7 @@ export class PosLoginForm {
         this.canSubmit = Boolean(this.idpUrl);
     }
     render() {
-        return (h("form", { key: '193d3790329d1480fd6b14fd55a0d8cee8ce61dd', method: "dialog", onSubmit: () => this.handleSubmit() }, h("label", { key: 'd85ea6b508c9f229e1125f8cc97092335458b94a', htmlFor: "idpUrl" }, "Please enter your Identity Provider"), h("input", { key: 'a2f5e9955b27a8c1fab14c8f087fab167a19dc9a', id: "idpUrl", type: "url", value: this.idpUrl, required: true, onInput: e => this.handleChange(e), list: "suggestedIssuers", placeholder: "Type to search..." }), h("datalist", { key: 'fa0924b31e1a4fcdc794931dd2073022ab4ce95b', id: "suggestedIssuers" }, h("option", { key: 'c3495be7c2a98494ac3ca7fe504edd4b1b232394', value: "https://solidcommunity.net" }, "solidcommunity.net"), h("option", { key: '7fd17434388ed31468df8682dcfc2b4263c27ccb', value: "https://solidweb.org" }, "solidweb.org"), h("option", { key: '4c2a5854fc2499198b289181136cbd0a2fd9c1e1', value: "https://solidweb.me" }, "solidweb.me"), h("option", { key: '02a81104db23c62e0d42b8b45b95eccbd16fc108', value: "https://inrupt.net" }, "inrupt.net"), h("option", { key: 'd7c15dca86800cafc5a974920e40bd117fa50194', value: "https://login.inrupt.com" }, "Inrupt PodSpaces"), h("option", { key: '93ff71136f1775098fda80db5d437f37b51c496f', value: "https://trinpod.us" }, "trinpod.us"), h("option", { key: '481f1630526e324cb24b38c0077b1aeb496b4690', value: "https://use.id" }, "use.id"), h("option", { key: 'abd85ffba7532ba488bf0a4c18a2da2f3dc481ee', value: "https://solid.redpencil.io" }, "redpencil.io"), h("option", { key: '339562d277c4af2e10344f385d00aa4cc37375fa', value: "https://datapod.grant.io" }, "Data Pod (grant.io)"), h("option", { key: '918224ac5af806666a7b77bc8049dcf79800ab8c', value: "https://teamid.live" }, "teamid.live")), h("input", { key: '1ad3ef7998237d30c5eaf5bc9eebe55ede09d0a8', id: "login", type: "submit", value: "Login", disabled: !this.canSubmit })));
+        return (h("form", { key: 'ddd05b4f905b65b2b5da556b3e9562bbff1812b0', method: "dialog", onSubmit: () => this.handleSubmit() }, h("label", { key: 'a23f430387db8339efe42d680d0659122b4503c2', htmlFor: "idpUrl" }, "Please enter your Identity Provider"), h("input", { key: '23c7209c3a4ecd79f305dc23961508f41ede85d3', id: "idpUrl", type: "url", value: this.idpUrl, required: true, onInput: e => this.handleChange(e), list: "suggestedIssuers", placeholder: "Type to search..." }), h("datalist", { key: '663730bddeb65eb5c58116ea329e00eee4b64a0f', id: "suggestedIssuers" }, h("option", { key: '71f0b94980ae6b38732f5f4319e1a5d4dad36f77', value: "https://solidcommunity.net" }, "solidcommunity.net"), h("option", { key: 'a18600e5fd7c6892f64b1b8e70480d564e9c39f6', value: "https://solidweb.org" }, "solidweb.org"), h("option", { key: '5528ee847f979c29d8d9725a13d51f7ae88cb82c', value: "https://solidweb.me" }, "solidweb.me"), h("option", { key: '9f1b85fbc78dc9870112053c61ece17d20dd89ec', value: "https://inrupt.net" }, "inrupt.net"), h("option", { key: '6bdaac53eae2b6830a2146e980542565dead33b7', value: "https://login.inrupt.com" }, "Inrupt PodSpaces"), h("option", { key: 'd5f243d1e7656bbca35b1c9920d4e2b867abed68', value: "https://trinpod.us" }, "trinpod.us"), h("option", { key: '1a9f2aab20d25a09b31ae47858c638e065ac27b5', value: "https://use.id" }, "use.id"), h("option", { key: 'f275d341b26be71158d6e5bd44ed138f54da823e', value: "https://solid.redpencil.io" }, "redpencil.io"), h("option", { key: '0945f4829972e9bdb37deb406d24d63e5bf30e8f', value: "https://datapod.grant.io" }, "Data Pod (grant.io)"), h("option", { key: '4cce12430b365c241a126ece63865c8dfa6e195e', value: "https://teamid.live" }, "teamid.live")), h("input", { key: 'd46215b8314e845b4ba6df750537ec6c8a14f8ed', id: "login", type: "submit", value: "Login", disabled: !this.canSubmit })));
     }
     handleChange(event) {
         this.validate();

package/dist/collection/components/pos-make-findable/pos-make-findable.css

@@ -8,11 +8,11 @@ button.main {
   max-width: var(--size-40);
   flex-direction: row;
   overflow: hidden;
-  height: var(--size-8);
-  width: var(--size-8);
+  height: var(--pos-navigation-bar-height);
+  width: var(--pos-navigation-bar-height);
   align-items: center;
   justify-content: center;
-  border-radius: var(--radius-xs);
+  border-radius: var(--radius-md);
   color: var(--pos-subtle-text-color);
   border: var(--size-px) dashed var(--pos-subtle-text-color);
   background-color: var(--pos-background-color);
@@ -35,6 +35,9 @@ button.main {
     transform: scale(0.99);
     filter: brightness(90%);
   }
+  &:focus {
+    outline: var(--pos-input-focus-outline);
+  }
 }
 
 .options {
@@ -96,7 +99,7 @@ button.open {
     background: var(--color-green-200);
   }
   width: var(--size-full);
-  height: var(--size-8);
+  height: var(--pos-navigation-bar-height);
   background: var(--pos-background-color);
   color: var(--pos-normal-text-color);
 

package/dist/collection/components/pos-navigation/__test/typeToSearch.js

@@ -0,0 +1,12 @@
+import { fireEvent } from "@testing-library/dom";
+export async function typeToSearch(page, text) {
+    jest.useFakeTimers();
+    const searchBar = page.root.querySelector('input');
+    searchBar.value = text;
+    // @ts-ignore
+    fireEvent(searchBar, new CustomEvent('change', { target: { value: text } }));
+    jest.advanceTimersByTime(300); // advance debounce time
+    jest.useRealTimers();
+    await page.waitForChanges();
+}
+//# sourceMappingURL=typeToSearch.js.map

package/dist/collection/components/pos-navigation/__test/typeToSearch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"typeToSearch.js","sourceRoot":"","sources":["../../../../../src/components/pos-navigation/__test/typeToSearch.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAEjD,MAAM,CAAC,KAAK,UAAU,YAAY,CAAC,IAAI,EAAE,IAAY;IACnD,IAAI,CAAC,aAAa,EAAE,CAAC;IACrB,MAAM,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IACnD,SAAS,CAAC,KAAK,GAAG,IAAI,CAAC;IACvB,aAAa;IACb,SAAS,CAAC,SAAS,EAAE,IAAI,WAAW,CAAC,QAAQ,EAAE,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC;IAC7E,IAAI,CAAC,mBAAmB,CAAC,GAAG,CAAC,CAAC,CAAC,wBAAwB;IACvD,IAAI,CAAC,aAAa,EAAE,CAAC;IACrB,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;AAC9B,CAAC","sourcesContent":["import { fireEvent } from '@testing-library/dom';\n\nexport async function typeToSearch(page, text: string) {\n  jest.useFakeTimers();\n  const searchBar = page.root.querySelector('input');\n  searchBar.value = text;\n  // @ts-ignore\n  fireEvent(searchBar, new CustomEvent('change', { target: { value: text } }));\n  jest.advanceTimersByTime(300); // advance debounce time\n  jest.useRealTimers();\n  await page.waitForChanges();\n}\n"]}

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

@@ -0,0 +1,38 @@
+section.current {
+  display: flex;
+  height: var(--pos-navigation-bar-height);
+  flex-grow: 1;
+  gap: 0;
+  background-color: var(--pos-input-background-color);
+  border-radius: var(--radius-md);
+  width: 100%;
+  &:focus-within {
+    outline: var(--pos-input-focus-outline);
+  }
+}
+
+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);
+  outline: none;
+  border: none;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  &: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

@@ -0,0 +1,105 @@
+import { h } from "@stencil/core";
+export class PosNavigationBar {
+    onClick() {
+        this.navigate.emit(this.current);
+    }
+    activate(e) {
+        if ((e.ctrlKey || e.metaKey) && e.key === 'k') {
+            e.preventDefault();
+            this.navigate.emit(this.current);
+        }
+    }
+    render() {
+        const ariaLabel = this.current ? `${this.current.label()} (Click to search or enter URI)` : 'Search or enter URI';
+        return (h("section", { key: '1b507d50bd24f257023fe980f1ffdb3abe903577', class: "current" }, this.current && this.searchIndexReady && h("pos-make-findable", { key: 'e96559f40418154a26350705ae6e3dbf8057a424', uri: this.current.uri }), h("button", { key: '2ac476bd89918e71ca10cc945952f8c9905865df', "aria-label": ariaLabel, onClick: () => this.onClick() }, h("div", { key: 'd34b73e2090f08cab8533d03a7b206d420bfa8c2' }, 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"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["pos-navigation-bar.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["pos-navigation-bar.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "current": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "Thing",
+                    "resolved": "Thing",
+                    "references": {
+                        "Thing": {
+                            "location": "import",
+                            "path": "@pod-os/core",
+                            "id": "../core/types/index.d.ts::Thing"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false
+            },
+            "searchIndexReady": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "search-index-ready",
+                "reflect": false
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "navigate",
+                "name": "pod-os:navigate",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }];
+    }
+    static get listeners() {
+        return [{
+                "name": "keydown",
+                "method": "activate",
+                "target": "document",
+                "capture": false,
+                "passive": false
+            }];
+    }
+}
+//# sourceMappingURL=pos-navigation-bar.js.map

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

@@ -0,0 +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;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"]}