From ebd0c947034ea97a8187b861b3ad717366c8fc26 Mon Sep 17 00:00:00 2001
From: Mike Davies <miked@joinzoe.com>
Date: Thu, 5 Jan 2023 18:53:38 +0000
Subject: [PATCH] Add a callback prop  that's called when an API instance is
 created. This allows parent components to interact with the Chessground API,
 e.g. make moves on the board, reset the board. Add arrows.

---
 .eslintrc.cjs |  1 +
 src/index.tsx | 11 +++++++++--
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/.eslintrc.cjs b/.eslintrc.cjs
index f63bbef..7b85f4b 100644
--- a/.eslintrc.cjs
+++ b/.eslintrc.cjs
@@ -24,5 +24,6 @@ module.exports = {
     'react/require-default-props': 'off',
     'no-use-before-define': 'off',
     'react/jsx-filename-extension': [1, { extensions: ['.ts', '.tsx'] }],
+    'no-unused-vars': ['error', { argsIgnorePattern: 'api' }],
   },
 };
diff --git a/src/index.tsx b/src/index.tsx
index 317e5f6..4916cdf 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -8,11 +8,12 @@ interface Props {
   width?: number
   height?: number
   contained?: boolean;
-  config?: Config
+  config?: Config;
+  onApiReady?: (api: Api) => void;
 }
 
 function Chessground({
-  width = 900, height = 900, config = {}, contained = false,
+  width = 900, height = 900, config = {}, contained = false, onApiReady,
 }: Props) {
   const [api, setApi] = useState<Api | null>(null);
 
@@ -34,6 +35,12 @@ function Chessground({
     api?.set(config);
   }, [api, config]);
 
+  useEffect(() => {
+    if (api && onApiReady) {
+      onApiReady(api);
+    }
+  }, [api]);
+
   return (
     <div style={{ height: contained ? '100%' : height, width: contained ? '100%' : width }}>
       <div ref={ref} style={{ height: '100%', width: '100%', display: 'table' }} />