@cplieger/web-terminal-ui 4.1.0 → 4.1.1

package/css/30-tabs.css

@@ -356,6 +356,12 @@
      from the filled done/working/input states (WCAG 1.4.1). */
   background: transparent;
   border: 1.5px solid color-mix(in oklch, var(--text) 45%, transparent);
+  /* Reset every transient visual owned by a status. In particular, a dot that
+     leaves working must stop its pulse, and a dot that enters working must not
+     carry the input ring or an exited opacity into the animated paint layer. */
+  box-shadow: none;
+  opacity: 1;
+  animation: none;
 }
 
 /* Reveal a dot only once its session has reported activity (the tabs feature
@@ -370,31 +376,33 @@
   border: 1.5px solid color-mix(in oklch, var(--text) 45%, transparent);
 }
 
-/* Agent working: solid pulsing white. (Was purple to match Kiro IDE's thinking
-   colour, but that collides with the purple active-tab fill; white reads clearly
-   on every tab state.) Motion is the primary non-hue cue. Server-side this is
-   driven by the OSC 9;4 progress signal, so it tracks agent activity, not the
-   user typing at the prompt. */
+/* Agent working: solid pulsing pale lime. Its high lightness keeps it clear on
+   every tab state, while its yellow-green hue complements the Kiro purple active
+   tab. Motion is the primary non-hue cue. Server-side this is driven by the OSC
+   9;4 progress signal, so it tracks agent activity, not the user typing at the
+   prompt. */
 :where(.wt-root) .wt-status-dot[data-status="working"] {
-  background: #fff;
-  border-color: #fff;
+  background: #d9f99d;
+  border-color: #d9f99d;
   animation: wt-pulse 1.2s ease-in-out infinite;
 }
 
-/* Agent done / ready: solid green, matching Kiro IDE's "Ready" (#22c55e), no
-   motion. The filled dot distinguishes it from the hollow idle without hue. */
+/* Agent done / ready: solid saturated green, matching Kiro IDE's "Ready"
+   (#22c55e), no motion. Keeping it darker and more saturated than working's
+   pale lime makes the two states distinct by lightness as well as motion. */
 :where(.wt-root) .wt-status-dot[data-status="done"] {
   background: #22c55e;
   border-color: #22c55e;
 }
 
-/* User action required (permission / approval): solid amber matching Kiro IDE's
-   "waiting-approval" (#fbbf24), plus a ring so it reads as "needs you" via shape
-   as well as hue. It persists until you act on or switch into the tab. */
+/* User action required (permission / approval): solid orange (#fb923c), shifted
+   away from the old amber so it is clearly separated from both pale-lime working
+   and green done, plus a matching ring so it reads as "needs you" via shape as
+   well as hue. It persists until you act on or switch into the tab. */
 :where(.wt-root) .wt-status-dot[data-status="input"] {
-  background: #fbbf24;
-  border-color: #fbbf24;
-  box-shadow: 0 0 0 2px oklch(85% 0.16 85deg / 40%);
+  background: #fb923c;
+  border-color: #fb923c;
+  box-shadow: 0 0 0 2px rgb(251 146 60 / 40%);
 }
 
 /* Exited: a dim hollow dot, static; distinct from idle by its lower opacity. */
@@ -405,7 +413,19 @@
 }
 
 @keyframes wt-pulse {
+  0%,
+  100% {
+    /* Pin the animated layer's paint as well as its opacity. When working begins
+       in the same frame that input/done ends, an opacity-only animation can
+       pulse the previously rasterized orange/green dot. */
+    background-color: #d9f99d;
+    border-color: #d9f99d;
+    opacity: 1;
+  }
+
   50% {
+    background-color: #d9f99d;
+    border-color: #d9f99d;
     opacity: 0.4;
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cplieger/web-terminal-ui",
-  "version": "4.1.0",
+  "version": "4.1.1",
   "type": "module",
   "description": "Reference touch-first browser UI for @cplieger/web-terminal-engine: a composable kernel + feature modules (tabs, activity monitor, mobile toolbar, context menu, IME, predictive echo, viewport handling) and CSS. One createTerminal() call.",
   "license": "GPL-3.0-or-later",
@@ -50,7 +50,7 @@
     "@vitest/coverage-v8": "4.1.10",
     "eslint": "10.7.0",
     "fast-check": "4.9.0",
-    "happy-dom": "20.10.6",
+    "happy-dom": "20.11.0",
     "html-validate": "11.5.6",
     "knip": "6.27.0",
     "prettier": "3.9.5",