diff --git a/components/doc/chart/accessibilitydoc.js b/components/doc/chart/accessibilitydoc.js
index 1117e6035b..b127d465ef 100644
--- a/components/doc/chart/accessibilitydoc.js
+++ b/components/doc/chart/accessibilitydoc.js
@@ -13,18 +13,17 @@ export function AccessibilityDoc() {
};
return (
-
- Screen Reader
-
- Chart components internally use canvas element, refer to the{' '}
-
- Chart.js accessibility
- {' '}
- guide for more information. The canvas element can be customized with canvasProps property to define aria roles and properties, in addition any content inside the component is directly passed as a child of the canvas to be
- able to provide fallback content like a table.
-
-
-
-
+
+ Screen Reader
+
+ Chart components internally use canvas element, refer to the{' '}
+
+ Chart.js accessibility
+ {' '}
+ guide for more information. The canvas element can be customized with canvasProps property to define aria roles and properties, in addition any content inside the component is directly passed as a child of the canvas to be able
+ to provide fallback content like a table.
+
+
+
);
}
diff --git a/components/lib/multiselect/MultiSelect.js b/components/lib/multiselect/MultiSelect.js
index b88958275d..02a430f1cb 100644
--- a/components/lib/multiselect/MultiSelect.js
+++ b/components/lib/multiselect/MultiSelect.js
@@ -912,6 +912,7 @@ export const MultiSelect = React.memo(
setTimeout(() => {
props.overlayVisible ? show() : hide();
}, 100);
+ // eslint-disable-next-line react-hooks/exhaustive-deps
}, [props.overlayVisible]);
useUpdateEffect(() => {
diff --git a/components/templates/templateFeaturesAnimation/useAnimatedFeatures.js b/components/templates/templateFeaturesAnimation/useAnimatedFeatures.js
index 33add02add..b8d22242ba 100644
--- a/components/templates/templateFeaturesAnimation/useAnimatedFeatures.js
+++ b/components/templates/templateFeaturesAnimation/useAnimatedFeatures.js
@@ -48,11 +48,13 @@ const useAnimatedFeatures = (animationRef, arrayLength, seconds = 10000) => {
clearAllIntervals();
setSelectedID(1);
}
+ // eslint-disable-next-line react-hooks/exhaustive-deps
}, [animationRef, isVisible]);
useEffect(() => {
if (!hoveredID) null;
handleHover(hoveredID, 'onMouseEnter');
+ // eslint-disable-next-line react-hooks/exhaustive-deps
}, [selectedID]);
return { selectedID, setHoveredID, handleClick, handleHover };
diff --git a/components/templates/templateFeaturesAnimation/useVisible.js b/components/templates/templateFeaturesAnimation/useVisible.js
index 21d664b21c..df0b69e667 100644
--- a/components/templates/templateFeaturesAnimation/useVisible.js
+++ b/components/templates/templateFeaturesAnimation/useVisible.js
@@ -17,9 +17,11 @@ const useVisible = (element, rootMargin = 0.2) => {
return () => {
if (observer && element.current) {
+ // eslint-disable-next-line react-hooks/exhaustive-deps
observer.unobserve(element.current);
}
};
+ // eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
return isVisible;