reduxjs/redux-devtools
1
1
Fork 0
mirror of https://github.com/reduxjs/redux-devtools.git synced 2024-11-29 13:03:55 +03:00
Code Issues Packages Projects Releases Wiki Activity

docs(react-json-tree): update react-json-tree documentation (#520)

Browse Source 
* Documentation

* Remove newline

* Update
This commit is contained in:
Nathan Bierema 2020-07-28 22:26:39 -04:00 committed by GitHub
parent 632f7442dd
commit 924899a735
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 15 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
packages/react-json-tree/README.md
View File

@ -83,8 +83,8 @@ const theme = {
textDecoration: 'underline' textDecoration: 'underline'
}, },
// switch key for objects to uppercase when object is expanded. // switch key for objects to uppercase when object is expanded.
// `nestedNodeLabel` receives additional arguments `expanded` and `keyPath` // `nestedNodeLabel` receives additional argument `expandable`
nestedNodeLabel: ({ style }, nodeType, expanded) => ({ nestedNodeLabel: ({ style }, keyPath, nodeType, expanded) => ({
style: { style: {
...style, ...style,
textTransform: expanded ? 'uppercase' : style.textTransform textTransform: expanded ? 'uppercase' : style.textTransform
@ -123,7 +123,7 @@ You can pass the following properties to customize rendered labels and values:
```jsx ```jsx
<JSONTree <JSONTree
labelRenderer={raw => <strong>{raw}</strong>} labelRenderer={([key]) => <strong>{key}</strong>}
valueRenderer={raw => <em>{raw}</em>} valueRenderer={raw => <em>{raw}</em>}
/> />
``` ```
@ -132,11 +132,20 @@ In this example the label and value will be rendered with `<strong>` and `<em>`
For `labelRenderer`, you can provide a full path - [see this PR](https://github.com/chibicode/react-json-tree/pull/32). For `labelRenderer`, you can provide a full path - [see this PR](https://github.com/chibicode/react-json-tree/pull/32).
Their full signatures are:
- `labelRenderer: function(keyPath, nodeType, expanded, expandable)`
- `valueRenderer: function(valueAsString, value, ...keyPath)`
#### More Options #### More Options
- `shouldExpandNode: function(keyName, data, level)` - determines if node should be expanded (root is expanded by default) - `shouldExpandNode: function(keyPath, data, level)` - determines if node should be expanded (root is expanded by default)
- `hideRoot: Boolean` - if `true`, the root node is hidden. - `hideRoot: boolean` - if `true`, the root node is hidden.
- `sortObjectKeys: Boolean | function(a, b)` - sorts object keys with compare function (optional). Isn't applied to iterable maps like `Immutable.Map`. - `sortObjectKeys: boolean | function(a, b)` - sorts object keys with compare function (optional). Isn't applied to iterable maps like `Immutable.Map`.
- `postprocessValue: function(value)` - maps `value` to a new `value`
- `isCustomNode: function(value)` - overrides the default object type detection and renders the value as a single value
- `collectionLimit: number` - sets the number of nodes that will be rendered in a collection before rendering them in collapsed ranges
- `keyPath: (string | number)[]` - overrides the initial key path for the root node (defaults to `[root]`)
### Credits ### Credits