From 02fc5faef1e9c132005d6ef42ff1f8fedbad0751 Mon Sep 17 00:00:00 2001
From: ishan-aws <85854534+ishan-aws@users.noreply.github.com>
Date: Mon, 7 Nov 2022 21:11:17 +1100
Subject: [PATCH 1/2] add: Callback function exposed

This exposes the underlying `callback` function which is called when the rendering state changes. For large files, it can take a while for the graph to "show", hence this helps creates better progress bars if someone needs them.
---
 src/Graphviz.tsx | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/Graphviz.tsx b/src/Graphviz.tsx
index ebfebdf..6bb609e 100644
--- a/src/Graphviz.tsx
+++ b/src/Graphviz.tsx
@@ -16,6 +16,10 @@ interface IGraphvizProps {
    * The classname to attach to this component for styling purposes.
    */
   className?: string;
+  /**
+   * The callback function to call when the graph is rendered.
+   */
+  callback?: () => void;
 }
 
 const defaultOptions: GraphvizOptions = {
@@ -29,14 +33,14 @@ let counter = 0;
 // eslint-disable-next-line no-plusplus
 const getId = () => `graphviz${counter++}`;
 
-const Graphviz = ({ dot, className, options = {} }: IGraphvizProps) => {
+const Graphviz = ({ dot, className, options = {}, callback }: IGraphvizProps) => {
   const id = useMemo(getId, []);
 
   useEffect(() => {
     graphviz(`#${id}`, {
       ...defaultOptions,
       ...options,
-    }).renderDot(dot);
+    }).renderDot(dot, callback);
   }, [dot, options]);
 
   return <div className={className} id={id} />;

From 4b221d5283145a1c3c9ed0bde0eb5b7a6b407a09 Mon Sep 17 00:00:00 2001
From: ishan-aws <85854534+ishan-aws@users.noreply.github.com>
Date: Mon, 7 Nov 2022 21:15:36 +1100
Subject: [PATCH 2/2] fix: linting issues

Fixed linting issues to ensure all tests passing
---
 src/Graphviz.tsx | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/Graphviz.tsx b/src/Graphviz.tsx
index 6bb609e..4d2e9ae 100644
--- a/src/Graphviz.tsx
+++ b/src/Graphviz.tsx
@@ -33,7 +33,12 @@ let counter = 0;
 // eslint-disable-next-line no-plusplus
 const getId = () => `graphviz${counter++}`;
 
-const Graphviz = ({ dot, className, options = {}, callback }: IGraphvizProps) => {
+const Graphviz = ({
+  dot,
+  className,
+  options = {},
+  callback,
+}: IGraphvizProps) => {
   const id = useMemo(getId, []);
 
   useEffect(() => {