diff --git a/chrome.html b/chrome.html
index 9f716944..3bb2da43 100644
--- a/chrome.html
+++ b/chrome.html
@@ -350,11 +350,14 @@
connector extension. Body opens its panel; ✕ stops the connector. The
dot pulses while a tool call runs. Tabs it is driving get .tab.agent. */
.agentchip { display: inline-flex; align-items: center; background: rgb(217 119 87 / .16);
+ max-width: 160px; flex: 0 1 auto; min-width: 0;
border: 1px solid rgb(217 119 87 / .55); border-radius: 999px; color: #e08a6c; font-size: 12px; font-weight: 600; overflow: hidden; flex: none; }
.agentchip .agcore { background: transparent; border: none; color: inherit; font: inherit; padding: 5px 9px 5px 10px;
+ min-width: 0; overflow: hidden;
cursor: pointer; white-space: nowrap; display: inline-flex; align-items: center; gap: 6px; }
.agentchip .agcore:hover { background: rgb(217 119 87 / .12); }
- .agentchip .adot { width: 7px; height: 7px; border-radius: 50%; background: #d97757; }
+ .agentchip .adot { width: 7px; height: 7px; border-radius: 50%; background: #d97757; flex: none; }
+ .agentchip #agentLabel { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; margin-left: 6px; }
.agentchip.busy .adot { animation: agpulse 0.9s ease-in-out infinite; }
@keyframes agpulse { 50% { opacity: .25; transform: scale(.7); } }
.agentchip .agstop { background: transparent; border: none; border-left: 1px solid rgb(217 119 87 / .35);
diff --git a/package.json b/package.json
index 272d4015..e9fca27e 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "theseus-navigator",
- "version": "0.3.115",
+ "version": "0.3.116",
"license": "MPL-2.0",
"description": "Theseus Navigator — a browser that follows the thread. By Silent Mode, a Deviant project.",
"author": "Silent Mode",
diff --git a/quicklinks.html b/quicklinks.html
index 89ec4453..4b6bceca 100644
--- a/quicklinks.html
+++ b/quicklinks.html
@@ -49,27 +49,25 @@
.gear { color: var(--mut); margin-bottom: 2px; }
.gear:hover { color: var(--ink); }
.gear svg { width: 17px; height: 17px; }
- .llm { color: var(--mut); margin-bottom: 2px; position: relative; }
+ .llm { color: var(--mut); margin-bottom: 2px; }
.llm:hover { color: var(--ink); }
.llm.on { background: var(--acid-tint); box-shadow: inset 2px 0 0 var(--acid); color: var(--ink); }
.llm .glyph { font-size: 16px; line-height: 1; }
.llm img { width: 18px; height: 18px; display: block; }
- /* Chevron is the discoverable "pick AI" affordance — kept small so it
- doesn't crowd the AI icon, but with the acid accent so it reads at
- a glance and a bigger hit target through padding. */
- .llm .chev { position: absolute; right: -2px; bottom: -2px; width: 14px; height: 14px;
- display: grid; place-items: center; color: var(--bg); background: var(--acid);
- border: 2px solid var(--bg); border-radius: 50%; font-size: 9px; font-weight: 800;
- line-height: 1; padding: 0; cursor: pointer; box-shadow: 0 1px 3px rgba(0,0,0,.5); }
- .llm .chev:hover { background: #fff; }
- .llm .chev:focus-visible { outline: 2px solid var(--acid); outline-offset: 2px; }
+ /* Separate "Pick AI engine" button — a sibling of the launch button
+ so the two affordances read as distinct. Dot-grid glyph conveys
+ "picker" without copying the chevron's old meaning. */
+ .llmpick { color: var(--mut); margin-bottom: 2px; }
+ .llmpick:hover { color: var(--acid); }
+ .llmpick svg { width: 14px; height: 14px; display: block; }
-
+
+
@@ -84,26 +82,26 @@
// LLM button: click opens the current default LLM in the left panel.
// Right-click (or the small chevron badge) opens the AI picker menu.
const llmBtn = document.getElementById("llmBtn");
+ const llmPick = document.getElementById("llmPick");
const llmGlyph = document.getElementById("llmGlyph");
const llmTip = document.getElementById("llmTip");
- const llmChev = document.getElementById("llmChev");
- llmBtn.addEventListener("click", (e) => {
- if (e.target === llmChev) return; // chevron handles its own click
- Q && Q.open && Q.open("llm");
- });
+ // Launch button: opens (or toggles) the current AI engine in the panel.
+ llmBtn.addEventListener("click", () => { Q && Q.open && Q.open("llm"); });
+ // Right-click on the launch button still opens the picker (power-user shortcut).
llmBtn.addEventListener("contextmenu", (e) => {
e.preventDefault();
const r = llmBtn.getBoundingClientRect();
Q && Q.llmMenu && Q.llmMenu({ x: r.left, y: r.top, width: r.width, height: r.height });
});
- llmChev.addEventListener("keydown", (e) => {
- if (e.key === "Enter" || e.key === " ") { e.preventDefault(); e.stopPropagation(); const r = llmBtn.getBoundingClientRect(); Q && Q.llmMenu && Q.llmMenu({ x: r.left, y: r.top, width: r.width, height: r.height }); }
- });
- llmChev.addEventListener("click", (e) => {
- e.stopPropagation();
- const r = llmBtn.getBoundingClientRect();
+ // Pick button: a sibling icon that opens the picker overlay. Anchored at
+ // the pick button so the overlay sits beside it.
+ llmPick.addEventListener("click", () => {
+ const r = llmPick.getBoundingClientRect();
Q && Q.llmMenu && Q.llmMenu({ x: r.left, y: r.top, width: r.width, height: r.height });
});
+ llmPick.addEventListener("keydown", (e) => {
+ if (e.key === "Enter" || e.key === " ") { e.preventDefault(); const r = llmPick.getBoundingClientRect(); Q && Q.llmMenu && Q.llmMenu({ x: r.left, y: r.top, width: r.width, height: r.height }); }
+ });
const { BRAND, svgFor: brandForLink, hostOf } = window.StripIcons;
function letterIcon(b, L) { b.classList.add("letter"); b.prepend(document.createTextNode((L.title || "?").slice(0, 1).toUpperCase())); }
// One order for web apps and extension panels (main keeps it); drag an
@@ -193,6 +191,7 @@
const engines = (llm && llm.engines) || [];
if (engines.length) {
llmBtn.hidden = false;
+ llmPick.hidden = false;
llmBtn.classList.toggle("on", !!(llm && llm.open));
const curId = (llm && llm.current) || engines[0].id;
const cur = engines.find((e) => e.id === curId) || engines[0];
@@ -210,6 +209,7 @@
}
} else {
llmBtn.hidden = true;
+ llmPick.hidden = true;
}
}
Q && Q.getState && Q.getState().then(render).catch(() => render(null));