What is react-json-view?

react-json-view is a React component that displays JSON data and JavaScript arrays in a visual tree format inside a web browser. Instead of showing a wall of raw text, it renders the data as an expandable and collapsible tree where each object and array can be opened or closed by clicking. The component is no longer actively maintained, and the README suggests a fork called @microlink/react-json-view as a current alternative. Adding the component to a React application requires only two lines: an import statement and a single tag with the JSON object passed as a property. From there, a large number of optional settings control how the data appears. Developers can choose from multiple color themes based on the base-16 theme standard, including named themes like Monokai and Solarized, or supply a custom set of colors. Other options control indentation width, whether data types are labeled, whether object sizes are shown, and how long strings or arrays are handled before being clipped or grouped. The component also supports editing. When callback functions are passed through the onEdit, onAdd, and onDelete properties, the interface gains buttons that let a user modify values, add new keys, or remove existing ones directly in the browser. Each callback receives information about what changed and can return false to block the update if the change fails validation. Other features include a copy-to-clipboard button on any node, the ability to collapse all nodes beyond a specified depth automatically, and the option to sort object keys alphabetically. Arrays longer than a configurable threshold are shown in numbered groups rather than as one long list. The package is distributed through npm and works with any JavaScript web application that uses React, not just projects built with a specific framework.