Small tweak

Author: CarlosNZ

README.md

@@ -252,14 +252,16 @@ Since there is very little user feedback when clicking "Copy", a good idea would
 
 In addition to the "Copy", "Edit" and "Delete" buttons that appear by each value, you can add your own buttons if you need to allow some custom operations on the data. Provide an array of button definitions in the `customButtons` prop, in the following definition structure:
 
-```js
+```ts
 {
-  Element: React.FC,
-  onClick: (nodeData: NodeData, e: React.MouseEvent) => void
+  Element: React.FC<{ nodeData: NodeData }>,
+  onClick?: (nodeData: NodeData, e: React.MouseEvent) => void
 }
 ```
 Where `NodeData` is the same data structure received by the previous "Update Functions".
 
+The `onClick` is optional -- don't provide it if you have your own `onClick` handler within your button component.
+
 ## Filter functions
 
 You can control which nodes of the data structure can be edited, deleted, or added to, or have their data type changed, by passing Filter functions. These will be called on each property in the data and the attribute will be enforced depending on whether the function returns `true` or `false` (`true` means *cannot* be edited).

src/ButtonPanels.tsx

@@ -126,7 +126,7 @@ export const EditButtons: React.FC<EditButtonProps> = ({
         </div>
       )}
       {customButtons?.map(({ Element, onClick }, i) => (
-        <div key={i} onClick={(e) => onClick && onClick(nodeData, e)}}>
+        <div key={i} onClick={(e) => onClick && onClick(nodeData, e)}>
           <Element nodeData={nodeData} />
         </div>
       ))}