From 3da5722c831421c156bb4f880e6926b1a7e6e2a0 Mon Sep 17 00:00:00 2001
From: Danilo Leal <67129314+danilo-leal@users.noreply.github.com>
Date: Fri, 1 Dec 2023 08:47:35 -0300
Subject: [PATCH] remove the manually-generated id to show case the automatic
 one

---
 docs/data/joy/components/select/SelectFieldDemo.js  | 4 +---
 docs/data/joy/components/select/SelectFieldDemo.tsx | 4 +---
 docs/data/joy/components/select/select.md           | 4 ++--
 3 files changed, 4 insertions(+), 8 deletions(-)

diff --git a/docs/data/joy/components/select/SelectFieldDemo.js b/docs/data/joy/components/select/SelectFieldDemo.js
index f1b6099dfbd09e..6e1223b7b7704f 100644
--- a/docs/data/joy/components/select/SelectFieldDemo.js
+++ b/docs/data/joy/components/select/SelectFieldDemo.js
@@ -8,9 +8,7 @@ import Option from '@mui/joy/Option';
 export default function SelectFieldDemo() {
   return (
     <FormControl sx={{ width: 240 }}>
-      <FormLabel id="select-field-demo-label" htmlFor="select-field-demo-button">
-        Favorite pet
-      </FormLabel>
+      <FormLabel htmlFor="select-field-demo-button">Favorite pet</FormLabel>
       <Select
         defaultValue="dog"
         slotProps={{
diff --git a/docs/data/joy/components/select/SelectFieldDemo.tsx b/docs/data/joy/components/select/SelectFieldDemo.tsx
index f1b6099dfbd09e..6e1223b7b7704f 100644
--- a/docs/data/joy/components/select/SelectFieldDemo.tsx
+++ b/docs/data/joy/components/select/SelectFieldDemo.tsx
@@ -8,9 +8,7 @@ import Option from '@mui/joy/Option';
 export default function SelectFieldDemo() {
   return (
     <FormControl sx={{ width: 240 }}>
-      <FormLabel id="select-field-demo-label" htmlFor="select-field-demo-button">
-        Favorite pet
-      </FormLabel>
+      <FormLabel htmlFor="select-field-demo-button">Favorite pet</FormLabel>
       <Select
         defaultValue="dog"
         slotProps={{
diff --git a/docs/data/joy/components/select/select.md b/docs/data/joy/components/select/select.md
index 3d88869106591a..ddc128992ad205 100644
--- a/docs/data/joy/components/select/select.md
+++ b/docs/data/joy/components/select/select.md
@@ -243,9 +243,9 @@ If you'd like to set a `max-height` for a long list of options, make sure to spe
 
 ## Accessibility
 
-In order for the select to be accessible, **it should be linked to a label**.
+To ensure the Select is accessible, make sure to add label linked to it.
 
-The `FormControl` automatically generates a unique id that links the select with the `FormLabel` component:
+If you use the Form Label component, together with the Form Control, Joy UI automatically generates a unique id that links the Select to it.
 
 {{"demo": "SelectFieldDemo.js"}}