FormControl + Autocomplete component updates (#2075)

* setup new tokens

* layout

* label positioning

* cleanup

* states

* cleanup

* convert label to use grid for caption text (start)

* begin checkbox/radio custom styles

* fix input grid (mostly)

* refactor + cleanup

* consolidate styles, start custom checkbox

* cleanup

* lint

* add disabled state to actionlist-item

* adjust trailing action grid

* Stylelint auto-fixes

* remove docs

* add indeterminate checkbox styles

* Create empty-drinks-report.md

Co-authored-by: Actions Auto Build <[email protected]>

Author: langermank

.changeset/empty-drinks-report.md

@@ -0,0 +1,5 @@
+---
+"@primer/css": patch
+---
+
+FormControl + Autocomplete component updates

docs/src/@primer/gatsby-theme-doctocat/nav.yml

@@ -46,8 +46,6 @@
   children:
     - title: Alerts
       url: /components/alerts
-    - title: Autocomplete
-      url: /components/autocomplete
     - title: Avatars
       url: /components/avatars
     - title: Blankslate

src/actionlist/action-list-item.scss

@@ -235,6 +235,27 @@
     }
   }
 
+  // disabled
+  &[aria-disabled='true'] {
+    .ActionList-item-content {
+      .ActionList-item-label,
+      .ActionList-item-description {
+        color: var(--color-primer-fg-disabled);
+      }
+
+      .ActionList-item-visual {
+        fill: var(--color-primer-fg-disabled);
+      }
+
+      @media (hover: hover) {
+        &:hover {
+          cursor: not-allowed;
+          background-color: transparent;
+        }
+      }
+    }
+  }
+
   // variants
 
   // danger

src/autocomplete/autocomplete.scss

@@ -1,3 +1,6 @@
+// This file can be deprecated when AutoComplete is upstreamed to PVC + rolled out to dotcom https://github.com/github/primer/issues/796
+// AutoComplete relies on FormControl, Overlay and ActionList CSS
+
 // Stacked label (default)
 .autocomplete-label-stacked {
   display: block;