@inchurch/matcha-theme 22.28.3 → 22.28.4

package/components/matcha-nav.scss

@@ -251,6 +251,19 @@
     outline: var(--matcha-state-focus-ring-width, 2px) solid var(--matcha-color-accent);
     outline-offset: var(--matcha-state-focus-ring-offset, 2px);
   }
+
+  // Desabilitado — irmão do .matcha-nav-item--disabled (mesma dupla
+  // pointer-events/cursor aqui; a cor fica no mixin de tema). Cobre as 3 formas:
+  // o `disabled` nativo do <button>, o atributo em elemento que não é button
+  // (o slot aceita <a>) e o aria-disabled de quem precisa manter o foco.
+  // Sem isto, um módulo desabilitado renderiza IDÊNTICO ao habilitado e o
+  // usuário clica sem entender por que nada acontece.
+  &:disabled,
+  &[disabled],
+  &[aria-disabled="true"] {
+    cursor: default;
+    pointer-events: none;
+  }
 }
 
 // ── Nav Rail labeled (84px — nome do módulo embaixo do ícone) ───────────────
@@ -710,6 +723,19 @@
         font-weight: var(--matcha-weight-medium, 500);
       }
     }
+
+    // Desabilitado — mesmo token de cor do nav-item disabled, pra os dois
+    // estados lerem igual. Depois do bloco ativo de propósito: um módulo
+    // desabilitado não deve ficar com a cor de ativo.
+    &:disabled,
+    &[disabled],
+    &[aria-disabled="true"] {
+      color: var(--matcha-color-interaction-disabled-fg);
+
+      matcha-icon {
+        color: var(--matcha-color-interaction-disabled-fg);
+      }
+    }
   }
 
   .matcha-nav-rail__divider {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@inchurch/matcha-theme",
-  "version": "22.28.3",
+  "version": "22.28.4",
   "description": "Themes for matcha-design-system",
   "main": "main.scss",
   "scripts": {