Merge pull request #39 from feedzai/develop

Support for dynamic data / DOM elements

Author: DiogoRDuarte

CHANGELOG.md

@@ -1,17 +1,26 @@
 # Changelog
+
 All notable changes to this project will be documented in this file.
 
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
 ## Unreleased
 
+### Added
+
+- Dynamic changes in the data or DOM elements now trigger updates in the tool
+
 ## 2.0.1 - 2024-10-08
+
 ### Added
+
 - Aligned native ShortcutGuide styling with the prototypes
 
 ## 2.0.0 - 2024-10-04
+
 ### Added
+
 - Changed bundler from babel to vite
 - Replaced jest with cypress
 - Converted Javascript to Typescript
@@ -21,22 +30,32 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Converted the ShortcutGuide into a prop, making it overridable and customizable
 
 ## 1.0.3 - 2024-01-09
+
 ### Added
+
 - Remove unused dependency
 
 ## 1.0.2 - 2023-12-06
+
 ### Added
+
 - Fixed the previously correction of the "series:" class attribution in the data elements that would break the navigation inside multi series charts
 
 ## 1.0.1 - 2023-12-06
+
 ### Added
+
 - Corrected the attribution of the "series:" class in the data elements that would break the navigation inside multi series charts
 
 ## 1.0.0 - 2023-11-14
+
 ### Added
+
 - Added support for charts with multiple encodings
 
 ## 0.2.0 - 2023-11-02
+
 ### Added
+
 - Extended React compatibility to support projects with React >=16.14.0
 - Set up automatic semantic versioning

package-lock.json

@@ -217,7 +217,7 @@ const AutoVizuA11y = ({
 		const SELECTOR = selectorType.element || `.${selectorType.className ?? ""}`;
 		const NEW_ELEMENTS = Array.from(chartRef.current.querySelectorAll(SELECTOR)) as HTMLElement[];
 		setElements(NEW_ELEMENTS);
-	}, [chartRef, selectorType]);
+	}, [chartRef, selectorType, data, children]);
 
 	useEffect(() => {
 		const initSeries = () => {
@@ -295,7 +295,7 @@ const AutoVizuA11y = ({
 			return () => clearTimeout(timer);
 		};
 		asyncEffect();
-	}, [chartRef]);
+	}, [chartRef, data, children]);
 
 	const handleOnKeyDown = useCallback(
 		(event: React.KeyboardEvent<HTMLDivElement>) => {