swagger-ui/flavors/swagger-ui-react

swagger-ui-react

swagger-ui-react is a flavor of Swagger UI suitable for use in React applications.

It has a few differences from the main version of Swagger UI:

• Declares react and react-dom as peerDependencies instead of production dependencies
• Exports a component instead of a constructor function

Versions of this module mirror the version of Swagger UI included in the distribution.

Quick start

Install swagger-ui-react:

$ npm i --save swagger-ui-react

Use it in your React application:

import SwaggerUI from "swagger-ui-react"
import "swagger-ui-react/swagger-ui.css"

export default App = () => <SwaggerUI url="https://petstore.swagger.io/v2/swagger.json" />

Props

These props map to Swagger UI configuration options of the same name.

spec: PropTypes.object

An OpenAPI document respresented as a JavaScript object, JSON string, or YAML string for Swagger UI to display.

⚠️ Don’t use this in conjunction with url - unpredictable behavior may occur.

url: PropTypes.string

Remote URL to an OpenAPI document that Swagger UI will fetch, parse, and display.

⚠️ Don’t use this in conjunction with spec - unpredictable behavior may occur.

onComplete: PropTypes.func

A callback function that is triggered when Swagger-UI finishes rendering an OpenAPI document.

requestInterceptor: PropTypes.func

req => req or req => Promise<req>.

A function that accepts a request object, and returns either a request object or a Promise that resolves to a request object.

responseInterceptor: PropTypes.func

res => res or res => Promise<res>.

A function that accepts a response object, and returns either a response object or a Promise that resolves to a response object.

Limitations

• Not all configuration bindings are available.
• OAuth redirection handling is not supported.
• Topbar/Standalone mode is not supported.
• Custom plugins are not supported.

We intend to address these limitations based on user demand, so please open an issue or pull request if you have a specific request.

Notes

• The package.json in the same folder as this README is not the manifest that should be used for releases - another manifest is generated at build-time and can be found in ./dist/.

---

For anything else, check the Swagger-UI repository.