A beautiful React component for viewing JSON Schema
npm install @stoplight/json-schema-viewerA JSON Schema viewer React component
- Explore the components: Storybook
- View the changelog: Releases
- Full JSON Schema Draft 4 support, including oneOf and anyOf combiner properties
- Renders complicated nested objects to any depth
- Renders validation properties and markdown descriptions
- Capable of linking resolved \$refs
- Theme-able
- Collapsible
Supported in modern browsers and node.
``bash`latest stable
yarn add @stoplight/json-schema-viewer
`jsx
// index.jsx
import { JsonSchemaViewer } from "@stoplight/json-schema-viewer";
schema={schema}
expanded={true}
hideTopBar={false}
emptyText="No schema defined"
defaultExpandedDepth={0}
/>;
`
More examples can be find in the Storybook stories.
1. Clone repo.
2. Create / checkout feature/{name}, chore/{name}, or fix/{name} branch.yarn
3. Install deps: .yarn test.prod
4. Make your changes.
5. Run tests: .yarn commit
6. Stage relevant files to git.
7. Commit: . _NOTE: Commits that don't follow the conventional format will be rejected. yarn commit creates this format for you, or you can put it together manually and then do a regular git commit._git push
8. Push: .develop` branch.
9. Open PR targeting the