change background color

[Vendjin]

Please tell me how to change the background color to a custom one?

[AnyRoad]

Hi!

You can set custom style for the parent div of the component like this:

import { JsonView, defaultStyles, collapseAllNested, allExpanded } from 'react-json-view-lite';

const jsonStyle = {
  ...defaultStyles,
  container: 'your-style-name-with-custom-bg'
};

<JsonView
            data={jsonData}
            shouldExpandNode={expanded ? allExpanded : collapseAllNested}
            style={jsonStyle}
          />

Here is the default style and you might need to re-use most of the values in your custom style:

.container-base {
  line-height: 1.2;
  white-space: pre-wrap;
  white-space: -moz-pre-wrap;
  white-space: -pre-wrap;
  white-space: -o-pre-wrap;
  word-wrap: break-word;
}

right now it is not very convinient, I will try to find some better way for the next component version.