solid-ui 3.1.3-7 → 3.1.3-9

package/dist/v2/components/auth/loginButton/LoginButton.esm.js

@@ -1,519 +0,0 @@
-import { phoneIcon as e } from "./downArrow.esm.js";
-import { authSession as t, authn as n, getSuggestedIssuers as r, offlineTestID as i, solidLogicSingleton as a } from "solid-logic";
-import { LitElement as o, css as s, html as c } from "lit";
-//#region src/v2/components/auth/loginButton/LoginButton.ts
-var l = class extends o {
-	static properties = {
-		label: {
-			type: String,
-			reflect: !0
-		},
-		theme: {
-			type: String,
-			reflect: !0
-		},
-		issuerUrl: {
-			type: String,
-			attribute: "issuer-url",
-			reflect: !0
-		},
-		icon: {
-			type: String,
-			reflect: !0
-		},
-		layout: {
-			type: String,
-			reflect: !0
-		},
-		_popupOpen: { state: !0 },
-		_issuerInputValue: { state: !0 },
-		_dropdownOpen: { state: !0 }
-	};
-	static styles = s`
-    :host { /* default theme */
-      display: inline-block;
-      position: relative;
-      z-index: 400;
-      --login-button-background: var(--lavender-900, #7c4cff);
-      --login-button-text: var(--color-header-text, #ffffff);
-      --popup-background: var(--color-background, #F8F9FB);
-      --popup-text: var(--color-text, #1A1A1A);
-      --popup-border: var(--color-border, #E5E7EB);
-      --popup-shadow: var(--box-shadow-sm, 0 1px 4px rgba(124,77,255,0.12));
-      --popup-overlay-background: rgba(0, 0, 0, 0.6);
-      --issuer-input-background: var(--color-background, #F8F9FB);
-      --issuer-input-text: var(--color-text, #1A1A1A);
-      --issuer-input-border: var(--color-text, #1A1A1A);
-      --issuer-button-background: var(--color-background, #F8F9FB);
-      --issuer-button-text: var(--color-text, #1A1A1A);
-      --issuer-button-border: var(--color-border, #E5E7EB);
-      --issuer-button-hover-background: var(--lavender-900, #7c4cff);
-      --issuer-label-color: var(--grey-purple-700, #1A1A1A);
-      --issuer-placeholder-color: var(--grey-purple-700, #5e546d);;
-      --error-text-color: var(--color-error, #B00020);
-    }
-
-    :host([theme='dark']) {
-      display: inline-block;
-      position: relative;
-      z-index: 900;
-      --login-button-background: var(--lavender-900, #7c4cff);
-      --login-button-text: var(--color-header-text, #ffffff);
-      --popup-background: var(--color-background, #F8F9FB);
-      --popup-text: var(--color-text, #1A1A1A);
-      --popup-border: var(--color-border, #E5E7EB);
-      --popup-shadow: var(--box-shadow-sm, 0 1px 4px rgba(124,77,255,0.12));
-      --popup-overlay-background: rgba(0, 0, 0, 0.6);
-      --issuer-input-background: var(--color-background, #F8F9FB);
-      --issuer-input-text: var(--color-text, #1A1A1A);
-      --issuer-input-border: var(--color-text, #1A1A1A);
-      --issuer-button-background: var(--color-background, #F8F9FB);
-      --issuer-button-text: var(--color-text, #1A1A1A);
-      --issuer-button-border: var(--color-text, #1A1A1A);
-      --issuer-button-hover-background: var(--lavender-900, #7c4cff);
-      --issuer-label-color: var(--grey-purple-700, #1A1A1A);
-      --issuer-placeholder-color: var(--grey-purple-700, #5e546d);;
-      --error-text-color: var(--color-error, #B00020);
-    }
-
-    .login-button {
-      display: flex;
-      height: 35px;
-      padding: var(--spacing-xxs, 0.3125rem) var(--spacing-xs, 0.75rem);
-      align-items: center;
-      gap: var(--spacing-xxs, 0.3125rem);
-      border-radius: var(--border-radius-base, 0.3125rem);
-      background: var(--login-button-background);
-      border: none;
-      color: var(--login-button-text);
-      cursor: pointer;
-      font: inherit;
-      line-height: 1;
-      white-space: nowrap;
-      text-decoration: none;
-      box-sizing: border-box;
-      transition: transform 0.2s ease;
-    }
-
-    .login-button-icon {
-      width: 16px;
-      height: 16px;
-      display: inline-block;
-      object-fit: contain;
-    }
-
-    .login-button:active {
-      transform: translateY(1px);
-    }
-
-    .popup-dialog {
-      border: none;
-      padding: 0;
-      background: transparent;
-      outline: none;
-      overflow: visible;
-      width: min(30rem, calc(100vw - 2rem));
-      max-width: calc(100vw - 2rem);
-      max-height: calc(100dvh - 2rem);
-    }
-
-    .popup-dialog::backdrop {
-      background: var(--popup-overlay-background, rgba(0, 0, 0, 0.6));
-    }
-
-    .popup-box {
-      background: var(--popup-background);
-      color: var(--popup-text);
-      box-shadow: var(--popup-shadow);
-      border: 1px solid var(--popup-border);
-      border-radius: var(--border-radius-md, 0.5rem);
-      width: min(30rem, calc(100vw - 2rem));
-      min-width: min(30rem, calc(100vw - 2rem));
-      max-width: calc(100vw - 2rem);
-      max-height: calc(100dvh - 2rem);
-      overflow: auto;
-      z-index: 1001;
-    }
-
-    .popup-top-menu {
-      border-bottom: 1px solid #DDD;
-      display: flex;
-      flex-direction: row;
-      align-items: center;
-      justify-content: space-between;
-      padding-bottom: 8px;
-      margin-bottom: 8px;
-      padding: 1rem;
-      background: var(--gray-200, #E5E7EB);
-    }
-
-    .popup-title {
-      font-weight: 800;
-    }
-
-    .popup-close {
-      background: transparent;
-      border: none;
-      cursor: pointer;
-      font-size: 1.25rem;
-      line-height: 1;
-      padding: 0 0.25rem;
-    }
-
-    .issuer-text-section {
-      display: flex;
-      flex-direction: column;
-      padding: 1rem 1rem 1.75rem;
-    }
-
-    .issuer-text-label {
-      color: var(--issuer-label-color);
-      margin-bottom: 6px;
-    }
-
-    .issuer-text-row {
-      display: flex;
-      flex-direction: row;
-      gap: 6px;
-      align-items: flex-start;
-    }
-
-    .issuer-input-wrapper {
-      flex: 1;
-      display: flex;
-      flex-direction: column;
-      min-width: 0;
-      position: relative;
-    }
-
-    .issuer-input-field-row {
-      display: flex;
-      flex-direction: row;
-      position: relative;
-    }
-
-    .issuer-text-input {
-      flex: 1;
-      padding: 0.375rem 2.75rem 0.375rem 0.5rem;
-      border: 1px solid var(--issuer-input-border);
-      border-radius: var(--border-radius-base, 0.3125rem);
-      background: var(--issuer-input-background);
-      color: var(--issuer-input-text);
-      font: inherit;
-      min-width: 0;
-    }
-
-    .issuer-text-input::placeholder {
-      color: var(--issuer-placeholder-color);
-    }
-
-    .issuer-dropdown-toggle {
-      position: absolute;
-      right: 6px;
-      top: 50%;
-      transform: translateY(-50%);
-      width: 26px;
-      height: 26px;
-      padding: 0;
-      border: none;
-      background: transparent;
-      cursor: pointer;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      flex-shrink: 0;
-      border-radius: var(--border-radius-base, 0.3125rem);
-    }
-
-    .issuer-dropdown-toggle:hover {
-      background: var(--color-header-menu-item-hover, #e6dcff);
-    }
-
-    .issuer-dropdown-toggle svg {
-      width: 14px;
-      height: 14px;
-      display: block;
-    }
-
-    .issuer-dropdown-list {
-      position: absolute;
-      top: calc(100% + 6px);
-      left: 0;
-      right: 0;
-      border: 1px solid var(--color-border, #E5E7EB);
-      border-top: none;
-      border-radius: 0 0 var(--border-radius-base, 0.3125rem) var(--border-radius-base, 0.3125rem);
-      background: var(--issuer-input-background);
-      overflow: visible;
-      z-index: 10;
-      box-shadow: 0 4px 12px rgba(124, 77, 255, 0.12);
-    }
-
-    .issuer-dropdown-item {
-      display: block;
-      width: 100%;
-      padding: 0.625rem 0.75rem;
-      border: none;
-      border-bottom: 1px solid var(--color-border, #E5E7EB);
-      background: transparent;
-      color: var(--issuer-button-text);
-      cursor: pointer;
-      font: inherit;
-      text-align: left;
-      box-sizing: border-box;
-    }
-
-    .issuer-dropdown-item:last-child {
-      border-bottom: none;
-    }
-
-    .issuer-dropdown-item:hover {
-      background: var(--color-header-menu-item-hover, #e6dcff);
-      border-radius: var(--border-radius-base-md, 0.5rem);
-    }
-
-    .popup-footer {
-      display: flex;
-      flex-direction: row;
-      justify-content: center;
-      gap: 8px;
-      padding: 0.75rem 1rem 1rem;
-    }
-
-    .popup-footer-hr {
-      margin: 0;
-      border: none;
-      border-top: 1px solid var(--popup-border, #E5E7EB);
-    }
-
-    .popup-cancel-button {
-      padding: 0.5rem 1.25rem;
-      border: 1px solid #C0BFC7;
-      border-radius: var(--border-radius-base, 0.3125rem);
-      background: var(--popup-background);
-      color: #314158;
-      cursor: pointer;
-      font: inherit;
-    }
-
-    .popup-cancel-button:hover {
-      background: #D1D5DB;
-    }
-
-    .popup-login-button {
-      padding: 0.5rem 1.25rem;
-      border: none;
-      border-radius: var(--border-radius-base, 0.3125rem);
-      background: var(--lavender-900, #7c4cff);
-      color: #ffffff;
-      cursor: pointer;
-      font: inherit;
-    }
-
-    .popup-login-button:hover {
-      background: #6a3de8;
-    }
-
-    .popup-login-button:disabled {
-      opacity: 0.5;
-      cursor: not-allowed;
-    }
-
-    .error-msg {
-      color: var(--error-text-color);
-      font-size: 0.875rem;
-      margin-top: 8px;
-    }
-
-    @media (max-width: 40rem) {
-      .popup-dialog {
-        width: calc(100vw - 1rem);
-        max-width: calc(100vw - 1rem);
-        max-height: calc(100dvh - 1rem);
-      }
-
-      .popup-box {
-        width: calc(100vw - 1rem);
-        min-width: 0;
-        max-width: calc(100vw - 1rem);
-        max-height: calc(100dvh - 1rem);
-        border-radius: var(--border-radius-base, 0.3125rem);
-      }
-
-      .popup-top-menu,
-      .issuer-text-section,
-      .popup-footer {
-        padding-left: 0.75rem;
-        padding-right: 0.75rem;
-      }
-
-      .popup-footer {
-        flex-wrap: wrap;
-        gap: 0.625rem;
-      }
-
-      .popup-footer > button {
-        flex: 1 1 100%;
-      }
-
-      .issuer-text-row,
-      .issuer-input-field-row {
-        width: 100%;
-      }
-    }
-  `;
-	_issuerInputId = `issuer-url-input-${Math.random().toString(36).slice(2, 10)}`;
-	_errorMsg = "";
-	constructor() {
-		super(), this.label = "Log In", this.theme = "light", this.issuerUrl = "", this.icon = "", this.layout = "desktop", this._popupOpen = !1, this._issuerInputValue = "", this._dropdownOpen = !1;
-	}
-	connectedCallback() {
-		super.connectedCallback();
-	}
-	disconnectedCallback() {
-		super.disconnectedCallback();
-	}
-	_openPopup() {
-		let e = i();
-		if (e) {
-			this._loginComplete(e.uri);
-			return;
-		}
-		this._issuerInputValue = typeof localStorage < "u" && localStorage.getItem("loginIssuer") || this.issuerUrl || "", this._errorMsg = "", this._popupOpen = !0;
-	}
-	_closePopup() {
-		this._popupOpen = !1;
-	}
-	updated() {
-		let e = this.shadowRoot?.querySelector("dialog");
-		e && (this._popupOpen && !e.open ? e.showModal() : !this._popupOpen && e.open && e.close());
-	}
-	async _loginToIssuer(e) {
-		if (e) try {
-			a.store.updater.flagAuthorizationMetadata();
-			let n = new URL(window.location.href).hash;
-			n && window.localStorage.setItem("preLoginRedirectHash", n), window.localStorage.setItem("loginIssuer", e);
-			let r = new URL(window.location.href);
-			r.hash = "", await t.login(e, r.href);
-		} catch (e) {
-			this._errorMsg = e.message || String(e), this.requestUpdate();
-		}
-	}
-	_loginComplete(e) {
-		n.saveUser(e), this.dispatchEvent(new CustomEvent("login-success", {
-			detail: { webId: e },
-			bubbles: !0,
-			composed: !0
-		}));
-	}
-	_handleGoClick() {
-		this._dropdownOpen = !1, this._loginToIssuer(this._issuerInputValue);
-	}
-	_toggleDropdown() {
-		this._dropdownOpen = !this._dropdownOpen;
-	}
-	_selectIssuerFromDropdown(e) {
-		this._issuerInputValue = e, this._dropdownOpen = !1;
-	}
-	_handleInputChange(e) {
-		this._issuerInputValue = e.target.value;
-	}
-	_handleInputKeydown(e) {
-		e.key === "Enter" && this._loginToIssuer(this._issuerInputValue), e.key === "Escape" && this._closePopup();
-	}
-	_renderPopup() {
-		let t = r();
-		return c`
-      <div class="popup-box">
-          <div class="popup-top-menu">
-            <span class="popup-title">Select an identity provider</span>
-            <button class="popup-close" type="button" aria-label="Close" @click="${() => this._closePopup()}">&#x2715;</button>
-          </div>
-
-          <div class="issuer-text-section">
-            <label class="issuer-text-label" for="${this._issuerInputId}">Solid Identity Provider</label>
-            <div class="issuer-text-row">
-              <div class="issuer-input-wrapper">
-                <div class="issuer-input-field-row">
-                  <input
-                    id="${this._issuerInputId}"
-                    class="issuer-text-input"
-                    type="text"
-                    placeholder="https://example.com"
-                    .value="${this._issuerInputValue}"
-                    @input="${this._handleInputChange}"
-                    @keydown="${this._handleInputKeydown}"
-                    autocomplete="url"
-                  />
-                  ${t.length ? c`
-                    <button
-                      class="issuer-dropdown-toggle"
-                      type="button"
-                      aria-label="Show identity provider suggestions"
-                      aria-expanded="${this._dropdownOpen}"
-                      @click="${() => this._toggleDropdown()}"
-                    >${e}</button>
-                  ` : ""}
-                </div>
-                ${this._dropdownOpen && t.length ? c`
-                  <div class="issuer-dropdown-list" role="listbox">
-                    ${t.map((e) => c`
-                      <button
-                        class="issuer-dropdown-item"
-                        type="button"
-                        role="option"
-                        @click="${() => this._selectIssuerFromDropdown(e.uri)}"
-                      >${e.name}</button>
-                    `)}
-                  </div>
-                ` : ""}
-              </div>
-            </div>
-            ${this._errorMsg ? c`<div class="error-msg">${this._errorMsg}</div>` : ""}
-          </div>
-          <hr class="popup-footer-hr" />
-          <div class="popup-footer">
-            <button class="popup-cancel-button" type="button" @click="${() => this._closePopup()}">Cancel</button>
-            <button
-              class="popup-login-button"
-              type="button"
-              ?disabled="${!this._issuerInputValue}"
-              @click="${() => this._handleGoClick()}"
-            >Log In</button>
-          </div>
-        </div>
-    `;
-	}
-	render() {
-		return c`
-      <button
-        class="login-button"
-        type="button"
-        part="login-button"
-        @click="${() => this._openPopup()}"
-      >
-        ${this.icon ? c`<img class="login-button-icon" src="${this.icon}" alt="" aria-hidden="true" part="login-button-icon" />` : ""}
-        <slot>${this.label}</slot>
-      </button>
-
-      <dialog
-        class="popup-dialog"
-        role="dialog"
-        aria-modal="true"
-        aria-label="Select an identity provider"
-        @cancel="${(e) => {
-			e.preventDefault(), this._closePopup();
-		}}"
-        @click="${(e) => {
-			e.target === e.currentTarget && this._closePopup();
-		}}"
-      >
-        ${this._popupOpen ? this._renderPopup() : ""}
-      </dialog>
-    `;
-	}
-};
-//#endregion
-export { l as LoginButton };
-
-//# sourceMappingURL=LoginButton.esm.js.map

package/dist/v2/components/auth/loginButton/LoginButton.esm.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"LoginButton.esm.js","names":[],"sources":["../../../../../src/v2/components/auth/loginButton/LoginButton.ts"],"sourcesContent":["import { LitElement, html, css } from 'lit'\nimport { authSession, authn, getSuggestedIssuers, offlineTestID, solidLogicSingleton } from 'solid-logic'\nimport { phoneIcon as downArrowIcon } from './downArrow'\n\nexport class LoginButton extends LitElement {\n  static properties = {\n    label: { type: String, reflect: true },\n    theme: { type: String, reflect: true },\n    issuerUrl: { type: String, attribute: 'issuer-url', reflect: true },\n    icon: { type: String, reflect: true },\n    layout: { type: String, reflect: true },\n    _popupOpen: { state: true },\n    _issuerInputValue: { state: true },\n    _dropdownOpen: { state: true }\n  }\n\n  static styles = css`\n    :host { /* default theme */\n      display: inline-block;\n      position: relative;\n      z-index: 400;\n      --login-button-background: var(--lavender-900, #7c4cff);\n      --login-button-text: var(--color-header-text, #ffffff);\n      --popup-background: var(--color-background, #F8F9FB);\n      --popup-text: var(--color-text, #1A1A1A);\n      --popup-border: var(--color-border, #E5E7EB);\n      --popup-shadow: var(--box-shadow-sm, 0 1px 4px rgba(124,77,255,0.12));\n      --popup-overlay-background: rgba(0, 0, 0, 0.6);\n      --issuer-input-background: var(--color-background, #F8F9FB);\n      --issuer-input-text: var(--color-text, #1A1A1A);\n      --issuer-input-border: var(--color-text, #1A1A1A);\n      --issuer-button-background: var(--color-background, #F8F9FB);\n      --issuer-button-text: var(--color-text, #1A1A1A);\n      --issuer-button-border: var(--color-border, #E5E7EB);\n      --issuer-button-hover-background: var(--lavender-900, #7c4cff);\n      --issuer-label-color: var(--grey-purple-700, #1A1A1A);\n      --issuer-placeholder-color: var(--grey-purple-700, #5e546d);;\n      --error-text-color: var(--color-error, #B00020);\n    }\n\n    :host([theme='dark']) {\n      display: inline-block;\n      position: relative;\n      z-index: 900;\n      --login-button-background: var(--lavender-900, #7c4cff);\n      --login-button-text: var(--color-header-text, #ffffff);\n      --popup-background: var(--color-background, #F8F9FB);\n      --popup-text: var(--color-text, #1A1A1A);\n      --popup-border: var(--color-border, #E5E7EB);\n      --popup-shadow: var(--box-shadow-sm, 0 1px 4px rgba(124,77,255,0.12));\n      --popup-overlay-background: rgba(0, 0, 0, 0.6);\n      --issuer-input-background: var(--color-background, #F8F9FB);\n      --issuer-input-text: var(--color-text, #1A1A1A);\n      --issuer-input-border: var(--color-text, #1A1A1A);\n      --issuer-button-background: var(--color-background, #F8F9FB);\n      --issuer-button-text: var(--color-text, #1A1A1A);\n      --issuer-button-border: var(--color-text, #1A1A1A);\n      --issuer-button-hover-background: var(--lavender-900, #7c4cff);\n      --issuer-label-color: var(--grey-purple-700, #1A1A1A);\n      --issuer-placeholder-color: var(--grey-purple-700, #5e546d);;\n      --error-text-color: var(--color-error, #B00020);\n    }\n\n    .login-button {\n      display: flex;\n      height: 35px;\n      padding: var(--spacing-xxs, 0.3125rem) var(--spacing-xs, 0.75rem);\n      align-items: center;\n      gap: var(--spacing-xxs, 0.3125rem);\n      border-radius: var(--border-radius-base, 0.3125rem);\n      background: var(--login-button-background);\n      border: none;\n      color: var(--login-button-text);\n      cursor: pointer;\n      font: inherit;\n      line-height: 1;\n      white-space: nowrap;\n      text-decoration: none;\n      box-sizing: border-box;\n      transition: transform 0.2s ease;\n    }\n\n    .login-button-icon {\n      width: 16px;\n      height: 16px;\n      display: inline-block;\n      object-fit: contain;\n    }\n\n    .login-button:active {\n      transform: translateY(1px);\n    }\n\n    .popup-dialog {\n      border: none;\n      padding: 0;\n      background: transparent;\n      outline: none;\n      overflow: visible;\n      width: min(30rem, calc(100vw - 2rem));\n      max-width: calc(100vw - 2rem);\n      max-height: calc(100dvh - 2rem);\n    }\n\n    .popup-dialog::backdrop {\n      background: var(--popup-overlay-background, rgba(0, 0, 0, 0.6));\n    }\n\n    .popup-box {\n      background: var(--popup-background);\n      color: var(--popup-text);\n      box-shadow: var(--popup-shadow);\n      border: 1px solid var(--popup-border);\n      border-radius: var(--border-radius-md, 0.5rem);\n      width: min(30rem, calc(100vw - 2rem));\n      min-width: min(30rem, calc(100vw - 2rem));\n      max-width: calc(100vw - 2rem);\n      max-height: calc(100dvh - 2rem);\n      overflow: auto;\n      z-index: 1001;\n    }\n\n    .popup-top-menu {\n      border-bottom: 1px solid #DDD;\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n      justify-content: space-between;\n      padding-bottom: 8px;\n      margin-bottom: 8px;\n      padding: 1rem;\n      background: var(--gray-200, #E5E7EB);\n    }\n\n    .popup-title {\n      font-weight: 800;\n    }\n\n    .popup-close {\n      background: transparent;\n      border: none;\n      cursor: pointer;\n      font-size: 1.25rem;\n      line-height: 1;\n      padding: 0 0.25rem;\n    }\n\n    .issuer-text-section {\n      display: flex;\n      flex-direction: column;\n      padding: 1rem 1rem 1.75rem;\n    }\n\n    .issuer-text-label {\n      color: var(--issuer-label-color);\n      margin-bottom: 6px;\n    }\n\n    .issuer-text-row {\n      display: flex;\n      flex-direction: row;\n      gap: 6px;\n      align-items: flex-start;\n    }\n\n    .issuer-input-wrapper {\n      flex: 1;\n      display: flex;\n      flex-direction: column;\n      min-width: 0;\n      position: relative;\n    }\n\n    .issuer-input-field-row {\n      display: flex;\n      flex-direction: row;\n      position: relative;\n    }\n\n    .issuer-text-input {\n      flex: 1;\n      padding: 0.375rem 2.75rem 0.375rem 0.5rem;\n      border: 1px solid var(--issuer-input-border);\n      border-radius: var(--border-radius-base, 0.3125rem);\n      background: var(--issuer-input-background);\n      color: var(--issuer-input-text);\n      font: inherit;\n      min-width: 0;\n    }\n\n    .issuer-text-input::placeholder {\n      color: var(--issuer-placeholder-color);\n    }\n\n    .issuer-dropdown-toggle {\n      position: absolute;\n      right: 6px;\n      top: 50%;\n      transform: translateY(-50%);\n      width: 26px;\n      height: 26px;\n      padding: 0;\n      border: none;\n      background: transparent;\n      cursor: pointer;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      flex-shrink: 0;\n      border-radius: var(--border-radius-base, 0.3125rem);\n    }\n\n    .issuer-dropdown-toggle:hover {\n      background: var(--color-header-menu-item-hover, #e6dcff);\n    }\n\n    .issuer-dropdown-toggle svg {\n      width: 14px;\n      height: 14px;\n      display: block;\n    }\n\n    .issuer-dropdown-list {\n      position: absolute;\n      top: calc(100% + 6px);\n      left: 0;\n      right: 0;\n      border: 1px solid var(--color-border, #E5E7EB);\n      border-top: none;\n      border-radius: 0 0 var(--border-radius-base, 0.3125rem) var(--border-radius-base, 0.3125rem);\n      background: var(--issuer-input-background);\n      overflow: visible;\n      z-index: 10;\n      box-shadow: 0 4px 12px rgba(124, 77, 255, 0.12);\n    }\n\n    .issuer-dropdown-item {\n      display: block;\n      width: 100%;\n      padding: 0.625rem 0.75rem;\n      border: none;\n      border-bottom: 1px solid var(--color-border, #E5E7EB);\n      background: transparent;\n      color: var(--issuer-button-text);\n      cursor: pointer;\n      font: inherit;\n      text-align: left;\n      box-sizing: border-box;\n    }\n\n    .issuer-dropdown-item:last-child {\n      border-bottom: none;\n    }\n\n    .issuer-dropdown-item:hover {\n      background: var(--color-header-menu-item-hover, #e6dcff);\n      border-radius: var(--border-radius-base-md, 0.5rem);\n    }\n\n    .popup-footer {\n      display: flex;\n      flex-direction: row;\n      justify-content: center;\n      gap: 8px;\n      padding: 0.75rem 1rem 1rem;\n    }\n\n    .popup-footer-hr {\n      margin: 0;\n      border: none;\n      border-top: 1px solid var(--popup-border, #E5E7EB);\n    }\n\n    .popup-cancel-button {\n      padding: 0.5rem 1.25rem;\n      border: 1px solid #C0BFC7;\n      border-radius: var(--border-radius-base, 0.3125rem);\n      background: var(--popup-background);\n      color: #314158;\n      cursor: pointer;\n      font: inherit;\n    }\n\n    .popup-cancel-button:hover {\n      background: #D1D5DB;\n    }\n\n    .popup-login-button {\n      padding: 0.5rem 1.25rem;\n      border: none;\n      border-radius: var(--border-radius-base, 0.3125rem);\n      background: var(--lavender-900, #7c4cff);\n      color: #ffffff;\n      cursor: pointer;\n      font: inherit;\n    }\n\n    .popup-login-button:hover {\n      background: #6a3de8;\n    }\n\n    .popup-login-button:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n    }\n\n    .error-msg {\n      color: var(--error-text-color);\n      font-size: 0.875rem;\n      margin-top: 8px;\n    }\n\n    @media (max-width: 40rem) {\n      .popup-dialog {\n        width: calc(100vw - 1rem);\n        max-width: calc(100vw - 1rem);\n        max-height: calc(100dvh - 1rem);\n      }\n\n      .popup-box {\n        width: calc(100vw - 1rem);\n        min-width: 0;\n        max-width: calc(100vw - 1rem);\n        max-height: calc(100dvh - 1rem);\n        border-radius: var(--border-radius-base, 0.3125rem);\n      }\n\n      .popup-top-menu,\n      .issuer-text-section,\n      .popup-footer {\n        padding-left: 0.75rem;\n        padding-right: 0.75rem;\n      }\n\n      .popup-footer {\n        flex-wrap: wrap;\n        gap: 0.625rem;\n      }\n\n      .popup-footer > button {\n        flex: 1 1 100%;\n      }\n\n      .issuer-text-row,\n      .issuer-input-field-row {\n        width: 100%;\n      }\n    }\n  `\n\n  declare label: string\n  declare theme: 'light' | 'dark'\n  declare issuerUrl: string\n  declare icon: string\n  declare layout: 'desktop' | 'mobile'\n  declare _popupOpen: boolean\n  declare _issuerInputValue: string\n  declare _dropdownOpen: boolean\n\n  private _issuerInputId = `issuer-url-input-${Math.random().toString(36).slice(2, 10)}`\n  private _errorMsg = ''\n\n  constructor () {\n    super()\n    this.label = 'Log In'\n    this.theme = 'light'\n    this.issuerUrl = ''\n    this.icon = ''\n    this.layout = 'desktop'\n    this._popupOpen = false\n    this._issuerInputValue = ''\n    this._dropdownOpen = false\n  }\n\n  connectedCallback () {\n    super.connectedCallback()\n  }\n\n  disconnectedCallback () {\n    super.disconnectedCallback()\n  }\n\n  private _openPopup () {\n    const offline = offlineTestID()\n    if (offline) {\n      this._loginComplete(offline.uri)\n      return\n    }\n    this._issuerInputValue = (typeof localStorage !== 'undefined' && localStorage.getItem('loginIssuer')) || this.issuerUrl || ''\n    this._errorMsg = ''\n    this._popupOpen = true\n  }\n\n  private _closePopup () {\n    this._popupOpen = false\n  }\n\n  updated () {\n    const dialog = this.shadowRoot?.querySelector('dialog') as HTMLDialogElement | null\n    if (!dialog) return\n    if (this._popupOpen && !dialog.open) {\n      dialog.showModal()\n    } else if (!this._popupOpen && dialog.open) {\n      dialog.close()\n    }\n  }\n\n  private async _loginToIssuer (issuerUri: string) {\n    if (!issuerUri) return\n    try {\n      // clear authorization metadata from store\n      ;(solidLogicSingleton.store.updater as any).flagAuthorizationMetadata()\n\n      const preLoginRedirectHash = new URL(window.location.href).hash\n      if (preLoginRedirectHash) {\n        window.localStorage.setItem('preLoginRedirectHash', preLoginRedirectHash)\n      }\n      window.localStorage.setItem('loginIssuer', issuerUri)\n\n      const locationUrl = new URL(window.location.href)\n      locationUrl.hash = ''\n      await authSession.login(issuerUri, locationUrl.href)\n    } catch (err: any) {\n      this._errorMsg = err.message || String(err)\n      this.requestUpdate()\n    }\n  }\n\n  private _loginComplete (webIdUri: string) {\n    authn.saveUser(webIdUri)\n    this.dispatchEvent(new CustomEvent('login-success', {\n      detail: { webId: webIdUri },\n      bubbles: true,\n      composed: true\n    }))\n  }\n\n  private _handleGoClick () {\n    this._dropdownOpen = false\n    this._loginToIssuer(this._issuerInputValue)\n  }\n\n  private _toggleDropdown () {\n    this._dropdownOpen = !this._dropdownOpen\n  }\n\n  private _selectIssuerFromDropdown (uri: string) {\n    this._issuerInputValue = uri\n    this._dropdownOpen = false\n  }\n\n  private _handleInputChange (e: Event) {\n    this._issuerInputValue = (e.target as HTMLInputElement).value\n  }\n\n  private _handleInputKeydown (e: KeyboardEvent) {\n    if (e.key === 'Enter') {\n      this._loginToIssuer(this._issuerInputValue)\n    }\n    if (e.key === 'Escape') {\n      this._closePopup()\n    }\n  }\n\n  private _renderPopup () {\n    const suggestedIssuers = getSuggestedIssuers()\n    return html`\n      <div class=\"popup-box\">\n          <div class=\"popup-top-menu\">\n            <span class=\"popup-title\">Select an identity provider</span>\n            <button class=\"popup-close\" type=\"button\" aria-label=\"Close\" @click=\"${() => this._closePopup()}\">&#x2715;</button>\n          </div>\n\n          <div class=\"issuer-text-section\">\n            <label class=\"issuer-text-label\" for=\"${this._issuerInputId}\">Solid Identity Provider</label>\n            <div class=\"issuer-text-row\">\n              <div class=\"issuer-input-wrapper\">\n                <div class=\"issuer-input-field-row\">\n                  <input\n                    id=\"${this._issuerInputId}\"\n                    class=\"issuer-text-input\"\n                    type=\"text\"\n                    placeholder=\"https://example.com\"\n                    .value=\"${this._issuerInputValue}\"\n                    @input=\"${this._handleInputChange}\"\n                    @keydown=\"${this._handleInputKeydown}\"\n                    autocomplete=\"url\"\n                  />\n                  ${suggestedIssuers.length\n? html`\n                    <button\n                      class=\"issuer-dropdown-toggle\"\n                      type=\"button\"\n                      aria-label=\"Show identity provider suggestions\"\n                      aria-expanded=\"${this._dropdownOpen}\"\n                      @click=\"${() => this._toggleDropdown()}\"\n                    >${downArrowIcon}</button>\n                  `\n: ''}\n                </div>\n                ${this._dropdownOpen && suggestedIssuers.length\n? html`\n                  <div class=\"issuer-dropdown-list\" role=\"listbox\">\n                    ${suggestedIssuers.map(issuerInfo => html`\n                      <button\n                        class=\"issuer-dropdown-item\"\n                        type=\"button\"\n                        role=\"option\"\n                        @click=\"${() => this._selectIssuerFromDropdown(issuerInfo.uri)}\"\n                      >${issuerInfo.name}</button>\n                    `)}\n                  </div>\n                `\n: ''}\n              </div>\n            </div>\n            ${this._errorMsg ? html`<div class=\"error-msg\">${this._errorMsg}</div>` : ''}\n          </div>\n          <hr class=\"popup-footer-hr\" />\n          <div class=\"popup-footer\">\n            <button class=\"popup-cancel-button\" type=\"button\" @click=\"${() => this._closePopup()}\">Cancel</button>\n            <button\n              class=\"popup-login-button\"\n              type=\"button\"\n              ?disabled=\"${!this._issuerInputValue}\"\n              @click=\"${() => this._handleGoClick()}\"\n            >Log In</button>\n          </div>\n        </div>\n    `\n  }\n\n  render () {\n    return html`\n      <button\n        class=\"login-button\"\n        type=\"button\"\n        part=\"login-button\"\n        @click=\"${() => this._openPopup()}\"\n      >\n        ${this.icon ? html`<img class=\"login-button-icon\" src=\"${this.icon}\" alt=\"\" aria-hidden=\"true\" part=\"login-button-icon\" />` : ''}\n        <slot>${this.label}</slot>\n      </button>\n\n      <dialog\n        class=\"popup-dialog\"\n        role=\"dialog\"\n        aria-modal=\"true\"\n        aria-label=\"Select an identity provider\"\n        @cancel=\"${(e: Event) => { e.preventDefault(); this._closePopup() }}\"\n        @click=\"${(e: MouseEvent) => { if (e.target === e.currentTarget) this._closePopup() }}\"\n      >\n        ${this._popupOpen ? this._renderPopup() : ''}\n      </dialog>\n    `\n  }\n}\n"],"mappings":"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"}

package/dist/v2/components/auth/loginButton/downArrow.cjs.js

@@ -1,9 +0,0 @@
-var e=require("lit-html").html`
-  <svg xmlns="http://www.w3.org/2000/svg" 
-    viewBox="0 0 12 7" 
-    fill="none"
-  >
-    <path d="M0.679688 0.678955L5.50729 5.50656L10.3349 0.678955" stroke="#6A7282" stroke-width="1.35776" stroke-linecap="round" stroke-linejoin="round"/>
-  </svg>
-`;exports.phoneIcon=e;
-//# sourceMappingURL=downArrow.cjs.js.map

package/dist/v2/components/auth/loginButton/downArrow.cjs.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"downArrow.cjs.js","names":[],"sources":["../../../../../src/v2/components/auth/loginButton/downArrow.ts"],"sourcesContent":["import { html } from 'lit-html'\n\nexport const phoneIcon = html`\n  <svg xmlns=\"http://www.w3.org/2000/svg\" \n    viewBox=\"0 0 12 7\" \n    fill=\"none\"\n  >\n    <path d=\"M0.679688 0.678955L5.50729 5.50656L10.3349 0.678955\" stroke=\"#6A7282\" stroke-width=\"1.35776\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n  </svg>\n`\n"],"mappings":"AAEA,IAAa,EAAY,kBAAA,CAAA,CAAA,IAAI"}

package/dist/v2/components/auth/loginButton/downArrow.esm.js

@@ -1,14 +0,0 @@
-import { html as e } from "lit-html";
-//#region src/v2/components/auth/loginButton/downArrow.ts
-var t = e`
-  <svg xmlns="http://www.w3.org/2000/svg" 
-    viewBox="0 0 12 7" 
-    fill="none"
-  >
-    <path d="M0.679688 0.678955L5.50729 5.50656L10.3349 0.678955" stroke="#6A7282" stroke-width="1.35776" stroke-linecap="round" stroke-linejoin="round"/>
-  </svg>
-`;
-//#endregion
-export { t as phoneIcon };
-
-//# sourceMappingURL=downArrow.esm.js.map

package/dist/v2/components/auth/loginButton/downArrow.esm.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"downArrow.esm.js","names":[],"sources":["../../../../../src/v2/components/auth/loginButton/downArrow.ts"],"sourcesContent":["import { html } from 'lit-html'\n\nexport const phoneIcon = html`\n  <svg xmlns=\"http://www.w3.org/2000/svg\" \n    viewBox=\"0 0 12 7\" \n    fill=\"none\"\n  >\n    <path d=\"M0.679688 0.678955L5.50729 5.50656L10.3349 0.678955\" stroke=\"#6A7282\" stroke-width=\"1.35776\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n  </svg>\n`\n"],"mappings":";;AAEA,IAAa,IAAY,CAAI"}

package/dist/v2/components/auth/loginButton/index.cjs.js

@@ -1,2 +0,0 @@
-const e=require("./LoginButton.cjs.js");var t=`solid-ui-login-button`;customElements.get(t)||customElements.define(t,e.LoginButton),exports.LoginButton=e.LoginButton;
-//# sourceMappingURL=index.cjs.js.map

package/dist/v2/components/auth/loginButton/index.cjs.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs.js","names":[],"sources":["../../../../../src/v2/components/auth/loginButton/index.ts"],"sourcesContent":["import { LoginButton } from './LoginButton'\n\nexport { LoginButton }\n\nconst LOGIN_BUTTON_TAG_NAME = 'solid-ui-login-button'\n\nif (!customElements.get(LOGIN_BUTTON_TAG_NAME)) {\n  customElements.define(LOGIN_BUTTON_TAG_NAME, LoginButton)\n}\n"],"mappings":"wCAIA,IAAM,EAAwB,wBAEzB,eAAe,IAAI,CAAqB,GAC3C,eAAe,OAAO,EAAuB,EAAA,WAAW"}

package/dist/v2/components/auth/loginButton/index.esm.js

@@ -1,8 +0,0 @@
-import { LoginButton as e } from "./LoginButton.esm.js";
-//#region src/v2/components/auth/loginButton/index.ts
-var t = "solid-ui-login-button";
-customElements.get(t) || customElements.define(t, e);
-//#endregion
-export { e as LoginButton };
-
-//# sourceMappingURL=index.esm.js.map

package/dist/v2/components/auth/loginButton/index.esm.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.esm.js","names":[],"sources":["../../../../../src/v2/components/auth/loginButton/index.ts"],"sourcesContent":["import { LoginButton } from './LoginButton'\n\nexport { LoginButton }\n\nconst LOGIN_BUTTON_TAG_NAME = 'solid-ui-login-button'\n\nif (!customElements.get(LOGIN_BUTTON_TAG_NAME)) {\n  customElements.define(LOGIN_BUTTON_TAG_NAME, LoginButton)\n}\n"],"mappings":";;AAIA,IAAM,IAAwB;AAEzB,eAAe,IAAI,CAAqB,KAC3C,eAAe,OAAO,GAAuB,CAAW"}

package/dist/v2/components/auth/signupButton/SignupButton.cjs.js

@@ -1,59 +0,0 @@
-let e=require("lit");var t=`https://solidproject.org/get_a_pod`,n=class extends e.LitElement{static properties={label:{type:String,reflect:!0},theme:{type:String,reflect:!0},signupUrl:{type:String,attribute:`signup-url`,reflect:!0},icon:{type:String,reflect:!0},layout:{type:String,reflect:!0}};static styles=e.css`
-    :host {
-      display: inline-block;
-      --signup-button-background: transparent;
-      --signup-button-border: var(--color-border, #E5E7EB);
-      --signup-button-text: var(--color-header-text, #ffffff);
-    }
-
-    :host([theme='dark']) {
-      --signup-button-background: transparent;
-      --signup-button-border: var(--color-border, #E5E7EB);
-      --signup-button-text: var(--color-header-text, #ffffff);
-    }
-
-    .signup-button {
-      display: flex;
-      height: 35px;
-      padding: var(--spacing-xxs, 0.3125rem) var(--spacing-xs, 0.75rem);
-      align-items: center;
-      gap: var(--spacing-xxs, 0.3125rem);
-      border-radius: var(--border-radius-base, 0.3125rem);
-      background: var(--signup-button-background);
-      border: 1px solid var(--signup-button-border);
-      color: var(--signup-button-text);
-      cursor: pointer;
-      font: inherit;
-      line-height: 1;
-      white-space: nowrap;
-      text-decoration: none;
-      box-sizing: border-box;
-      transition: transform 0.2s ease;
-    }
-
-    :host([layout='mobile']) .signup-button {
-      border: none;
-    }
-
-    .signup-button-icon {
-      width: 16px;
-      height: 16px;
-      display: inline-block;
-      object-fit: contain;
-    }
-
-    .signup-button:active {
-      transform: translateY(1px);
-    }
-  `;constructor(){super(),this.label=`Sign Up`,this.signupUrl=t,this.theme=`light`,this.icon=``,this.layout=`desktop`}_handleClick(){window.open(this.signupUrl,`_blank`,`noopener,noreferrer`)}render(){return e.html`
-      <button
-        class="signup-button"
-        type="button"
-        part="signup-button"
-        @click="${()=>this._handleClick()}"
-      >
-        ${this.icon?e.html`<img class="signup-button-icon" src="${this.icon}" alt="" aria-hidden="true" part="signup-button-icon" />`:``}
-        <slot>${this.label}</slot>
-      </button>
-    `}};exports.SignupButton=n;
-//# sourceMappingURL=SignupButton.cjs.js.map