A React component for viewing and displaying any kind of data, not just JSON, with full customization and theme support.
@textea/json-viewer is a React component library for visualizing and inspecting any data structure, not just JSON. It solves the problem of displaying complex data in a customizable, interactive way, supporting Maps, Sets, primitives, and custom types. It provides features like theming, metadata previews, and a built-in editor.
Frontend developers building React applications that need to display, inspect, or edit complex data structures, such as debugging tools, admin panels, or data exploration interfaces.
Developers choose @textea/json-viewer for its extreme customization, support for non-JSON data types, and seamless integration with Material-UI. Its flexibility in handling custom data types and themes sets it apart from simpler JSON viewers.
not only a JSON viewer
Open-Awesome is built by the community, for the community. Submit a project, suggest an awesome list, or help improve the catalog on GitHub.
Allows deep control over display elements, including defining custom data types for images or other formats, as shown in the documentation with defineDataType.
Handles JavaScript-specific types like Maps and Sets, and supports custom type definitions, going beyond standard JSON to inspect any data structure.
Offers built-in light and dark themes and compatibility with Base16 themes, enabling easy integration into existing design systems.
Includes metadata previews, clipboard copy, and a basic editor, enhancing user interaction and data inspection directly within the viewer.
Mandates installation of @mui/material and emotion libraries, increasing bundle size and tightly coupling the project to MUI's ecosystem.
Defining custom data types or advanced theming requires additional code and API understanding, adding setup overhead for simple use cases.
The built-in editor only supports basic types, and more complex editing needs custom implementation, as indicated in the features list.