diff --git a/docs/data/material/components/autocomplete/autocomplete.md b/docs/data/material/components/autocomplete/autocomplete.md index 66ea7f2bf92a38..1722e4eb7cef41 100644 --- a/docs/data/material/components/autocomplete/autocomplete.md +++ b/docs/data/material/components/autocomplete/autocomplete.md @@ -53,6 +53,20 @@ However, you can use different structures by providing a `getOptionLabel` prop. If your options are objects, you must provide the `isOptionEqualToValue` prop to ensure correct selection and highlighting. By default, it uses strict equality to compare options with the current value. +:::warning +If your options have duplicate labels, you must extract a unique key with the `getOptionKey` prop. + +```tsx +const options = [ + { label: 'The Godfather', id: 1 }, + { label: 'The Godfather', id: 2 }, +]; + +return option.id} />; +``` + +::: + ### Playground Each of the following examples demonstrates one feature of the Autocomplete component.