Skip to content

Commit db5c750

Browse files
committed
feat: add className prop
Resolves mac-s-g#247
1 parent 2feadce commit db5c750

File tree

3 files changed

+10
-2
lines changed

3 files changed

+10
-2
lines changed

README.md

+1
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,7 @@ Name|Type|Default|Description
4343
`src`|`JSON Object`|None|This property contains your input JSON
4444
`name`|`string` or `false`|"root"|Contains the name of your root node. Use `null` or `false` for no name.
4545
`theme`|`string`|"rjv-default"|RJV supports base-16 themes. Check out the list of supported themes [in the demo](https://mac-s-g.github.io/react-json-view/demo/dist/). A custom "rjv-default" theme applies by default.
46+
`className`|`string`|`undefined`|Additional `className` string to append to the `className` of react-json-view's container.
4647
`style`|`object`|`{}`|Style attributes for react-json-view container. Explicit style attributes will override attributes provided by a theme.
4748
`iconStyle`|`string`|"circle"| Style of expand/collapse icons. Accepted values are "circle", triangle" or "square".
4849
`indentWidth`|`integer`|4|Set the indent-width for nested objects

index.d.ts

+6
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,12 @@ export interface ReactJsonViewProps {
2020
* Default: "rjv-default"
2121
*/
2222
theme?: ThemeKeys | ThemeObject;
23+
/**
24+
* Additional `className` string to append to the `className` of react-json-view's container.
25+
*
26+
* Default: undefined
27+
*/
28+
className?: string;
2329
/**
2430
* Style attributes for react-json-view container.
2531
* Explicit style attributes will override attributes provided by a theme.

src/js/index.js

+3-2
Original file line numberDiff line numberDiff line change
@@ -53,6 +53,7 @@ class ReactJsonView extends React.PureComponent {
5353
onAdd: false,
5454
onSelect: false,
5555
iconStyle: 'triangle',
56+
className: undefined,
5657
style: {},
5758
validationMessage: 'Validation Error',
5859
defaultValue: null,
@@ -168,11 +169,11 @@ class ReactJsonView extends React.PureComponent {
168169
name
169170
} = this.state;
170171

171-
const { style, defaultValue } = this.props;
172+
const { className, style, defaultValue } = this.props;
172173

173174
return (
174175
<div
175-
class="react-json-view"
176+
className={"react-json-view" + (className ? " " + className : "")}
176177
style={{ ...Theme(theme, 'app-container').style, ...style }}
177178
>
178179
<ValidationFailure

0 commit comments

Comments
 (0)