@tx-dts/react-openapi-renderer NPM

react-openapi-renderer

React OpenAPI component

Install

npm install --save @tx-dts/react-openapi-renderer

yarn add @tx-dts/react-openapi-renderer

UI

You can also check out the example and how library works - here.

Usage

import React, { Component } from "react";

import ReactOpenApiRenderer from "@tx-dts/react-openapi-renderer";
import "@tx-dts/react-openapi-renderer/dist/index.css";

class Example extends Component {
  render() {
    const jsonSpecification = {};
    return <ReactOpenApiRenderer specification={jsonSpecification} />;
  }
}

Here is the link to example JSON documentation that you can try out.

Other notes

Currently you have to manually include Bootstrap CSS and JS files:

CSS - inside head tag

<link
  href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/css/bootstrap.min.css"
  rel="stylesheet"
  integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6"
  crossorigin="anonymous"
/>

Bootstrap JS Scripts - at the bottom of body tag

<script
  src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.1/dist/umd/popper.min.js"
  integrity="sha384-SR1sx49pcuLnqZUnnPwx6FCym0wLsk5JZuNx2bPPENzswTNFaQU1RDvt3wT4gWFG"
  crossorigin="anonymous"
></script>
<script
  src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/js/bootstrap.min.js"
  integrity="sha384-j0CNLUeiqtyaRmlzUHCPZ+Gy5fQu0dQ6eZ/xAww941Ai1SxSY+0EQqNXNE6DZiVc"
  crossorigin="anonymous"
></script>