feat(react-json-tree): Add keyPath to getItemString (#694)

reduxjs · Dec 22, 2020 · 85b4b0f · 85b4b0f
1 parent a46b432
commit 85b4b0f
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 4 deletions.
diff --git a/packages/react-json-tree/README.md b/packages/react-json-tree/README.md
@@ -102,14 +102,14 @@ You can pass `getItemString` to customize the way arrays, objects, and iterable
 By default, it'll be:
 
 ```jsx
-<JSONTree getItemString={(type, data, itemType, itemString)
+<JSONTree getItemString={(type, data, itemType, itemString, keyPath)
   => <span>{itemType} {itemString}</span>}
 ```
 
 But if you pass the following:
 
 ```jsx
-const getItemString = (type, data, itemType, itemString)
+const getItemString = (type, data, itemType, itemString, keyPath)
   => (<span> // {type}</span>);
 ```
 

diff --git a/packages/react-json-tree/src/JSONNestedNode.tsx b/packages/react-json-tree/src/JSONNestedNode.tsx
@@ -193,7 +193,8 @@ export default class JSONNestedNode extends React.Component<Props, State> {
       nodeType,
       data,
       itemType,
-      createItemString(data, collectionLimit)
+      createItemString(data, collectionLimit),
+      keyPath
     );
     const stylingArgs = [keyPath, nodeType, expanded, expandable] as const;
 

diff --git a/packages/react-json-tree/src/types.ts b/packages/react-json-tree/src/types.ts
@@ -35,7 +35,8 @@ interface JSONNestedNodeCircularPropsPassedThroughJSONTree {
     nodeType: string,
     data: any,
     itemType: React.ReactNode,
-    itemString: string
+    itemString: string,
+    keyPath: (string | number)[]
   ) => React.ReactNode;
   postprocessValue: (value: any) => any;
   isCustomNode: (value: any) => boolean;