@ai-ecoverse/slicc-spectrum 1.94.2 → 1.95.0

package/dist/slicc-kernel-model.js

@@ -6,7 +6,7 @@ import {
   DummySettings,
   clock,
   dummySettingsKey
-} from "./chunk-2R4DLSKG.js";
+} from "./chunk-QGY4KBEB.js";
 import {
   Emitter
 } from "./chunk-T5NHW4KC.js";

package/dist/slicc-ui.js

@@ -49643,7 +49643,8 @@ var accountStatus = {
   "signing-in": ["info", "Signing in\u2026"],
   rejected: ["notice", "Rejected"],
   "needs-sign-in": ["neutral", "Needs sign-in"],
-  "sign-in-expired": ["notice", "Sign-in expired"]
+  "sign-in-expired": ["notice", "Sign-in expired"],
+  unreachable: ["notice", "Unreachable"]
 };
 var authHints = {
   "api-key": "API key",
@@ -49677,6 +49678,7 @@ function draft(option2) {
     fields: option2.fields,
     keyUrl: option2.keyUrl,
     needs: option2.needs,
+    blocked: option2.blocked,
     vaultName: option2.vaultName
   };
 }
@@ -49716,6 +49718,7 @@ var SliccSettings = class extends ThemedElement {
   };
   #waits = new SignInWaits(() => this.requestUpdate());
   #landing = null;
+  #away = false;
   #bases = /* @__PURE__ */ new Map();
   #scroll = new ViewScroll(this, "settings:scroll", { scroller: () => this, rows: "[data-id]" });
   constructor() {
@@ -49954,6 +49957,10 @@ var SliccSettings = class extends ThemedElement {
       .option[aria-disabled='true'] .name {
         color: var(--swc-neutral-subdued-content-color-default);
       }
+      .option[data-blocked] .name,
+      .option[data-blocked] .description {
+        color: var(--swc-disabled-content-color);
+      }
       .option .tag {
         justify-self: end;
         color: var(--swc-neutral-subdued-content-color-default);
@@ -50261,6 +50268,7 @@ var SliccSettings = class extends ThemedElement {
   }
   #submit(event2, account) {
     event2.preventDefault();
+    if (account.blocked) return;
     const form = event2.currentTarget;
     this.problem = null;
     this.filled = new Set([...this.filled].filter((name) => name !== "value"));
@@ -50369,6 +50377,7 @@ var SliccSettings = class extends ThemedElement {
     return this.adding?.id === account.id ? "Connect" : "Save";
   }
   #ready(account) {
+    if (account.blocked) return false;
     if (!this.#offered()) return true;
     const required = (account.fields ?? []).filter((field) => field.required && !field.options);
     return ["value", ...required.map((field) => field.name)].every((name) => this.filled.has(name));
@@ -50533,12 +50542,13 @@ var SliccSettings = class extends ThemedElement {
       data-action="connect"
       accessible-label=${popup(account) ? `Sign in to ${account.provider}` : `${label} ${account.provider}`}
       ?pending=${busy}
-      ?disabled=${entering}
+      ?disabled=${entering || !!account.blocked}
       @click=${() => this.#start(account)}
     >${label}</swc-button>`;
   }
   #status(account) {
     if (this.#signingIn(account)) return "signing-in";
+    if (account.status === "connected" && account.blocked) return "unreachable";
     if (account.status === "expired" && account.auth === "api-key") return "rejected";
     if (popup(account) && account.status === "disconnected") return "needs-sign-in";
     if (popup(account) && account.status === "expired") return "sign-in-expired";
@@ -50578,6 +50588,14 @@ var SliccSettings = class extends ThemedElement {
         ><swc-icon-delete slot="icon"></swc-icon-delete></swc-action-button
       ><swc-tooltip for=${id} placement="top">${label}</swc-tooltip>`;
   }
+  async #closeTip(id) {
+    const tip = this.renderRoot.querySelector(
+      `swc-tooltip[for="${CSS.escape(id)}"]`
+    );
+    if (!tip) return;
+    tip.open = false;
+    await tip.updateComplete;
+  }
   async #remove(account) {
     const model = this.model;
     const body4 = removeBodies[account.auth ?? ""] ?? "Its key is deleted from the vault. Models from it stop working.";
@@ -50590,6 +50608,7 @@ var SliccSettings = class extends ThemedElement {
     const keyed = account.store === "vault" && account.auth === "api-key" && !!vault?.remove;
     if (keyed && !await this.#forget(account, vault)) return;
     if (this.model !== model) return;
+    await this.#closeTip(`remove-${account.id}`);
     this.#busy(account.id, true);
     this.failure = null;
     try {
@@ -50603,9 +50622,25 @@ var SliccSettings = class extends ThemedElement {
     this.focusOn("[data-action=add-provider]");
     for (const field of account.fields ?? []) this.#bases.delete(`${account.id} ${field.name}`);
   }
-  #notice(needs, size4 = "long") {
+  #notice(row, size4 = "long") {
+    const needs = row.blocked;
     if (needs !== "cors-free-transport") return A;
-    return b`<p class="notice" data-notice=${needs}><swc-icon-alert-triangle size="s" aria-hidden="true"></swc-icon-alert-triangle><span>${corsNotice[size4]}</span></p>`;
+    return b`<p class="notice" data-notice=${needs} data-blocked><swc-icon-alert-triangle size="s" aria-hidden="true"></swc-icon-alert-triangle><span>${corsNotice[size4]} <a class="swc-Link" href="#network" data-action="setup-network" aria-label="Set up the SLICC extension or CLI" @click=${(event2) => this.#setUp(event2)}>Set up</a></span></p>`;
+  }
+  #setUp(event2) {
+    event2.preventDefault();
+    event2.stopPropagation();
+    if (this.picking) {
+      this.#away = true;
+      this.#closePicker();
+    }
+    this.dispatchEvent(
+      new CustomEvent("show-surface", {
+        detail: { id: "network", section: "whole" },
+        bubbles: true,
+        composed: true
+      })
+    );
   }
   #signingNote(account) {
     const key2 = `settings:${account.id}`;
@@ -50616,7 +50651,7 @@ var SliccSettings = class extends ThemedElement {
     return b`<p class="hint" role="status" data-signing>${signInText(this.#waits.waited(key2))}</p>`;
   }
   #rowNotes(account) {
-    const notice = this.#notice(account.needs);
+    const notice = this.#notice(account);
     const signing = this.adding?.id === account.id ? A : this.#signingNote(account);
     if (notice === A && signing === A) return A;
     return b`<div class="notes">${notice}${signing}</div>`;
@@ -50653,6 +50688,9 @@ var SliccSettings = class extends ThemedElement {
     this.query = "";
     const landing = this.#landing;
     this.#landing = null;
+    const away2 = this.#away;
+    this.#away = false;
+    if (away2) return;
     void this.updateComplete.then(() => {
       const root2 = this.renderRoot;
       const row = landing ? root2.querySelector(`.account[data-id="${CSS.escape(landing)}"] swc-button`) : null;
@@ -50664,7 +50702,7 @@ var SliccSettings = class extends ThemedElement {
     this.#closePicker();
   }
   #choose(option2) {
-    if (this.#added(option2.id)) return;
+    if (option2.blocked || this.#added(option2.id)) return;
     this.adding = option2;
     this.failure = null;
     if (option2.auth === "api-key" || option2.auth === "fields") {
@@ -50703,11 +50741,13 @@ var SliccSettings = class extends ThemedElement {
     if (event2.key !== "Enter") return;
     event2.preventDefault();
     const first2 = matchProviders(this.#offered() ?? [], this.query).find(
-      (option2) => !this.#added(option2.id)
+      (option2) => !option2.blocked && !this.#added(option2.id)
     );
     if (first2) this.#choose(first2);
   }
   #optionKey(event2, option2) {
+    const inner = event2.target !== event2.currentTarget;
+    if (inner && (event2.key === "Enter" || event2.key === " ")) return;
     const options2 = this.#options();
     const at = options2.indexOf(event2.currentTarget);
     const moves = {
@@ -50736,14 +50776,15 @@ var SliccSettings = class extends ThemedElement {
       tabindex="-1"
       data-provider=${option2.id}
       data-auth=${option2.auth}
-      aria-disabled=${added ? "true" : "false"}
+      ?data-blocked=${!!option2.blocked}
+      aria-disabled=${added || option2.blocked ? "true" : "false"}
       @click=${() => this.#choose(option2)}
       @keydown=${(event2) => this.#optionKey(event2, option2)}
     >
       <span class="name">${option2.name}</span>
       <span class="tag">${added ? b`<span class="added" data-added><swc-icon-checkmark size="s" aria-hidden="true"></swc-icon-checkmark>Added</span>` : authHints[option2.auth]}</span>
       ${option2.description ? b`<span class="description">${option2.description}</span>` : A}
-      ${this.#notice(option2.needs, "short")}
+      ${this.#notice(option2, "short")}
     </div>`;
   }
   #pickStep(offered) {
@@ -50768,23 +50809,24 @@ var SliccSettings = class extends ThemedElement {
       ${signing ? this.#signingNote(account) : A}
       <div class="buttons">
         ${cancel ? b`<swc-button size="m" variant="secondary" data-action="cancel-sign-in" @click=${() => this.#stopSigningIn(account)}>Cancel</swc-button>` : A}
-        <swc-button size="m" variant="accent" data-action="sign-in" ?pending=${signing} @click=${() => this.connect(account.id)}>${signing ? "Signing in\u2026" : "Sign in"}</swc-button>
+        <swc-button size="m" variant="accent" data-action="sign-in" ?pending=${signing} ?disabled=${!!account.blocked} @click=${() => this.connect(account.id)}>${signing ? "Signing in\u2026" : "Sign in"}</swc-button>
         ${signing ? A : this.#leave(account)}
       </div>`;
   }
   #localStep(account) {
     return b`<p class="hint">SLICC connects to ${account.provider} on this device.</p>
       <div class="buttons">
-        <swc-button size="m" variant="accent" data-action="connect" ?pending=${this.pending.has(account.id)} @click=${() => this.connect(account.id)}>Connect</swc-button>
+        <swc-button size="m" variant="accent" data-action="connect" ?pending=${this.pending.has(account.id)} ?disabled=${!!account.blocked} @click=${() => this.connect(account.id)}>Connect</swc-button>
         ${this.#leave(account)}
       </div>`;
   }
-  #connectStep(option2) {
+  #connectStep(adding) {
+    const option2 = this.#offered()?.find((candidate) => candidate.id === adding.id) ?? adding;
     const account = this.#added(option2.id) ?? draft(option2);
     const step = option2.auth === "oauth" ? this.#signInStep(account) : option2.auth === "local" ? this.#localStep(account) : this.#key(account);
     return b`<div class="step" data-step=${option2.auth} data-provider=${option2.id}>
       ${option2.description ? b`<p class="lead">${option2.description}</p>` : A}
-      ${this.#notice(option2.needs)}
+      ${this.#notice(option2)}
       ${step}
       ${this.failure?.id === option2.id ? b`<div class="failure" role="alert"><swc-icon-alert-triangle size="s" aria-hidden="true"></swc-icon-alert-triangle><span>${this.failure.message}</span></div>` : A}
     </div>`;