0.0.21 • Published 4 years ago
json-schema-designer v0.0.21
JSON Schema Designer
The JSON Schema Designer is a web component that allows easy JSON Schema creation and configuration with a GUI point and click interface.
Installation
- Run
npm install json-schema-designer --save
- Put a script tag similar to this
<script src='node_modules/json-schema-designer/dist/jsonschemadesigner.js'></script>
in the head of your index.html - Then you can use the element anywhere in your template, JSX, html etc
Basic Usage
Properties
- inputschema (optional) - an object containing the JSON Schema to load into the designer.
- inputtranslation (optional) - an object containing translations for the strings within the designer.
- viewmode (optional) - the view mode of the designer. options are "tabs", "columns" and "designerOnly" (default)
- datatypes (optional) - list of datatypes that can be selected for each item except for root. default: 'string', 'number', 'integer', 'object', 'array', 'boolean', 'null', '$ref'
- usedefinitions (optional) - boolean value that allows or disallows the adding of definitions to the json schema. (default: true)
Note: all properties passed to the component will be stringified.
<json-schema-designer
id="json-designer"
viewmode="designerOnly"
inputschema={{schema}}
inputtranslations={{translations}}
datatypes={{datatypes}}
usedefinitions="true">
</json-schema-designer>
Methods
- exportSchema - returns the stringified JSON object of the configured JSON Schema.
Example Usage:
let schemaDesigner = document.querySelector('#json-designer')
let jsonSchema = JSON.parse(schemaDesigner.exportSchema())
Advanced Usage
To add your own translations to the designer, pass in a translations object with the following format:
{
"json-schema-designer": {
"schema": "Schema",
"definitions": "Definitions",
"add-definition": "Add Definition"
...
}
}
Only translation found inside of the "json-schema-designer" key will be used.
A list of all translatable strings can be found in src/global/i18n.ts
References
0.0.21
4 years ago
0.0.20
4 years ago
0.0.19
4 years ago
0.0.18
4 years ago
0.0.17
4 years ago
0.0.16
5 years ago
0.0.15
5 years ago
0.0.14
5 years ago
0.0.13
5 years ago
0.0.12
5 years ago
0.0.11
5 years ago
0.0.10
5 years ago
0.0.9
5 years ago
0.0.8
5 years ago
0.0.7
5 years ago
0.0.6
5 years ago
0.0.5
6 years ago
0.0.4
6 years ago
0.0.3
6 years ago
0.0.1
6 years ago