@pod-os/elements 0.25.2 → 0.25.3-rc.2f9e99a.0

package/dist/esm/ion-card_34.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, d as getElement, e as getAssetPath, f as readTask, w as writeTask, i as createEvent, j as forceUpdate, k as getRenderingRef } from './index-4fdc2561.js';
-import { i as inheritAttributes$1, c as clamp, d as debounceEvent, a as componentOnReady, r as raf, g as getElementRoot } from './helpers-a93a8cd2.js';
+import { i as inheritAttributes$1, c as clamp, d as debounceEvent, a as componentOnReady, r as raf, g as getElementRoot } from './helpers-c51da066.js';
 import { o as openURL, c as createColorClasses$1, h as hostContext, g as getClassMap } from './theme-d75c68ae.js';
 import { g as getIonMode$1, c as config$1 } from './ionic-global-df0a32a5.js';
 import { i as isRTL$1 } from './dir-f50ace98.js';
@@ -7,8 +7,8 @@ import { a as arrowBackSharp, c as closeCircle, b as closeSharp, s as searchOutl
 import { E as ENABLE_HTML_CONTENT_DEFAULT, s as sanitizeDOMString } from './index-ce4e7029.js';
 import { c as createLockController } from './lock-controller-10217ff6.js';
 import { p as printIonWarning } from './index-f7ac0403.js';
-import { O as OVERLAY_GESTURE_PRIORITY, c as createDelegateController, a as createTriggerController, i as isCancel, p as prepareOverlay, s as setOverlayId, b as present, d as dismiss, e as eventMethod, f as safeCall, G as GESTURE, t as toastController } from './overlays-75a54062.js';
-import { c as createAnimation } from './animation-8c622dae.js';
+import { O as OVERLAY_GESTURE_PRIORITY, c as createDelegateController, a as createTriggerController, i as isCancel, p as prepareOverlay, s as setOverlayId, b as present, d as dismiss, e as eventMethod, f as safeCall, G as GESTURE, t as toastController } from './overlays-4b3bb757.js';
+import { c as createAnimation } from './animation-43b39c85.js';
 import { w as win } from './index-6b94f340.js';
 import { createGesture } from './index-38fe935b.js';
 import { c as createStore$1, s as store, B as BrokenFile } from './BrokenFile-f46cbf25.js';
@@ -17,7 +17,7 @@ import { s as subscribeResource } from './ResourceAware-5f237305.js';
 import './gesture-controller-958242a2.js';
 import { s as subscribePodOs } from './PodOsAware-132573cd.js';
 import './hardware-back-button-41efa076.js';
-import './framework-delegate-b5751311.js';
+import './framework-delegate-c5179013.js';
 
 const cardIosCss = ":host{--ion-safe-area-left:0px;--ion-safe-area-right:0px;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:block;position:relative;background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit);contain:content;overflow:hidden}:host(.ion-color){background:var(--ion-color-base);color:var(--ion-color-contrast)}:host(.card-disabled){cursor:default;opacity:0.3;pointer-events:none}.card-native{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;display:block;width:100%;min-height:var(--min-height);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);outline:none;background:inherit}.card-native::-moz-focus-inner{border:0}button,a{cursor:pointer;user-select:none;-webkit-user-drag:none}ion-ripple-effect{color:var(--ripple-color)}:host{--background:var(--ion-card-background, var(--ion-item-background, var(--ion-background-color, #fff)));--color:var(--ion-card-color, var(--ion-item-color, var(--ion-color-step-600, #666666)));-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:24px;margin-bottom:24px;border-radius:8px;transition:transform 500ms cubic-bezier(0.12, 0.72, 0.29, 1);font-size:0.875rem;box-shadow:0 4px 16px rgba(0, 0, 0, 0.12)}:host(.ion-activated){transform:scale3d(0.97, 0.97, 1)}";
 const IonCardIosStyle0 = cardIosCss;
@@ -1915,7 +1915,7 @@ const PosAddNewThing = class {
         this.dialog.showModal();
     }
     render() {
-        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 }))));
+        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 }))));
     }
 };
 PosAddNewThing.style = PosAddNewThingStyle0;
@@ -3246,11 +3246,11 @@ const PosApp = class {
         }
     }
     render() {
-        return h("slot", { key: 'eb7dfaa67c538b3e3e33f42556c1b604fc964729' });
+        return h("slot", { key: '402887f3383b6053da157df211c28977720db8e2' });
     }
 };
 
-const posAppBrowserCss = "pos-router {\n  margin: 0;\n  padding: 0;\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n}\n\npos-navigation-bar {\n  max-width: var(--width-lg);\n  margin: 0;\n}\n\npos-add-new-thing,\npos-login {\n  flex: 0 1 auto; /* Behält die Breite des Inhalts bei */\n}\n\nheader,\nfooter {\n  display: flex;\n  gap: var(--size-1);\n  height: auto;\n  justify-content: center;\n  align-items: center;\n  padding: var(--size-1);\n}\n\nfooter svg {\n  width: var(--size-5);\n  height: var(--size-5);\n}\n\nfooter {\n  font-size: var(--scale-fluid-000);\n\n  .settings {\n    padding: 0 var(--size-1);\n    text-decoration: none;\n    border: 1px solid var(--color-grey-800);\n    color: var(--color-grey-800);\n    border-radius: var(--radius-xs);\n\n    &:hover {\n      background-color: var(--color-grey-800);\n      color: white;\n    }\n  }\n}\n\nheader {\n  flex-wrap: wrap;\n  padding: 0 var(--size-8);\n}\n\nmain {\n  flex: 1;\n  max-height: 100vh;\n  overflow: auto;\n}\n\n@media (max-width: 640px) {\n  header {\n    padding: 0 var(--size-1) var(--size-1);\n    justify-content: space-between;\n  }\n\n  pos-navigation-bar {\n    flex-basis: 100%;\n    order: 0;\n  }\n\n  pos-add-new-thing,\n  pos-login {\n    order: 1;\n  }\n}\n";
+const posAppBrowserCss = "pos-router {\n  margin: 0;\n  padding: 0;\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n}\n\npos-navigation-bar {\n  max-width: var(--width-lg);\n  margin: 0;\n}\n\npos-add-new-thing,\npos-login {\n  flex: 0 1 auto; /* Behält die Breite des Inhalts bei */\n}\n\nheader,\nfooter {\n  display: flex;\n  gap: var(--size-1);\n  height: auto;\n  justify-content: center;\n  align-items: center;\n  padding: var(--size-1);\n}\n\nfooter svg {\n  width: var(--size-5);\n  height: var(--size-5);\n}\n\nfooter {\n  font-size: var(--scale-fluid-000);\n\n  .settings {\n    padding: 0 var(--size-1);\n    text-decoration: none;\n    background-color: var(--pos-background-color);\n    border: 1px solid var(--pos-secondary-border-color);\n    color: var(--pos-secondary-border-color);\n    border-radius: var(--radius-xs);\n\n    &:hover {\n      background-color: var(--pos-secondary-border-color);\n      color: var(--pos-background-color);\n    }\n  }\n}\n\nheader {\n  flex-wrap: wrap;\n  padding: 0 var(--size-8);\n}\n\nmain {\n  flex: 1;\n  max-height: 100vh;\n  overflow: auto;\n}\n\n@media (max-width: 640px) {\n  header {\n    padding: 0 var(--size-1) var(--size-1);\n    justify-content: space-between;\n  }\n\n  pos-navigation-bar {\n    flex-basis: 100%;\n    order: 0;\n  }\n\n  pos-add-new-thing,\n  pos-login {\n    order: 1;\n  }\n}\n";
 const PosAppBrowserStyle0 = posAppBrowserCss;
 
 const PosAppBrowser = class {
@@ -3287,7 +3287,7 @@ const Logo = () => {
 };
 PosAppBrowser.style = PosAppBrowserStyle0;
 
-const posAppDashboardCss = ":host{display:grid;grid-template-columns:repeat(auto-fit, minmax(var(--size-12), var(--size-96)));gap:var(--size-4);padding:var(--size-2);justify-content:center;align-items:start;justify-items:stretch;height:100%;background:linear-gradient(230deg, rgb(251, 251, 255) 0%, rgb(215, 223, 252) 100%)}";
+const posAppDashboardCss = ":host{display:grid;grid-template-columns:repeat(auto-fit, minmax(var(--size-12), var(--size-96)));gap:var(--size-4);padding:var(--size-2);justify-content:center;align-items:start;justify-items:stretch}";
 const PosAppDashboardStyle0 = posAppDashboardCss;
 
 const PosAppDashboard = class {
@@ -3300,7 +3300,7 @@ const PosAppDashboard = class {
 };
 PosAppDashboard.style = PosAppDashboardStyle0;
 
-const posAppSettingsCss = ":host{display:grid;grid-template-columns:repeat(auto-fit, minmax(var(--size-12), var(--size-96)));gap:var(--size-4);padding:var(--size-2);justify-content:center;align-items:start;justify-items:stretch;height:100%;background:linear-gradient(230deg, rgb(251, 251, 255) 0%, rgb(215, 223, 252) 100%)}";
+const posAppSettingsCss = ":host{display:grid;grid-template-columns:repeat(auto-fit, minmax(var(--size-12), var(--size-96)));gap:var(--size-4);padding:var(--size-2);justify-content:center;align-items:start;justify-items:stretch}";
 const PosAppSettingsStyle0 = posAppSettingsCss;
 
 const PosAppSettings = class {
@@ -3308,7 +3308,7 @@ const PosAppSettings = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return h("pos-setting-offline-cache", { key: '83d824c60d1eb9e2d60b0d7255dda841ad9c6164' });
+        return h("pos-setting-offline-cache", { key: '0da588136a4c7c4238e0387bfe0649464ccd1c7d' });
     }
 };
 PosAppSettings.style = PosAppSettingsStyle0;
@@ -3329,7 +3329,7 @@ const PosDescription = class {
     }
 };
 
-const posDialogCss = "dialog{background-color:var(--pos-background-color);border:none;border-radius:var(--radius-md);box-shadow:var(--shadow-md);max-width:var(--width-xs)}dialog header>:first-child{flex-grow:1;font-weight:var(--weight-light);font-size:var(--scale-2);font-family:var(--font-sans);margin:0}dialog header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:var(--scale-0);border-bottom-style:inset;padding:0 0 var(--scale-0) 0}dialog>:last-child{display:block;margin-top:var(--scale-3)}button#close{cursor:pointer;display:flex;align-items:center;justify-content:center;border:none;background:none;font-size:var(--scale-3);color:var(--color-grey-500)}button#close:hover{color:var(--color-grey-800)}";
+const posDialogCss = "dialog{background-color:var(--pos-background-color);color:var(--pos-normal-text-color);border:none;border-radius:var(--radius-md);box-shadow:var(--shadow-md);max-width:var(--width-xs);animation:slideIn 0.2s ease-out}dialog::backdrop{background:rgba(0, 0, 0, 0.5);backdrop-filter:var(--blur-sm);animation:fadeIn 0.2s ease-out}@media (prefers-color-scheme: dark){dialog::backdrop{background:rgb(100, 100, 100, 0.5)}}dialog header>:first-child{flex-grow:1;font-weight:var(--weight-light);font-size:var(--scale-2);font-family:var(--font-sans);margin:0}dialog header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:var(--scale-0);border-bottom-style:inset;padding:0 0 var(--scale-0) 0}dialog>:last-child{display:block;margin-top:var(--scale-3)}button#close{cursor:pointer;display:flex;align-items:center;justify-content:center;border:none;background:none;font-size:var(--scale-3);color:var(--color-grey-500)}button#close:hover{color:var(--pos-secondary-border-color)}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes slideIn{from{opacity:0;transform:translateY(-20px) scale(0.95)}to{opacity:1;transform:translateY(0) scale(1)}}";
 const PosDialogStyle0 = posDialogCss;
 
 const PosDialog = class {
@@ -3343,7 +3343,7 @@ const PosDialog = class {
         this.dialog.close();
     }
     render() {
-        return (h(Host, { key: '097959e50499628b0b3e9be024cd415d25182303' }, h("dialog", { key: '0ac068acd6392cfc57f9e3bff866a6c865dcafe3', ref: el => (this.dialog = el) }, h("header", { key: '0cf470448e42f04c8a839eb67eec5a0708e306cb' }, h("slot", { key: '3f3f457ff9130c66ac31e21da74f9ffa9cc42a06', name: "title" }), h("button", { key: 'd420ee61dc91d4f193048f6c89351121c0337446', tabindex: -1, id: "close", title: "Close", onClick: () => this.close() }, h("ion-icon", { key: '9a775752b1678654b3446b964fe83ca15d8722ca', name: "close-outline" }))), h("slot", { key: '464e9fefd0dc8c32b52399358ff250e1982bdf36', 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" }))));
     }
 };
 PosDialog.style = PosDialogStyle0;
@@ -3378,11 +3378,11 @@ const PosErrorToast = class {
         await toast.present();
     }
     render() {
-        return (h(Host, { key: 'ca253ac051cc38f56c8db1224fea075293f796b4' }, h("ion-toast", { key: '060b78fd54963782be40abca4592c5871fc84d82', 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: '45f799c8d1f36ad3f11a62485677fc38eb01857b' })), h("slot", { key: '02c6e3ad7cce764de694579056fc1fe1d97dfa32' })));
+        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' })));
     }
 };
 
-const posExampleResourcesCss = ":host{border:var(--size-px) solid var(--color-grey-100);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:var(--size-8);max-width:var(--size-96);background:var(--color-white)}.links{display:flex;flex-direction:column;gap:var(--size-3);max-width:80vw}";
+const posExampleResourcesCss = ":host{border:var(--size-px) solid var(--pos-border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:var(--size-8);max-width:var(--size-96);background:var(--pos-card-background)}.links{display:flex;flex-direction:column;gap:var(--size-3);max-width:80vw}";
 const PosExampleResourcesStyle0 = posExampleResourcesCss;
 
 const PosExampleResources = class {
@@ -3395,7 +3395,7 @@ const PosExampleResources = class {
 };
 PosExampleResources.style = PosExampleResourcesStyle0;
 
-const posGettingStartedCss = ":host{border:var(--size-px) solid var(--color-grey-100);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:var(--size-8);max-width:var(--size-96);background:var(--color-white)}.question{font-weight:var(--weight-semibold);color:var(--color-grey-900)}a{font-weight:var(--weight-bold);color:var(--pos-primary-color)}";
+const posGettingStartedCss = ":host{border:var(--size-px) solid var(--pos-border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:var(--size-8);max-width:var(--size-96);background:var(--pos-card-background)}.question{font-weight:var(--weight-semibold)}a{font-weight:var(--weight-bold);color:var(--pos-primary-color)}";
 const PosGettingStartedStyle0 = posGettingStartedCss;
 
 const PosGettingStarted = class {
@@ -3533,12 +3533,12 @@ const PosLogin = class {
         this.dialog.showModal();
     }
     render() {
-        return (h(Host, { key: '246bea632b952b0a004e1237697a86bd0ebfeea4' }, h("div", { key: 'cdcb1905deb0d27f79adc4ed1eeae0adb47b37f6', class: "container" }, store.state.isLoggedIn ? (h("pos-resource", { uri: store.state.webId }, h("span", { class: "user-data" }, h("pos-picture", null), h("pos-label", null)))) : (''), !store.state.isLoggedIn && (h("button", { key: 'dc3a1072af920e9495a2e003c1e2edf8d282de29', id: "login", onClick: () => this.openDialog() }, "Login")), store.state.isLoggedIn && (h("button", { key: 'ca04ffb1126cd26d1c80060673c036048b403c82', id: "logout", onClick: () => this.logout() }, "Logout"))), h("pos-dialog", { key: 'f832ac8272a695e1bcf826d5aa5d62843bfb4de5', ref: el => (this.dialog = el) }, h("span", { key: 'd2dd84554a068af4a044cba963aa4417b8232d93', slot: "title" }, "Sign in to your Pod"), h("pos-login-form", { key: '98b542c2ddc6828fe99857632ee90a0dae6fdf96', "onPod-os:idp-url-selected": ev => this.login(ev), slot: "content" }))));
+        return (h(Host, { key: 'a4fffd431e401c0acba29cd336715b24fa2bed67' }, h("div", { key: '31aaebc9eeacbf274d72bb42f9bca15691bf1590', class: "container" }, store.state.isLoggedIn ? (h("pos-resource", { uri: store.state.webId }, h("span", { class: "user-data" }, h("pos-picture", null), h("pos-label", null)))) : (''), !store.state.isLoggedIn && (h("button", { key: '8680aa6b62740fea847d85e12e05573ba44e37ce', id: "login", onClick: () => this.openDialog() }, "Login")), store.state.isLoggedIn && (h("button", { key: '3f1af02cd8e77910d4469c1ab83a4fc844c3bae2', id: "logout", onClick: () => this.logout() }, "Logout"))), h("pos-dialog", { key: '732816c365ae37b144fd56c0146dd9970336dc2a', ref: el => (this.dialog = el) }, h("span", { key: '7598a5abff7af257779111cac31ee879eb47dfd4', slot: "title" }, "Sign in to your Pod"), h("pos-login-form", { key: 'cb1297076cf78aafad0dba1b5c111bf9c68e717b', "onPod-os:idp-url-selected": ev => this.login(ev), slot: "content" }))));
     }
 };
 PosLogin.style = PosLoginStyle0;
 
-const posLoginFormCss = ":host{display:block;margin:0}form{display:flex;flex-direction:column;gap:var(--size-4)}input{outline:var(--pos-input-outline);padding:var(--scale-000);border:none;border-radius:var(--radius-xs);width:var(--size-full);box-sizing:border-box}input:focus-within{outline:var(--pos-input-focus-outline)}input#login{outline:none;box-shadow:var(--shadow-sm);cursor:pointer;color:var(--pos-primary-text-color);background-color:var(--pos-primary-color)}input#login:disabled{cursor:default;color:var(--pos-disabled-text-color);background-color:var(--pos-disabled-color);box-shadow:none}input#login:hover:not(:disabled),input#login:focus{filter:brightness(110%);box-shadow:var(--shadow-md)}";
+const posLoginFormCss = ":host{display:block;margin:0}form{display:flex;flex-direction:column;gap:var(--size-4)}input{outline:var(--pos-input-outline);padding:var(--scale-000);border:none;border-radius:var(--radius-xs);width:var(--size-full);box-sizing:border-box;background:var(--pos-input-background-color);color:var(--pos-normal-text-color)}input:focus-within{outline:var(--pos-input-focus-outline)}input#login{outline:none;box-shadow:var(--shadow-sm);cursor:pointer;color:var(--pos-primary-text-color);background-color:var(--pos-primary-color)}input#login:disabled{cursor:default;color:var(--pos-disabled-text-color);background-color:var(--pos-disabled-color);box-shadow:none}input#login:hover:not(:disabled),input#login:focus{filter:brightness(110%);box-shadow:var(--shadow-md)}";
 const PosLoginFormStyle0 = posLoginFormCss;
 
 const PosLoginForm = class {
@@ -3552,7 +3552,7 @@ const PosLoginForm = class {
         this.canSubmit = Boolean(this.idpUrl);
     }
     render() {
-        return (h("form", { key: 'ad94a827203fead2cc5976e65d5dd11b76929a37', method: "dialog", onSubmit: () => this.handleSubmit() }, h("label", { key: '042115e98ac3dc97aa941b9a086a930c532bab19', htmlFor: "idpUrl" }, "Please enter your Identity Provider"), h("input", { key: '45a4621d9a21a5b21ec82f81025b2be68d5505ae', id: "idpUrl", type: "url", value: this.idpUrl, required: true, onInput: e => this.handleChange(e), list: "suggestedIssuers", placeholder: "Type to search..." }), h("datalist", { key: '1f4dd4962470e796d1a175ea2ec2d03663390a0d', id: "suggestedIssuers" }, h("option", { key: 'f00f189f9f7babbda5c109a57d380d4d44d68f79', value: "https://solidcommunity.net" }, "solidcommunity.net"), h("option", { key: 'a0a1e4171ef87cd219cb8f0c68b68d0901d3fa55', value: "https://solidweb.org" }, "solidweb.org"), h("option", { key: '4361294b71ba9b7b123dd5d1deb2692b2edfa59e', value: "https://solidweb.me" }, "solidweb.me"), h("option", { key: '0fcee23d732415ef206d8c9a4d18c31f2bcd8eca', value: "https://inrupt.net" }, "inrupt.net"), h("option", { key: '267b177e9765e09ee2aa592c8a4d4c152ad7fb0b', value: "https://login.inrupt.com" }, "Inrupt PodSpaces"), h("option", { key: '302a4d517fedeafb146d9f8a3938383c57e24f7e', value: "https://trinpod.us" }, "trinpod.us"), h("option", { key: '83fd1b92688b24f575d3ee17a9cb394c8ab16eab', value: "https://use.id" }, "use.id"), h("option", { key: '007f814795f747d9b74f7b16db986502a9b746af', value: "https://solid.redpencil.io" }, "redpencil.io"), h("option", { key: '5477d60737d194bce4c50f24a75930427b6dc9bb', value: "https://datapod.grant.io" }, "Data Pod (grant.io)"), h("option", { key: 'e289736fcc31902f783efae443f17dfda532ba9f', value: "https://teamid.live" }, "teamid.live")), h("input", { key: '69a61d727a4e2c88a7f3594b98cca42f934b649a', id: "login", type: "submit", value: "Login", disabled: !this.canSubmit })));
+        return (h("form", { key: '6c54aa03972bf5af3779c1e3f874b99574232821', method: "dialog", onSubmit: () => this.handleSubmit() }, h("label", { key: 'a5def7569abeb0a2591886d48fa0deb2c7f6039c', htmlFor: "idpUrl" }, "Please enter your Identity Provider"), h("input", { key: '1da8575dccea9a777f00cb8a7f96435654a582bc', id: "idpUrl", type: "url", value: this.idpUrl, required: true, onInput: e => this.handleChange(e), list: "suggestedIssuers", placeholder: "Type to search..." }), h("datalist", { key: '1818988df2f8a825194eb3503979d6c6adac3619', id: "suggestedIssuers" }, h("option", { key: '25e1b3fd84610e0664c25c3ca9cd535bf7558357', value: "https://solidcommunity.net" }, "solidcommunity.net"), h("option", { key: '5635e434dc4bf406a3664cf5cb28489b5b9218fc', value: "https://solidweb.org" }, "solidweb.org"), h("option", { key: 'd4d301023b40f84b5f445d14290ef3bc589cff56', value: "https://solidweb.me" }, "solidweb.me"), h("option", { key: '39f968af206347c83e4271724e9090543fcec43e', value: "https://inrupt.net" }, "inrupt.net"), h("option", { key: '381767d06a60e16b9323cb15b4298db2eac71d82', value: "https://login.inrupt.com" }, "Inrupt PodSpaces"), h("option", { key: 'd4461d0bb2bfba0ec97f276951b6534dee1ffd51', value: "https://trinpod.us" }, "trinpod.us"), h("option", { key: '80aa0ef7de3ec8dd53d06402c116a6c97747a24f', value: "https://use.id" }, "use.id"), h("option", { key: '794bee3c5a2b29738f25bb67bfb918754fe016ef', value: "https://solid.redpencil.io" }, "redpencil.io"), h("option", { key: '88e27225e7252c90bfb24f21a72bd70c9e3408f4', value: "https://datapod.grant.io" }, "Data Pod (grant.io)"), h("option", { key: '033b75773e898b4fed2507c5064686fb0ad56e03', value: "https://teamid.live" }, "teamid.live")), h("input", { key: 'c8dc41c5d6a892e623d42f5b1839af2728929abd', id: "login", type: "submit", value: "Login", disabled: !this.canSubmit })));
     }
     handleChange(event) {
         this.validate();
@@ -3675,7 +3675,7 @@ const IconMakeFindable = () => (h("svg", { role: "presentation", xmlns: "http://
 const IconSuccess = () => (h("svg", { role: "presentation", 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: "M10.125 2.25h-4.5c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125v-9M10.125 2.25h.375a9 9 0 0 1 9 9v.375M10.125 2.25A3.375 3.375 0 0 1 13.5 5.625v1.5c0 .621.504 1.125 1.125 1.125h1.5a3.375 3.375 0 0 1 3.375 3.375M9 15l2.25 2.25L15 12" })));
 PosMakeFindable.style = PosMakeFindableStyle0;
 
-const posNavigationBarCss = ":host {\n}\n\n.suggestions ol {\n  border: 1px solid var(--color-grey-200);\n  display: flex;\n  flex-direction: column;\n  position: absolute;\n  margin: 0;\n  padding: 0;\n  z-index: var(--layer-top);\n  list-style-type: none;\n  box-shadow: var(--shadow-xl);\n}\n\n.suggestions {\n  position: relative;\n  li {\n    padding: 1rem;\n    background-color: white;\n    pos-rich-link {\n      --background-color: inherit;\n    }\n    &.selected {\n      background-color: var(--color-blue);\n      &:hover {\n        background-color: var(--color-blue-700);\n      }\n    }\n    &:hover {\n      background-color: var(--color-grey-200);\n    }\n  }\n}\n\n.suggestions li.selected pos-rich-link {\n  --label-color: white;\n  --description-color: var(--color-grey-200);\n  --uri-color: var(--color-grey-200);\n}\n\nion-searchbar {\n  width: 100%;\n}\n\nform {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n\n.bar {\n  flex-grow: 1;\n}\n";
+const posNavigationBarCss = ".suggestions ol {\n  border: 1px solid var(--pos-border-color);\n  display: flex;\n  flex-direction: column;\n  position: absolute;\n  margin: 0;\n  padding: 0;\n  z-index: var(--layer-top);\n  list-style-type: none;\n  box-shadow: var(--shadow-xl);\n}\n\n.suggestions {\n  position: relative;\n  li {\n    padding: 1rem;\n    background-color: var(--pos-background-color);\n    pos-rich-link {\n      --background-color: inherit;\n    }\n    &.selected {\n      background-color: var(--pos-primary-color);\n      &:hover {\n        background-color: var(--pos-primary-color);\n      }\n    }\n    &:hover {\n      background-color: var(--pos-border-color);\n    }\n  }\n}\n\n.suggestions li.selected pos-rich-link {\n  --label-color: white;\n  --description-color: var(--pos-border-color);\n  --uri-color: var(--pos-subtle-text-color);\n}\n\nion-searchbar {\n  width: 100%;\n}\n\nform {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n\n.bar {\n  flex-grow: 1;\n}\n";
 const PosNavigationBarStyle0 = posNavigationBarCss;
 
 const PosNavigationBar = class {
@@ -3752,12 +3752,12 @@ const PosNavigationBar = class {
         }
     }
     render() {
-        return (h("form", { key: 'dadf35124fd0908c3623ef2e358f1e751a0b7242', onSubmit: e => this.onSubmit(e) }, this.searchIndex && this.uri ? h("pos-make-findable", { uri: this.uri }) : '', h("div", { key: '64d85b0b51298e2d1b3d6ff32f36db3f80fa1796', class: "bar" }, h("ion-searchbar", { key: 'cd51737238ab42315ace5bebdcc0b4c561b02c38', enterkeyhint: "search", placeholder: "Search or enter URI", value: this.uri, debounce: 300, onIonChange: e => this.onChange(e), onIonInput: e => this.onChange(e) }), this.suggestions.length > 0 ? (h("div", { class: "suggestions" }, h("ol", null, this.suggestions.map((it, index) => (h("li", { class: index === this.selectedIndex ? 'selected' : '' }, h("pos-rich-link", { uri: it.ref }))))))) : null)));
+        return (h("form", { key: 'cafd872d1cd6a9a0493b6c05ad51ab080d59a4f4', onSubmit: e => this.onSubmit(e) }, this.searchIndex && this.uri ? h("pos-make-findable", { uri: this.uri }) : '', h("div", { key: '8c090ab0ed8b6cb579be0baf7c8129e41b1a5732', class: "bar" }, h("ion-searchbar", { key: '2b1070406dcf0548a5df9c9b226c933789bb1aa5', enterkeyhint: "search", placeholder: "Search or enter URI", value: this.uri, debounce: 300, onIonChange: e => this.onChange(e), onIonInput: e => this.onChange(e) }), this.suggestions.length > 0 ? (h("div", { class: "suggestions" }, h("ol", null, this.suggestions.map((it, index) => (h("li", { class: index === this.selectedIndex ? 'selected' : '' }, h("pos-rich-link", { uri: it.ref }))))))) : null)));
     }
 };
 PosNavigationBar.style = PosNavigationBarStyle0;
 
-const posNewThingFormCss = ":host{display:block}form{display:grid;grid-template-columns:var(--size-16) 1fr;grid-gap:var(--scale-0)}label{grid-column:1 / 2;display:flex;align-items:center;justify-content:flex-end}input,pos-select-term,button{grid-column:2 / 3}input,pos-select-term::part(input){outline:var(--pos-input-outline);padding:var(--scale-000);border:none;border-radius:var(--radius-xs);width:var(--size-full);box-sizing:border-box}input:focus-within,pos-select-term::part(input):focus-within{outline:var(--pos-input-focus-outline)}#new-uri{grid-column:1/3;cursor:default;word-break:break-all;color:var(--color-grey-800);font-weight:var(--weight-light);background:var(--color-grey-100);padding:var(--scale-000);border-radius:var(--radius-xs)}input#create{outline:none;box-shadow:var(--shadow-sm);cursor:pointer;color:var(--pos-primary-text-color);background-color:var(--pos-primary-color)}input#create:disabled{cursor:default;color:var(--pos-disabled-text-color);background-color:var(--pos-disabled-color);box-shadow:none}input#create:hover:not(:disabled),input#create:focus{filter:brightness(110%);box-shadow:var(--shadow-md)}";
+const posNewThingFormCss = ":host{display:block}form{display:grid;grid-template-columns:var(--size-16) 1fr;grid-gap:var(--scale-0)}label{grid-column:1 / 2;display:flex;align-items:center;justify-content:flex-end}input,pos-select-term,button{grid-column:2 / 3}input,pos-select-term::part(input){outline:var(--pos-input-outline);padding:var(--scale-000);border:none;border-radius:var(--radius-xs);width:var(--size-full);box-sizing:border-box;background:var(--pos-input-background-color);color:var(--pos-normal-text-color)}input:focus-within,pos-select-term::part(input):focus-within{outline:var(--pos-input-focus-outline)}#new-uri{grid-column:1/3;cursor:default;word-break:break-all;color:var(--pos-normal-text-color);font-weight:var(--weight-light);background:var(--pos-disabled-color);padding:var(--scale-000);border-radius:var(--radius-xs)}input#create{outline:none;box-shadow:var(--shadow-sm);cursor:pointer;color:var(--pos-primary-text-color);background-color:var(--pos-primary-color)}input#create:disabled{cursor:default;color:var(--pos-disabled-text-color);background-color:var(--pos-disabled-color);box-shadow:none}input#create:hover:not(:disabled),input#create:focus{filter:brightness(110%);box-shadow:var(--shadow-md)}";
 const PosNewThingFormStyle0 = posNewThingFormCss;
 
 const PosNewThingForm = class {
@@ -3778,7 +3778,7 @@ const PosNewThingForm = class {
         subscribePodOs(this);
     }
     render() {
-        return (h("form", { key: 'd231729bb8d01ffa9e1f88d9488fa92041f33460', method: "dialog", onSubmit: e => this.handleSubmit(e) }, h("label", { key: '739f893b508ffe8baa0b575594af48f6f690425c', htmlFor: "type" }, "Type"), h("pos-select-term", { key: '9973af04355cf8dec838a4217f711e4c8669dab4', id: "type", placeholder: "", value: this.selectedTypeUri, "onPod-os:term-selected": e => this.onTermSelected(e) }), h("label", { key: '4fac8ecca95c2e16c98c35ae92ea9b7f6bd6a94a', htmlFor: "name" }, "Name"), h("input", { key: 'c922c03e656d194c3235fb374ef90fce205f7ee7', 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: 'fb39eb6c09e67315326f13e184aab93a4ed786c6', id: "create", type: "submit", value: "Create", disabled: !this.canSubmit })));
+        return (h("form", { key: '0d52a6b85338d0353876f0fde0a7ef45e5ebe104', method: "dialog", onSubmit: e => this.handleSubmit(e) }, h("label", { key: '6765ada99850150a6a1dc9135a6ec0c575e3066d', htmlFor: "type" }, "Type"), h("pos-select-term", { key: '375ca79b6ffa3d363954578cf83d2eab10b0e486', id: "type", placeholder: "", value: this.selectedTypeUri, "onPod-os:term-selected": e => this.onTermSelected(e) }), h("label", { key: '9da148cb532d236a5dc9ad73fc75e1bd2d277d17', htmlFor: "name" }, "Name"), h("input", { key: '81b5a4bf51eb403bfebfa0c9e023935ddde48194', 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: '5f4ff09818262ad875f80bce3a0f942b0428335f', id: "create", type: "submit", value: "Create", disabled: !this.canSubmit })));
     }
     handleChange(event) {
         this.name = event.target.value;
@@ -3904,7 +3904,7 @@ const PosResource = class {
     }; }
 };
 
-const posRichLinkCss = ":host {\n  --background-color: inherit;\n  --label-color: var(--color-grey-900);\n  --description-color: var(--color-grey-900);\n  --uri-color: var(--color-grey-600);\n  --font-family: var(--font-sans);\n}\n\np.content {\n  background-color: var(--background-color);\n  line-height: var(--line-xs);\n  margin: 0;\n  display: flex;\n  flex-direction: column;\n  align-items: baseline;\n  gap: var(--size-1);\n\n  .url {\n    font-size: var(--scale-fluid-1);\n    color: var(--color-grey-500);\n  }\n}\n\na {\n  color: var(--label-color);\n  max-width: var(--prose-lg);\n  text-decoration: underline;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  text-decoration-thickness: var(--size-px);\n}\n\npos-label {\n  color: var(--label-color);\n  font-size: var(--scale-fluid-2);\n  margin-bottom: var(--size-1);\n}\n\npos-description {\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 2;\n  text-overflow: ellipsis;\n  overflow: hidden;\n  font-weight: var(--weight-light);\n  color: var(--description-color);\n  font-size: var(--scale-fluid-2);\n}\n\n@media (min-width: 640px) {\n  pos-label {\n    font-size: var(--scale-fluid-0);\n  }\n  pos-description {\n    font-size: var(--scale-fluid-1);\n  }\n\n  p.content {\n    .url {\n      font-size: var(--scale-fluid-000);\n    }\n  }\n}\n";
+const posRichLinkCss = ":host {\n  --background-color: inherit;\n  --label-color: var(--pos-normal-text-color);\n  --description-color: var(--pos-normal-text-color);\n  --uri-color: var(--pos-subtle-text-color);\n  --font-family: var(--font-sans);\n}\n\np.content {\n  background-color: var(--background-color);\n  line-height: var(--line-xs);\n  margin: 0;\n  display: flex;\n  flex-direction: column;\n  align-items: baseline;\n  gap: var(--size-1);\n\n  .url {\n    font-size: var(--scale-fluid-1);\n    color: var(--color-grey-500);\n  }\n}\n\na {\n  color: var(--label-color);\n  max-width: var(--prose-lg);\n  text-decoration: underline;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  text-decoration-thickness: var(--size-px);\n}\n\npos-label {\n  color: var(--label-color);\n  font-size: var(--scale-fluid-2);\n  margin-bottom: var(--size-1);\n}\n\npos-description {\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 2;\n  text-overflow: ellipsis;\n  overflow: hidden;\n  font-weight: var(--weight-light);\n  color: var(--description-color);\n  font-size: var(--scale-fluid-2);\n}\n\n@media (min-width: 640px) {\n  pos-label {\n    font-size: var(--scale-fluid-0);\n  }\n  pos-description {\n    font-size: var(--scale-fluid-1);\n  }\n\n  p.content {\n    .url {\n      font-size: var(--scale-fluid-000);\n    }\n  }\n}\n";
 const PosRichLinkStyle0 = posRichLinkCss;
 
 const PosRichLink = class {
@@ -3913,10 +3913,10 @@ const PosRichLink = class {
         this.linkEmitter = createEvent(this, "pod-os:link", 7);
     }
     render() {
-        return (h("pos-resource", { key: 'e9f1c8b7ca9ded161eebf1b4886b21ec2a23e042', lazy: true, uri: this.uri }, h("p", { key: '022cebbb522c3a04f1f6b83e9aeb8ad890642bdd', class: "content" }, h("a", { key: '105415deeb645e99e36d34f1750da0fa444c6ba8', href: this.uri, onClick: e => {
+        return (h("pos-resource", { key: '3b236e4b091933214cdedb460d916d8d09d5dca8', lazy: true, uri: this.uri }, h("p", { key: '988ccbc7283df323fe9a3230fcb8761bc44ef71f', class: "content" }, h("a", { key: '48054e89ea97d8a5b974811dfbfeab2dbc49a7da', href: this.uri, onClick: e => {
                 e.preventDefault();
                 this.linkEmitter.emit(this.uri);
-            } }, h("pos-label", { key: '4530f9511b81d37229f7c4f57915da035002bdfb' })), h("span", { key: '341e91a6167d36881d2bb5e96365aa7f2f7f2f9b', class: "url" }, new URL(this.uri).host), h("pos-description", { key: 'c8e3875a219a76fa401a558d9c4eaa6813206a19' }))));
+            } }, h("pos-label", { key: '9c1cb23e622d7130d37bfa17106e345949f44d9e' })), h("span", { key: 'c4f1532dffb691838947d2e9e79d4f8a51ef1eeb', class: "url" }, new URL(this.uri).host), h("pos-description", { key: 'c9a4b76eb86af15f908b820f06c4631a22f0c34f' }))));
     }
 };
 PosRichLink.style = PosRichLinkStyle0;
@@ -4247,12 +4247,12 @@ const PosRouter = class {
         this.routeChanged.emit(this.uri);
     }
     render() {
-        return h("slot", { key: '4c9986b609d72550130ca76675dee260ca1cf373' });
+        return h("slot", { key: '5c111993377abe4ad03de3c8678c0a5a9529085a' });
     }
 };
 PosRouter.style = PosRouterStyle0;
 
-const posSelectTermCss = ":host{display:block}input{border:none;padding-top:1rem;padding-bottom:1rem}input:focus{outline:none}";
+const posSelectTermCss = ":host{display:block}input{background-color:transparent;color:var(--pos-normal-text-color);border:none;padding-top:1rem;padding-bottom:1rem}input:focus{outline:none}";
 const PosSelectTermStyle0 = posSelectTermCss;
 
 const PosSelectTerm = class {
@@ -4277,7 +4277,7 @@ const PosSelectTerm = class {
         this.termSelected.emit({ uri: event.target.value });
     }
     render() {
-        return (h(Host, { key: '0c84c241534e981ac22797ca058622c79aa2c661' }, h("input", { key: '0dd0c1d3ed228a3e2c333e440eb5044e99110252', part: "input", list: "terms", placeholder: this.placeholder, value: this.value, onChange: ev => this.handleChange(ev) }), h("datalist", { key: 'b792a879f92d1b95b094cef9cab81738205a503b', part: "terms", id: "terms" }, this.terms.map(term => (h("option", { value: term.uri }, term.shorthand))))));
+        return (h(Host, { key: 'd8316308e089f89fdbb16dbdf799caa308713a14' }, h("input", { key: 'aab9ef56274dd2608c346673fd9be2420b0f6dbf', part: "input", list: "terms", placeholder: this.placeholder, value: this.value, onChange: ev => this.handleChange(ev) }), h("datalist", { key: '5b54e6c44cd926b9b40fe79de1afb12326f919bc', part: "terms", id: "terms" }, this.terms.map(term => (h("option", { value: term.uri }, term.shorthand))))));
     }
     static get delegatesFocus() { return true; }
     static get watchers() { return {
@@ -4286,7 +4286,7 @@ const PosSelectTerm = class {
 };
 PosSelectTerm.style = PosSelectTermStyle0;
 
-const posSettingOfflineCacheCss = ":host{border:var(--size-px) solid var(--color-grey-100);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:var(--size-8);max-width:var(--size-96);background:var(--color-white)}svg{width:var(--size-8)}h2{display:flex;align-items:center}p{padding:var(--size-2)}.info{background-color:var(--color-blue-200)}.warn{background-color:var(--color-yellow-200)}";
+const posSettingOfflineCacheCss = ":host{border:var(--size-px) solid var(--pos-border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:var(--size-8);max-width:var(--size-96);background:var(--pos-card-background)}svg{width:var(--size-8)}h2{display:flex;align-items:center}p{padding:var(--size-2)}.info{color:var(--color-grey-900);background-color:var(--color-blue-200)}.warn{color:var(--color-grey-900);background-color:var(--color-yellow-200)}";
 const PosSettingOfflineCacheStyle0 = posSettingOfflineCacheCss;
 
 const PosSettingOfflineCache = class {
@@ -4294,7 +4294,7 @@ const PosSettingOfflineCache = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h(Host, { key: 'a98de97ba1e0930b485a4a3610102deb02d927a7' }, h("div", { key: '5cf196a71b95fdfed7e5d990b272e12d2b9dd3ff' }, h("h2", { key: '99ddd9827f3ccc5a5277cc64e3952a3f5170f7bc' }, h("svg", { key: 'd9ce3722957428524cc9b264265320119f2e5c88', xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", "stroke-width": "1.5", stroke: "currentColor" }, h("path", { key: '8e4e7af37df231e3141ba30b17a02517737cbe85', "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: '7175929cd9327bc705db305294afa362cb2f648c', class: "info" }, "\u2139 Enable offline cache to be able to access previously loaded data while offline."), h("p", { key: '784fd9141b339165fdab6a98c084430299ff7ed5', class: "warn" }, "\u26A0 Private data may be stored on this device. Only enable it, if you trust this device."), h("label", { key: 'dac2cddf6b6c374d1a2ef3c4d9bad63a9cb7b8d9' }, h("input", { key: 'e39adb18d03ce622a85dd48a28c6d3c0dc2ce7f4', 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"))));
     }
 };
 PosSettingOfflineCache.style = PosSettingOfflineCacheStyle0;