From 701989cc41dd9c092b4303e7903d8646ff0fe275 Mon Sep 17 00:00:00 2001
From: Kuroakira <jinnseitanosi@gmail.com>
Date: Mon, 30 Dec 2024 08:01:37 +0900
Subject: [PATCH] fix for typescript (#417)

Co-authored-by: AkiraShira <akira.shirahama@coten.co.jp>
---
 website/docs/02-usage.md | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/website/docs/02-usage.md b/website/docs/02-usage.md
index 04143688..dd4b7da6 100644
--- a/website/docs/02-usage.md
+++ b/website/docs/02-usage.md
@@ -69,6 +69,8 @@ const App = () => {
 
 The Spreadsheet component accepts the `onChange` prop that is called every time one of the Spreadsheet's cells is changed by the user. You can use it to save the modified data and to react to changes (e.g. validating the modified data, further modifying it, persisting it).
 
+JavaScript (See TypeScript example below):
+
 ```javascript
 import { useState } from "react";
 import Spreadsheet from "react-spreadsheet";
@@ -81,3 +83,18 @@ const App = () => {
   return <Spreadsheet data={data} onChange={setData} />;
 };
 ```
+
+TypeScript:
+
+```typescript
+import { useState } from "react";
+import Spreadsheet from "react-spreadsheet";
+
+const App = () => {
+  const [data, setData] = useState<Matrix<CellBase>>([
+    [{ value: "Vanilla" }, { value: "Chocolate" }, { value: "" }],
+    [{ value: "Strawberry" }, { value: "Cookies" }, { value: "" }],
+  ]);
+  return <Spreadsheet data={data} onChange={setData} />;
+};
+```