rfestag / react-dir

A react component for rendering arbitrary JS objects, similar to console.dir()

react-dir

react-dir is a react component for rendering arbitrary JS data (strings, numbers, objects, etc), similar to console.dir() or console.log() in a browser.

Install

It hasn't been published yet, but once it is you will install like this:

npm install react-dir

Usage

react-dir provides a Dir component that receives some value to render. More examples can be found in the documentation page.

import React from "react";
import ReactDOM from "react-dom";
import Dir from "./Dir";

ReactDOM.render(
  <Dir value={{a: 1, b: "String", c: [1,2,3]}}>,
  document.getElementById("root")
);

TODO

• Support constant values (null, NaN, undefined)
• Support primitive types (Strings, numbers, booleans)
• Support nested objects and arrays
• Support custom coloring
• Support React components (pass through)
• Support Promises
• Support Observables (RxJS)