@optum/json-schema-editor NPM

Description

JSON Schema is hypermedia ready, and ideal for annotating your existing JSON-based HTTP API. JSON Schema documents are identified by URIs, which can be used in HTTP Link headers, and inside JSON Schema documents to allow recursive definitions. - json-schema.org

JsonSchemaEditor is a React component library that allows the easy generation of valid Draft 07 JsonSchema from a UI, so that it can be easily persisted in a schema management system.

Benefits include:

Describes your existing data format(s).
Provides clear human- and machine- readable - documentation.
Validates data which is useful for:
- Automated testing.
- Ensuring quality of client submitted data.

Documentation

Control documentation and demo can be viewed here

Install

npm install @optum/json-schema-editor

yarn add @optum/json-schema-editor

Props

property	type	description	default
data	object	the initial data for the editor	{}
readOnly	boolean	make editor read only	false
onSchemaChange	callback (results: string) => void	callback method to capture changes to schema	required (no default)

Usage

import JsonSchemaEditor from "@optum/json-schema-editor";

export const printIt = (schema) => {
  console.log(schema);
};

function App() {
  return (
    <div className="App">
      <JsonSchemaEditor onSchemaChange={printIt} />
    </div>
  );
}

export default App;