@kevin5251984/guild 0.2.19 → 0.2.20

package/src/public/chat.html

@@ -167,12 +167,7 @@
                       <a class="model-choice" href="/settings" data-i18n="model.settings">狀態欄</a>
                     </div>
                   </div>
-                  <select id="model-reasoning" hidden>
-                    <option value="minimal" data-i18n="reason.min">最低</option>
-                    <option value="low" data-i18n="reason.low">低</option>
-                    <option value="medium" data-i18n="reason.mid">中</option>
-                    <option value="high" data-i18n="reason.high">高</option>
-                  </select>
+                  <select id="model-reasoning" hidden></select>
                   <input type="checkbox" id="model-fast" hidden />
                 </div>
               </div>
@@ -266,6 +261,13 @@
     </div>
     <script>
       const COLORS = ["#7c6af7", "#5b8def", "#2ea887", "#e07a3d", "#d4537e"];
+      const SEAT_HUE = {
+        infra: "#5b8def",
+        pm: "#2ea887",
+        rd: "#e07a3d",
+        design: "#7c6af7",
+        marketing: "#d4537e",
+      };
       const CHANNEL_ROSTER_CAP = 6;
       function isGeneralChannel(ch) {
         return Boolean(ch && (ch.id === "channel-general" || ch.name === "general"));
@@ -321,6 +323,8 @@
       };
 
       function hue(key) {
+        const seat = SEAT_HUE[String(key).toLowerCase()];
+        if (seat) return seat;
         let n = 0;
         for (const ch of String(key)) n = (n + ch.charCodeAt(0) * 17) % COLORS.length;
         return COLORS[n];
@@ -1036,14 +1040,48 @@
         }
         return out;
       }
+      function deferredHandles(text) {
+        const raw = String(text || "");
+        const out = [];
+        const add = (name) => {
+          const key = String(name || "").toLowerCase();
+          if (key && out.indexOf(key) < 0) out.push(key);
+        };
+        const scan = raw.replace(/```[\s\S]*?```/g, " ");
+        const cue =
+          /(?:完成後|通過後|最後(?:才|由)?|才需要|才叫|才交)[^@\n]{0,24}@([A-Za-z0-9_-]+)/gi;
+        const bare =
+          /(?:完成後|才需要|才叫)\s*(?:call|ask|由)\s*`?@?([A-Za-z0-9_-]+)`?/gi;
+        let row;
+        while ((row = cue.exec(scan))) add(row[1]);
+        while ((row = bare.exec(scan))) add(row[1]);
+        const later =
+          /^[ \t]*(?:\d+[.)、]\s*|[-*•]\s+)(?:通過後|最後|然後|之後|完成後)\s*`?@([A-Za-z0-9_-]+)`?/i;
+        const lines = raw.split(/\r?\n/);
+        for (let i = 0; i < lines.length; i++) {
+          const hit = lines[i].match(later);
+          if (hit) add(hit[1]);
+        }
+        return out;
+      }
       function summonedBotIds(text) {
         const raw = String(text || "");
+        const deferred = new Set(deferredHandles(raw));
+        const members = new Set(
+          state.kind === "channel"
+            ? ((currentChannel() && currentChannel().memberIds) || [])
+            : state.kind === "dm"
+              ? [state.id]
+              : [],
+        );
         const known = new Map(
-          (state.bots || []).map((bot) => [String(bot.handle).toLowerCase(), bot.id]),
+          (state.bots || [])
+            .filter((bot) => !members.size || members.has(bot.id))
+            .map((bot) => [String(bot.handle).toLowerCase(), bot.id]),
         );
         const out = [];
-        const push = (id) => {
-          if (id && !out.includes(id)) out.push(id);
+        const push = (id, handle) => {
+          if (id && !deferred.has(handle) && !out.includes(id)) out.push(id);
         };
         let fence = false;
         const lines = raw.split(/\r?\n/);
@@ -1060,11 +1098,21 @@
           if (!m) continue;
           const names = m[1].match(/@([A-Za-z0-9_-]+)/g) || [];
           for (let n = 0; n < names.length; n++) {
-            push(known.get(names[n].slice(1).toLowerCase()));
+            const handle = names[n].slice(1).toLowerCase();
+            push(known.get(handle), handle);
           }
         }
         if (out.length) return out;
-        return mentionedBotIds(raw).slice(0, 1);
+        return mentionedBotIds(raw)
+          .filter((id) => {
+            const bot = (state.bots || []).find((row) => row.id === id);
+            return (
+              bot &&
+              (!members.size || members.has(id)) &&
+              !deferred.has(String(bot.handle).toLowerCase())
+            );
+          })
+          .slice(0, 1);
       }
       function lastBotAuthor() {
         const msgs = state.messages || [];
@@ -1244,7 +1292,20 @@
       }
       function botModelMeta(bot) {
         const model = botModelLabel(bot) || "—";
-        const reason = reasonLabel((modelCfg && modelCfg.reasoning) || "medium");
+        const spec = (() => {
+          const ref = botModelRef(bot);
+          if (!ref) return null;
+          const hit = allModels().find(
+            (row) => row.provider === ref.provider && row.model === ref.model,
+          );
+          return (hit && hit.reasoning) || null;
+        })();
+        const reasonVal = clampEffort(
+          modelCfg && modelCfg.reasoning,
+          spec,
+          Boolean(modelCfg && modelCfg.fast),
+        );
+        const reason = reasonVal ? reasonLabel(reasonVal) : "—";
         const provider = botProviderLabel(bot) || "—";
         return model + " · " + reason + " · " + provider;
       }
@@ -5332,6 +5393,7 @@
               group: p.name || p.id,
               ready: Boolean(p.ready),
               kind: p.kind || "key",
+              reasoning: m.reasoning || null,
             });
           }
         }
@@ -5345,10 +5407,45 @@
         return hit ? hit.name : ref.model;
       }
       function reasonLabel(value) {
+        if (value === "none") return t("reason.none");
         if (value === "minimal") return t("reason.min");
         if (value === "low") return t("reason.low");
+        if (value === "medium") return t("reason.mid");
         if (value === "high") return t("reason.high");
-        return t("reason.mid");
+        if (value === "xhigh") return t("reason.xhigh");
+        if (value === "max") return t("reason.max");
+        return value || t("reason.mid");
+      }
+      function activeReasoningSpec() {
+        const ref = activeModelRef();
+        if (!ref) return null;
+        const hit = allModels().find(
+          (row) => row.provider === ref.provider && row.model === ref.model,
+        );
+        return (hit && hit.reasoning) || null;
+      }
+      function effortChoices(spec) {
+        const raw = spec && spec.supportedEfforts;
+        if (!raw || !raw.length) return [];
+        return spec.mandatory
+          ? raw.filter((key) => key !== "none")
+          : raw.slice();
+      }
+      function clampEffort(want, spec, fast) {
+        const choices = effortChoices(spec);
+        if (!choices.length) return "";
+        if (fast) {
+          if (choices.indexOf("low") >= 0) return "low";
+          if (choices.indexOf("minimal") >= 0) return "minimal";
+          return choices[choices.length - 1];
+        }
+        if (want && choices.indexOf(want) >= 0) return want;
+        if (spec.defaultEffort && choices.indexOf(spec.defaultEffort) >= 0) {
+          return spec.defaultEffort;
+        }
+        if (choices.indexOf("high") >= 0) return "high";
+        if (choices.indexOf("medium") >= 0) return "medium";
+        return choices[0];
       }
       function speedLabel() {
         return modelCfg.fast ? t("speed.fast") : t("speed.normal");
@@ -5450,25 +5547,44 @@
         }
         document.getElementById("model-results").innerHTML =
           html || '<p class="model-empty">' + t("noModels") + "</p>";
-        document.getElementById("model-reasoning").value = modelCfg.reasoning || "medium";
         document.getElementById("model-fast").checked = Boolean(modelCfg.fast);
-        const reason = reasonLabel(modelCfg.reasoning || "medium");
+        const spec = activeReasoningSpec();
+        const choices = effortChoices(spec);
+        const reasonVal = clampEffort(
+          modelCfg.reasoning,
+          spec,
+          Boolean(modelCfg.fast),
+        );
+        const reasonSel = document.getElementById("model-reasoning");
+        reasonSel.innerHTML = choices
+          .map(
+            (value) =>
+              '<option value="' +
+              value +
+              '">' +
+              reasonLabel(value) +
+              "</option>",
+          )
+          .join("");
+        if (reasonVal) reasonSel.value = reasonVal;
+        const reasonRow = document.querySelector('.model-nav [data-sheet="reasoning"]');
+        if (reasonRow) reasonRow.hidden = !choices.length;
+        if (!choices.length) {
+          const pane = document.getElementById("model-sheet-reasoning");
+          if (pane && !pane.hidden) showModelSheet("models");
+        }
+        const reason = choices.length ? reasonLabel(reasonVal) : "";
         const speed = speedLabel();
         const name = displayName(current);
         document.getElementById("model-btn-label").textContent = current
-          ? name + " " + reason
+          ? name + (reason ? " " + reason : "")
           : name;
         document.getElementById("model-row-model").textContent = name;
-        document.getElementById("model-row-reason").textContent = reason;
+        document.getElementById("model-row-reason").textContent = reason || "—";
         document.getElementById("model-row-speed").textContent = speed;
-        document.getElementById("model-reason-list").innerHTML = [
-          ["minimal", t("reason.min")],
-          ["low", t("reason.low")],
-          ["medium", t("reason.mid")],
-          ["high", t("reason.high")],
-        ]
-          .map(([value, label]) => {
-            const on = (modelCfg.reasoning || "medium") === value ? " on" : "";
+        document.getElementById("model-reason-list").innerHTML = choices
+          .map((value) => {
+            const on = reasonVal === value ? " on" : "";
             const tick = on ? '<span class="tick">✓</span>' : "";
             return (
               '<button type="button" class="model-choice' +
@@ -5476,7 +5592,7 @@
               '" data-reason="' +
               value +
               '">' +
-              label +
+              reasonLabel(value) +
               tick +
               "</button>"
             );

package/src/public/i18n.js

@@ -119,10 +119,13 @@ var I18N_ROWS = [
   ["local", "本地", "Local"],
   ["you", "你", "You"],
   ["emptyParen", "(空)", "(empty)"],
+  ["reason.none", "關閉", "Off"],
   ["reason.min", "最低", "Min"],
   ["reason.low", "低", "Low"],
   ["reason.mid", "中", "Mid"],
   ["reason.high", "高", "High"],
+  ["reason.xhigh", "極高", "Extra high"],
+  ["reason.max", "最大", "Max"],
   ["speed.normal", "標準", "Standard"],
   ["speed.fast", "快速", "Fast"],
   ["model", "模型", "Model"],

package/src/public/mobile.css

@@ -8,6 +8,7 @@
   --panel: #10141A;
   --lift: #161C24;
   --card: #161C24;
+  --bubble: #1A222C;
   --you: #242C36;
   --text: #E8E4DC;
   --muted: #8B8F96;
@@ -15,6 +16,10 @@
   --fill: #141A22;
   --ok: #9fdfb2;
   --danger: #f0a8a8;
+  --press: 0.97;
+  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
+  --press-ms: 140ms;
+  --hover-ms: 160ms;
   --tap: 44px;
   --focus: 0 0 0 2px var(--bg), 0 0 0 3px var(--steel);
   --vvh: 100dvh;
@@ -48,6 +53,58 @@ textarea:focus-visible {
   outline: none;
   box-shadow: var(--focus);
 }
+/* Enamel press language, shared with the hall: paper / steel / ghost. */
+.navlist a,
+.back,
+.turn-stop,
+.turn-steer,
+.steer,
+.send,
+.stop-all,
+.mention-item {
+  transition:
+    background-color var(--hover-ms) ease,
+    border-color var(--hover-ms) ease,
+    color var(--hover-ms) ease,
+    transform var(--press-ms) var(--ease-out),
+    opacity var(--hover-ms) ease;
+}
+.navlist a:active,
+.back:active,
+.turn-stop:active:not(:disabled),
+.turn-steer:active:not(:disabled),
+.steer:active:not(:disabled),
+.send:active:not(:disabled),
+.stop-all:active:not(:disabled),
+.mention-item:active {
+  transform: scale(var(--press));
+}
+@media (prefers-reduced-motion: reduce) {
+  .navlist a,
+  .back,
+  .turn-stop,
+  .turn-steer,
+  .steer,
+  .send,
+  .stop-all,
+  .mention-item {
+    transition:
+      background-color var(--hover-ms) ease,
+      border-color var(--hover-ms) ease,
+      color var(--hover-ms) ease,
+      opacity var(--hover-ms) ease;
+  }
+  .navlist a:active,
+  .back:active,
+  .turn-stop:active,
+  .turn-steer:active,
+  .steer:active,
+  .send:active,
+  .stop-all:active,
+  .mention-item:active {
+    transform: none;
+  }
+}
 .screen {
   display: flex;
   flex-direction: column;
@@ -214,6 +271,7 @@ textarea:focus-visible {
   font-weight: 650;
   color: #fff;
   background: var(--steel);
+  box-shadow: 0 0 0 1px color-mix(in srgb, var(--steel) 38%, transparent);
 }
 .avatar img {
   width: 100%;
@@ -242,6 +300,7 @@ textarea:focus-visible {
   white-space: pre-wrap;
 }
 .msg.you .bubble { background: var(--you); }
+.msg.bot .bubble { background: var(--bubble); }
 .assistant-text {
   margin: 0;
   color: var(--text);
@@ -264,7 +323,7 @@ textarea:focus-visible {
 .assistant-text .md-fence {
   margin: 0.35rem 0 0.7rem;
   border-radius: 12px;
-  background: #1a1a1a;
+  background: var(--fill);
   overflow: auto;
 }
 .assistant-text .md-fence-bar {
@@ -301,11 +360,11 @@ textarea:focus-visible {
   white-space: nowrap;
   background: linear-gradient(
     90deg,
-    #E8E4DC 0%,
-    #E8E4DC 40%,
-    #8B8F96 50%,
-    #E8E4DC 60%,
-    #E8E4DC 100%
+    var(--text) 0%,
+    var(--text) 40%,
+    var(--muted) 50%,
+    var(--text) 60%,
+    var(--text) 100%
   );
   background-position: 100% 0;
   background-size: 250% 100%;
@@ -319,8 +378,8 @@ textarea:focus-visible {
   font-size: 13px;
   font-weight: 400;
   font-variant-numeric: tabular-nums;
-  color: #6f6f6f;
-  -webkit-text-fill-color: #6f6f6f;
+  color: var(--muted);
+  -webkit-text-fill-color: var(--muted);
 }
 @keyframes m-shimmer { to { background-position: 0 0; } }
 @media (prefers-reduced-motion: reduce) {
@@ -343,15 +402,22 @@ textarea:focus-visible {
   line-height: 20px;
   color: var(--muted);
 }
-.live-name { color: #cfcfcf; font-weight: 500; }
+.live-name { color: var(--text); font-weight: 500; }
 .live-detail {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
 .live-step.running .live-name { color: var(--text); }
-.turn-actions { margin-top: 4px; }
+.turn-actions {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  margin-top: 4px;
+}
 .turn-stop,
+.turn-steer,
+.steer,
 .send,
 .stop-all {
   display: inline-flex;
@@ -369,19 +435,44 @@ textarea:focus-visible {
   font-weight: 620;
   cursor: pointer;
 }
+/* Stop is ghost steel: --fill at rest, --lift on hover, danger ink only. */
 .turn-stop,
 .stop-all {
   color: var(--danger);
+  background: var(--fill);
+  border-color: color-mix(in srgb, var(--danger) 32%, var(--line));
+}
+.turn-stop:hover,
+.stop-all:hover {
   background: var(--lift);
-  border-color: color-mix(in srgb, var(--danger) 35%, var(--line));
+  border-color: color-mix(in srgb, var(--danger) 45%, var(--line));
 }
+/* Steer rides the steel rail, never a filled danger slab. */
+.turn-steer,
+.steer {
+  color: var(--steel);
+  background: var(--fill);
+  border-color: color-mix(in srgb, var(--steel) 38%, var(--line));
+}
+.turn-steer:hover,
+.steer:hover {
+  background: var(--lift);
+  color: var(--text);
+  border-color: color-mix(in srgb, var(--steel) 55%, var(--line));
+}
+/* The one paper CTA on the page. */
 .send {
-  background: var(--steel);
+  background: var(--paper);
   color: var(--ink);
   border-color: transparent;
 }
+.send:hover:not(:disabled) {
+  background: color-mix(in srgb, var(--paper) 88%, white);
+}
 .send:disabled,
-.stop-all:disabled {
+.stop-all:disabled,
+.steer:disabled,
+.turn-stop:disabled {
   opacity: 0.45;
   cursor: default;
 }
@@ -407,9 +498,17 @@ textarea:focus-visible {
   gap: 0.5rem;
 }
 .composer-actions .send,
-.composer-actions .stop-all {
+.composer-actions .stop-all,
+.composer-actions .steer {
   flex: 1;
 }
+.composer-steer {
+  color: var(--muted);
+  font-size: 0.75rem;
+  line-height: 1.4;
+  padding: 0 0.15rem;
+}
+.composer-steer[hidden] { display: none; }
 #draft {
   display: block;
   width: 100%;
@@ -472,6 +571,7 @@ textarea:focus-visible {
   color: #fff;
   background: var(--steel);
   flex: none;
+  box-shadow: 0 0 0 1px color-mix(in srgb, var(--steel) 38%, transparent);
 }
 .flash {
   position: fixed;
@@ -489,3 +589,9 @@ textarea:focus-visible {
   z-index: 8;
 }
 .flash.on { opacity: 1; }
+/* Errors read as danger ink on enamel lift, never a filled red slab. */
+.flash.err {
+  background: var(--lift);
+  color: var(--danger);
+  border: 1px solid color-mix(in srgb, var(--danger) 35%, var(--line));
+}