From a0f1460c6e7d2d8650f7c210080316638b3269b5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Connor=20B=C3=A4r?= <github@connorbaer.com>
Date: Tue, 23 Jan 2024 19:26:42 +0000
Subject: [PATCH] Support aria-disabled in Field

---
 .../components/Field/Field.module.css         | 23 +++++++++++++------
 1 file changed, 16 insertions(+), 7 deletions(-)

diff --git a/packages/circuit-ui/components/Field/Field.module.css b/packages/circuit-ui/components/Field/Field.module.css
index 116b07ee93..301b029931 100644
--- a/packages/circuit-ui/components/Field/Field.module.css
+++ b/packages/circuit-ui/components/Field/Field.module.css
@@ -5,8 +5,10 @@
 }
 
 .wrapper[disabled],
+.wrapper[aria-disabled="true"],
 .wrapper[data-disabled="true"],
 .fieldset[disabled],
+.fieldset[aria-disabled="true"],
 .fieldset[data-disabled="true"] {
   pointer-events: none;
 }
@@ -28,7 +30,8 @@
   line-height: var(--cui-body-s-line-height);
 }
 
-[disabled] .label-text,
+:global([disabled]) .label-text,
+:global([aria-disabled="true"]) .label-text,
 :global([data-disabled="true"]) .label-text {
   color: var(--cui-fg-normal-disabled);
 }
@@ -37,7 +40,8 @@
   color: var(--cui-fg-subtle);
 }
 
-[disabled] .label-text-optional,
+:global([disabled]) .label-text-optional,
+:global([aria-disabled="true"]) .label-text-optional,
 :global([data-disabled="true"]) .label-text-optional {
   color: var(--cui-fg-subtle-disabled);
 }
@@ -49,7 +53,8 @@
   color: var(--cui-fg-subtle);
 }
 
-[disabled] .description,
+:global([disabled]) .description,
+:global([aria-disabled="true"]) .description,
 :global([data-disabled="true"]) .description {
   color: var(--cui-fg-subtle-disabled);
 }
@@ -63,7 +68,8 @@
   transition: color var(--cui-transitions-default);
 }
 
-[disabled] .validation-hint,
+:global([disabled]) .validation-hint,
+:global([aria-disabled="true"]) .validation-hint,
 :global([data-disabled="true"]) .validation-hint {
   color: var(--cui-fg-subtle-disabled);
 }
@@ -72,7 +78,8 @@
   color: var(--cui-fg-success);
 }
 
-[disabled] .valid,
+:global([disabled]) .valid,
+:global([aria-disabled="true"]) .valid,
 :global([data-disabled="true"]) .valid {
   color: var(--cui-fg-success-disabled);
 }
@@ -81,7 +88,8 @@
   color: var(--cui-fg-warning);
 }
 
-[disabled] .warning,
+:global([disabled]) .warning,
+:global([aria-disabled="true"]) .warning,
 :global([data-disabled="true"]) .warning {
   color: var(--cui-fg-warning-disabled);
 }
@@ -90,7 +98,8 @@
   color: var(--cui-fg-danger);
 }
 
-[disabled] .invalid,
+:global([disabled]) .invalid,
+:global([aria-disabled="true"]) .invalid,
 :global([data-disabled="true"]) .invalid {
   color: var(--cui-fg-danger-disabled);
 }