diff --git a/docs/data/material/components/autocomplete/FixedTags.js b/docs/data/material/components/autocomplete/FixedTags.js index fc57e587e221b3..982b9f1f35c706 100644 --- a/docs/data/material/components/autocomplete/FixedTags.js +++ b/docs/data/material/components/autocomplete/FixedTags.js @@ -21,13 +21,17 @@ export default function FixedTags() { options={top100Films} getOptionLabel={(option) => option.title} renderTags={(tagValue, getTagProps) => - tagValue.map((option, index) => ( - - )) + tagValue.map((option, index) => { + const { key, ...tagProps } = getTagProps({ index }); + return ( + + ); + }) } style={{ width: 500 }} renderInput={(params) => ( diff --git a/docs/data/material/components/autocomplete/FixedTags.tsx b/docs/data/material/components/autocomplete/FixedTags.tsx index fc57e587e221b3..982b9f1f35c706 100644 --- a/docs/data/material/components/autocomplete/FixedTags.tsx +++ b/docs/data/material/components/autocomplete/FixedTags.tsx @@ -21,13 +21,17 @@ export default function FixedTags() { options={top100Films} getOptionLabel={(option) => option.title} renderTags={(tagValue, getTagProps) => - tagValue.map((option, index) => ( - - )) + tagValue.map((option, index) => { + const { key, ...tagProps } = getTagProps({ index }); + return ( + + ); + }) } style={{ width: 500 }} renderInput={(params) => ( diff --git a/docs/data/material/components/autocomplete/Sizes.js b/docs/data/material/components/autocomplete/Sizes.js index ca0235e0bc38d6..741046dabddb9d 100644 --- a/docs/data/material/components/autocomplete/Sizes.js +++ b/docs/data/material/components/autocomplete/Sizes.js @@ -66,14 +66,18 @@ export default function Sizes() { getOptionLabel={(option) => option.title} defaultValue={top100Films[13]} renderTags={(value, getTagProps) => - value.map((option, index) => ( - - )) + value.map((option, index) => { + const { key, ...tagProps } = getTagProps({ index }); + return ( + + ); + }) } renderInput={(params) => ( option.title} defaultValue={[top100Films[13]]} renderTags={(value, getTagProps) => - value.map((option, index) => ( - - )) + value.map((option, index) => { + const { key, ...tagProps } = getTagProps({ index }); + return ( + + ); + }) } renderInput={(params) => ( option.title} defaultValue={top100Films[13]} renderTags={(value, getTagProps) => - value.map((option, index) => ( - - )) + value.map((option, index) => { + const { key, ...tagProps } = getTagProps({ index }); + return ( + + ); + }) } renderInput={(params) => ( option.title} defaultValue={[top100Films[13]]} renderTags={(value, getTagProps) => - value.map((option, index) => ( - - )) + value.map((option, index) => { + const { key, ...tagProps } = getTagProps({ index }); + return ( + + ); + }) } renderInput={(params) => (