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;