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) => (