From a3d8f712cee488da90c74153c9ed557fc3c99a6c Mon Sep 17 00:00:00 2001
From: Lea Verou <lea@verou.me>
Date: Fri, 20 Dec 2024 11:22:05 -0500
Subject: [PATCH] Remove visually-hidden component, add its icon to the util

---
 docs/docs/components/index.md          | 14 +++-----------
 docs/docs/utilities/visually-hidden.md |  2 +-
 2 files changed, 4 insertions(+), 12 deletions(-)

diff --git a/docs/docs/components/index.md b/docs/docs/components/index.md
index 0508d65e9..1410a1eed 100644
--- a/docs/docs/components/index.md
+++ b/docs/docs/components/index.md
@@ -408,14 +408,6 @@ layout: page-outline
       <span class="page-name">Resize Observer</span>
     </wa-card>
   </a>
-  <a href="/docs/components/visually-hidden">
-    <wa-card with-header>
-      <div slot="header">
-        {% include "svgs/visually-hidden.njk" %}
-      </div>
-      <span class="page-name">Visually Hidden</span>
-    </wa-card>
-  </a>
 </div>
 
 <div id="component-filter-empty" hidden>
@@ -430,7 +422,7 @@ layout: page-outline
 
   function updateResults() {
     const filter = input.value.toLowerCase().trim();
-    
+
     // Hide headings while filtering
     grid.querySelectorAll('h2').forEach(heading => {
       heading.hidden = filter === '' ? false : true;
@@ -473,11 +465,11 @@ layout: page-outline
       visibility: visible;
 
       &.hidden {
-        display: block;  
+        display: block;
         position: absolute;
         visibility: hidden;
       }
-    }    
+    }
   }
 
   #component-filter-empty {
diff --git a/docs/docs/utilities/visually-hidden.md b/docs/docs/utilities/visually-hidden.md
index 41d38e939..d667b4807 100644
--- a/docs/docs/utilities/visually-hidden.md
+++ b/docs/docs/utilities/visually-hidden.md
@@ -1,7 +1,7 @@
 ---
 title: Visually Hidden
 description: The visually hidden utility makes content accessible to assistive devices without displaying it on the screen.
-noAlpha: true
+icon: visually-hidden
 ---
 
 `.wa-visually-hidden` `.wa-visually-hidden-force`