From 44e82e3c421fe1e8d4b3e70e24dc497ee227b088 Mon Sep 17 00:00:00 2001
From: mwiegand <martin.wiegand@seibert.group>
Date: Sun, 17 May 2026 19:44:27 +0200
Subject: [PATCH] feat(console): color-code sm_* (SourceMod) suggestions
 distinctly

sm_* commands depend on the SourceMod plugin being loaded on the
target server, which is not always the case. Render their names in
the third syntax-palette color (purple via --cm-number) so the user
can tell at a glance that these may not exist on the server they
are targeting. Vanilla cvars and commands keep their existing
pink/green colors. Theme-aware via the existing token swap.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 l4d2web/l4d2web/static/css/console-autocomplete.css | 4 ++++
 l4d2web/l4d2web/static/js/console-autocomplete.js   | 7 ++++++-
 2 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/l4d2web/l4d2web/static/css/console-autocomplete.css b/l4d2web/l4d2web/static/css/console-autocomplete.css
index 46621c4..b121c88 100644
--- a/l4d2web/l4d2web/static/css/console-autocomplete.css
+++ b/l4d2web/l4d2web/static/css/console-autocomplete.css
@@ -46,6 +46,10 @@
   color: var(--cm-string, #ce9178);
 }
 
+.console-autocomplete-row.kind-sourcemod .console-autocomplete-name {
+  color: var(--cm-number, #884488);
+}
+
 .console-autocomplete-desc {
   color: var(--color-muted, #888);
   font-size: 0.9em;
diff --git a/l4d2web/l4d2web/static/js/console-autocomplete.js b/l4d2web/l4d2web/static/js/console-autocomplete.js
index 644fe5b..739ea8d 100644
--- a/l4d2web/l4d2web/static/js/console-autocomplete.js
+++ b/l4d2web/l4d2web/static/js/console-autocomplete.js
@@ -118,7 +118,12 @@ function bindConsoleAutocomplete(form) {
     if (items.length === 0) { close(); return; }
     const rows = items.slice(0, MAX_RENDERED).map((e, i) => {
       const selected = i === highlightIdx ? " aria-selected='true'" : "";
-      const kindClass = e.kind === "command" ? "kind-command" : "kind-cvar";
+      // SourceMod commands (sm_*) get a distinct class so the user
+      // can see at a glance that the command depends on a plugin
+      // being loaded on the target server.
+      const kindClass = e.kind === "command"
+        ? (e.name.startsWith("sm_") ? "kind-sourcemod" : "kind-command")
+        : "kind-cvar";
       const desc = e.desc ? `<span class="console-autocomplete-desc">${escapeHtml(e.desc)}</span>` : "";
       return `<div class="console-autocomplete-row ${kindClass}"${selected} role="option" data-idx="${i}"><span class="console-autocomplete-name">${escapeHtml(e.name)}</span>${desc}</div>`;
     }).join("");